/* ============================================================
   U3 — Direction C · "The Monolith" — DARK COHESION LAYER
   Loaded AFTER monolith.css and monolith-fx.css.
   The hero is dark + atmospheric; this carries that world all
   the way down instead of slamming into light paper. It only
   re-points the existing palette tokens + patches the few
   places that hardcoded the old paper color. Delete this one
   <link> to fall back to the original light Monolith.
   ============================================================ */

:root{
  --paper:#0C0D11;        /* page ground — deep, a hair of blue, matches hero base */
  --paper-2:#16181F;      /* raised surfaces / placeholder fills */
  --ink:#F2F0EA;          /* was dark text & strong fills → now light */
  --ink-2:#ADAFB7;        /* secondary text */
  --ink-3:#83868F;        /* mono labels / tertiary */
  --ink-4:#54565E;        /* faintest */
  --rule:#2A2C36;         /* strong swiss rule, now a visible dark hairline */
  --hair:#1E2028;         /* faint hairline */
  --accent:#1F44E0;       /* electric cobalt — unchanged */
  --accent-l:#6E86FF;     /* lighter cobalt for accents sitting on dark */
  --live:#41C079;         /* brightened so status reads on dark */
  --build:#E2A33C;
}

/* ---- hero now fades into the dark ground, not paper ---- */
.hero::after{
  background:linear-gradient(to bottom,
    rgba(12,13,17,0) 0%,
    rgba(12,13,17,0) 38%,
    var(--paper) 100%);
}

/* ---- scrolled nav: dark glass instead of paper glass ---- */
.nav.scrolled{
  background:rgba(12,13,17,.96);
  border-bottom-color:var(--rule);
}
/* keep the (light) wordmark light on the dark scrolled bar */
.nav.scrolled .mark img{filter:none;}
.nav.scrolled .nav-links a{color:var(--ink-2);}
.nav.scrolled .nav-links a:hover{color:#fff;}
.nav.scrolled .nav-cta{background:var(--ink);color:var(--paper);}
.nav.scrolled .nav-cta:hover{background:var(--accent);color:#fff;}

/* ---- brighten the cobalt section numerals so they pop on dark ---- */
.sec-head .no{color:var(--accent-l);}

/* ---- LAB band: keep it as its own zone, but as a lift WITHIN the
        dark world rather than the lone dark island it used to be ---- */
.lab{background:#15171F;color:var(--ink);}
.lab .sec-head{border-bottom-color:var(--rule);}
.lab .sec-head h2{color:var(--ink);}
.lab .sec-head .no{color:var(--accent-l);}
.lab .sec-head .sd{color:var(--ink-2);}
.mw{color:var(--ink);}
.mw:hover{color:var(--accent-l);}
.lab-note{color:var(--ink-3);}

/* ---- cheaper custom cursor: drop mix-blend-mode:difference, which forces a
        full-screen recomposite on every move/scroll (a real scroll-perf cost).
        Keep the dot + trailing ring, just with solid colors that read on dark. ---- */
.u3-cursor{background:var(--accent-l);mix-blend-mode:normal;}
.u3-cursor-ring{border-color:rgba(242,240,234,.5);mix-blend-mode:normal;}
.cursor-active .u3-cursor-ring{background:rgba(242,240,234,.10);}

/* ---- hero legibility floor: a soft, localized scrim behind the copy + a
        faint halo on the headline, so the white text stays readable over the
        brightest moments of the chrome without dimming the surrounding FX ---- */
.hero .hero-inner::before{
  content:"";position:absolute;inset:-6vh -8vw -2vh -8vw;z-index:-1;pointer-events:none;
  background:radial-gradient(120% 85% at 34% 42%,
    rgba(6,7,11,.62) 0%, rgba(6,7,11,.34) 42%, rgba(6,7,11,0) 72%);
}
.hero h1{text-shadow:0 2px 34px rgba(6,7,11,.55), 0 1px 6px rgba(6,7,11,.45);}
.hero .lede,.hero .hero-top .lbl{text-shadow:0 1px 14px rgba(6,7,11,.5);}

/* ---- same legibility floor for the nav while it's over the hero. Once
        scrolled it gets a solid dark bar, so only the transparent state needs it ---- */
.nav:not(.scrolled){
  background:linear-gradient(to bottom, rgba(6,7,11,.62) 0%, rgba(6,7,11,.26) 60%, rgba(6,7,11,0) 100%);
}
.nav:not(.scrolled) .nav-links a{text-shadow:0 1px 3px rgba(6,7,11,.9), 0 1px 12px rgba(6,7,11,.7);}
.nav:not(.scrolled) .mark img{filter:drop-shadow(0 1px 8px rgba(6,7,11,.6));}
.nav:not(.scrolled) .nav-cta{box-shadow:0 2px 18px rgba(6,7,11,.4);}
