/* ============================================================
   CONSOLIDATED FIX LAYER  (loaded last — wins the cascade)
   Goals:
   1. READABILITY — every content "block" uses one consistent,
      legible text colour on its (dark) card surface. Repairs the
      light-theme leftovers that ended up dark-on-dark.
   2. PERFORMANCE — removes the expensive effects that caused
      scroll jank: stacked backdrop-filter blurs, scroll-driven
      parallax transforms, and heavy multi-layer texture repaints.
   ============================================================ */

:root{
  /* one source of truth for text on dark card surfaces */
  --card-bg:#16181a;
  --card-bg-2:#1d1f22;
  --card-border:rgba(255,255,255,.14);
  --text-strong:#f6f1ef;      /* headings / bold */
  --text-body:#d9d6d2;        /* body copy — readable, consistent */
  --text-muted:#a9a5a0;       /* captions / labels / categories */
  --accent:#B31B1B;           /* readable red accent on dark */
  --accent-deep:#B31B1B;
}

/* ------------------------------------------------------------
   1. READABILITY
   ------------------------------------------------------------ */

/* All card-like blocks: translucent dark glass (matches the reference
   "copy" panel look — photo subtly shows through), kept dark enough
   that text stays fully readable. */
.aud,.pillar,.term,.q,.concern,.tier,.way,.val,.card,.step,.fact,
.s,.c,.lead .c,.mt .myth,.mt .truth,.ask,.faq,
section.section-fade .aud,
section.section-fade .pillar,
section.section-fade .term,
section.section-fade .q,
section.section-fade .concern,
section.section-fade .tier,
section.section-fade .way,
section.section-fade .val,
section.section-fade .card,
section.section-fade .step,
section.section-fade .fact,
section.section-fade .s,
section.section-fade .c{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  background-image:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  box-shadow:0 24px 60px -40px rgba(0,0,0,.8) !important;
}

/* Kill the decorative ::after grain overlays that sat on every card */
.aud::after,.pillar::after,.term::after,.q::after,.concern::after,
.tier::after,.way::after,.val::after,.card::after,.step::after,
.fact::after,.s::after,.c::after,
section.section-fade .aud::after,
section.section-fade .pillar::after,
section.section-fade .term::after,
section.section-fade .q::after,
section.section-fade .concern::after,
section.section-fade .tier::after,
section.section-fade .way::after,
section.section-fade .val::after,
section.section-fade .card::after,
section.section-fade .step::after,
section.section-fade .fact::after,
section.section-fade .s::after,
section.section-fade .c::after{
  content:none !important;
  display:none !important;
}

/* Headings inside blocks */
.aud h3,.pillar h3,.term h3,.concern .q,.tier h3,.way h3,.val h3,
.card h3,.step h3,.fact h3,.s h3,.c h3,.mt h3,.lead .c h3,
.term .top h3{
  color:var(--text-strong) !important;
  text-shadow:none !important;
}

/* Body copy inside every block — the key consistency fix.
   These were var(--gray)/var(--ink) (dark) on now-dark cards. */
.aud p,.pillar p,.term p,.q p,.concern p,.tier p,.way p,.val p,
.card p,.step p,.fact p,.s p,.c p,.mt p,.lead .c p,.ask .q,.faq p,
.step li,.cklist li,.mt .myth p,.mt .truth p,
section.section-fade .aud p,
section.section-fade .pillar p,
section.section-fade .term p,
section.section-fade .q p,
section.section-fade .concern p,
section.section-fade .tier p,
section.section-fade .way p,
section.section-fade .val p,
section.section-fade .card p,
section.section-fade .step p,
section.section-fade .fact p,
section.section-fade .s p,
section.section-fade .c p{
  color:var(--text-body) !important;
}

/* Bold / inline emphasis that was var(--ink) (near-black) */
.term p b,.concern p b,.cklist li b,.split p strong,.mt p b,
.aud p strong,.pillar p strong,.step p strong,.card p strong,
.lead .c p strong{
  color:#ffffff !important;
  font-weight:600;
}

/* Small labels / categories / numbers — keep them readable */
.term .cat{
  color:#cbc7c2 !important;
  border-color:rgba(255,255,255,.18) !important;
  background:rgba(255,255,255,.06) !important;
}
/* Stat / data captions that were dark gray on now-dark surfaces */
.fact .v,.statband .v,.statrow .v,.tl .row p{
  color:var(--text-muted) !important;
}
.pillar .pn,.val .vn,.lead .c .n,.aud .go,.mt .tag{
  color:var(--accent) !important;
}
.step .sn,.fact .k,.tl .yr{
  color:var(--accent) !important;
}
.no-results{color:var(--text-muted) !important;}

/* Search box + filter chips (lingo) — were light-on-light */
.search{
  background:var(--card-bg) !important;
  border:1px solid var(--card-border) !important;
}
.search input{color:var(--text-strong) !important;}
.search input::placeholder{color:var(--text-muted) !important;}
.search svg{color:var(--text-muted) !important;}
.chip{
  background:rgba(255,255,255,.05) !important;
  color:var(--text-body) !important;
  border:1px solid var(--card-border) !important;
}
.chip:hover{border-color:var(--accent) !important;color:var(--text-strong) !important;}
.chip.on{
  background:var(--accent-deep) !important;
  color:#fff !important;
  border-color:var(--accent-deep) !important;
}

/* "Myth vs truth" rows (rush): both share the same translucent glass
   surface so text colour is consistent and readable. */
.mt .myth,.mt .truth{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  background-image:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
.mt .myth .tag{color:var(--text-muted) !important;}
.mt .truth .tag{color:var(--accent) !important;}

/* "ask" question list (rush) was on light paper-2 */
.ask{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  border-left:3px solid var(--accent) !important;
}
.ask .q{color:var(--text-body) !important;border-bottom-color:rgba(255,255,255,.12) !important;}
.ask .q::before,.ask .q::after{color:var(--accent) !important;}

/* FAQ accordions */
.faq summary{color:var(--text-strong) !important;}
.faq summary::after{color:var(--accent) !important;}
.faq p{color:var(--text-body) !important;}

/* GOLD / RED panels keep DARK text on purpose — preserve those.
   (CTA bands, .tri-note, .cta-band) */
.cta-band h2,.tri-note h3{color:#141414 !important;text-shadow:none !important;}
.cta-band p,.tri-note p{color:rgba(12,12,13,.82) !important;}

/* .contact "Come see the house" renders over a dark photo (data-bg),
   not gold — so its text must be LIGHT grey to stay readable. */
.contact h2{color:#ededeb !important;text-shadow:0 8px 26px rgba(0,0,0,.6) !important;}
.contact p{color:#cfcdc9 !important;text-shadow:0 2px 12px rgba(0,0,0,.55) !important;}
.contact .eyebrow{color:var(--accent) !important;}
.contact .eyebrow::before{border-bottom-color:var(--accent) !important;}
.contact .btn-ghost{color:#ededeb !important;border-color:rgba(255,255,255,.4) !important;}

/* .give "Invest in the next chapter" renders over a dark photo (data-bg),
   not gold — so its text must be LIGHT to stay readable. */
.give h2{color:var(--text-strong) !important;text-shadow:0 8px 26px rgba(0,0,0,.6) !important;}
.give p{color:#ededeb !important;text-shadow:0 2px 12px rgba(0,0,0,.55) !important;}
.give .eyebrow{color:var(--accent) !important;}
.give .eyebrow::before{border-bottom-color:var(--accent) !important;}
.give .tier{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}
.give .tier .amt{color:var(--text-strong) !important;}
.give .tier .what{color:rgba(246,244,238,.8) !important;text-align:right;}

/* Inline "copy" panels on image sections: translucent dark glass
   (photo subtly shows through), with text kept fully readable. */
section.section-fade:not(.hero) .copy,
section.section-fade:not(.hero) .lead{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  background-image:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 24px 70px -50px rgba(0,0,0,.9) !important;
}
section.section-fade:not(.hero) .copy h2,
section.section-fade:not(.hero) .copy h3,
section.section-fade:not(.hero) .lead h2,
section.section-fade:not(.hero) .lead h3{
  color:var(--text-strong) !important;
  text-shadow:0 8px 26px rgba(0,0,0,.6) !important;
}
section.section-fade:not(.hero) .copy p,
section.section-fade:not(.hero) .lead p{color:#ededeb !important;}
section.section-fade:not(.hero) .copy p strong{color:#fff !important;}

/* ------------------------------------------------------------
   2. PERFORMANCE
   ------------------------------------------------------------ */

/* The nav glass is fine, but drop blur on everything else.
   Stacked backdrop-filter is the single biggest scroll cost. */
.hero-tag .eyebrow,.identity-kicker{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Stop scroll-driven parallax transforms (they force a repaint of
   large images every frame). Images stay put = smooth scrolling. */
.hero-bg img,
.subhero .bg img{
  transform:none !important;
  will-change:auto !important;
}
.site-bg-layer{
  transform:none !important;
  will-change:auto !important;
}

/* Texture on the large dark panels — shows through the translucent
   cards and gives them the grain/weave effect from the reference. */
section.section-fade::before,
section.section-fade.section-clean::before,
.dark::before,
footer.site::before{
  background:
    radial-gradient(circle at 14% 12%, rgba(255,255,255,.06), transparent 31%),
    radial-gradient(circle at 86% 68%, rgba(255,255,255,.07), transparent 34%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.05) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0 1px, transparent 1px 96px),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 8px),
    repeating-linear-gradient(45deg, rgba(255,255,255,.03) 0 1px, transparent 1px 8px),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,.18)) !important;
  opacity:.6 !important;
  mix-blend-mode:screen;
}
section.section-fade > .wrap::before,
.dark > .wrap::before,
footer.site > .wrap::before{
  display:none !important;
}

/* Calm hover transforms a touch so they don't trigger layout thrash */
.aud,.pillar,.term,.q,.concern,.tier,.way,.val,.card,.step,.fact{
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease !important;
}

/* Spinning marquee bar — make the words white and readable.
   (They were var(--ink), i.e. near-black, on a dark bar.) */
.marquee-track span{color:#b8b5b0 !important;text-shadow:0 2px 14px rgba(0,0,0,.5) !important;}

/* Respect reduced-motion fully */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .marquee-track{animation:none !important;}
}

/* ---- Alumni page new cards: match translucent glass theme ---- */
.opp,.nb,.board,.emp,
section.section-fade .opp,
section.section-fade .nb,
section.section-fade .board,
section.section-fade .emp{
  background:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  background-image:linear-gradient(135deg, rgba(16,16,16,.84), rgba(24,24,24,.76)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  box-shadow:0 24px 60px -40px rgba(0,0,0,.8) !important;
}
.emp span{color:#e9e6e2 !important;}
.opp h3,.nb h3,.board h3{color:var(--text-strong) !important;}
.opp p,.nb .role,.nb .deg,.board .sub,.board .roster{color:var(--text-body) !important;}
.opp .meta{color:var(--text-muted) !important;border-top-color:rgba(255,255,255,.12) !important;}
.nb .deg{border-top-color:rgba(255,255,255,.12) !important;}
.board .lead-row{border-bottom-color:rgba(255,255,255,.12) !important;}
.board .lead-row .nm{color:var(--text-strong) !important;}
.board .lead-row .ti{color:var(--text-muted) !important;}
.board .roster b{color:var(--text-strong) !important;}
.opp p strong,.nb p strong{color:#fff !important;}

/* ============================================================
   UNIFIED CARD THEME — rounded, textured gradient boxes.
   Applies the same box language used on About/Home to every
   remaining card across the site.
   ============================================================ */
.term,.concern,.mt .card,.ask,.lead .c,.statrow .s,.faq details{
  border-radius:22px !important;
  border:1px solid rgba(255,255,255,.13) !important;
  background:
    radial-gradient(circle at 14% 12%, rgba(255,255,255,.06), transparent 31%),
    radial-gradient(circle at 86% 68%, rgba(255,255,255,.07), transparent 34%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 1px, transparent 1px 8px),
    linear-gradient(135deg, rgba(16,16,16,.88), rgba(25,25,25,.8)) !important;
}
.term:hover,.concern:hover,.mt .card:hover,.lead .c:hover{
  border-color:rgba(255,255,255,.32) !important;
}
/* keep text readable inside the darkened boxes */
.ask h3{color:var(--text-strong) !important}
.ask .q{color:rgba(246,244,238,.85) !important;border-bottom-color:rgba(255,255,255,.14) !important}
.faq summary{color:var(--text-strong) !important}
.faq p{color:rgba(246,244,238,.78) !important}
.faq details{padding:24px 28px !important}
.faq{display:flex;flex-direction:column;gap:14px}
.statrow{border:none !important;gap:14px !important}
.statrow .s{border-right:none !important;border-bottom:none !important}