/* ==========================================================================
   A3 Strategic Advisory — www.a3strategicadvisory.com — shared stylesheet
   Phase 3 MVW build, 20260706MO.

   Design law: style_guide_resonant_stark.md (Motion Amendment v1.2 direction-
   lock) + the locked v4 "Depth" reference implementation
   (00_Project_Center/02_Design/A3_concept_v4_depth_L4_20260706MO/).
   Every color is a §2.1 guide hex or an alpha of that exact RGB. No new hues.
   Card tilt ≤4.5°/axis (operator direction-lock 20260706MO).
   ========================================================================== */

:root{
  /* color tokens — guide §2.1 */
  --a3-sheet:#F4F5F7;
  --a3-sheet-deep:#EDEFF2;
  --a3-sheet-hi:#F6F7F9;
  --a3-surface:#FFFFFF;
  --a3-ink:#171717;
  --a3-ink-2:#4D4D4D;
  --a3-ink-3:#8F8F8F;
  --a3-annotation:#5B6472;
  --a3-hairline:#EBEBEB;
  --a3-link:#0064E2;
  --a3-accent:#0072F5;               /* large graphics / glows ONLY — never text */
  --a3-night:#0A0A0A;
  --a3-night-ink:#EDEFF2;
  --a3-night-ink-2:#A8B0BA;
  --a3-error:#B00020;
  --a3-success:#006E28;

  /* type — §2.2 (Geist intended; system stack fallback, as the locked v4 build) */
  --font-sans:"Geist Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,"Roboto Mono",Menlo,Consolas,monospace;

  /* spacing — §2.3 */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px;
  --sp-8:32px; --sp-12:48px; --sp-16:64px; --sp-24:96px; --sp-32:128px;

  /* radii — §2.4 */
  --radius-s:6px; --radius-m:8px; --radius-l:12px; --radius-pill:9999px;

  /* motion — §2.7 base durations */
  --dur-fast:150ms; --dur-base:200ms; --ease:ease-out;

  /* pointer / scene state (written by the rAF loop; defaults = at rest) */
  --px:0px; --py:0px;
  --mx:52%; --my:40%;
  --sheen:-30%;
  --scene-rx:0deg; --scene-ry:0deg;

  /* pattern tiles — guide §3.2/§3.3. Visible (hero) / Whisper (elsewhere). */
  --tile-visible:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cpath d='M24 0v96M72 0v96M0 24h96M0 72h96M0 0v96M96 0v96M0 0h96M0 96h96' fill='none' stroke='%23171717' stroke-opacity='.03' stroke-width='1'/%3E%3Cpath d='M48 0v96M0 48h96' fill='none' stroke='%23171717' stroke-opacity='.04' stroke-width='1'/%3E%3Cpath d='M0 -6v4M0 2v4M-6 0h4M2 0h4' fill='none' stroke='%235B6472' stroke-opacity='.04' stroke-width='1' transform='translate(48 48)'/%3E%3C/svg%3E");
  --tile-whisper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cpath d='M24 0v96M72 0v96M0 24h96M0 72h96M0 0v96M96 0v96M0 0h96M0 96h96' fill='none' stroke='%23171717' stroke-opacity='.02' stroke-width='1'/%3E%3Cpath d='M48 0v96M0 48h96' fill='none' stroke='%23171717' stroke-opacity='.02' stroke-width='1'/%3E%3C/svg%3E");
  --tile-reticle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96'%3E%3Cpath d='M0 -6v4M0 2v4M-6 0h4M2 0h4' fill='none' stroke='%235B6472' stroke-opacity='.04' stroke-width='1' transform='translate(48 48)'/%3E%3C/svg%3E");
  --tile-reticle-lg:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cpath d='M80 66v10M80 84v10M66 80h10M84 80h10' fill='none' stroke='%235B6472' stroke-opacity='.06' stroke-width='1'/%3E%3Ccircle cx='80' cy='80' r='13' fill='none' stroke='%235B6472' stroke-opacity='.05' stroke-width='1'/%3E%3C/svg%3E");
  --tile-deep:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M0 0h120M0 60h120M0 0v120M60 0v120' fill='none' stroke='%23171717' stroke-opacity='.02' stroke-width='1'/%3E%3C/svg%3E");
  --tile-night:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cpath d='M0 0h120M0 40h120M0 80h120M0 0v120M40 0v120M80 0v120' fill='none' stroke='%23EDEFF2' stroke-opacity='.06' stroke-width='1'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font:400 16px/1.5 var(--font-sans);
  letter-spacing:-0.02em;
  color:var(--a3-ink);
  background:var(--a3-sheet);
  overflow-x:hidden;
}

/* ---------- layout primitives (§5.1) ---------- */
.container{max-width:960px;margin-inline:auto;padding-inline:24px}
.prose{max-width:600px}

.sheet{position:relative}
.sheet::before{
  content:"";position:absolute;inset:0;
  background-image:var(--tile-whisper);
  background-size:96px 96px;
  pointer-events:none;z-index:0;
}
.sheet>*{position:relative;z-index:1}

/* ---------- skip link / focus (§6.2) ---------- */
.skip{position:absolute;left:-9999px;top:0;background:var(--a3-surface);color:var(--a3-ink);padding:8px 16px;z-index:50;border-radius:var(--radius-s)}
.skip:focus{left:8px;top:8px}
:focus-visible{outline:2px solid var(--a3-link);outline-offset:2px;border-radius:inherit}
.night-band :focus-visible,.site-footer :focus-visible{outline-color:var(--a3-night-ink)}

/* ---------- buttons (§4.1) ---------- */
.cta-primary{
  display:inline-block;background:var(--a3-ink);color:#FFFFFF;
  font:500 16px/1 var(--font-sans);letter-spacing:0;white-space:nowrap;
  padding:12px 24px;border-radius:var(--radius-pill);
  border:none;box-shadow:none;cursor:pointer;position:relative;
  isolation:isolate;text-decoration:none;
  transition:background var(--dur-fast) var(--ease),transform var(--dur-fast) var(--ease);
  /* NO overflow:hidden here — it clips the ::before 44px hit-area extension
     (Fix Round 1, CRITICAL-2). The ::after glow self-clips via border-radius. */
}
.cta-primary:hover{background:#383838}
.cta-primary:active{transform:scale(.99)}
.cta-primary::after{
  content:"";position:absolute;inset:0;z-index:-1;opacity:0;
  border-radius:inherit;overflow:hidden;
  background:radial-gradient(120px circle at var(--cx,50%) var(--cy,50%),rgba(0,114,245,.22),transparent 70%);
  transition:opacity var(--dur-base) var(--ease);pointer-events:none;
}
@media (hover:hover) and (pointer:fine){
  .cta-primary:hover::after{opacity:1}
}
.cta-compact{font-size:14px;padding:8px 16px}
/* dark-band inversion (§4.1) */
.night-band .cta-primary{background:var(--a3-surface);color:var(--a3-ink)}
.night-band .cta-primary:hover{background:var(--a3-sheet-hi)}
.textlink{
  color:var(--a3-link);text-decoration:none;
  transition:color var(--dur-fast) var(--ease);
}
.textlink:hover,.textlink:focus-visible{text-decoration:underline}
.arrow{display:inline-block;transition:transform var(--dur-fast) var(--ease)}
.textlink:hover .arrow,.textlink:focus-visible .arrow{transform:translateX(4px)}

/* ---------- nav (§4.3) ---------- */
.site-nav{
  position:sticky;top:0;z-index:20;height:64px;
  background:rgba(244,245,247,.85);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--a3-hairline);
  transition:background-color var(--dur-base) var(--ease),
             border-bottom-color var(--dur-base) var(--ease);
}
.site-nav.js-armed{border-bottom-color:transparent}
.site-nav.js-armed.is-elevated{
  background:rgba(244,245,247,.95);
  border-bottom-color:var(--a3-hairline);
}
.nav-inner{height:64px;display:flex;align-items:center;gap:var(--sp-6)}
.brand{display:flex;align-items:center;gap:var(--sp-3);text-decoration:none;color:var(--a3-ink);perspective:600px}
.brand-name{font:600 14px/1 var(--font-sans);letter-spacing:-0.02em;white-space:nowrap}

/* ---------- brand mark — multi-plane 3D brand object (enhancement 20260707TU) ----------
   v4 depth vocabulary only (§9.3): static Z-offset planes (drafting-sheet
   backplate behind, mark tile in front), a layered drop-shadow that ENCODES the
   permanent Z-lift (§9.3.2 — depth cue, not ornament), a blueprint-blue accent
   glow (decoration only, never text), a hover pop-out on the inner plane, and a
   pointer-coupled tilt (js layer 8) capped at the same ≤4.5°/axis card law.
   Reduced motion + print: flat, complete, fully visible. No-JS: the static
   3D composition is pure CSS and renders complete. */
.brand-mark{
  position:relative;display:block;width:52px;height:52px;flex:none;
  transform-style:preserve-3d;
  transform:rotateX(var(--brx,0deg)) rotateY(var(--bry,0deg));
  transition:transform var(--dur-base) var(--ease);
  filter:
    drop-shadow(0 10px 18px rgba(23,23,23,.16))
    drop-shadow(0 3px 6px rgba(23,23,23,.10))
    drop-shadow(0 0 1px rgba(0,114,245,.10));
}
.brand-mark::before{ /* far plane — drafting-sheet backplate */
  content:"";position:absolute;inset:-4px;z-index:0;
  border-radius:var(--radius-m);
  background-color:var(--a3-sheet-deep);
  background-image:var(--tile-visible);
  background-size:32px 32px;
  box-shadow:0 0 0 1px var(--a3-hairline);
  transform:translateZ(-14px);
}
.brand-glow{ /* mid plane — blueprint-blue rim (guide §2.1: accent = graphics only) */
  position:absolute;inset:-2px;z-index:1;border-radius:var(--radius-m);opacity:.55;
  background:radial-gradient(34px circle at 50% 42%,rgba(0,114,245,.16),transparent 72%);
  transform:translateZ(-4px);
  transition:opacity var(--dur-base) var(--ease);
  pointer-events:none;
}
.brand-mark img{ /* near plane — the mark tile, permanently lifted off the sheet */
  position:relative;z-index:2;display:block;width:52px;height:52px;
  padding:4px;background:var(--a3-surface);border-radius:var(--radius-s);
  box-shadow:0 0 0 1px var(--a3-hairline);
  transform:translateZ(12px);
  transition:transform var(--dur-base) var(--ease);
}
.brand:hover .brand-mark img,.footer-brand:hover .brand-mark img{transform:translateZ(26px)}
.brand:hover .brand-glow,.footer-brand:hover .brand-glow{opacity:1}
.nav-links{display:flex;gap:var(--sp-6);list-style:none;margin-left:var(--sp-4)}
.nav-links a{
  font:500 14px/1 var(--font-sans);letter-spacing:0;color:var(--a3-ink-2);
  text-decoration:none;white-space:nowrap;transition:color var(--dur-fast) var(--ease);
}
.nav-links a:hover{color:var(--a3-ink)}
.nav-links a[aria-current="page"]{color:var(--a3-ink)}
.nav-cta{margin-left:auto}
.menu-toggle{
  display:none;margin-left:auto;background:var(--a3-surface);color:var(--a3-ink);
  font:500 14px/1 var(--font-sans);padding:8px 16px;border:none;cursor:pointer;
  border-radius:var(--radius-pill);box-shadow:0 0 0 1px var(--a3-hairline);
}

/* ==========================================================================
   HERO — homepage multi-plane 3D depth scene (v4 a) + interior page headers
   ========================================================================== */
.hero{
  position:relative;overflow:hidden;
  perspective:1200px;
  perspective-origin:52% 42%;
  background:#F4F5F7;
  background:linear-gradient(180deg,#F6F7F9 0%,#F2F4F6 55%,#EDEFF2 100%);
}
.hero-scene{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  transform-style:preserve-3d;
  transform:rotateX(var(--scene-rx)) rotateY(var(--scene-ry));
  transition:transform 320ms var(--ease);
  will-change:transform;
}
.hero-grid-plane{
  position:absolute;inset:-8% -6%;
  background-image:var(--tile-visible);
  background-size:96px 96px;
  transform:translate3d(var(--px),var(--py),-220px) scale(1.24);
  transform-origin:50% 50%;
  will-change:transform;
}
.hero-reticle-stack{
  position:absolute;top:-10%;bottom:-10%;right:-6%;width:56%;
  transform-style:preserve-3d;
  transform:translate3d(calc(var(--px) * -1.6),calc(var(--py) * -1.6),0);
  will-change:transform;
}
.rstack-layer{position:absolute;inset:0;background-repeat:repeat;will-change:transform}
.rstack-1{background-image:var(--tile-reticle);background-size:96px 96px;background-position:48px 48px;transform:translateZ(-140px) scale(1.14)}
.rstack-2{background-image:var(--tile-reticle-lg);background-size:160px 160px;transform:translateZ(-60px) scale(1.06)}
.rstack-3{background-image:var(--tile-reticle-lg);background-size:200px 200px;background-position:80px 40px;transform:translateZ(6px)}
.hero-lamp{
  position:absolute;inset:-6%;pointer-events:none;opacity:0;
  background:radial-gradient(460px circle at var(--mx) var(--my),rgba(255,255,255,.4),rgba(255,255,255,0) 62%);
  transform:translateZ(-30px);
  transition:opacity 600ms var(--ease);
  will-change:opacity;
}
.hero.lamp-on .hero-lamp{opacity:1}
.hero-sheen{
  position:absolute;top:-20%;bottom:-20%;left:-60%;width:60%;
  pointer-events:none;opacity:0;
  background:linear-gradient(100deg,rgba(246,247,249,0) 0%,rgba(246,247,249,.9) 45%,rgba(246,247,249,0) 100%);
  transform:translate3d(var(--sheen),0,-10px) skewX(-12deg);
  will-change:transform;
  transition:opacity 800ms var(--ease);
}
.hero.sheen-on .hero-sheen{opacity:.5}
.dim-fragment{
  position:absolute;right:24px;bottom:40px;
  opacity:.06;pointer-events:none;z-index:1;
  transform:translateZ(20px);
  will-change:transform;
}
.hero-inner{
  padding-block:var(--sp-24) var(--sp-32);position:relative;z-index:2;
  transform:translateZ(40px);
}
.hero h1{
  font:600 clamp(40px,5vw,64px)/1.0 var(--font-sans);
  letter-spacing:-0.06em;
  max-width:14ch;
  color:var(--a3-ink); /* fallback — always AA */
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  .hero h1{
    background:linear-gradient(180deg,rgba(23,23,23,.8) 0%,var(--a3-ink) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
}
.hero .subhead{
  font:400 20px/1.5 var(--font-sans);letter-spacing:-0.02em;
  color:var(--a3-ink-2);max-width:600px;margin-top:var(--sp-6);
}
.hero-actions{display:flex;align-items:center;gap:var(--sp-6);margin-top:var(--sp-8);flex-wrap:wrap}
.hero-actions .textlink{font:500 16px/1 var(--font-sans);letter-spacing:0}

/* interior page header — static Visible tile, no 3D scene (per-page depth budget) */
.page-hero{perspective:none}
.page-hero .hero-inner{padding-block:var(--sp-24);transform:none}
.page-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:var(--tile-visible);background-size:96px 96px;
}
.page-hero .hero-inner{position:relative;z-index:1}
.page-hero h1{max-width:22ch}
.eyebrow{
  font:400 12px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;
  color:var(--a3-annotation);
}
.page-hero .eyebrow{display:block;margin-bottom:var(--sp-4)}

/* ==========================================================================
   SECTION SYSTEM
   ========================================================================== */
section h2{
  font:600 clamp(32px,3.75vw,48px)/1.06 var(--font-sans);
  letter-spacing:-0.06em;max-width:20ch;
}
section h3{
  font:600 clamp(24px,2.5vw,32px)/1.15 var(--font-sans);
  letter-spacing:-0.04em;max-width:26ch;
}
.section{padding-block:var(--sp-24)}
.section-tint{background:var(--a3-sheet-deep)}
.section p+p{margin-top:var(--sp-4)}

/* layered section depth (v4 c) */
.depth-section{position:relative;isolation:isolate}
.section-backplane{
  position:absolute;inset:-12% 0;z-index:0;pointer-events:none;
  background-image:var(--tile-deep);
  background-size:120px 120px;
  opacity:.9;
  will-change:transform;
}
.depth-section>.container{position:relative;z-index:1}

/* ---------- bento cards (§4.2, v4 b) ---------- */
.disciplines{padding-block:var(--sp-24);margin-top:-24px}
.bento{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sp-6);margin-top:var(--sp-12);
  perspective:1400px;
  perspective-origin:50% 40%;
}
.card{
  position:relative;background:var(--a3-surface);
  border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);
  padding:var(--sp-6);
  display:flex;flex-direction:column;gap:var(--sp-4);
  transform-style:preserve-3d;
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(var(--card-z,0px));
  transition:transform var(--dur-base) var(--ease),
             box-shadow var(--dur-base) var(--ease),
             filter var(--dur-base) var(--ease);
}
.card-glow{
  position:absolute;inset:0;border-radius:inherit;z-index:0;opacity:0;
  background:radial-gradient(240px circle at var(--gx,50%) var(--gy,50%),rgba(0,114,245,.10),transparent 68%);
  pointer-events:none;transition:opacity var(--dur-base) var(--ease);
  transform:translateZ(2px);
}
.card>*{position:relative;z-index:1}
.card .eyebrow{transform:translateZ(var(--z-eye,0px));transition:transform var(--dur-base) var(--ease)}
.card .capability{transform:translateZ(var(--z-cap,0px));transition:transform var(--dur-base) var(--ease)}
.card .result{transform:translateZ(var(--z-metric,0px));transition:transform var(--dur-base) var(--ease)}
.card>.textlink{transform:translateZ(var(--z-link,0px));transition:transform var(--dur-base) var(--ease),color var(--dur-fast) var(--ease)}
.card::after{
  content:"";position:absolute;inset:-6px;pointer-events:none;opacity:.05;z-index:0;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M.5 8V.5H8' fill='none' stroke='%235B6472' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 .5h7.5V8' fill='none' stroke='%235B6472' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M.5 0v7.5H8' fill='none' stroke='%235B6472' stroke-width='1'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M0 7.5h7.5V0' fill='none' stroke='%235B6472' stroke-width='1'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:top left,top right,bottom left,bottom right;
  transition:opacity var(--dur-base) var(--ease);
}
@media (hover:hover) and (pointer:fine){
  .card:hover{
    box-shadow:0 0 0 1px #D4D6DA;
    /* pop-out elevation — layered drop-shadow encoding the real Z-lift (§9.3.2) */
    filter:
      drop-shadow(0 10px 22px rgba(23,23,23,.10))
      drop-shadow(0 3px 8px rgba(23,23,23,.06))
      drop-shadow(0 0 1px rgba(0,114,245,.06));
  }
  .card:hover::after{opacity:.12}
  .card:hover .card-glow{opacity:1}
  .card:hover .arrow{transform:translateX(4px)}
  .card:hover{--z-eye:28px;--z-cap:16px;--z-metric:54px;--z-link:38px}
}
.capability{font:400 16px/1.5 var(--font-sans);letter-spacing:-0.02em;color:var(--a3-ink)}
.result{margin-top:auto}
.result-k{
  display:block;font:400 12px/1.4 var(--font-mono);letter-spacing:.05em;
  text-transform:uppercase;color:var(--a3-annotation);margin-bottom:var(--sp-2);
}
.metric{
  display:block;font:500 clamp(28px,3vw,40px)/1.1 var(--font-mono);
  letter-spacing:-0.01em;color:var(--a3-ink);
}
.result-desc{
  display:block;font:400 14px/1.45 var(--font-sans);letter-spacing:0;
  color:var(--a3-ink-2);margin-top:var(--sp-2);
}
.card .textlink{font:500 14px/1 var(--font-sans);letter-spacing:0}

/* ---------- results band (silo section 4) ---------- */
.results-band .metric-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--sp-6);margin-top:var(--sp-12);
}
.metric-cell{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-6);
}
.metric-cell .metric-label{
  display:block;font:400 14px/1.45 var(--font-sans);letter-spacing:0;
  color:var(--a3-ink-2);margin-top:var(--sp-2);
}

/* ---------- trust anchors (silo section 5; official client logos, 20260707TU) ----------
   Guide §5.3 1:1 wordmark→logo swap: real alt text, grayscale render
   (filter:grayscale(1) — the sanctioned §5.3 treatment; opacity is an alpha of
   the logos' own inks, no new hue), explicit width/height (zero CLS), no
   layout change. The li text styles below remain as the §5.3 fallback voice. */
.trust-band{background:var(--a3-sheet-deep);border-block:1px solid var(--a3-hairline)}
.wordmarks{
  display:flex;gap:var(--sp-8) var(--sp-12);flex-wrap:wrap;align-items:center;
  margin-top:var(--sp-8);list-style:none;
}
.wordmarks li{
  font:500 14px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;
  color:var(--a3-annotation); /* 5.19:1 on #EDEFF2 — AA PASS (guide §5.3) */
  white-space:nowrap;
}
.logo-img{display:block;filter:grayscale(1);opacity:.78}
.wordmarks .logo-img{display:block}

/* ---------- dark band (§4.4) + receding perspective floor (v4 e) ---------- */
.night-band{
  position:relative;overflow:hidden;
  background:var(--a3-night);color:var(--a3-night-ink);
  perspective:520px;perspective-origin:50% 0%;
}
.night-band h2,.night-band h3{color:var(--a3-night-ink)}
.night-band p,.night-band li{color:var(--a3-night-ink-2)}
.night-band .eyebrow{color:var(--a3-night-ink-2)}
.night-band strong{color:var(--a3-night-ink)}
.night-band .textlink{color:var(--a3-night-ink);text-decoration:underline}
.band-floor{
  position:absolute;left:-30%;right:-30%;bottom:-40%;height:180%;
  pointer-events:none;z-index:0;opacity:0;
  background-image:var(--tile-night);
  background-size:120px 120px;
  transform:rotateX(74deg) translate3d(0,var(--depth,0px),0);
  transform-origin:50% 100%;
  will-change:transform;
  transition:opacity 700ms var(--ease);
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 42%,#000 100%);
  mask-image:linear-gradient(180deg,transparent 0%,#000 42%,#000 100%);
}
.night-band.depth-on .band-floor{opacity:1}
.band-sweep{
  position:absolute;inset:0;pointer-events:none;z-index:0;opacity:0;
  background:radial-gradient(600px 300px at var(--swp,20%) 0%,rgba(237,239,242,.05),transparent 70%);
  transition:opacity 700ms var(--ease);
}
.night-band.depth-on .band-sweep{opacity:1}
.night-band>.container{position:relative;z-index:1}
.machinery-list{list-style:none;margin-top:var(--sp-12);display:grid;gap:var(--sp-6)}
.machinery-list li{font:400 16px/1.5 var(--font-sans)}
.machinery-list strong{font-weight:600}
.night-band .link-line{margin-top:var(--sp-12);color:var(--a3-night-ink-2)}

/* ---------- closing CTA strip ---------- */
.closing{
  background:var(--a3-sheet-deep);border-top:1px solid var(--a3-hairline);
  margin-top:-16px;position:relative;z-index:2;
}
.closing-inner{padding-block:var(--sp-24);text-align:center;position:relative;z-index:1}
.closing h2{max-width:18ch;margin-inline:auto}
.closing p{
  font:400 20px/1.5 var(--font-sans);letter-spacing:-0.02em;color:var(--a3-ink-2);
  max-width:600px;margin:var(--sp-6) auto 0;
}
.closing .cta-primary{margin-top:var(--sp-8)}

/* ==========================================================================
   SERVICES PAGE
   ========================================================================== */
.service-section{border-top:1px solid var(--a3-hairline);scroll-margin-top:80px}
.service-section:first-of-type{border-top:none}
.service-head .eyebrow{display:block;margin-bottom:var(--sp-4)}
.service-block{margin-top:var(--sp-12)}
.service-block>h3{margin-bottom:var(--sp-6)}
.service-block .prose{margin-top:var(--sp-4)}
.solution-list{list-style:none;margin-top:var(--sp-6);display:grid;gap:var(--sp-4)}
.solution-list li{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-6);
}
.solution-list strong{font-weight:600}
.record-card{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-8);
  margin-top:var(--sp-6);
}
.record-card ul{list-style:none;display:grid;gap:var(--sp-6)}
.record-card strong{font:500 clamp(20px,2vw,24px)/1.3 var(--font-mono);letter-spacing:-0.01em;color:var(--a3-ink)}
.record-anchor{
  margin-top:var(--sp-6);font-size:14px;color:var(--a3-ink-2);
  display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap;
}
.record-anchor .wordmark{
  font:500 14px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;
  color:var(--a3-annotation);
}
.service-cta{margin-top:var(--sp-8)}
.framework-list{list-style:none;margin-top:var(--sp-6);display:grid;gap:var(--sp-4)}
.framework-list li{padding-left:var(--sp-6);border-left:1px solid var(--a3-hairline)}
.framework-list strong{font-weight:600}
.framework-list.numbered{counter-reset:fw}
.framework-list.numbered li{counter-increment:fw;position:relative}
.framework-list.numbered li::before{
  content:counter(fw);position:absolute;left:-1px;top:2px;transform:translateX(-100%);
  padding-right:var(--sp-3);
  font:400 12px/1.6 var(--font-mono);letter-spacing:.05em;color:var(--a3-annotation);
}
.framework-list.numbered li{margin-left:var(--sp-6)}

/* ==========================================================================
   CASE STUDIES PAGE
   ========================================================================== */
.case-study{border-top:1px solid var(--a3-hairline);scroll-margin-top:80px}
.case-study:first-of-type{border-top:none}
.case-lever{
  /* copy sentence in the annotation voice — NO text-transform (copy casing is law).
     Type snapped to the §2.2 mono-label stop (12px / +0.05em) — Fix Round 1 MINOR-2. */
  display:block;font:400 12px/1.5 var(--font-mono);letter-spacing:.05em;
  color:var(--a3-annotation);margin-top:var(--sp-4);
}
.outcome-quote{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-8);
  margin-top:var(--sp-8);
  font:400 20px/1.5 var(--font-sans);letter-spacing:-0.02em;color:var(--a3-ink);
}
.outcome-quote strong{font-weight:600}
.case-block{margin-top:var(--sp-12)}
.case-block>h3{margin-bottom:var(--sp-6)}
.case-block .prose+.prose{margin-top:var(--sp-4)}
.process-list,.payoff-list{list-style:none;margin-top:var(--sp-6);display:grid;gap:var(--sp-4);max-width:720px}
.process-list li,.payoff-list li{padding-left:var(--sp-6);border-left:1px solid var(--a3-hairline)}
.process-list strong,.payoff-list strong{font-weight:600}
.case-close{margin-top:var(--sp-8);max-width:600px;color:var(--a3-ink-2)}
.framework-detail{
  margin-top:var(--sp-12);
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);
}
.framework-detail summary{
  cursor:pointer;padding:var(--sp-6);
  font:500 16px/1.3 var(--font-sans);letter-spacing:-0.02em;color:var(--a3-ink);
  border-radius:inherit;
}
.framework-detail summary .eyebrow{display:block;margin-bottom:var(--sp-2)}
.framework-detail[open] summary{border-bottom:1px solid var(--a3-hairline)}
.framework-detail ul{list-style:none;padding:var(--sp-6);display:grid;gap:var(--sp-4)}
.framework-detail strong{font-weight:600}

/* ==========================================================================
   ABOUT PAGE
   ========================================================================== */
.signal-stack{
  /* copy casing preserved — no text-transform ("AI Governance & Enablement" exact) */
  margin-top:var(--sp-8);padding:var(--sp-6);
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);
  font:500 14px/1.8 var(--font-mono);letter-spacing:.05em;
  color:var(--a3-annotation);
}
.mechanism-list{list-style:none;margin-top:var(--sp-12);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-4)}
.mechanism-list li{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-4) var(--sp-6);
  font:400 16px/1.5 var(--font-sans);
}
.record-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-6);margin-top:var(--sp-12)}
.record-block{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-8);
  display:flex;flex-direction:column;gap:var(--sp-4);
}
.record-block .wordmark{
  font:500 14px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;
  color:var(--a3-annotation);
}
.record-logos{display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap}
.record-block p{color:var(--a3-ink)}
.record-block .textlink{font:500 14px/1 var(--font-sans);letter-spacing:0;margin-top:auto}

/* ==========================================================================
   CONTACT PAGE
   ========================================================================== */
.agenda-list{list-style:none;margin-top:var(--sp-12);display:grid;gap:var(--sp-4);counter-reset:agenda;max-width:720px}
.agenda-list li{
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);padding:var(--sp-6);
  counter-increment:agenda;position:relative;padding-left:var(--sp-16);
}
.agenda-list li::before{
  content:counter(agenda);position:absolute;left:var(--sp-6);top:var(--sp-6);
  font:500 clamp(20px,2vw,24px)/1.1 var(--font-mono);color:var(--a3-annotation);
}
.agenda-list strong{font-weight:600}
.contact-notes{margin-top:var(--sp-8);max-width:600px}
.contact-notes p+p{margin-top:var(--sp-4)}
.contact-notes strong{font-weight:600}
.scheduler-frame{
  margin-top:var(--sp-12);padding:var(--sp-16) var(--sp-8);text-align:center;
  background:var(--a3-surface);border-radius:var(--radius-l);
  box-shadow:0 0 0 1px var(--a3-hairline);
}
/* D4 Cal.com click-to-activate embed (Fix Round 1): the inline container is
   inert until the visitor asks for the calendar; the activation button hides
   once the embed script has landed. No third-party bytes before interaction. */
.cal-inline{display:none}
.scheduler-frame.cal-active .cal-inline{display:block;min-height:560px;margin-top:var(--sp-6)}
.scheduler-frame.cal-active [data-cal-target]{display:none}
html.no-js .scheduler-frame [data-cal-target]{display:none} /* no-JS: the noscript link serves instead */
.channel-list{list-style:none;margin-top:var(--sp-6);display:grid;gap:var(--sp-3)}
.reassurance{border-top:1px solid var(--a3-hairline)}
.reassurance ul{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-6)}
.reassurance li{
  font:400 14px/1.45 var(--font-sans);color:var(--a3-ink-2);
  padding-left:var(--sp-4);border-left:1px solid var(--a3-hairline);
}

/* ==========================================================================
   FOOTER (§4.4) — dark night-band variant
   ========================================================================== */
.site-footer{
  position:relative;overflow:hidden;
  background:var(--a3-night);color:var(--a3-night-ink);
  border-top:1px solid rgba(237,239,242,.14);
  perspective:520px;perspective-origin:50% 0%;
}
.site-footer.depth-on .band-floor{opacity:1}
.site-footer.depth-on .band-sweep{opacity:1}
.footer-inner{
  position:relative;z-index:1;
  padding-block:var(--sp-12);display:flex;align-items:flex-start;
  justify-content:space-between;gap:var(--sp-8);flex-wrap:wrap;
}
.footer-brand{display:flex;align-items:center;gap:var(--sp-4);perspective:600px}
.site-footer .brand-mark::before{box-shadow:0 0 0 1px rgba(237,239,242,.14)} /* night hairline (§4.4 ink-alpha family) */
.footer-word{font:600 14px/1 var(--font-sans);letter-spacing:-0.02em;color:var(--a3-night-ink)}
.footer-links{list-style:none;display:flex;gap:var(--sp-6);flex-wrap:wrap}
.footer-links a{
  font:500 14px/1 var(--font-sans);letter-spacing:0;color:var(--a3-night-ink-2);
  text-decoration:none;transition:color var(--dur-fast) var(--ease);
}
.footer-links a:hover,.footer-links a:focus-visible{color:var(--a3-night-ink)}
.footer-meta{display:flex;flex-direction:column;gap:var(--sp-3);align-items:flex-end}
.footer-meta a{color:var(--a3-night-ink-2);font:400 14px/1.4 var(--font-sans);text-decoration:none}
.footer-meta a:hover,.footer-meta a:focus-visible{color:var(--a3-night-ink);text-decoration:underline}
.footer-legal{
  font:400 12px/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;
  color:var(--a3-night-ink-2);
}

/* ---------- breakpoints (§5.2) ---------- */
@media (max-width:899px){
  /* the enlarged brand mark takes the room the name used below 900px;
     the anchor keeps its full accessible name via aria-label */
  .brand-name{display:none}
}
@media (max-width:1279px){
  .nav-inner{gap:var(--sp-4)}
  .nav-links{gap:var(--sp-4);margin-left:var(--sp-2)}
  .hero-inner{padding-block:80px}
  .section,.disciplines,.closing-inner{padding-block:80px}
  .page-hero .hero-inner{padding-block:80px}
  .bento{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bento .card:nth-child(3){grid-column:span 2}
  .results-band .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .results-band .metric-cell:nth-child(5){grid-column:span 2}
}
@media (max-width:767px){
  html.js .nav-links{
    display:none;position:absolute;top:64px;left:0;right:0;
    flex-direction:column;gap:0;margin:0;
    background:var(--a3-surface);border-bottom:1px solid var(--a3-hairline);
  }
  html.js .site-nav.menu-open .nav-links{display:flex}
  html.js .nav-links li{border-top:1px solid var(--a3-hairline)}
  html.js .nav-links a{display:block;padding:var(--sp-4) var(--sp-6)}
  /* no-JS fallback: links stay visible so every page remains reachable */
  html.no-js .nav-links{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
  html.no-js .nav-links a{font-size:14px} /* §2.2 scale stop (was off-scale 13px) */
  /* brand-name already hidden ≤899px; the static 3D brand composition stays
     below 768px (it is a still — only the pointer tilt is desktop-gated) */
  html.js .menu-toggle{display:inline-block}
  .nav-cta{margin-left:0}
  html.no-js .nav-cta{display:none} /* keeps the bar usable; contact stays 1 link away */
  .hero-inner,.page-hero .hero-inner{padding-block:var(--sp-16)}
  .section,.disciplines,.closing-inner{padding-block:var(--sp-16)}
  .bento{grid-template-columns:1fr;gap:var(--sp-4);perspective:none}
  .bento .card:nth-child(3){grid-column:auto}
  .results-band .metric-grid{grid-template-columns:1fr}
  .results-band .metric-cell:nth-child(5){grid-column:auto}
  .mechanism-list,.record-pair{grid-template-columns:1fr}
  .reassurance ul{grid-template-columns:1fr}
  .dim-fragment{display:none}
  /* below 768px: no pointer 3D — flatten every depth transform */
  .card{transform:none}
  .card:hover{filter:none} /* no Z-lift below 768px, so no elevation shadow either */
  .card .eyebrow,.card .capability,.card .result,.card>.textlink{transform:none}
  .hero{perspective:none}
  .hero-scene{transform:none}
  .hero-grid-plane{transform:translate3d(0,0,0)}
  .hero-reticle-stack{transform:none;opacity:.6}
  .rstack-1,.rstack-2,.rstack-3{transform:none}
  .hero-lamp{display:none}
  .hero-inner{transform:none}
  .section-backplane{display:none}
  .disciplines,.closing{margin-top:0}
  .band-floor{transform:rotateX(74deg);opacity:1}
}

/* ---------- reduced motion (§6.3 / §9.3.3: flattens ALL 3D) ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .hero-lamp,.hero-sheen,.band-sweep{display:none}
  .hero{perspective:none}
  .hero-scene{transform:none}
  .hero-grid-plane{transform:none}
  .hero-reticle-stack{transform:none;opacity:.5}
  .rstack-1,.rstack-2,.rstack-3{transform:none}
  .hero-inner{transform:none}
  .dim-fragment{transform:none}
  .card{transform:none;filter:none}
  /* hover elevation removed under reduced motion (§9.3.2/§9.3.3) — this rule
     out-specifies AND follows the (hover:hover) .card:hover elevation rule,
     so the flatten wins (Fix Round 1, CRITICAL-1). */
  .card:hover{filter:none}
  .card .eyebrow,.card .capability,.card .result,.card>.textlink{transform:none}
  .card-glow{display:none}
  .cta-primary::after{display:none}
  .section-backplane{transform:none}
  .band-floor{transform:rotateX(74deg);opacity:1}
  .disciplines,.closing{margin-top:0}
  /* brand mark: flat, complete, fully visible (law) — planes collapse, the
     Z-encoding shadow and glow go with them */
  .brand,.footer-brand{perspective:none}
  .brand-mark{transform:none;filter:none}
  .brand-mark::before,.brand-mark img{transform:none}
  .brand-glow{display:none}
}
/* pattern dropped in print (§3.4); brand mark prints flat */
@media print{
  .sheet::before,.page-hero::before,.hero-scene,.hero-lamp,.hero-sheen,.band-floor,.band-sweep,.section-backplane,.brand-glow{display:none}
  .brand-mark{transform:none;filter:none}
  .brand-mark::before,.brand-mark img{transform:none}
}

/* ≥44px touch targets on pill controls — hit area only, zero visual change */
.cta-primary,.menu-toggle{position:relative}
.cta-primary::before,.menu-toggle::before{
  content:"";position:absolute;left:0;right:0;top:50%;
  height:44px;transform:translateY(-50%);z-index:2;
}