/* site.css — ported verbatim from Cortya-Web public/index.html <style>.
   The design system (atmosphere, backdrop/field, nav, buttons, sections, footer,
   reduced-motion). Color tokens live in theme.css. Section-specific selectors are
   inert unless their markup/classes are present. Per-repo overrides go in each
   page <style>, loaded AFTER this file. Do not edit here — re-copy from source. */

<style>
/* ============ Ember Console — Cortya ============ */
:root{
  /* color tokens live in /assets/theme.css (6 schemes x 2 modes).
     --amber / --teal resolve there as aliases of --accent / --accent-2,
     so every var(--amber)/var(--teal) below stays theme-correct. */
  --ease:cubic-bezier(.16,.84,.44,1);
  --measure:720px;
  --container:1180px;
  --wide:1320px;
  --pad:clamp(112px,16vh,184px);
  --font-display:"Bricolage Grotesque",sans-serif;
  --font-body:"Atkinson Hyperlegible",sans-serif;
  --font-mono:"Spline Sans Mono",monospace;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-padding-top:96px;}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}
html{overflow-x:clip;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:2px;}
::selection{background:var(--selection);color:var(--ink);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
.skip{position:fixed;top:10px;left:10px;z-index:100;background:var(--amber);color:var(--bg);font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;padding:10px 18px;border-radius:999px;transform:translateY(-300%);transition:transform .3s var(--ease);}
.skip:focus-visible{transform:none;}

.container{width:min(var(--container),calc(100% - 48px));margin-inline:auto;}
.wide{width:min(var(--wide),calc(100% - 48px));margin-inline:auto;}

.mono{
  font-family:var(--font-mono);
  font-weight:500;
  font-size:11.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ink-2);
}
.mono em{font-style:normal;color:var(--amber);}
.val{color:var(--amber);}

/* ============ Backdrop + the Field ============ */
.backdrop{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:var(--bg);contain:strict;}
.bd-group{position:absolute;inset:0;}
.bd{position:absolute;aspect-ratio:1;border-radius:50%;filter:blur(80px);mix-blend-mode:var(--bd-blend);opacity:var(--lo);}
.bd--ember{--lo:.55;width:85vw;background:radial-gradient(circle,var(--wash-1) 0%,transparent 62%);top:-20%;left:-15%;}
.bd--verdigris{--lo:.45;width:78vw;background:radial-gradient(circle,var(--wash-2) 0%,transparent 60%);bottom:-25%;right:-12%;}
.bd--madder{--lo:.40;width:75vw;background:radial-gradient(circle,var(--wash-3) 0%,transparent 58%);top:55%;left:60%;translate:-50% -50%;}
#field{position:absolute;inset:0;}
.bd-grain{position:absolute;inset:0;opacity:var(--grain-o);mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='180'%20height='180'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.9'%20numOctaves='2'%20stitchTiles='stitch'/%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E");}
.bd-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 38%,var(--vignette) 100%);}

@keyframes bd-in{from{opacity:0;}}
@keyframes drift-ember{0%,100%{transform:translate(0,0) scale(.92);}50%{transform:translate(12vw,9vw) scale(1.10);}}
@keyframes drift-verdigris{0%,100%{transform:translate(0,0) scale(1);}50%{transform:translate(-10vw,-11vw) scale(1.12);}}
@keyframes drift-madder{0%,100%{transform:translate(0,0) scale(.95);}50%{transform:translate(9vw,-9vw) scale(1.08);}}
@keyframes drift-gold{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}
html.js .bd--ember{animation:bd-in .6s var(--ease) both,drift-ember 40s ease-in-out infinite;}
html.js .bd--verdigris{animation:bd-in .6s var(--ease) both,drift-verdigris 34s ease-in-out infinite;}
html.js .bd--madder{animation:bd-in .6s var(--ease) both,drift-madder 28s ease-in-out infinite;}
@media (prefers-reduced-motion:no-preference){
  html.js .bd,html.js .hero__gold{will-change:transform;}
}

header,main,footer{position:relative;z-index:1;}

/* ============ Idle-motion gating — paused offscreen, running when .is-live ============ */
html.js [data-section]{--play:paused;}
html.js [data-section].is-live{--play:running;}

/* ============ Brand tick (pulsing diamond) ============ */
.tick{position:relative;display:inline-block;width:7px;height:7px;background:var(--amber);transform:rotate(45deg);flex:none;}
.tick::after{content:"";position:absolute;inset:-4px;border:1px solid var(--amber);opacity:0;}
@keyframes tick-pulse{0%,100%{transform:rotate(45deg) scale(1);}50%{transform:rotate(45deg) scale(1.15);}}
@keyframes tick-ring{0%{opacity:.7;transform:scale(.6);}70%,100%{opacity:0;transform:scale(1.6);}}
html.js .tick{animation:tick-pulse 2.4s ease-in-out infinite;animation-play-state:var(--play,running);}
html.js .tick::after{animation:tick-ring 2.4s ease-out infinite;animation-play-state:var(--play,running);}

/* ============ Nav ============ */
.nav{position:fixed;top:0;left:0;right:0;z-index:20;border-bottom:1px solid transparent;transition:background .5s var(--ease),border-color .5s var(--ease);}
.nav.is-scrolled{background:var(--surface-veil);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--hairline);}
.nav__inner{width:min(var(--wide),calc(100% - 48px));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;flex-wrap:wrap;}
.nav__brand{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:600;font-size:1.2rem;letter-spacing:-.01em;color:var(--ink);}
.nav__links{display:flex;align-items:center;gap:clamp(14px,2.6vw,30px);flex-wrap:wrap;}
.nav__links a:not(.btn){position:relative;font-family:var(--font-mono);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);padding:4px 0;transition:color .3s var(--ease);}
.nav__links a:not(.btn):hover,.nav__links a:not(.btn):focus-visible{color:var(--ink);}
.nav__links a:not(.btn)::after{content:"";position:absolute;left:50%;right:50%;bottom:0;height:1px;background:var(--amber);transition:left .56s var(--ease),right .56s var(--ease);}
.nav__links a:not(.btn):hover::after,.nav__links a:not(.btn):focus-visible::after{left:0;right:0;}
@keyframes fade-up{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
html.js .nav{animation:fade-up .9s var(--ease) both .2s;}

/* ============ Buttons ============ */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-mono);font-weight:500;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;padding:15px 30px;border-radius:999px;transition:transform .45s var(--ease),box-shadow .45s var(--ease),background .45s var(--ease),border-color .45s var(--ease),color .45s var(--ease);}
.btn--solid{background:var(--amber);color:var(--on-accent);}
.btn--solid:hover,.btn--solid:focus-visible{transform:translateY(-2px);box-shadow:0 12px 40px rgba(var(--accent-rgb),.28);background:var(--accent-hi);}
.btn--ghost{border:1px solid rgba(var(--ink-rgb),.28);color:var(--ink);}
.btn--ghost:hover,.btn--ghost:focus-visible{transform:translateY(-2px);border-color:var(--amber);box-shadow:0 12px 40px rgba(var(--accent-rgb),.12);}
.btn--nav{padding:10px 20px;font-size:10.5px;}
.btn__m,.btn__l{display:inline-flex;align-items:center;justify-content:center;gap:10px;}

/* ============ Keystone (section marker — replaces the rules) ============ */
.keystone{display:inline-flex;align-items:flex-end;gap:5px;height:16px;margin-bottom:14px;}
.keystone i{width:2px;background:var(--amber);transform-origin:bottom;transition:transform .52s var(--ease);}
.keystone i:nth-child(1){height:6px;opacity:.35;}
.keystone i:nth-child(2){height:10px;opacity:.55;transition-delay:70ms;}
.keystone i:nth-child(3){height:16px;opacity:1;transition-delay:140ms;}
.keystone i:nth-child(4){height:10px;opacity:.55;transition-delay:210ms;}
.keystone i:nth-child(5){height:6px;opacity:.35;transition-delay:280ms;}
html.js [data-section]:not(.is-seen) .keystone i{transform:scaleY(0);}
@keyframes keystone-breathe{0%,100%{transform:scaleY(1);}50%{transform:scaleY(1.25);}}
html.js .is-seen .keystone i:nth-child(3){animation:keystone-breathe 2.4s ease-in-out .8s infinite;animation-play-state:var(--play,running);}

/* ============ Calibration arcs (the small-data-visual family) ============ */
.arc{display:inline-block;line-height:0;flex:none;}
.arc svg{overflow:visible;}
.arc__track{fill:none;stroke:var(--baseline);stroke-width:2;transition:stroke .3s var(--ease);}
.arc__val{fill:none;stroke:var(--amber);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:var(--off,0);transition:stroke-dashoffset 1.1s var(--ease);transition-delay:var(--ad,0s);}
.arc__tip{fill:var(--amber);transition:opacity .5s var(--ease);transition-delay:calc(var(--ad,0s) + .6s);}
.arc__tipglow{fill:var(--amber);opacity:0;}
.arc__num{fill:var(--ink);font-family:var(--font-mono);font-size:15px;letter-spacing:.04em;}
html.js [data-section]:not(.is-seen) .arc__val{stroke-dashoffset:100;transition:none;}
html.js [data-section]:not(.is-seen) .arc__tip{opacity:0;transition:none;}
@keyframes glow-pulse{0%,100%{opacity:0;}50%{opacity:1;}}
html.js .is-seen .arc__tipglow{animation:glow-pulse 2.4s ease-in-out infinite;animation-delay:var(--gd,0s);animation-play-state:var(--play,running);}
.arc--corner{position:absolute;top:26px;right:26px;}
.arc--corner .arc__num{font-size:12px;}

/* ============ Scroll reveals ============ */
html.js [data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .95s var(--ease),transform .95s var(--ease);transition-delay:calc(var(--i,0) * 90ms);}
html.js .is-seen [data-reveal]{opacity:1;transform:none;}

/* ============ Sections (shared) ============ */
.section{position:relative;padding:var(--pad) 0;}
.section::before{content:"";position:absolute;width:min(560px,80vw);aspect-ratio:1;border-radius:50%;filter:blur(70px);mix-blend-mode:var(--bd-blend);opacity:.14;pointer-events:none;z-index:-1;}
#origin::before{background:radial-gradient(circle,var(--wash-1) 0%,transparent 65%);top:-8%;left:-10%;}
#work::before{background:radial-gradient(circle,var(--wash-hero) 0%,transparent 65%);top:38%;right:-12%;}
#foundations::before{background:radial-gradient(circle,var(--wash-2) 0%,transparent 65%);bottom:-6%;left:-12%;}
#services::before{background:radial-gradient(circle,var(--wash-3) 0%,transparent 65%);top:-10%;right:-8%;}
.section__index{display:block;margin-bottom:28px;}
h2,h3{font-family:var(--font-display);font-weight:600;letter-spacing:-.015em;line-height:1.12;}
.h-section{font-size:clamp(1.9rem,3.4vw,2.75rem);}
.h-lead{margin-bottom:clamp(34px,5vh,52px);max-width:24ch;}

/* ============ Hero ============ */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:140px 0 28px;}
/* gold breath — parked behind the hero headline only; scrolls away with the hero */
.hero__gold{position:absolute;width:60vw;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,var(--wash-hero) 0%,transparent 60%);top:-12%;left:52%;filter:blur(80px);mix-blend-mode:var(--bd-blend);opacity:.28;pointer-events:none;}
html.js .hero__gold{animation:bd-in .6s var(--ease) both,drift-gold 34s ease-in-out infinite;}
.hero__inner{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;}
.hero__content{grid-column:1/11;}
.hero__kicker{display:inline-flex;align-items:center;gap:14px;margin-bottom:30px;}
.hero__title{position:relative;font-family:var(--font-display);font-weight:800;font-size:clamp(3rem,7.5vw,6.25rem);line-height:1.02;letter-spacing:-.025em;max-width:12ch;}
.hero__title .glyph{display:inline-block;}
/* no filter:blur here — animating filter rasterizes each glyph layer per frame */
@keyframes glyph-in{from{opacity:0;transform:translateY(28px);}to{opacity:1;transform:none;}}
html.js .hero__title .glyph{animation:glyph-in 1.1s var(--ease) both;animation-delay:calc(var(--i) * 65ms + 350ms);}
/* headline sheen — pure transform sweep on an 11s cycle */
.hero__sheen{position:absolute;top:0;bottom:0;left:0;width:30%;opacity:0;transform:translateX(-120%) skewX(-18deg);background:linear-gradient(105deg,transparent,rgba(var(--ink-rgb),.10),transparent);mix-blend-mode:overlay;pointer-events:none;}
@keyframes sheen-sweep{0%{transform:translateX(-120%) skewX(-18deg);opacity:0;}2%{opacity:1;}13%{opacity:1;}16%,100%{transform:translateX(320%) skewX(-18deg);opacity:0;}}
html.js .hero__sheen{animation:sheen-sweep 11s linear 2.4s infinite;animation-play-state:var(--play,running);}
/* orbit satellite — one amber diamond riding a 130px arm */
@keyframes orbit{to{transform:rotate(360deg);}}
@keyframes sat-breathe{0%,100%{transform:translateX(130px) rotate(45deg) scale(1);}50%{transform:translateX(130px) rotate(45deg) scale(1.18);}}
.hero__orbit{position:absolute;top:18%;right:18%;width:0;height:0;pointer-events:none;}
html.js .hero__orbit{animation:orbit 26s linear infinite;animation-play-state:var(--play,running);}
.hero__orbit b{position:absolute;left:-2.5px;top:-2.5px;width:5px;height:5px;background:var(--amber);opacity:.45;transform:translateX(130px) rotate(45deg);}
html.js .hero__orbit b{animation:sat-breathe 5s ease-in-out infinite;animation-play-state:var(--play,running);}
.hero__sub{margin-top:32px;max-width:52ch;color:var(--ink-2);}
.hero__ctas{display:flex;gap:16px;margin-top:44px;flex-wrap:wrap;}
.hero__foot{margin-top:auto;padding-top:72px;}
/* plumb cue — a pulse cascading downward: "descend" */
.plumb{display:grid;gap:8px;justify-items:start;margin-bottom:12px;}
.plumb b{background:var(--amber);transform:rotate(45deg);opacity:.25;}
.plumb b:nth-child(1){width:4px;height:4px;}
.plumb b:nth-child(2){width:5px;height:5px;}
.plumb b:nth-child(3){width:6px;height:6px;}
@keyframes plumb-step{0%,100%{opacity:.25;transform:rotate(45deg) translateZ(0);}40%{opacity:1;}}
html.js .plumb b{animation:plumb-step 1.8s ease-in-out infinite;animation-play-state:var(--play,running);}
html.js .plumb b:nth-child(2){animation-delay:.2s;}
html.js .plumb b:nth-child(3){animation-delay:.4s;}
.hero__cue{display:flex;justify-content:space-between;margin-top:14px;}
html.js .hero__kicker{animation:fade-up .9s var(--ease) both .35s;}
html.js .hero__sub{animation:fade-up .9s var(--ease) both 1.5s;}
html.js .hero__ctas{animation:fade-up .9s var(--ease) both 1.75s;}
html.js .hero .plumb{animation:fade-up .9s var(--ease) both 2s;}
html.js .hero__cue{animation:fade-up .9s var(--ease) both 2.4s;}

/* ============ Origin ============ */
.origin__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;perspective:900px;}
.origin__index{grid-column:1/3;margin-bottom:0;}
.origin__prose{grid-column:3/9;max-width:var(--measure);}
.origin__prose .h-section{margin-bottom:26px;}
.origin__prose p{color:var(--ink-2);}
.origin__stat{position:relative;grid-column:9/13;margin-top:-3rem;align-self:start;background:var(--surface);border:1px solid var(--hairline);border-radius:20px;padding:30px 26px;}
.origin__stat .big{font-family:var(--font-display);font-weight:800;font-size:clamp(2.6rem,4vw,3.6rem);line-height:1;color:var(--amber);letter-spacing:-.02em;}
.origin__stat .mono{display:block;margin-top:14px;line-height:1.8;}
/* breathing halo — pre-baked shadow, opacity-only animation */
@keyframes halo-breathe{0%,100%{opacity:0;}50%{opacity:.8;}}
.halo{position:relative;}
.halo::before,.origin__stat::before{content:"";position:absolute;inset:0;border-radius:20px;box-shadow:0 0 60px -18px rgba(var(--accent-rgb),.30);opacity:0;pointer-events:none;}
html.js .is-seen .halo::before,html.js .is-seen .origin__stat::before{animation:halo-breathe 7s ease-in-out infinite;animation-delay:var(--hd,0s);animation-play-state:var(--play,running);}
/* satellite on the stat card's top-right corner */
.stat-orbit{position:absolute;top:0;right:0;width:0;height:0;}
html.js .is-seen .stat-orbit{animation:orbit 18s linear infinite;animation-play-state:var(--play,running);}
.stat-orbit b{position:absolute;left:-2px;top:-2px;width:4px;height:4px;background:var(--amber);opacity:.5;transform:translateX(26px) rotate(45deg);}

/* ============ Work ============ */
.work__row{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:start;perspective:900px;}
.work__row + .work__row{margin-top:clamp(80px,11vh,128px);}
.work__visual{grid-column:1/6;}
.work__copy{grid-column:7/13;}
.work__row--b .work__copy{grid-column:1/6;}
.work__row--b .work__visual{grid-column:6/13;}
.work__kicker{display:block;margin-bottom:18px;color:var(--amber);}
.work__name{font-size:clamp(1.7rem,2.6vw,2.3rem);margin-bottom:18px;}
.work__desc{color:var(--ink-2);max-width:52ch;}
.work__stat{display:block;margin-top:22px;line-height:1.9;}
.work__cta{margin-top:26px;}
.work__meters{margin-top:34px;display:grid;gap:10px;max-width:420px;}
.meter{position:relative;display:flex;align-items:center;gap:18px;padding:4px 0;}
.meter__label{transition:color .3s var(--ease);}
.meter:hover .arc__track{stroke:rgba(var(--accent-rgb),.4);}
.meter:hover .meter__label{color:var(--ink);}
html.js .meter__valtext{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

/* Signal Dial */
.dial{display:grid;justify-items:center;gap:22px;padding:48px 24px 28px;background:var(--surface);border:1px solid var(--hairline);border-radius:20px;}
.dial svg{width:220px;height:220px;overflow:visible;}
.dial__ticks line{stroke:rgba(var(--ink-rgb),.3);stroke-width:1;}
.dial__ticks line.maj{stroke:rgba(var(--ink-rgb),.55);}
#dial-ticks{transform-origin:110px 110px;}
.dial__sweepwrap{transform-origin:110px 110px;}
@keyframes dial-spin{to{transform:rotate(360deg);}}
/* sweep accelerates through and lingers each lap instead of metronoming */
html.js .dial__sweepwrap{animation:dial-spin 7.2s cubic-bezier(.45,.05,.55,.95) infinite;animation-play-state:var(--play,running);}
/* tick ring counter-drift: barely perceptible, deeply alive */
html.js #dial-ticks{animation:dial-spin 240s linear infinite reverse;animation-play-state:var(--play,running);}
.dial__sweep{fill:none;stroke:var(--amber);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:58.6 469.1;}
.dial__sweep--halo{stroke-width:7;opacity:.25;filter:blur(4px);transition:opacity .4s var(--ease);}
.dial:hover .dial__sweep--halo{opacity:.5;}
.dial__dot{fill:var(--amber);transform-origin:110px 110px;}
@keyframes dot-breathe{0%,100%{transform:scale(1);opacity:.85;}50%{transform:scale(1.35);opacity:1;}}
html.js .dial__dot{animation:dot-breathe 2.4s ease-in-out infinite;animation-play-state:var(--play,running);}
.dial__readout{position:relative;height:1.4em;width:100%;text-align:center;}
.dial__readout span{position:absolute;inset:0;opacity:0;color:var(--amber);}
@keyframes word-cycle{0%{opacity:0;}3%{opacity:1;}30%{opacity:1;}36%{opacity:0;}100%{opacity:0;}}
html.js .dial__readout span{animation:word-cycle 21s linear infinite;animation-play-state:var(--play,running);}
html.js .dial__readout span:nth-child(2){animation-delay:7s;}
html.js .dial__readout span:nth-child(3){animation-delay:14s;}
html:not(.js) .dial__readout span:first-child{opacity:1;}
.dial__label{width:100%;display:flex;justify-content:space-between;border-top:1px solid var(--hairline);padding-top:16px;}

/* Corps matrix */
.matrix-card{position:relative;background:var(--surface);border:1px solid var(--hairline);border-radius:20px;padding:clamp(28px,4vw,52px);}
.matrix{display:grid;grid-template-columns:repeat(14,1fr);gap:16px 8px;justify-items:center;align-items:center;}
.cell{position:relative;width:2px;height:12px;border-radius:1px;background:var(--amber);opacity:var(--o,.5);transition:opacity .7s var(--ease),background .7s var(--ease);transition-delay:var(--d,0ms);}
html.js [data-section]:not(.is-seen) .cell{opacity:.12;background:var(--ink-2);transition:none;}
/* idle shimmer — a slow diagonal luminance wave forever crossing the roster */
@keyframes cell-wave{0%,100%{opacity:var(--o,.5);}50%{opacity:calc(var(--o,.5) + .22);}}
html.js .is-seen .matrix.is-wave .cell{animation:cell-wave 7s ease-in-out infinite;animation-delay:var(--wd,0ms);animation-play-state:var(--play,running);}
.cell--featured{width:5px;height:17px;border-radius:2px;box-shadow:0 0 10px rgba(var(--accent-rgb),.55);cursor:default;transition:transform .3s var(--ease),opacity .7s var(--ease),background .7s var(--ease);}
.cell--featured:hover{transform:scale(1.5);}
/* featured glow — strong shadow pre-baked on a layer, pulsed via opacity */
.cell--featured::before{content:"";position:absolute;inset:-1px;border-radius:2px;box-shadow:0 0 16px 3px rgba(var(--accent-rgb),.55);opacity:0;pointer-events:none;}
html.js .is-seen .cell--featured::before{animation:glow-pulse 2.4s ease-in-out infinite;animation-delay:var(--fd,0s);animation-play-state:var(--play,running);}
.cell--featured::after{content:attr(data-name);position:absolute;bottom:calc(100% + 9px);left:50%;transform:translate(-50%,4px);font-family:var(--font-mono);font-weight:500;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);background:var(--surface-2);border:1px solid var(--hairline);border-radius:6px;padding:5px 9px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s var(--ease),transform .3s var(--ease);z-index:5;}
.cell--featured:hover::after{opacity:1;transform:translate(-50%,0);}
/* blip — one of the 112 momentarily speaking */
.cell--blip{transform:scale(1.6) !important;opacity:1 !important;transition:transform .25s var(--ease),opacity .25s var(--ease) !important;transition-delay:0ms !important;}
.matrix-card__foot{display:flex;justify-content:space-between;margin-top:30px;gap:12px;flex-wrap:wrap;}
.matrix-card__foot a{position:relative;color:var(--amber);transition:color .3s var(--ease);}
.matrix-card__foot a::after{content:"";position:absolute;left:50%;right:50%;bottom:-2px;height:1px;background:var(--amber);transition:left .56s var(--ease),right .56s var(--ease);}
.matrix-card__foot a:hover::after,.matrix-card__foot a:focus-visible::after{left:0;right:0;}

/* ============ Pillars ============ */
.pillars__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch;}
.pillars__grid>div,.services__grid>div{perspective:900px;}
.card{position:relative;height:100%;background:var(--surface);border:1px solid var(--hairline);border-radius:20px;padding:clamp(26px,3vw,42px);overflow:hidden;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease);}
.card:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.22);}
.card::after{content:"";position:absolute;top:-25%;bottom:-25%;left:-45%;width:38%;background:linear-gradient(90deg,transparent,rgba(var(--ink-rgb),.07),transparent);transform:skewX(-18deg) translateX(0);transition:transform .7s var(--ease);pointer-events:none;}
.card:hover::after{transform:skewX(-18deg) translateX(440%);}
/* pointer spotlight layer (injected by JS into tiltable surfaces) */
.spot{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s var(--ease);background:radial-gradient(220px circle at var(--mx,50%) var(--my,50%),rgba(var(--accent-rgb),.08),transparent 70%);}
.card:hover>.spot,.dial:hover>.spot,.matrix-card:hover>.spot,.origin__stat:hover>.spot{opacity:1;}
.pillar__kicker{display:block;margin-bottom:14px;color:var(--amber);}
.pillar h3{font-size:clamp(1.35rem,1.9vw,1.7rem);margin-bottom:16px;padding-right:64px;}
.pillar__body{font-size:16px;color:var(--ink-2);}
.pillar__points{list-style:none;margin-top:22px;display:grid;gap:12px;}
.pillar__points li{position:relative;font-size:16px;color:var(--ink-2);padding-left:24px;}
.pillar__points li::before{content:"";position:absolute;left:4px;top:.62em;width:5px;height:5px;background:var(--amber);transform:rotate(45deg);opacity:.7;}
/* sequential glint across the bullet diamonds */
@keyframes li-glint{0%,100%{opacity:.7;}10%{opacity:1;}}
html.js .is-seen .pillar__points li::before{animation:li-glint 8s ease-in-out infinite;animation-delay:calc(var(--li,0) * .5s);animation-play-state:var(--play,running);}
.pillar__foot{display:block;margin-top:26px;padding-top:20px;border-top:1px solid var(--hairline);font-size:10.5px;}

/* ============ Services ============ */
.services__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch;}
.services__grid > div{height:100%;}
.service__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:18px;}
.service__cal{display:flex;align-items:center;gap:12px;margin-bottom:22px;}
.service h3{font-size:1.3rem;margin-bottom:12px;}
.service p{font-size:16px;color:var(--ink-2);}
.services__phases{margin-top:clamp(56px,8vh,80px);}
.phase-labels{display:flex;justify-content:space-between;align-items:center;}
.phase-labels span:not(.arrow){display:inline-flex;align-items:center;}
.phase-labels span:not(.arrow)::before{content:"";display:inline-block;width:6px;height:6px;background:var(--ink-2);transform:rotate(45deg);margin-right:10px;transition:background .4s var(--ease);}
/* traveling highlight — the pulse walks listen→measure→deploy→verify forever */
@keyframes phase-pulse{0%,18%{background:var(--amber);transform:rotate(45deg) scale(1.4);}26%,100%{background:var(--ink-2);transform:rotate(45deg) scale(1);}}
html.js .is-seen .phase-labels span:not(.arrow)::before{animation:phase-pulse 6s ease-in-out infinite;animation-delay:var(--pd,0s);animation-play-state:var(--play,running);}
.phase-labels .arrow{color:rgba(var(--ink-rgb),.45);}

/* ============ Closing CTA ============ */
.cta{position:relative;text-align:center;padding:var(--pad) 0;}
/* wash-hero token at full strength; the old rgba(...,.22) alpha now lives on the
   element opacity, so the breathe keyframe values are multiplied by .22 */
.cta::before{content:"";position:absolute;left:50%;top:50%;width:min(640px,90vw);aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,var(--wash-hero) 0%,transparent 65%);filter:blur(60px);opacity:.22;pointer-events:none;}
@keyframes cta-breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.165;}50%{transform:translate(-50%,-50%) scale(1.07);opacity:.22;}}
html.js .cta::before{animation:cta-breathe 9s ease-in-out infinite;animation-play-state:var(--play,running);}
.cta__inner{position:relative;max-width:760px;margin-inline:auto;padding-inline:24px;}
.cta h2{font-weight:800;font-size:clamp(2.4rem,5.4vw,4.2rem);letter-spacing:-.025em;line-height:1.05;}
.cta p{margin:24px auto 38px;max-width:52ch;color:var(--ink-2);}
/* the address itself, readable + copyable at the point of decision (mailto can fail silently) */
.cta__addr{margin-top:22px;}
.cta__addr .cta__email{color:var(--ink);user-select:all;-webkit-user-select:all;}
.cta__copy{margin-left:10px;background:none;border:1px solid var(--hairline);border-radius:999px;cursor:pointer;font-family:var(--font-mono);font-weight:500;font-size:10px;letter-spacing:.08em;text-transform:lowercase;color:var(--ink-2);padding:3px 10px;transition:color .3s var(--ease),border-color .3s var(--ease);}
.cta__copy:hover,.cta__copy:focus-visible{color:var(--amber);border-color:rgba(var(--accent-rgb),.4);}
.cta__sat{position:absolute;left:50%;top:50%;width:0;height:0;pointer-events:none;}
html.js .cta__sat--a{animation:orbit 30s linear infinite;animation-play-state:var(--play,running);}
html.js .cta__sat--b{animation:orbit 44s linear infinite reverse;animation-play-state:var(--play,running);}
.cta__sat b{position:absolute;background:var(--amber);}
.cta__sat--a b{width:5px;height:5px;left:-2.5px;top:-2.5px;opacity:.4;transform:translateX(280px) rotate(45deg);}
.cta__sat--b b{width:4px;height:4px;left:-2px;top:-2px;opacity:.3;transform:translateX(340px) rotate(45deg);}
.cta .btn--solid{position:relative;overflow:hidden;}
.cta .btn--solid::after{content:"";position:absolute;top:-25%;bottom:-25%;left:-45%;width:38%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg) translateX(0);pointer-events:none;}
@keyframes btn-sheen{0%{transform:skewX(-18deg) translateX(0);}12%,100%{transform:skewX(-18deg) translateX(440%);}}
html.js .cta .btn--solid::after{animation:btn-sheen 7s linear infinite;animation-play-state:var(--play,running);}

/* ============ Footer ============ */
.footer{padding:120px 0 80px;}
.footer__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 24px;}
/* canonical shared block: corps footer (h2 headings — the footer sits outside main's outline) */
.footer__cols h2{font-family:var(--font-mono);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);margin-bottom:16px;}
.footer__cols p,.footer__cols a{font-family:var(--font-mono);font-weight:400;font-size:12px;letter-spacing:.08em;color:var(--ink-2);line-height:2;}
.footer__cols a{position:relative;transition:color .3s var(--ease);}
.footer__cols a:hover,.footer__cols a:focus-visible{color:var(--amber);}
.footer__cols a::after{content:"";position:absolute;left:50%;right:50%;bottom:-2px;height:1px;background:var(--amber);transition:left .56s var(--ease),right .56s var(--ease);}
.footer__cols a:hover::after,.footer__cols a:focus-visible::after{left:0;right:0;}
/* canonical shared block: corps field-mode treatment (lowercase, .08em — house rule: lowercase mono labels) */
.field-mode{background:none;border:0;cursor:pointer;position:relative;padding:2px 0;font-family:var(--font-mono);font-weight:400;font-size:11px;letter-spacing:.08em;text-transform:lowercase;color:var(--ink-2);transition:color .3s var(--ease);}
.field-mode:hover,.field-mode:focus-visible{color:var(--amber);}
.field-mode::after{content:"";position:absolute;left:50%;right:50%;bottom:-2px;height:1px;background:var(--amber);transition:left .56s var(--ease),right .56s var(--ease);}
.field-mode:hover::after,.field-mode:focus-visible::after{left:0;right:0;}
.footer__line{margin-top:72px;display:flex;align-items:center;gap:14px;font-family:var(--font-mono);font-weight:400;font-size:12px;letter-spacing:.08em;color:var(--ink-2);}

/* ============ Responsive ============ */
@media (max-width:1020px){
  .work__visual,.work__copy,.work__row--b .work__visual,.work__row--b .work__copy{grid-column:1/13;padding-top:0;}
  .work__row--b .work__visual{order:2;margin-top:36px;}
  .work__row--b .work__copy{order:1;}
  .work__copy{margin-top:36px;}
  .origin__index{grid-column:1/13;margin-bottom:8px;}
  .origin__prose{grid-column:1/13;}
  .origin__stat{grid-column:1/13;margin-top:24px;max-width:340px;}
}
@media (max-width:880px){
  .pillars__grid,.services__grid{grid-template-columns:1fr;}
  .footer__cols{grid-template-columns:1fr;}
  .hero__content{grid-column:1/13;}
}
@media (max-width:720px){
  .hero__orbit,.cta__sat{display:none;}
}
@media (max-width:560px){
  body{font-size:16px;}
  .nav__inner{padding:14px 0;row-gap:8px;}
  .nav__links{gap:14px;}
  .btn--nav{display:none;}
  .matrix{gap:12px 4px;}
  .phase-labels .arrow{display:none;}
  .footer__line{flex-wrap:wrap;}
}

/* ============ Reduced motion — complete fallback ============ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001s !important;
    animation-delay:0s !important;
    animation-iteration-count:1 !important;
    transition-duration:.001s !important;
    transition-delay:0s !important;
  }
  html{scroll-behavior:auto;}
  html.js [data-reveal]{transform:none;}
  html.js .hero__title .glyph{animation:none;opacity:1;filter:none;transform:none;}
  html.js .bd--ember,html.js .bd--verdigris,html.js .bd--madder{animation:none;transform:none;opacity:var(--lo);}
  html.js .hero__gold{animation:none;transform:none;opacity:.28;}
  html.js .tick,html.js .tick::after,html.js .dial__sweepwrap,html.js .dial__dot,html.js #dial-ticks{animation:none;}
  html.js .tick::after{opacity:0;}
  html.js .dial__readout span{animation:none;display:none;}
  html.js .dial__readout span:first-child{display:block;opacity:1;}
  /* keystone: render placed, middle tick still */
  html.js [data-section]:not(.is-seen) .keystone i{transform:scaleY(1);}
  html.js .is-seen .keystone i:nth-child(3){animation:none;}
  /* plumb: all three diamonds rendered calm */
  .plumb b{animation:none !important;opacity:.6;}
  /* sheens / orbits / satellites: off */
  html.js .hero__sheen{display:none;}
  html.js .hero__orbit,html.js .stat-orbit,html.js .cta__sat{display:none;}
  /* halos / glints / waves: static */
  html.js .is-seen .halo::before,html.js .is-seen .origin__stat::before{animation:none;opacity:0;}
  html.js .is-seen .pillar__points li::before{animation:none;opacity:.85;}
  html.js .is-seen .matrix.is-wave .cell{animation:none;}
  html.js .is-seen .cell--featured::before{animation:none;opacity:0;}
  html.js [data-section]:not(.is-seen) .cell{opacity:var(--o,.5);background:var(--amber);}
  /* calibration arcs render at final value instantly */
  html.js [data-section]:not(.is-seen) .arc__val{stroke-dashoffset:var(--off,0);}
  html.js [data-section]:not(.is-seen) .arc__tip{opacity:1;}
  html.js .is-seen .arc__tipglow{animation:none;opacity:0;}
  /* phase nodes static, amber-dimmed */
  html.js .is-seen .phase-labels span:not(.arrow)::before{animation:none;background:rgba(var(--accent-rgb),.55);transform:rotate(45deg);}
  /* cta wash frozen at midpoint, sheens off (.85 rebased by the .22 wash alpha) */
  html.js .cta::before{animation:none;transform:translate(-50%,-50%) scale(1.035);opacity:.19;}
  html.js .cta .btn--solid::after{display:none;}
  .card::after{display:none;}
  .spot{display:none;}
}
