/* r26 lane A (9 Nov 2026): the system pass. One value per role. Loads after site, r18, areas, hero, close, premium and order CSS.
   Pat: "too much blurr, uneven and nothings is consitent, bland backgrounds, too distracting, things need to be flushed, animations need to be working correctly". */
:root{--dur:.6s;--stag:.12s;--card:0 24px 48px -32px rgba(17,65,54,.35);--ground:#F6F4EE;--night:#0B2C25}

/* ---- #5 #12 #11 no blobs, no orb, no drifting texture, no sheen ---- */
.float,div.float,.hp .float{display:none}
.rl .orb,.rl g.orb{display:none;animation:none}
.sec.dk::before,.ft::before,.doors::before{animation:none;will-change:auto}
.hp:before,.sec.dk::after,.doors::after,.ft::after{animation:none}
.acc:after{display:none;animation:none}

/* ---- #6 one header: solid night green, no blur, no shadow, a hairline, mint button, white logo, at every scroll position ---- */
.hd,.hd.lt{background:#0B2C25;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;border-bottom:1px solid rgba(143,203,176,.18);color:#F6F4EE}
.hd .logo-w,.hd.lt .logo-w{display:block}
.hd .logo-c,.hd.lt .logo-c{display:none}
.hd .btn,.hd.lt .btn{background:var(--mint);color:var(--green)}
.hd nav a.on,.hd.lt .on{border-color:var(--mint)}
.hd .mb,.hd.lt .mb{color:#F6F4EE;border:0;background:rgba(143,203,176,.12);min-height:48px;padding:0 24px;font:600 17px/1 var(--f-text);border-radius:4px}
.mnav{background:#0B2C25;-webkit-backdrop-filter:none;backdrop-filter:none}

/* ---- every other glass surface goes flat ---- */
.chip,.replay,.panel,.door,.grp .cap,.cm-win,.hp .fn{-webkit-backdrop-filter:none;backdrop-filter:none}
.grp .cap{background:rgba(17,65,54,.9)}
.panel,.door{background:rgba(246,244,238,.08)}
.cm-win{box-shadow:none;border:0}

/* ---- #9 #10 #11: one light ground, one dark ground, one static 64 px grid at .05 on every section ---- */
.sec.lt,.how,.office,.teamsec,.teamsec.t23,.why,.why.w23,.aboutsec{background:var(--ground)}
.how.sec.lt{background:var(--ground)} /* r29: mint tint off, one ground (Pat 10 Nov) */
.sec.lt{position:relative;isolation:isolate}
.sec.lt::after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:linear-gradient(rgba(17,65,54,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(17,65,54,.05) 1px,transparent 1px);background-size:64px 64px}
.sec.dk,.rsec,.results,.ft{background-color:#0B2C25;background-image:none}
#areas.sec.dk.dk,#research.sec.dk.dk,#results.sec.dk.dk{background-color:#0B2C25;background-image:none}
.sec.dk::after,.ft::after{opacity:1;animation:none;
  background-image:linear-gradient(rgba(143,203,176,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(143,203,176,.05) 1px,transparent 1px);background-size:64px 64px}
#areas.sec.dk::after,#research.sec.dk::after{background-size:64px 64px;opacity:1}
/* the closing room carries a film: nothing sits over it but its own scrim */
.doors::before,.doors::after{content:none}
.hp{background:#0B2C25;box-shadow:var(--card);border-radius:16px}
.hp:before{background-image:linear-gradient(rgba(143,203,176,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(143,203,176,.05) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:none;mask-image:none}
/* receipt: kit ground, kit ink, mono 14/400 only */
.paper{background:#F6F4EE;color:#114136;font:400 14px/1.35 ui-monospace,'Cascadia Mono',Consolas,monospace;box-shadow:var(--card)}
.paper .h,.paper .tot{font-weight:400;border-color:#114136}
.paper .tot{border-top-color:#114136}
.paper .g,.paper .ty{font-size:14px;letter-spacing:0;color:rgba(17,65,54,.72)}
.paper .l span.n{color:rgba(17,65,54,.72)}
.paper .l i{border-color:#114136}
.paper .l i:after{border-color:#114136}
.paper .bar{background:repeating-linear-gradient(90deg,#114136 0 2px,transparent 2px 5px,#114136 5px 6px,transparent 6px 10px)}

/* ---- #4 the thread: one quiet line, one node ---- */
.thb{display:none}
.thr{pointer-events:none}
.thr .tp,.thr .tp.dk,.thr .tp.lt{stroke:rgba(143,203,176,.35);stroke-width:1}
.thr .tb{display:none}
.thr .tn,.thr .tn.dk,.thr .tn.lt{width:8px;height:8px;border-radius:50%;box-sizing:border-box;background:transparent;border:1.5px solid #8FCBB0;box-shadow:none;opacity:0;transition:opacity var(--dur) var(--ease)}
.thr .tn.on,.thr .tn.dk.on,.thr .tn.lt.on{opacity:1;background:transparent;border-color:#8FCBB0;box-shadow:none}
.thr .tpulse{display:none}
.cm-send.thr-on{box-shadow:none}

/* ---- #13 no glows. The Cartesian chip: one plain pulse (no scale), only while How we work is on screen. The flow dots pause out of view too ---- */
.rcore .hf.lit{filter:brightness(1.12)}
.rl .dot.on{filter:none}
.hp .ar i{box-shadow:none}
.hp .fn.mid{box-shadow:none;animation:none}
.hp .ar i,.hp .fn.mid{animation-play-state:paused}
#how.pr-in .hp .ar i,#how.pr-in .hp .fn.mid{animation-play-state:running}
#how.pr-in .hp .fn.mid{animation:arrive26 2.4s linear .8s infinite}
@keyframes arrive26{0%,80%{box-shadow:0 0 0 0 rgba(143,203,176,0)}85%{box-shadow:0 0 0 0 rgba(143,203,176,.6)}100%{box-shadow:0 0 0 6px rgba(143,203,176,0)}}
/* #14 #34 flow chips: flat, no border, item-label type */
.hp .fn{border:0;background:rgba(246,244,238,.07)}
.hp .fn.mid{background:var(--mint)}
.hp .fn b{font:600 17px/1.3 var(--f-text);white-space:normal;letter-spacing:0}

/* ---- #24 #44 reveal: .6 s, one easing, 16 px rise (premium-r20.js sets the 120 ms stagger, capped at 480 ms) ---- */
.rvx{transform:translate3d(0,16px,0);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);transition-delay:var(--rd,0s)}
.rvx.rvi{transform:none}
.paper .l,.paper .g{transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.paper .l i:after{transition:opacity var(--dur) var(--ease)}
.rl .ln,.rl .ring{transition-duration:var(--dur)}
.rl .dot{transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.rcore .hf{transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),filter var(--dur) var(--ease)}
.rcore .ct{transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
.rn .rx,.rn .rule{transition-duration:var(--dur);transition-timing-function:var(--ease)}
.sticky,.btn,.btn.big,.btn.big i,.cm-send{transition-duration:var(--dur);transition-timing-function:var(--ease)}

/* ---- #22 section padding: 64 / 64 at 1440, 48 / 48 on the phone (the closing room, 96 / 96, is set in bottom-r26.css) ---- */
section.sec[id]{padding-top:64px;padding-bottom:64px}
@media (max-width:860px){section.sec[id]{padding-top:48px;padding-bottom:48px}}

/* ---- #29 #30 headings and leads ---- */
h1,h2{font-weight:300;letter-spacing:-.02em;line-height:1.08}
h1 em,h2 em{display:block}
.sec h2,.subs h2,.doors h2,.h25 h1,.office h2,.results h2,.hp h2,.about h2{font-size:var(--t4);line-height:1.08}
h3{font:300 28px/1.15 var(--f-disp)}
body .lead.lead{font:400 20px/1.4 var(--f-text)}

/* ---- #31 tracked caps for eyebrows only; labels and footer heads are 14/600 sentence case ---- */
.lbl{font:600 14px/1.2 var(--f-text);letter-spacing:.14em;text-transform:uppercase;color:#114136}
.dk .lbl,.hp .lbl,.sec.dk .lbl{color:var(--mint)}
.sec .hd2 .lbl+h2,.lbl+h2,.lbl+.h2{margin-top:12px}
form label,.sf label,.subs .sf label{font:600 14px/1.2 var(--f-text);letter-spacing:0;text-transform:none}
.ft h3,.ft .fts2 h3,.ft .fts h3,.ft .ftc h3{font:600 14px/1.2 var(--f-text);letter-spacing:0;text-transform:lowercase;color:var(--mint)}
.ft h3::first-letter{text-transform:uppercase}
.office .ofb b{display:none}
.cr.ch span{letter-spacing:0;text-transform:none}

/* ---- #32 #42 #33 buttons: 48 tall, 0 24px, radius 4, 17/600, no shadow. The two door buttons (.big) keep their own size ---- */
.btn:not(.big),a.btn:not(.big),button.btn:not(.big),.sbtn,.cm-send{min-height:48px;padding:0 24px;border-radius:4px;font:600 17px/1 var(--f-text);box-shadow:none}
.hd .btn{min-height:48px;padding:0 24px}
.sticky{height:48px;font:600 17px/1 var(--f-text);border-radius:0}
.btn.big,.h25 .btn.big{box-shadow:none}

/* ---- #33 one card shadow, on light cards only: the receipt and the How card. Nothing else casts ---- */
.hp .pts,.acc,.cons,.door,.panel{box-shadow:none}

/* ---- #34 stray text styles folded in: stars in the text face ---- */
.st,.creds b .st,.h25 .creds b .st{font-family:var(--f-text);font-weight:400}

/* ---- reduced motion: everything visible, nothing moves ---- */
@media (prefers-reduced-motion:reduce){
  .rvx{opacity:1;transform:none;transition:none}
  .hp .ar i,.hp .fn.mid,#how.pr-in .hp .fn.mid,#how.pr-in .hp .ar i{animation:none}
  .thr .tn{transition:none}
}

/* ---- Pat 9 Nov: the grid lines move, quietly (premium-r20.js places 2 to 4 short segments per screen; transform and opacity only, behind all content) ---- */
.gl26,.sec>.gl26.tseg{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.gl26 .gl-seg{position:absolute;display:block;will-change:transform,opacity;opacity:0}
@media (prefers-reduced-motion:reduce){.gl26{display:none}}

.h25 .next b,.h25 b{font-weight:600}

/* ---- Pat 9 Nov: the grid is drawn, once per section, when the section first comes on screen (premium-r20.js builds the lines; transform and opacity only) ---- */
.sec.gd-live::after,.ft.gd-live::after{background-image:none}
.gd26{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.ft>.gd26.tseg,.sec>.gd26.tseg{position:absolute;z-index:0}
.ft>.gl26.tseg{position:absolute;z-index:1}
.gd26 i{position:absolute;display:block;opacity:.05;transform-origin:0 0}
@media (prefers-reduced-motion:reduce){.gd26{display:none}}