/*
 Theme Name:   Kadence Child
 Theme URI:    https://hofheroes.com
 Description:  HOF Heroes child theme for Kadence. All custom PHP, CPT registration,
               ACF field registration, and template overrides live here. Never edit
               the parent Kadence theme directly -- updates will wipe those changes.
 Author:       Jamison Avery / SDS
 Template:     kadence
 Version:      1.0.5
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain:  kadence-child
*/

/*
 * Brand variables are registered in functions.php via wp_head (hofh_register_css_custom_properties).
 * Google Fonts (Zilla Slab + Inter) are enqueued in functions.php via wp_enqueue_scripts.
 * This file overrides Kadence defaults with the HOF Heroes visual identity.
 *
 * Load order: Google Fonts → Kadence parent → this file
 *
 * Section index:
 *   1. Global base
 *   2. Typography
 *   3. Header & navigation
 *   4. Buttons
 *   5. Footer
 */


/* =============================================================================
   1. GLOBAL BASE
   ============================================================================= */

/* Override Kadence's global-palette8 (body background slot) at the variable level */
:root {
    --global-palette8: #F4F2EC;
}

html,
body,
body.wp-theme-kadence,
body.wp-child-theme-kadence-child {
    background: var(--hofh-bone) !important;
    color: var(--hofh-navy);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Kadence wraps pages in .kb-theme-container — override its background too */
.kb-theme-container,
.content-bg,
.wp-site-blocks {
    background: var(--hofh-bone) !important;
}


/* =============================================================================
   2. TYPOGRAPHY
   ============================================================================= */

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
    font-family: 'Zilla Slab', serif;
    font-weight: 700;
    color: var(--hofh-navy);
    line-height: 1.2;
    letter-spacing: -0.01em;
}

body,
p,
li,
td,
th,
label,
input,
textarea,
select,
.wp-block-paragraph {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    line-height: 1.65;
}

a {
    color: var(--hofh-green);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--hofh-navy);
}

/* Overline / eyebrow labels — small caps style used above section headlines */
.wp-block-paragraph:has(+ h1),
.wp-block-paragraph:has(+ h2) {
    font-family: 'Inter', sans-serif;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--hofh-green);
}


/* =============================================================================
   3. HEADER & NAVIGATION
   ============================================================================= */

/* ---- Logo sizing ---- */
.site-logo img,
.custom-logo,
.site-branding img,
.wp-block-site-logo img,
.site-branding a.brand img {
    height: 130px !important;
    width: auto !important;
    max-width: none !important;
    display: block;
}

/* ---- Main header row height ---- */
.site-main-header-inner-wrap {
    min-height: 160px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

/* Remove default WP logo link border */
.custom-logo-link,
.site-branding a {
    border: none !important;
    outline: none !important;
}

/* ---- Header container ---- */
.site-header,
#masthead,
.site-header-wrap,
.site-header-inner-wrap,
.kadence-sticky-header,
header[id="masthead"] {
    background: var(--hofh-navy) !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Constrain header content width so logo and nav don't spread to viewport edges */
#masthead .site-container,
.site-main-header-inner-wrap {
    max-width: 1200px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
}

/* ---- Hide text site title (logo image already carries the brand name) ---- */
.site-branding .site-title,
.site-title {
    display: none !important;
}

/* ---- Nav links ---- */
.main-navigation a,
.primary-navigation a,
.nav--toggle-sub a,
.kadence-navigation a,
header nav a,
.wp-block-navigation a,
.wp-block-navigation-item a {
    font-family: 'Inter', sans-serif;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--hofh-haze) !important;
    text-decoration: none;
    transition: color 0.2s ease;
}

.main-navigation a:hover,
.primary-navigation a:hover,
.wp-block-navigation a:hover,
.wp-block-navigation-item a:hover {
    color: var(--hofh-yellow) !important;
}

/* Active / current page nav link */
.main-navigation .current-menu-item > a,
.wp-block-navigation-item.current-menu-item > a {
    color: var(--hofh-yellow) !important;
}


/* =============================================================================
   4. BUTTONS
   ============================================================================= */

.wp-block-button__link,
.wp-element-button {
    font-family: 'Inter', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    border-radius: 2px !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
    cursor: pointer;
}

/* Primary (filled) — Astroturf Green */
.wp-block-button:not(.is-style-outline) .wp-block-button__link {
    background-color: var(--hofh-green) !important;
    color: var(--hofh-bone) !important;
    border: 2px solid var(--hofh-green) !important;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
    background-color: transparent !important;
    color: var(--hofh-green) !important;
}

/* Outline — Navy */
.wp-block-button.is-style-outline .wp-block-button__link {
    background-color: transparent !important;
    color: var(--hofh-navy) !important;
    border: 2px solid var(--hofh-navy) !important;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background-color: var(--hofh-navy) !important;
    color: var(--hofh-bone) !important;
}

/* Outline on dark backgrounds — Bone White */
.has-navy-background-color .wp-block-button.is-style-outline .wp-block-button__link,
[style*="background-color:#0D1B3E"] .wp-block-button.is-style-outline .wp-block-button__link {
    color: var(--hofh-bone) !important;
    border-color: var(--hofh-bone) !important;
}

.has-navy-background-color .wp-block-button.is-style-outline .wp-block-button__link:hover,
[style*="background-color:#0D1B3E"] .wp-block-button.is-style-outline .wp-block-button__link:hover {
    background-color: var(--hofh-bone) !important;
    color: var(--hofh-navy) !important;
}


/* =============================================================================
   5. FOOTER
   ============================================================================= */

.site-footer,
#colophon,
footer {
    background-color: var(--hofh-navy) !important;
    color: var(--hofh-haze);
    font-family: 'Inter', sans-serif;
    font-size: 0.8125rem;
    border-top: 1px solid rgba(184, 200, 240, 0.15);
}

.site-footer a,
footer a,
#colophon a {
    color: var(--hofh-haze);
    text-decoration: none;
    transition: color 0.2s ease;
}

.site-footer a:hover,
footer a:hover,
#colophon a:hover {
    color: var(--hofh-yellow);
}


/* =============================================================================
   6. PAGE LAYOUT
   ============================================================================= */

/* =============================================================================
   7. HOMEPAGE TEMPLATE  (front-page.php)
   ============================================================================= */

/* ---- Shared utilities ---- */
.hofh-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

.hofh-eyebrow {
    display: block;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--hofh-green);
    margin-bottom: 10px;
}

.hofh-rule {
    display: block;
    width: 40px;
    height: 2px;
    background: var(--hofh-green);
    margin: 24px auto;
}

/* ---- Buttons ---- */
.hofh-btn {
    display: inline-block;
    padding: 11px 26px;
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.hofh-btn--primary {
    background: var(--hofh-green);
    color: #fff;
    border: 2px solid var(--hofh-green);
}

.hofh-btn--primary:hover {
    background: transparent;
    color: var(--hofh-green);
}

.hofh-btn--outline {
    background: transparent;
    color: var(--hofh-navy);
    border: 2px solid rgba(13, 27, 62, 0.3);
}

.hofh-btn--outline:hover {
    border-color: var(--hofh-navy);
    color: var(--hofh-navy);
}

.hofh-btn--sm {
    padding: 7px 16px;
    font-size: 0.8125rem;
}

/* Ghost — white outline, for buttons on navy backgrounds */
.hofh-btn--ghost {
    background: transparent;
    color: rgba(255,255,255,0.88);
    border: 2px solid rgba(255,255,255,0.35);
}

.hofh-btn--ghost:hover {
    border-color: rgba(255,255,255,0.7);
    color: #fff;
}

/* Yellow — primary CTA on navy backgrounds */
.hofh-btn--yellow {
    background: var(--hofh-yellow);
    color: var(--hofh-navy);
    border: 2px solid var(--hofh-yellow);
}

.hofh-btn--yellow:hover {
    background: #e0b310;
    border-color: #e0b310;
    color: var(--hofh-navy);
}

/* ---- Tags ---- */
/*
 * Priority order (max 4 shown per card):
 * 1. HOF   2. RC   3. Grade/Raw   4. Local (Michigan)   5. Icon   6. Insert
 */
.hofh-tag {
    flex: 0 0 calc(25% - 3px);   /* 4 tags fill the row exactly with 4px gap */
    padding: 3px 4px;
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border-radius: 2px;
    white-space: nowrap;
    overflow: hidden;
    /* Vertical centering */
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.hofh-tag--hof    { background: var(--hofh-yellow); color: var(--hofh-navy); }       /* #1 HOF    */
.hofh-tag--rc     { background: var(--hofh-green);  color: #fff; }                   /* #2 RC     */
.hofh-tag--grade  { background: var(--hofh-bone); color: var(--hofh-navy); border: 1.5px solid #E07820; }         /* #3 Grade — bone bg so it reads on both light + dark surfaces */
.hofh-tag--local  { background: #0076B6; color: #fff; }                              /* #4 Local  (Michigan / Lions) */
.hofh-tag--icon   { background: #E07820; color: #fff; }                              /* #5 Icon   */
.hofh-tag--insert { background: #4A5568; color: #fff; }                              /* #6 Insert */

/* ---- Grids ---- */
.hofh-grid--3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.hofh-grid--4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}


/* ── SECTION 1: HERO ── */
.hofh-hero {
    background: var(--hofh-navy);
    padding: 80px 0;
}

.hofh-hero__inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 48px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
    box-sizing: border-box;
}

/* Branded emblem — shown in hero right column until real card images exist */
.hofh-hero__emblem {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.hofh-hero__emblem::before {
    content: '';
    position: absolute;
    width: 480px;
    height: 480px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(45,106,46,0.07) 0%, transparent 65%);
    pointer-events: none;
}

.hofh-hero__emblem-img {
    width: 300px;
    height: auto;
    position: relative;
    z-index: 1;
    opacity: 0.92;
}

.hofh-hero__h1 {
    font-family: 'Zilla Slab', serif;
    font-size: clamp(2.2rem, 5vw, 3.75rem);
    font-weight: 600;
    line-height: 1.05;
    color: #fff;
    margin-bottom: 24px;
    letter-spacing: -0.025em;
}

/* Line 1 gets slightly wider tracking so both lines read the same visual width */
.hofh-hero__line1 {
    letter-spacing: -0.01em;
}

.hofh-hero__h1 em {
    color: var(--hofh-yellow);
    font-style: italic;
}

.hofh-hero__sub {
    font-size: 1rem;
    color: var(--hofh-haze);
    max-width: 440px;
    margin-bottom: 40px;
    line-height: 1.8;
}

.hofh-hero__btns {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* Hero card slot */
.hofh-hero__card-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
}

.hofh-card-slab {
    position: relative;
    display: inline-block;
    padding: 7px 7px 32px;
    background: linear-gradient(145deg, #e4e4e4, #c6c6c6);
    border-radius: 2px;
    box-shadow: 0 12px 40px rgba(13,27,62,0.2), inset 0 1px 0 rgba(255,255,255,0.35);
}

.hofh-card-slab img {
    display: block;
    border-radius: 0;
    max-height: 300px;
    width: auto;
}

.hofh-slab-label {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 32px;
    background: linear-gradient(90deg, #002868, #BF0A30);
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.hofh-slab-label__co {
    font-size: 0.6rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.hofh-slab-label__grade {
    background: var(--hofh-yellow);
    color: #000;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 1px 7px;
    border-radius: 2px;
}

.hofh-hero .hofh-eyebrow {
    color: var(--hofh-haze);
}

.hofh-hero__card-meta {
    font-family: 'Zilla Slab', serif;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.hofh-hero__card-sub {
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 400;
    color: var(--hofh-haze);
}

/* Placeholder card */
.hofh-placeholder-card {
    width: 180px;
    height: 252px;
    background: linear-gradient(145deg, var(--hofh-navy), #1a2f5e);
    border-radius: 2px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(13,27,62,0.2);
}

.hofh-placeholder-card__body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hofh-placeholder-card__mark {
    font-family: 'Zilla Slab', serif;
    font-size: 3rem;
    font-weight: 700;
    color: rgba(245,197,24,0.15);
}

.hofh-placeholder-card__foot {
    background: var(--hofh-bone);
    padding: 10px;
    text-align: center;
    font-size: 0.75rem;
    color: rgba(13,27,62,0.4);
    font-family: 'Inter', sans-serif;
}



/* ── SECTION 2: STATS BAR ── */
.hofh-stats {
    background: var(--hofh-green);
}

.hofh-stats__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 28px 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.hofh-stat {
    text-align: center;
    padding: 0 16px;
    border-right: 1px solid rgba(255,255,255,0.2);
}

.hofh-stat:last-child {
    border-right: none;
}

.hofh-stat__n {
    font-family: 'Zilla Slab', serif;
    font-size: 1.125rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
    margin-bottom: 4px;
}

.hofh-stat__l {
    font-size: 0.8125rem;
    color: rgba(255,255,255,0.82);
    text-align: center;
    line-height: 1.3;
}


/* ── SECTION 3: FEATURED CARDS ── */
.hofh-featured { /* children handle their own backgrounds */ }

/* Featured section header — museum placard; browse CTA lives here */
.hofh-featured__shelf {
    background: rgba(13,27,62,0.03);
    border-bottom: 1px solid rgba(13,27,62,0.08);
    padding: 52px 0 52px;
}

.hofh-featured__shelf .hofh-wrap {
    padding-top: 0;
    padding-bottom: 0;
}

.hofh-featured__title {
    margin: 6px 0 14px;
    font-size: clamp(2rem, 4vw, 3rem);
    color: var(--hofh-navy);
}

.hofh-featured__desc {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.6);
    max-width: 600px;
    line-height: 1.75;
    margin: 0;
}

/* Browse CTA sits in the placard, below the description */
.hofh-featured__browse {
    margin-top: 28px;
}

/* Dark gallery wall — artifacts displayed like works on exhibit */
.hofh-featured__grid {
    background: var(--hofh-navy);
    padding: 40px 0 60px;
}

/* Card item — white card on navy grid */
.hofh-ci {
    background: #fff;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 2px;
    overflow: hidden;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(0,0,0,0.3), 0 12px 32px rgba(0,0,0,0.22);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
    display: block;
}

.hofh-ci:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.38), 0 20px 48px rgba(0,0,0,0.28);
}

.hofh-ci__img {
    width: 100%;
    aspect-ratio: 3 / 4;   /* matches photo format: 3:4 portrait */
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--hofh-bone);
    overflow: hidden;
    padding: 10px;
}

.hofh-ci__img img {
    width: 100%;
    height: 100%;
    object-fit: contain;   /* shows full card, no cropping */
}

/* Landscape cards (4:3) */
.hofh-ci--landscape .hofh-ci__img {
    aspect-ratio: 4 / 3;
}

.hofh-ci__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(160deg, var(--hofh-navy) 0%, #1a2f5e 100%);
}

.hofh-ci__placeholder span {
    font-family: 'Zilla Slab', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: rgba(245,197,24,0.25);
}

.hofh-ci__info {
    padding: 16px;
    border-top: 1px solid rgba(13,27,62,0.06);
}

.hofh-ci__player {
    font-family: 'Zilla Slab', serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--hofh-navy);
    margin-bottom: 2px;
}

.hofh-ci__set {
    font-size: 0.75rem;
    color: rgba(13,27,62,0.5);
    margin-bottom: 10px;
}

.hofh-ci__tags {
    display: flex;
    gap: 4px;
    margin-bottom: 12px;
}

.hofh-ci__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.hofh-ci__price {
    font-size: 1rem;
    font-weight: 600;
    color: var(--hofh-navy);
    font-variant-numeric: tabular-nums;
}

.hofh-ci__status {
    display: inline-block;
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 2px 8px;
    border-radius: 2px;
    border: 1px solid currentColor;
}

.hofh-ci__status--hold,
.hofh-ci__status--in-stock,
.hofh-ci__status--available { color: rgba(13,27,62,0.4); }
.hofh-ci__status--buy        { color: var(--hofh-green); }
.hofh-ci__status--sold       { color: rgba(13,27,62,0.25); }
.hofh-ci__status--coming-soon { color: rgba(13,27,62,0.25); }


/* ── SECTION 4: MANIFESTO ── */
.hofh-manifesto {
    background: #fff;
    border-top: 4px solid var(--hofh-green);
    padding: 88px 0;
}

.hofh-manifesto__inner {
    max-width: 800px;
    margin: 0;
}

.hofh-manifesto .hofh-eyebrow {
    color: var(--hofh-green);
    display: block;
}

.hofh-manifesto .hofh-rule {
    background: var(--hofh-green);
    margin: 24px 0;
}

.hofh-manifesto h2 {
    color: var(--hofh-navy);
    margin-bottom: 32px;
    font-size: clamp(1.4rem, 3vw, 2.25rem);
}

.hofh-manifesto p {
    color: rgba(13,27,62,0.72);
    font-size: 1.0625rem;
    line-height: 1.85;
    margin-bottom: 20px;
}

.hofh-manifesto p:last-of-type {
    margin-bottom: 0;
}

.hofh-manifesto__close {
    font-family: 'Zilla Slab', serif;
    font-size: 1.2rem;
    font-weight: 600;
    font-style: italic;
    color: var(--hofh-navy);
    display: block;
    margin-top: 8px;
}


/* ── RESPONSIVE ── */

/* ---- Tablet / large mobile (≤ 900px) ---- */
@media (max-width: 900px) {
    /* Hero collapses to single column */
    .hofh-hero {
        padding: 56px 0;
    }

    .hofh-hero__inner {
        grid-template-columns: 1fr;
        padding: 0 24px;
        text-align: center;
    }

    .hofh-hero__sub {
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

    .hofh-hero__btns {
        justify-content: center;
    }

    .hofh-hero__card-slot {
        display: none;
    }

    /* Stats collapses to 2-column */
    .hofh-stats__inner {
        grid-template-columns: repeat(2, 1fr);
        padding: 20px 24px;
        gap: 0;
    }

    .hofh-stat {
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.15);
        padding: 12px 16px;
    }

    .hofh-stat:nth-child(odd) {
        border-right: 1px solid rgba(255,255,255,0.15);
    }

    .hofh-stat:nth-last-child(-n+2) {
        border-bottom: none;
    }

    /* Featured shelf */
    .hofh-featured__hdr {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    /* Card grids — 2 columns on tablet */
    .hofh-grid--3,
    .hofh-grid--4 {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Global side padding reduction */
    .hofh-wrap {
        padding: 0 24px;
    }

    .hofh-featured__grid {
        padding: 28px 0;
    }

    .hofh-manifesto {
        padding: 64px 0;
    }

    .hofh-manifesto__inner {
        max-width: 100%;
    }
}

/* ---- Mobile (≤ 600px) ---- */
@media (max-width: 600px) {
    .hofh-hero {
        padding: 40px 0;
    }

    .hofh-hero__inner {
        padding: 0 20px;
        gap: 32px;
    }

    /* Stats: stay 2-column on mobile */
    .hofh-stats__inner {
        padding: 16px 20px;
    }

    /* Cards: single column on mobile */
    .hofh-grid--3,
    .hofh-grid--4 {
        grid-template-columns: 1fr;
    }

    .hofh-wrap {
        padding: 0 20px;
    }

    .hofh-featured__grid {
        padding: 24px 0;
    }

    .hofh-manifesto {
        padding: 48px 0;
    }

    .hofh-featured__shelf {
        padding: 40px 0 40px;
    }
}

/* Hide the automatic page-title hero on the front page */
.home .entry-hero,
.home .page-hero-section {
    display: none !important;
}

/* Remove the large top margin Kadence adds above page content on homepage */
.home .content-area,
.home .site-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Remove Kadence top margin on all custom-templated pages */
.post-type-archive-football_card .content-area,
.post-type-archive-football_card .site-content,
.single-football_card .content-area,
.single-football_card .site-content,
.page-id-0 .content-area { /* generic — overridden by specific selectors below */
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* =============================================================================
   8. EXHIBITS ARCHIVE  (archive-football_card.php)
   ============================================================================= */

/* ── Featured Strip ── */
.hofh-featured-strip {
    background: var(--hofh-navy);
    padding: 48px 0 56px;
}

.hofh-featured-strip .hofh-eyebrow {
    color: var(--hofh-yellow);
    margin-bottom: 24px;
    display: block;
}

.hofh-featured-strip .hofh-ci {
    border-color: rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
}

.hofh-featured-strip .hofh-ci__player {
    color: #fff;
}

.hofh-featured-strip .hofh-ci__set {
    color: var(--hofh-haze);
}

.hofh-featured-strip .hofh-ci:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.2);
}

/* Price and grade tag overrides on the navy featured strip */
.hofh-featured-strip .hofh-ci__price {
    color: var(--hofh-yellow);
}

/* Homepage featured grid — dark gallery wall; same card treatment as featured strip */
.hofh-featured__grid .hofh-ci {
    border-color: rgba(255,255,255,0.1);
    background: rgba(255,255,255,0.04);
}

.hofh-featured__grid .hofh-ci__player {
    color: #fff;
}

.hofh-featured__grid .hofh-ci__set {
    color: var(--hofh-haze);
}

.hofh-featured__grid .hofh-ci:hover {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.2);
}

.hofh-featured__grid .hofh-ci__price {
    color: var(--hofh-yellow);
}

.hofh-vault-header {
    background: rgba(13,27,62,0.03);
    border-bottom: 1px solid rgba(13,27,62,0.08);
    padding: 52px 0 44px;
}

.hofh-vault-header h1 {
    margin: 6px 0 14px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.hofh-vault-header__sub {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.6);
    max-width: 600px;
    line-height: 1.75;
    margin: 0;
}

/* ---- Filter bar ---- */
.hofh-filter-bar {
    border-bottom: 1px solid rgba(13,27,62,0.08);
    background: #fff;
    position: sticky;
    top: 0;
    z-index: 100;
}

.hofh-filter-bar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 14px 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.hofh-filter-group {
    display: flex;
    gap: 8px;
}

.hofh-filter-pill {
    padding: 6px 14px;
    font-family: 'Inter', sans-serif;
    font-size: 0.75rem;
    font-weight: 500;
    color: rgba(13,27,62,0.55);
    border: 1px solid rgba(13,27,62,0.15);
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
    background: transparent;
}

.hofh-filter-pill:hover {
    border-color: var(--hofh-green);
    color: var(--hofh-green);
}

.hofh-filter-pill--active {
    background: var(--hofh-green);
    color: #fff !important;
    border-color: var(--hofh-green);
    font-weight: 600;
}

.hofh-filter-divider {
    width: 1px;
    height: 20px;
    background: rgba(13,27,62,0.12);
    flex-shrink: 0;
}

.hofh-filter-bar__count {
    margin-left: auto;
    font-size: 0.75rem;
    color: rgba(13,27,62,0.4);
    font-weight: 500;
}

/* ---- Grid section ---- */
.hofh-vault-grid {
    padding: 56px 0 80px;
}

.hofh-vault-grid .hofh-grid--3 {
    margin-bottom: 48px;
}

/* ---- Empty state ---- */
.hofh-vault-empty {
    padding: 80px 0;
    text-align: center;
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.5);
}

.hofh-vault-empty a {
    color: var(--hofh-green);
    font-weight: 600;
}

/* ---- Pagination ---- */
.hofh-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
    padding-top: 8px;
}

.hofh-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 10px;
    font-family: 'Inter', sans-serif;
    font-size: 0.8125rem;
    font-weight: 500;
    color: rgba(13,27,62,0.6);
    border: 1px solid rgba(13,27,62,0.15);
    border-radius: 2px;
    text-decoration: none;
    transition: border-color 0.2s ease, color 0.2s ease;
}

.hofh-pagination .page-numbers:hover {
    border-color: var(--hofh-green);
    color: var(--hofh-green);
}

.hofh-pagination .page-numbers.current {
    background: var(--hofh-navy);
    color: var(--hofh-bone);
    border-color: var(--hofh-navy);
}


/* =============================================================================
   9. CARD DETAIL  (single-football_card.php)
   ============================================================================= */

/* ---- Breadcrumb ---- */
.hofh-breadcrumb {
    max-width: 1200px;
    margin: 0 auto;
    padding: 14px 40px;
    font-size: 0.75rem;
    color: rgba(13,27,62,0.4);
    border-bottom: 1px solid rgba(13,27,62,0.07);
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.hofh-breadcrumb a {
    color: rgba(13,27,62,0.45);
    text-decoration: none;
    transition: color 0.2s ease;
}

.hofh-breadcrumb a:hover {
    color: var(--hofh-green);
}

.hofh-breadcrumb__sep {
    opacity: 0.3;
}

.hofh-breadcrumb__current {
    color: var(--hofh-navy);
    font-weight: 500;
}

/* ---- Two-column layout ---- */
.hofh-detail-layout {
    padding: 48px 0 80px;
}

.hofh-detail-inner {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 56px;
    align-items: start;
}

/* ---- Left: sticky card ---- */
.hofh-detail-card {
    position: sticky;
    top: 130px; /* clears the Kadence nav + some breathing room */
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.hofh-detail-card__slab {
    position: relative;
    display: inline-block;
    padding: 8px 8px 10px; /* no slab footer by default */
    background: linear-gradient(145deg, #e8e8e8, #c8c8c8);
    border-radius: 2px;
    box-shadow: 0 12px 40px rgba(13,27,62,0.18), inset 0 1px 0 rgba(255,255,255,0.4);
    width: 100%;
}

/* Extra bottom padding when a graded label is present */
.hofh-detail-card__slab--graded {
    padding-bottom: 36px;
}

.hofh-detail-card__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 2px;
}

.hofh-detail-card__no-img {
    aspect-ratio: 3 / 4;
    background: linear-gradient(145deg, var(--hofh-navy), #1a2f5e);
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hofh-detail-card__no-img span {
    font-family: 'Zilla Slab', serif;
    font-size: 3rem;
    font-weight: 700;
    color: rgba(245,197,24,0.15);
}

.hofh-detail-card__tags {
    display: flex;
    gap: 6px;
    justify-content: center; /* 3 tags center, 4 tags fill edge-to-edge */
    width: 100%;
    align-self: stretch; /* override parent align-items:center — force full column width */
}

/* Each tag = exactly 1/4 of container. 4 tags fill perfectly; 3 tags center. */
.hofh-detail-card__tags .hofh-tag {
    flex: 0 0 calc(25% - 4.5px); /* 4×(25% - 4.5px) + 3×6px = 100% */
}

.hofh-detail-card__status {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 4px 14px;
    border-radius: 2px;
    border: 1px solid currentColor;
}

.hofh-detail-card__status--hold,
.hofh-detail-card__status--in-stock,
.hofh-detail-card__status--available { color: rgba(13,27,62,0.4); }
.hofh-detail-card__status--buy       { color: var(--hofh-green); }
.hofh-detail-card__status--sold      { color: rgba(13,27,62,0.25); }

/* ---- Right: info ---- */
.hofh-detail-setline {
    font-size: 0.9375rem;
    font-weight: 500;
    color: rgba(13,27,62,0.72);
    margin-top: 12px;
    margin-bottom: 24px;
    line-height: 1.4;
}

.hofh-detail-player {
    font-family: 'Zilla Slab', serif;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    color: var(--hofh-navy);
    line-height: 1.05;
    margin-bottom: 0;
}

.hofh-detail-grade {
    font-family: 'Zilla Slab', serif;
    font-size: 1.1rem;
    color: rgba(13,27,62,0.55);
    margin-bottom: 24px;
}

.hofh-detail-price-row {
    display: flex;
    align-items: baseline;
    gap: 20px;
    margin-bottom: 6px;
}

.hofh-detail-price {
    font-family: 'Inter', sans-serif;
    font-size: 1.875rem;
    font-weight: 600;
    color: var(--hofh-navy);
    font-variant-numeric: tabular-nums;
}

.hofh-detail-ctas {
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
    margin: 14px 0 28px;
    width: 100%;
}

/* Uniformly sized buttons — each takes equal 1/3 of the row */
.hofh-detail-ctas .hofh-btn {
    flex: 1;
    text-align: center;
}

/* ---- Data blocks ---- */
.hofh-data-block {
    background: #fff;
    border: 1px solid rgba(13,27,62,0.14);
    border-top: 3px solid var(--hofh-green);
    border-radius: 0 0 2px 2px;
    padding: 22px 24px;
    margin-bottom: 16px;
    box-shadow: 0 2px 8px rgba(13,27,62,0.06);
}

.hofh-data-block:last-child {
    margin-bottom: 0;
}

.hofh-data-block__label {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--hofh-green);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(13,27,62,0.08);
}

.hofh-data-block__body {
    font-size: 0.875rem;
    color: rgba(13,27,62,0.75);
    line-height: 1.8;
}

.hofh-data-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.hofh-dr {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px solid rgba(13,27,62,0.06);
    gap: 16px;
}

.hofh-dr:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.hofh-dr dt {
    font-size: 0.75rem;
    color: rgba(13,27,62,0.55);
    font-weight: 600;
    letter-spacing: 0.02em;
    flex-shrink: 0;
}

.hofh-dr dd {
    font-size: 0.8125rem;
    color: var(--hofh-navy);
    font-weight: 600;
    text-align: right;
    font-variant-numeric: tabular-nums;
    margin: 0;
}

.hofh-dr__hl {
    color: var(--hofh-green);
}

/* ---- Related cards ---- */
.hofh-related {
    border-top: 1px solid rgba(13,27,62,0.08);
    padding: 56px 0 80px;
}

.hofh-related h2 {
    margin: 8px 0 32px;
}


/* =============================================================================
   10. THE STANDARD  (page-the-standard.php)
   ============================================================================= */

/* ---- Page hero ---- */
.hofh-page-hero {
    padding: 80px 0 64px;
    background: var(--hofh-bone);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(13,27,62,0.08);
}

.hofh-page-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 12% 88%, rgba(45,106,46,0.07) 0%, transparent 60%);
    pointer-events: none;
}

.hofh-page-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
}

.hofh-page-hero__h1 {
    font-family: 'Zilla Slab', serif;
    font-size: clamp(2.8rem, 6vw, 4.5rem);
    font-weight: 700;
    line-height: 0.98;
    color: var(--hofh-navy);
    margin: 12px 0 20px;
}

.hofh-page-hero__h1 em {
    color: var(--hofh-navy);
    font-style: italic;
    text-decoration: underline;
    text-decoration-color: var(--hofh-green);
    text-decoration-thickness: 3px;
    text-underline-offset: 6px;
}

.hofh-page-hero__sub {
    font-size: 1.0625rem;
    color: rgba(13,27,62,0.65);
    max-width: 540px;
    line-height: 1.8;
    margin: 0;
}

/* ---- Our Story (dark anchor — same weight as the manifesto) ---- */
.hofh-story {
    padding: 80px 0;
    background: var(--hofh-navy);
    border-top: 1px solid rgba(184,200,240,0.08);
}

.hofh-story .hofh-eyebrow {
    color: var(--hofh-green);
}

.hofh-story-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: start;
}

.hofh-story-prose h2 {
    color: var(--hofh-bone);
    margin-bottom: 24px;
}

.hofh-story-prose p {
    font-size: 0.9375rem;
    color: var(--hofh-haze);
    line-height: 1.9;
    margin-bottom: 20px;
}

.hofh-story-prose p:last-child {
    margin-bottom: 0;
}

/* ---- Mission / Vision info blocks (dark context) ---- */
.hofh-info-block {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(184,200,240,0.12);
    border-radius: 2px;
    padding: 20px 22px;
    margin-bottom: 14px;
}

.hofh-info-block__label {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hofh-green);
    margin-bottom: 10px;
}

.hofh-info-block p {
    font-size: 0.9rem;
    color: var(--hofh-haze);
    line-height: 1.8;
    margin: 0;
}

/* ---- Values grid (dark context) ---- */
.hofh-values-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-top: 20px;
}

.hofh-value-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(184,200,240,0.1);
    border-left: 3px solid var(--hofh-green);
    border-radius: 2px;
    padding: 16px;
}

.hofh-value-card h4 {
    font-family: 'Inter', sans-serif;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--hofh-green);
    margin-bottom: 6px;
}

.hofh-value-card p {
    font-size: 0.8125rem;
    color: var(--hofh-haze);
    opacity: 0.8;
    line-height: 1.65;
    margin: 0;
}

/* ---- Acquisition Standard (bone — open, readable contrast to the dark sections) ---- */
.hofh-acq-standard {
    padding: 80px 0;
    background: var(--hofh-bone);
    border-top: none;
    border-bottom: none;
}

.hofh-acq-standard h2 {
    margin: 8px 0 12px;
}

.hofh-acq-standard > .hofh-wrap > p {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.6);
    max-width: 560px;
    margin-bottom: 48px;
    line-height: 1.75;
}

.hofh-acq-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.hofh-acq-card {
    background: #fff;
    border: 1px solid rgba(13,27,62,0.09);
    border-top: 3px solid var(--hofh-green);
    border-radius: 0 0 2px 2px;
    padding: 28px 24px;
    box-shadow: 0 2px 12px rgba(13,27,62,0.06);
}

.hofh-acq-num {
    font-family: 'Zilla Slab', serif;
    font-size: 3.5rem;
    font-weight: 700;
    color: var(--hofh-navy);
    opacity: 0.1;
    line-height: 1;
    margin-bottom: 16px;
    font-variant-numeric: tabular-nums;
}

.hofh-acq-card h3 {
    font-size: 1.0625rem;
    margin-bottom: 10px;
}

.hofh-acq-card p {
    font-size: 0.8125rem;
    color: rgba(13,27,62,0.6);
    line-height: 1.75;
    margin: 0;
}

/* ---- How We Communicate (dark anchor) ---- */
.hofh-voice {
    background: var(--hofh-navy);
    padding: 72px 0;
}

.hofh-voice .hofh-eyebrow {
    color: var(--hofh-green);
}

.hofh-voice h2 {
    color: var(--hofh-bone);
    margin: 8px 0 12px;
}

.hofh-voice > .hofh-wrap > p {
    color: var(--hofh-haze);
    opacity: 0.8;
    max-width: 560px;
    margin-bottom: 40px;
    line-height: 1.8;
    font-size: 0.9375rem;
}

.hofh-voice-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.hofh-voice-col {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(184,200,240,0.1);
    border-radius: 2px;
    padding: 24px;
}

.hofh-voice-col--yes { border-top: 3px solid var(--hofh-green); }
.hofh-voice-col--no  { border-top: 3px solid var(--hofh-orange); }

.hofh-voice-col h4 {
    font-family: 'Inter', sans-serif;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.hofh-voice-col--yes h4 { color: var(--hofh-green); }
.hofh-voice-col--no  h4 { color: var(--hofh-orange); }

.hofh-voice-item {
    padding: 10px 0;
    border-bottom: 1px solid rgba(184,200,240,0.08);
    font-size: 0.875rem;
    color: var(--hofh-haze);
    line-height: 1.65;
}

.hofh-voice-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.hofh-voice-item strong {
    color: var(--hofh-bone);
    display: block;
    margin-bottom: 3px;
    font-weight: 600;
}

/* ---- Michigan Roots (bone — closes the page after the dark Operational Contrast) ---- */
.hofh-michigan {
    padding: 80px 0;
    background: var(--hofh-bone);
    border-top: none;
}

.hofh-michigan h2 {
    margin: 8px 0 36px;
}

.hofh-michigan-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: start;
}

.hofh-michigan-prose p {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.72);
    line-height: 1.85;
    margin-bottom: 18px;
}

.hofh-michigan-prose p:last-child {
    margin-bottom: 0;
}


/* =============================================================================
   11. CARD SHOWS  (page-card-shows.php)
   ============================================================================= */

.hofh-shows-header {
    background: rgba(13,27,62,0.03);
    border-bottom: 1px solid rgba(13,27,62,0.08);
    padding: 52px 0 44px;
}

.hofh-shows-header h1 {
    margin: 6px 0 12px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.hofh-shows-header__sub {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.6);
    max-width: 580px;
    line-height: 1.75;
    margin: 0;
}

/* ---- Shows layout ---- */
.hofh-shows-layout {
    padding: 48px 0 80px;
}

.hofh-shows-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 40px;
    align-items: start;
}

/* ---- Sidebar ---- */
.hofh-shows-sidebar {
    position: sticky;
    top: 130px;
}

.hofh-shows-sidebar .hofh-eyebrow {
    margin-bottom: 16px;
}

.hofh-upcoming-show {
    background: #fff;
    border: 1px solid rgba(13,27,62,0.1);
    border-radius: 2px;
    padding: 16px;
    margin-bottom: 12px;
    transition: border-color 0.22s ease, box-shadow 0.22s ease;
}

.hofh-upcoming-show:hover {
    border-color: rgba(45,106,46,0.35);
    box-shadow: 0 4px 16px rgba(13,27,62,0.07);
}

.hofh-upcoming-show__date {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hofh-green);
    margin-bottom: 4px;
}

.hofh-upcoming-show__name {
    font-family: 'Zilla Slab', serif;
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--hofh-navy);
    margin-bottom: 3px;
}

.hofh-upcoming-show__location {
    font-size: 0.78rem;
    color: rgba(13,27,62,0.5);
    margin-bottom: 10px;
    line-height: 1.4;
}

.hofh-upcoming-show__pills {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.hofh-upcoming-show__pill {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 2px 8px;
    background: rgba(13,27,62,0.05);
    border: 1px solid rgba(13,27,62,0.1);
    border-radius: 2px;
    color: rgba(13,27,62,0.5);
}

.hofh-show-note {
    background: rgba(13,27,62,0.03);
    border: 1px solid rgba(13,27,62,0.09);
    border-radius: 2px;
    padding: 18px;
    margin-top: 10px;
}

.hofh-show-note .hofh-eyebrow {
    margin-bottom: 10px;
}

.hofh-show-note p {
    font-size: 0.8rem;
    color: rgba(13,27,62,0.6);
    line-height: 1.7;
    margin: 0;
}

/* ---- Recaps ---- */
.hofh-show-recaps > .hofh-eyebrow {
    display: block;
    margin-bottom: 20px;
}

.hofh-recap {
    background: #fff;
    border: 1px solid rgba(13,27,62,0.1);
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(13,27,62,0.05);
    margin-bottom: 32px;
}

.hofh-recap:last-child {
    margin-bottom: 0;
}

/* Empty recaps state — shown before first show */
.hofh-recap-empty {
    background: rgba(13,27,62,0.03);
    border: 1px solid rgba(13,27,62,0.09);
    border-radius: 2px;
    padding: 36px 32px;
}

.hofh-recap-empty p {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.55);
    line-height: 1.8;
    margin: 0;
}

.hofh-recap__header {
    background: var(--hofh-navy);
    padding: 24px 28px;
}

.hofh-recap__header .hofh-eyebrow {
    color: var(--hofh-green);
    margin-bottom: 6px;
}

.hofh-recap__header h3 {
    font-family: 'Zilla Slab', serif;
    font-size: 1.2rem;
    color: var(--hofh-bone);
    margin-bottom: 4px;
}

.hofh-recap__header > p {
    font-size: 0.8rem;
    color: var(--hofh-haze);
    opacity: 0.7;
    margin: 0 0 14px;
    line-height: 1.5;
}

.hofh-recap__meta {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.hofh-recap__meta span {
    font-size: 0.67rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 2px;
    border: 1px solid rgba(184,200,240,0.2);
    color: var(--hofh-haze);
}

.hofh-recap__body {
    padding: 28px;
}

.hofh-recap__section {
    margin-bottom: 28px;
}

.hofh-recap__section:last-child {
    margin-bottom: 0;
}

.hofh-recap__section-label {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--hofh-green);
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(13,27,62,0.08);
}

.hofh-recap__item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 10px 0;
    border-bottom: 1px solid rgba(13,27,62,0.05);
    gap: 16px;
}

.hofh-recap__item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.hofh-recap__item-desc {
    font-size: 0.875rem;
    color: rgba(13,27,62,0.75);
    line-height: 1.5;
}

.hofh-recap__item-value {
    font-size: 0.875rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    flex-shrink: 0;
}

.hofh-recap__item-value--sold   { color: #1e7a20; }
.hofh-recap__item-value--bought { color: #7a6000; }

.hofh-recap__note {
    padding: 10px 0;
    border-bottom: 1px solid rgba(13,27,62,0.05);
    font-size: 0.875rem;
    color: rgba(13,27,62,0.7);
    line-height: 1.65;
}

.hofh-recap__note:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

/* Cards in the Wild */
.hofh-recap__wild {
    background: var(--hofh-navy);
    border-radius: 2px;
    padding: 20px 22px;
}

.hofh-recap__wild-badge {
    display: inline-block;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: rgba(245,197,24,0.12);
    color: var(--hofh-yellow);
    border: 1px solid rgba(245,197,24,0.25);
    padding: 2px 8px;
    border-radius: 2px;
    margin-bottom: 8px;
}

.hofh-recap__wild-player {
    font-family: 'Zilla Slab', serif;
    font-size: 1rem;
    font-weight: 700;
    color: var(--hofh-yellow);
    margin-bottom: 2px;
}

.hofh-recap__wild-set {
    font-size: 0.78rem;
    color: var(--hofh-haze);
    opacity: 0.7;
    margin-bottom: 10px;
}

.hofh-recap__wild-sig {
    font-size: 0.8125rem;
    color: var(--hofh-haze);
    line-height: 1.72;
    opacity: 0.88;
    margin: 0 0 10px;
}

.hofh-recap__wild-condition {
    font-size: 0.78rem;
    color: var(--hofh-haze);
    opacity: 0.6;
    line-height: 1.55;
    margin-bottom: 12px;
}

.hofh-recap__wild-condition strong {
    font-style: normal;
    font-weight: 600;
    color: var(--hofh-haze);
    opacity: 0.7;
}

.hofh-recap__wild-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid rgba(184,200,240,0.1);
    flex-wrap: wrap;
    gap: 6px;
}

.hofh-recap__wild-observed {
    font-size: 0.67rem;
    color: var(--hofh-haze);
    opacity: 0.45;
}

.hofh-recap__wild-status {
    font-size: 0.67rem;
    font-weight: 600;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--hofh-haze);
    opacity: 0.55;
}


/* =============================================================================
   12. GENERIC PAGE  (page.php)
   ============================================================================= */

.hofh-generic-page {
    padding: 64px 0 80px;
}

.hofh-generic-page__inner {
    max-width: 780px;
}

.hofh-generic-page__title {
    margin-bottom: 36px;
}

.hofh-generic-page__content {
    font-size: 0.9375rem;
    line-height: 1.8;
    color: rgba(13,27,62,0.75);
}

.hofh-generic-page__content p {
    margin-bottom: 18px;
}

.hofh-generic-page__content p:last-child {
    margin-bottom: 0;
}

.hofh-generic-page__content h2,
.hofh-generic-page__content h3 {
    margin-top: 36px;
    margin-bottom: 16px;
}


/* =============================================================================
   RESPONSIVE — INNER PAGES
   ============================================================================= */

@media (max-width: 900px) {

    /* Vault */
    .hofh-filter-bar__inner {
        padding: 12px 24px;
    }

    .hofh-filter-bar__count {
        width: 100%;
        margin-left: 0;
    }

    /* Card Detail */
    .hofh-detail-inner {
        grid-template-columns: 1fr;
    }

    .hofh-detail-card {
        position: static;
        align-items: center;
    }

    .hofh-detail-card__slab {
        max-width: 220px;
    }

    .hofh-breadcrumb {
        padding: 12px 24px;
    }

    .hofh-detail-layout {
        padding: 32px 0 64px;
    }

    /* The Standard */
    .hofh-story-grid,
    .hofh-michigan-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .hofh-acq-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hofh-voice-grid {
        grid-template-columns: 1fr;
    }

    .hofh-values-grid {
        grid-template-columns: 1fr;
    }

    /* Card Shows */
    .hofh-shows-grid {
        grid-template-columns: 1fr;
    }

    .hofh-shows-sidebar {
        position: static;
    }
}

@media (max-width: 600px) {

    .hofh-page-hero {
        padding: 56px 0 44px;
    }

    .hofh-page-hero__h1 {
        font-size: clamp(2.2rem, 10vw, 3rem);
    }

    .hofh-vault-header,
    .hofh-shows-header {
        padding: 40px 0 28px;
    }

    .hofh-vault-header h1,
    .hofh-shows-header h1 {
        font-size: 1.875rem;
    }

    .hofh-detail-player {
        font-size: 2rem;
    }

    .hofh-recap__body {
        padding: 20px 18px;
    }

    .hofh-recap__header {
        padding: 20px 18px;
    }

    /* Exhibits */
    .hofh-exhibits-header {
        padding: 40px 0 28px;
    }

    .hofh-exhibits-header h1 {
        font-size: 1.875rem;
    }

    .hofh-exhibit-card__body {
        padding: 20px 18px 24px;
    }
}


/* =============================================================================
   13. EXHIBITS — Editorial Blog
   ============================================================================= */

/* ── Page Header ── */
.hofh-exhibits-header {
    background: rgba(13,27,62,0.03);
    border-bottom: 1px solid rgba(13,27,62,0.08);
    padding: 52px 0 44px;
}

.hofh-exhibits-header h1 {
    font-size: clamp(2rem, 4vw, 3rem);
    margin: 6px 0 14px;
    line-height: 1.15;
}

.hofh-exhibits-header__sub {
    font-size: 0.9375rem;
    color: rgba(13,27,62,0.6);
    max-width: 600px;
    line-height: 1.75;
    margin: 0;
}

/* ── Grid ── */
.hofh-exhibits-grid {
    padding: 64px 0 80px;
    background: var(--hofh-bone);
}

.hofh-exhibits-grid .hofh-grid--3 {
    align-items: start;
}

/* ── Article Card ── */
.hofh-exhibit-card {
    background: #fff;
    border: 1px solid #e5e0d8;
    border-radius: 2px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.hofh-exhibit-card:hover {
    box-shadow: 0 6px 24px rgba(13,27,62,.12);
    transform: translateY(-3px);
    text-decoration: none;
    color: inherit;
}

.hofh-exhibit-card__thumb {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--hofh-navy);
    display: flex;
    align-items: center;
    justify-content: center;
}

.hofh-exhibit-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.hofh-exhibit-card__placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Zilla Slab', serif;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--hofh-yellow);
    letter-spacing: 0.04em;
}

.hofh-exhibit-card__body {
    padding: 24px 24px 28px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.hofh-exhibit-card__cat {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--hofh-green);
}

.hofh-exhibit-card__title {
    font-family: 'Zilla Slab', serif;
    font-size: 1.1875rem;
    font-weight: 700;
    color: var(--hofh-navy);
    line-height: 1.3;
    margin: 0;
}

.hofh-exhibit-card:hover .hofh-exhibit-card__title {
    color: var(--hofh-green);
}

.hofh-exhibit-card__excerpt {
    font-size: 0.9375rem;
    color: #555;
    line-height: 1.6;
    margin: 0;
    flex: 1;
}

.hofh-exhibit-card__meta {
    font-size: 0.8125rem;
    color: #888;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #ede9e0;
    display: flex;
    align-items: center;
    gap: 6px;
}

.hofh-exhibit-card__meta-dot {
    color: #ccc;
}

/* ── Empty State ── */
.hofh-exhibits-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 80px 24px;
    background: #fff;
    border: 1px solid #e5e0d8;
    border-radius: 2px;
}

.hofh-exhibits-empty p {
    font-size: 1.0625rem;
    color: #666;
    margin: 0;
}

.hofh-exhibits-empty a {
    color: var(--hofh-green);
    font-weight: 600;
}

/* ── Exhibits responsive ── */
@media (max-width: 900px) {
    .hofh-exhibits-grid .hofh-grid--3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .hofh-exhibits-grid .hofh-grid--3 {
        grid-template-columns: 1fr;
    }
}
