/* ============================================================================
   Spirit Poster (Template C) inner sub-pages — Events / Clinics / Teams /
   Facilities / About. Same theme-agnostic vp-* markup the other themes use,
   restyled into Direction C's centered, symmetric "Spirit Poster" language:
   an ink page-header band with a red watermark, centred section heads, poster
   colour bands, and a centred red CTA close.

   Structure (padding, grids, the base typography) is shared from
   public-varsity-pages.css under `.public-site-shell .vp-*`. This file overrides
   colours, centres the chrome, and flips the few structural diffs Direction C
   needs. Scoped under .theme-spirit-poster; it loads AFTER the shared + kinetic
   files so its centred-poster overrides win on specificity ties.

   Colours read from the per-club brand palette the shell emits (--brand-primary
   = red, --brand-secondary = ink, --brand-accent = blue) over the fixed
   paper/muted neutrals. --cm-edge is inherited from theme-spirit-poster.css.
   ============================================================================ */

.theme-spirit-poster {
    --sp-red:   var(--brand-primary, #D8232A);
    --sp-ink:   var(--brand-secondary, #0E1216);
    --sp-blue:  var(--brand-accent, #1FA9D6);
    --sp-paper: var(--brand-paper, #F5F1EA);
    --sp-muted: var(--brand-muted, #7A7368);
}

/* ===== Page-header band — ink, centred, red watermark ===== */
.theme-spirit-poster .vp-header {
    position: relative;
    overflow: hidden;
    background: var(--sp-ink);
    color: var(--sp-paper);
    text-align: center;
    padding: clamp(2.5rem, 5vw, 64px) var(--cm-edge) clamp(3rem, 6vw, 72px);
    border-bottom: 0;
}
/* Giant red watermark centred behind the title (the design's "26"). */
.theme-spirit-poster .vp-header__watermark {
    display: block;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    font-family: "Anton", system-ui, sans-serif;
    font-size: clamp(180px, 30vw, 320px);
    line-height: 0.9;
    letter-spacing: -8px;
    color: var(--sp-red);
    opacity: 0.12;
    pointer-events: none;
    white-space: nowrap;
}
.theme-spirit-poster .vp-header__crumb {
    position: relative;
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--sp-paper) 55%, transparent);
    margin-bottom: 1.4rem;
    justify-content: center;
}
.theme-spirit-poster .vp-header__crumb a { color: inherit; }
.theme-spirit-poster .vp-header__crumb-sep { color: var(--sp-red); }
/* Single centred column — drop the 2-col title/intro split. */
.theme-spirit-poster .vp-header__grid {
    position: relative;
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 0;
}
.theme-spirit-poster .vp-header__grid > div { display: flex; flex-direction: column; align-items: center; }
.theme-spirit-poster .vp-header__title {
    font-family: "Anton", system-ui, sans-serif;
    color: var(--sp-paper);
    font-size: clamp(3rem, 10vw, 120px);
    line-height: 0.9;
    letter-spacing: -1px;
}
.theme-spirit-poster .vp-header__meta {
    justify-content: center;
    color: color-mix(in srgb, var(--sp-paper) 72%, transparent);
    margin-top: 1.5rem;
}
.theme-spirit-poster .vp-header__meta b { color: var(--sp-blue); }
.theme-spirit-poster .vp-header__intro {
    color: color-mix(in srgb, var(--sp-paper) 82%, transparent);
    font-size: 18px;
    max-width: 620px;
    margin: 1.6rem auto 0;
    text-align: center;
}
/* Pill — paper-outlined chip on the ink band. */
.theme-spirit-poster .vp-pill {
    border: 1.5px solid var(--sp-paper);
    border-radius: 0;
    color: var(--sp-paper);
    background: transparent;
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    padding: 6px 12px;
    margin-bottom: 1.4rem;
}
.theme-spirit-poster .vp-pill::before { content: none; }

/* The kinetic marquee divider has no place in this theme. */
.theme-spirit-poster .vp-header-marquee { display: none; }

/* ===== Section head — centred ===== */
.theme-spirit-poster .vp-sechead {
    max-width: none;
    text-align: center;
    margin: 0 auto clamp(2rem, 4vw, 48px);
}
.theme-spirit-poster .vp-sechead .vp-pill {
    border-color: var(--sp-red);
    color: var(--sp-red);
}
.theme-spirit-poster .vp-sechead--light .vp-pill {
    border-color: var(--sp-paper);
    color: var(--sp-paper);
}
.theme-spirit-poster .vp-sechead__title {
    font-family: "Anton", system-ui, sans-serif;
    font-size: clamp(2.25rem, 6vw, 80px);
    line-height: 0.96;
    letter-spacing: -0.5px;
    color: var(--sp-ink);
}
.theme-spirit-poster .vp-sechead--light .vp-sechead__title { color: var(--sp-paper); }
.theme-spirit-poster .vp-sechead__blurb {
    color: var(--sp-muted);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.theme-spirit-poster .vp-sechead--light .vp-sechead__blurb { color: color-mix(in srgb, var(--sp-paper) 78%, transparent); }

/* ===== Tag atom ===== */
.theme-spirit-poster .vp-tag {
    border: 1.5px solid var(--vp-accent, var(--sp-ink));
    border-radius: 0;
    color: var(--vp-accent, var(--sp-ink));
}
.theme-spirit-poster .vp-tag--solid { background: var(--vp-accent, var(--sp-ink)); color: var(--sp-paper); }

/* ===== Filter chips — centred ===== */
.theme-spirit-poster .vp-filter {
    background: var(--sp-paper);
    color: var(--sp-ink);
    border-bottom: 0;
    text-align: center;
}
.theme-spirit-poster .vp-filter__label { display: none; }
.theme-spirit-poster .vp-filter__btn { color: var(--sp-ink); border-color: currentColor; border-radius: 0; }
.theme-spirit-poster .vp-filter__btn--tryout { color: var(--sp-red); }
.theme-spirit-poster .vp-filter__btn--camp { color: var(--sp-blue); }
.theme-spirit-poster .vp-filter__count { color: var(--sp-muted); }

/* ===== Events ===== */
.theme-spirit-poster .vp-events { background: var(--sp-paper); color: var(--sp-ink); }

/* Featured card — ink panel. */
.theme-spirit-poster .vp-featured { background: var(--sp-ink); color: var(--sp-paper); border-radius: 0; }
.theme-spirit-poster .vp-featured__eyebrow { color: color-mix(in srgb, var(--sp-paper) 60%, transparent); }
.theme-spirit-poster .vp-featured__photo {
    background: repeating-linear-gradient(135deg,
        var(--vp-accent, var(--sp-red)) 0 14px,
        color-mix(in srgb, var(--vp-accent, var(--sp-red)) 86%, black) 14px 28px);
}
.theme-spirit-poster .vp-featured__badge-m { color: var(--vp-accent, var(--sp-red)); }

/* Event list — 3-up border-top-accent cards. */
.theme-spirit-poster .vp-evlist {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    border: 0;
}
.theme-spirit-poster .vp-evrow {
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
    gap: 0;
    align-items: stretch;
    padding: 24px;
    background: var(--sp-paper);
    border: 1px solid color-mix(in srgb, var(--sp-ink) 10%, transparent);
    border-top: 5px solid var(--vp-accent, var(--sp-ink));
}
.theme-spirit-poster .vp-evrow .vp-date {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
    width: auto; height: auto;
    background: none; border-top: 0;
}
.theme-spirit-poster .vp-evrow .vp-date__d {
    font-family: "Anton", system-ui, sans-serif;
    font-size: 72px; line-height: 0.85; letter-spacing: -1px;
    color: var(--vp-accent, var(--sp-ink));
}
.theme-spirit-poster .vp-evrow .vp-date__m { color: var(--sp-muted); margin-top: 4px; }
.theme-spirit-poster .vp-evrow__head { margin-top: 14px; }
.theme-spirit-poster .vp-evrow__when { color: var(--sp-muted); }
.theme-spirit-poster .vp-evrow__title { font-size: 26px; line-height: 1.02; margin-top: 16px; }
.theme-spirit-poster .vp-evrow__desc { color: var(--sp-muted); margin-top: 12px; }
.theme-spirit-poster .vp-evrow__cta { justify-self: stretch; margin-top: auto; padding-top: 18px; }
.theme-spirit-poster .vp-empty { color: var(--sp-muted); }

/* ===== Members-only note — centred ===== */
.theme-spirit-poster .vp-note {
    background: color-mix(in srgb, var(--sp-ink) 4%, var(--sp-paper));
    border: 1px solid color-mix(in srgb, var(--sp-ink) 12%, transparent);
    border-top: 3px solid var(--sp-blue);
    border-left: 0;
    justify-content: center;
    text-align: center;
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
.theme-spirit-poster .vp-note__tag { color: var(--sp-blue); }
.theme-spirit-poster .vp-note__text { color: var(--sp-ink); }
.theme-spirit-poster .vp-note__text a { color: var(--sp-ink); }

/* ===== Underline / button atoms ===== */
.theme-spirit-poster .vp-link,
.theme-spirit-poster .vp-link:link,
.theme-spirit-poster .vp-link:visited { color: var(--vp-accent, var(--sp-red)); }
.theme-spirit-poster .vp-btn,
.theme-spirit-poster .vp-btn:link,
.theme-spirit-poster .vp-btn:visited { background: var(--sp-red); border-radius: 0; }
.theme-spirit-poster .vp-btn-link,
.theme-spirit-poster .vp-btn-link:link,
.theme-spirit-poster .vp-btn-link:visited { color: var(--sp-ink); border-bottom-color: var(--sp-ink); }

/* ===== Clinics — expect / bring ===== */
.theme-spirit-poster .vp-clinic-info { background: var(--sp-paper); color: var(--sp-ink); }
.theme-spirit-poster .vp-expect { border-top: 2px solid var(--sp-ink); }
.theme-spirit-poster .vp-expect__row { border-bottom-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); }
.theme-spirit-poster .vp-expect__num { color: var(--sp-red); }
.theme-spirit-poster .vp-expect__text { color: var(--sp-muted); }
.theme-spirit-poster .vp-bring { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-bring__mark { color: var(--sp-red); }
.theme-spirit-poster .vp-bring__text { color: color-mix(in srgb, var(--sp-paper) 72%, transparent); }
.theme-spirit-poster .vp-bring__note { border-top-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); color: color-mix(in srgb, var(--sp-paper) 80%, transparent); }

/* ===== Facilities ===== */
.theme-spirit-poster .vp-fac { background: var(--sp-paper); color: var(--sp-ink); }
.theme-spirit-poster .vp-fac__card { border-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); border-radius: 0; }
.theme-spirit-poster .vp-fac__card--primary { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-fac__card--primary .vp-fac__photo {
    background: repeating-linear-gradient(135deg,
        var(--sp-red) 0 14px,
        color-mix(in srgb, var(--sp-red) 86%, black) 14px 28px);
}
.theme-spirit-poster .vp-fac__role,
.theme-spirit-poster .vp-fac__primary-tag { color: var(--sp-red); }
.theme-spirit-poster .vp-fac__card--primary .vp-fac__primary-tag { color: color-mix(in srgb, var(--sp-paper) 60%, transparent); }
.theme-spirit-poster .vp-fac__note { border-top-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); color: var(--sp-muted); }
.theme-spirit-poster .vp-fac__note a { color: var(--sp-red); }
.theme-spirit-poster .vp-fac__card--primary .vp-fac__note { color: color-mix(in srgb, var(--sp-paper) 78%, transparent); border-top-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); }
.theme-spirit-poster .vp-fac__card--primary .vp-fac__note a { color: var(--sp-paper); }

/* Game-day tips — ink band. */
.theme-spirit-poster .vp-tips { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-tips__grid { border-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); }
.theme-spirit-poster .vp-tips__cell { border-right-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); }
.theme-spirit-poster .vp-tips__num { color: var(--sp-red); }
.theme-spirit-poster .vp-tips__cell:nth-child(2) .vp-tips__num { color: var(--sp-blue); }
.theme-spirit-poster .vp-tips__text { color: color-mix(in srgb, var(--sp-paper) 75%, transparent); }

/* ===== Teams — join / facts / roster / standings ===== */
.theme-spirit-poster .vp-join { background: var(--sp-paper); color: var(--sp-ink); border-bottom-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); }
.theme-spirit-poster .vp-facts,
.theme-spirit-poster .vp-facts__cell { border-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); }
.theme-spirit-poster .vp-facts__num { color: var(--sp-ink); }
.theme-spirit-poster .vp-facts__label { color: var(--sp-muted); }

.theme-spirit-poster .vp-roster { background: var(--sp-paper); color: var(--sp-ink); }
.theme-spirit-poster .vp-roster__card { border-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); border-radius: 0; }
.theme-spirit-poster .vp-roster__card--dark { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-roster__card--dark .vp-roster__photo {
    background: repeating-linear-gradient(135deg,
        var(--sp-red) 0 14px,
        color-mix(in srgb, var(--sp-red) 86%, black) 14px 28px);
}
.theme-spirit-poster .vp-roster__group { color: var(--sp-red); }
.theme-spirit-poster .vp-roster__meta { color: var(--sp-muted); }
.theme-spirit-poster .vp-roster__card--dark .vp-roster__meta { color: color-mix(in srgb, var(--sp-paper) 70%, transparent); }
.theme-spirit-poster .vp-roster__record { border-top-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); }
.theme-spirit-poster .vp-roster__card--dark .vp-roster__record { border-top-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); }
.theme-spirit-poster .vp-roster__wl span,
.theme-spirit-poster .vp-roster__streak { color: var(--sp-muted); }

.theme-spirit-poster .vp-standings { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-standings__table { border-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); }
.theme-spirit-poster .vp-standings__head { border-bottom-color: color-mix(in srgb, var(--sp-paper) 16%, transparent); color: var(--sp-muted); }
.theme-spirit-poster .vp-standings__row { border-bottom-color: color-mix(in srgb, var(--sp-paper) 10%, transparent); }
.theme-spirit-poster .vp-standings__age { color: var(--sp-red); }
.theme-spirit-poster .vp-standings__pct { color: color-mix(in srgb, var(--sp-paper) 85%, transparent); }
.theme-spirit-poster .vp-standings__streak { color: var(--sp-muted); }
.theme-spirit-poster .vp-standings__streak--w { color: var(--sp-blue); }

/* ===== About — mission / glance / contact ===== */
.theme-spirit-poster .vp-mission { background: var(--sp-paper); color: var(--sp-ink); }
.theme-spirit-poster .vp-mission__body { color: var(--sp-muted); }
.theme-spirit-poster .vp-mission__photo {
    background: repeating-linear-gradient(135deg,
        var(--sp-red) 0 14px,
        color-mix(in srgb, var(--sp-red) 86%, black) 14px 28px);
    outline-color: var(--sp-ink);
}
.theme-spirit-poster .vp-glance { border-top: 2px solid var(--sp-ink); }
.theme-spirit-poster .vp-glance__cell { border-right-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); }
.theme-spirit-poster .vp-glance__num { color: var(--sp-ink); }
.theme-spirit-poster .vp-glance__label { color: var(--sp-muted); }

.theme-spirit-poster .vp-about-contact { background: var(--sp-paper); }
.theme-spirit-poster .vp-ccard { background: var(--sp-ink); color: var(--sp-paper); border-radius: 0; }
.theme-spirit-poster .vp-ccard__k { color: var(--sp-muted); }
.theme-spirit-poster .vp-ccard__v a { border-bottom-color: var(--sp-red); }
.theme-spirit-poster .vp-icard { border-color: color-mix(in srgb, var(--sp-ink) 10%, transparent); border-radius: 0; }
.theme-spirit-poster .vp-icard__title { color: var(--sp-ink); }
.theme-spirit-poster .vp-icard__text { color: var(--sp-muted); }

/* ===== CTA strip — centred red close ===== */
.theme-spirit-poster .vp-cta {
    position: relative;
    overflow: hidden;
    background: var(--sp-red);
    color: var(--sp-paper);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
}
.theme-spirit-poster .vp-cta__bg { display: none; }
.theme-spirit-poster .vp-cta__head {
    position: relative;
    font-family: "Anton", system-ui, sans-serif;
    text-align: center;
}
.theme-spirit-poster .vp-cta__right {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 18px;
}
.theme-spirit-poster .vp-cta__phone { color: color-mix(in srgb, var(--sp-paper) 90%, transparent); }
.theme-spirit-poster .vp-cta__phone b { color: var(--sp-paper); }
.theme-spirit-poster .vp-cta__btn,
.theme-spirit-poster .vp-cta__btn:link,
.theme-spirit-poster .vp-cta__btn:visited {
    background: var(--sp-paper);
    color: var(--sp-ink);
    border-radius: 0;
    margin-top: 18px;
}
.theme-spirit-poster .vp-cta__btn:hover { color: var(--sp-ink); filter: brightness(0.97); }

/* ===== Footer — ink, poster accents ===== */
.theme-spirit-poster .vp-footer { background: var(--sp-ink); color: var(--sp-paper); }
.theme-spirit-poster .vp-footer__brand-name { color: var(--sp-red); }
.theme-spirit-poster .vp-footer__col--portal .vp-footer__col-title { color: var(--sp-blue); }

/* ===== Responsive ===== */
@media (max-width: 900px) {
    .theme-spirit-poster .vp-evlist { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
    .theme-spirit-poster .vp-evlist { grid-template-columns: 1fr; }
}
