/* ==========================================================================
   YAZHI — CARDS (record, event, category)
   ========================================================================== */

.card {
    background: var(--yazhi-white);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
}

/* Record card */
.record-card__media { position: relative; aspect-ratio: 8/5; overflow: hidden; background: var(--yazhi-light-gray); }
.record-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.record-card:hover .record-card__media img { transform: scale(1.05); }
.record-card__badge { position: absolute; top: 0.75em; left: 0.75em; }
.record-card__body { padding: var(--space-sm); display: flex; flex-direction: column; gap: 0.5em; flex: 1; }
.record-card__category { font-size: var(--fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--yazhi-dark-gold); }
.record-card__title { font-size: var(--fs-md); margin: 0; }
.record-card__title a { color: inherit; text-decoration: none; }
.record-card__title a::after { content: ""; position: absolute; inset: 0; }
.record-card { position: relative; }
.record-card__meta { display: flex; flex-wrap: wrap; gap: 0.4em 1em; font-size: var(--fs-xs); color: var(--color-text-muted); }
.record-card__footer { margin-top: auto; padding-top: 0.5em; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--color-border); }
.record-card__id { font-size: var(--fs-xs); }

/* Event card */
.event-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--yazhi-light-gray); }
.event-card__media img { width: 100%; height: 100%; object-fit: cover; }
.event-card__date-chip {
    position: absolute; top: 0.75em; left: 0.75em;
    background: var(--yazhi-ivory);
    border: 1px solid var(--yazhi-gold);
    border-radius: var(--radius-sm);
    padding: 0.4em 0.7em;
    text-align: center;
    line-height: 1.1;
}
.event-card__date-chip .day { display: block; font-family: var(--font-display); font-weight: 700; font-size: 1.15rem; color: var(--yazhi-burgundy); }
.event-card__date-chip .mon { display: block; font-size: 0.62rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--yazhi-dark-gold); }
.event-card__body { padding: var(--space-sm); display: flex; flex-direction: column; gap: 0.5em; flex: 1; }
.event-card__title { font-size: var(--fs-md); margin: 0; position: relative; }
.event-card__title a { color: inherit; text-decoration: none; }
.event-card__title a::after { content: ""; position: absolute; inset: 0; }
.event-card { position: relative; }
.event-card__meta { display: flex; flex-direction: column; gap: 0.3em; font-size: var(--fs-sm); color: var(--color-text-muted); }
.event-card__meta span { display: flex; align-items: center; gap: 0.5em; }

/* Category card */
.category-card { text-align: center; padding: var(--space-md) var(--space-sm); text-decoration: none; color: inherit; }
.category-card__image { width: 84px; height: 84px; border-radius: 50%; overflow: hidden; margin: 0 auto var(--space-xs); border: 2px solid var(--yazhi-gold); }
.category-card__image img { width: 100%; height: 100%; object-fit: cover; }
.category-card__name { font-family: var(--font-display); font-size: var(--fs-md); color: var(--yazhi-deep-burgundy); margin-bottom: 0.2em; }
.category-card__count { font-size: var(--fs-xs); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.06em; }

/* Gallery album summary card */
.album-card { display: flex; flex-direction: column; }
.album-card__cover { aspect-ratio: 16/9; overflow: hidden; }
.album-card__cover img { width: 100%; height: 100%; object-fit: cover; }
.album-card__body { padding: var(--space-sm); }