:root{
  --ground:#EFEBE5;
  --ground-2:#E2DBD2;
  --ground-3:#D6CDC2;
  --paper:#F8F6F2;
  --ink:#24211E;
  --ink-2:#4A453F;
  --ink-3:#655E56;
  --line:rgba(36,33,30,.22);
  --line-strong:rgba(36,33,30,.55);
  --cyan:#3FE3DD;
  --cyan-ink:#0B6F6B;
  --mint:#93E2C2;
  --stone:#D8D0C5;
  --serif:"Source Serif 4",Georgia,serif;
  --sans:"Geist",ui-sans-serif,system-ui,sans-serif;
  --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --gutter:clamp(16px,4vw,48px);
  --space:clamp(88px,11vw,168px);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--cyan);color:var(--ink)}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
html{scrollbar-color:var(--ink-3) var(--ground)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:var(--paper);padding:8px 14px;z-index:99}
.skip:focus{left:8px}
.wrap{width:min(1240px,100% - 2*var(--gutter));margin-inline:auto}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}

/* type */
.display{font-family:var(--serif);font-weight:300;font-optical-sizing:auto;font-size:clamp(2.6rem,5.4vw,5.1rem);line-height:1.02;letter-spacing:-.025em;margin:0;text-wrap:balance}
.h2{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,3.6vw,3.25rem);line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
.h3{font-family:var(--serif);font-weight:400;font-size:1.55rem;line-height:1.15;letter-spacing:-.01em;margin:0}
.lede{font-size:clamp(1.05rem,1.3vw,1.2rem);color:var(--ink-2);max-width:46ch;margin:28px 0 36px}

/* icons + buttons */
.ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 22px;border:1px solid var(--ink);font-weight:500;font-size:15px;text-decoration:none;cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.btn-sm{height:40px;padding:0 16px;font-size:14px}
.btn-ink{background:var(--ink);color:var(--paper)}
.btn-ink:hover{background:#000}
.btn-ink:hover .ico{transform:translateX(3px)}
.btn .ico{transition:transform .3s var(--ease)}
.btn-line{background:transparent}
.btn-line:hover{background:var(--ink);color:var(--paper)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.55;cursor:progress}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line-strong);background:transparent;cursor:pointer;transition:background .25s var(--ease)}
.icon-btn:hover{background:var(--ink);color:var(--paper)}
.icon-btn[disabled]{opacity:.3;pointer-events:none}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* nav */
.nav{position:sticky;top:0;z-index:30;background:color-mix(in srgb,var(--ground) 88%,transparent);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid transparent;transition:border-color .3s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav-row{display:flex;align-items:center;gap:32px;height:68px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;font-size:17px;letter-spacing:-.01em}
.mark{width:22px;height:22px;fill:var(--ink)}
.mark .mark-soft{fill:var(--cyan)}
.nav nav{margin-left:auto}
.nav-links{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav-links a{text-decoration:none;font-size:15px;color:var(--ink-2)}
.nav-links a:hover{color:var(--ink);text-decoration:underline}

/* hero */
.hero{padding:clamp(40px,7vw,96px) 0 clamp(32px,4vw,56px);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero-art{position:relative;aspect-ratio:640/600}
.iso{width:100%;height:100%;overflow:visible}
.plane{transform:translateY(calc(var(--lift,0) * var(--k) * -1px));transition:transform .1s linear}
.p-face{stroke:var(--ink);stroke-width:1.2;vector-effect:non-scaling-stroke}
.p-cyan{fill:var(--cyan)}
.p-stone{fill:var(--stone)}
.p-charcoal{fill:var(--ink)}
.p-shadow{fill:var(--ink);opacity:.08}
.u-ink{fill:var(--ink)}
.u-ink-soft{fill:var(--ink);opacity:.45}
.u-paper{fill:var(--paper);stroke:var(--ink);stroke-width:.8}
.u-light{fill:var(--paper);opacity:.85}
.u-light-o{fill:none;stroke:var(--paper);stroke-width:.8;opacity:.6}
.u-cyan{fill:var(--cyan)}
.u-mint{fill:var(--mint);stroke:var(--ink);stroke-width:.8}
.p-label{font:500 11px var(--mono);letter-spacing:.14em;fill:var(--ink)}
.callout line{stroke:var(--ink);stroke-width:1}
.callout circle{fill:var(--cyan);stroke:var(--ink)}
.callout text{font:500 11px var(--mono);letter-spacing:.12em;fill:var(--ink)}
.callout .callout-sub{fill:var(--ink-3);letter-spacing:.04em;text-transform:none}
.blocks{position:absolute;right:-6%;bottom:6%;width:22%;aspect-ratio:2/2;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.blocks span{background:var(--ink)}
.blocks span.soft{background:var(--stone)}
.blocks span:nth-child(1){grid-column:2}
.blocks span:nth-child(2){grid-column:1;grid-row:2}
.blocks span:nth-child(3){grid-column:2;grid-row:2}
.blocks span:nth-child(4){display:none}

/* hero entrance (JS only, content visible without it) */
.js .hero .display,.js .hero .lede,.js .hero .actions{animation:rise 1s var(--ease) both}
.js .hero .lede{animation-delay:.12s}
.js .hero .actions{animation-delay:.22s}
.js .p-face{stroke-dasharray:1;stroke-dashoffset:1;fill-opacity:0;animation:draw 1.1s var(--ease) forwards,fillin .6s var(--ease) forwards;animation-delay:calc(.25s + var(--i) * .22s),calc(1s + var(--i) * .22s)}
.js .p-ui,.js .p-label-g,.js .p-shadow{opacity:0;animation:fade .6s var(--ease) forwards;animation-delay:calc(1.25s + var(--i) * .22s)}
.js .plane > g{animation:settle 1.4s var(--ease) both;animation-delay:calc(.25s + var(--i) * .22s)}
.js .callout{opacity:0;animation:fade .6s var(--ease) 2.1s forwards}
.js .blocks span{opacity:0;animation:step .01s steps(1) forwards;animation-delay:calc(1.6s + var(--d) * .14s)}
.js .ground{opacity:0;animation:fade 1.2s var(--ease) .1s forwards}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fillin{to{fill-opacity:1}}
@keyframes fade{to{opacity:1}}
@keyframes step{to{opacity:1}}
@keyframes settle{from{translate:0 36px}to{translate:0 0}}

/* hairline grid with cyan nodes */
.grid-lines{position:relative;border-top:1px solid var(--line-strong);border-left:1px solid var(--line-strong)}
.grid-lines .cell{border-right:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);position:relative}
.grid-lines .cell::after{content:"";position:absolute;right:-4px;bottom:-4px;width:7px;height:7px;background:var(--cyan);border:1px solid var(--ink);z-index:1;transform:scale(0);transition:transform .5s var(--ease)}
.grid-lines.in .cell::after{transform:scale(1)}
.grid-lines .cell:nth-child(2)::after{transition-delay:.06s}.grid-lines .cell:nth-child(3)::after{transition-delay:.12s}.grid-lines .cell:nth-child(5)::after{transition-delay:.18s}.grid-lines .cell:nth-child(6)::after{transition-delay:.24s}

/* proof */
.proof{padding:clamp(48px,6vw,88px) 0 var(--space)}
.proof-head{display:grid;grid-template-columns:repeat(12,1fr);margin-bottom:48px}
.proof-head .h2{grid-column:5 / 13;font-size:clamp(1.6rem,2.6vw,2.4rem)}
.proof-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.proof-grid .cell{min-height:118px}
.org{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;padding:22px 52px 22px 24px;background:transparent;border:0;text-align:left;cursor:pointer;transition:background .3s var(--ease)}
.org:hover{background:var(--ground-2)}
.org-name{font-weight:500;font-size:17px;letter-spacing:-.01em}
.org-role{font-size:14px;color:var(--ink-3);max-height:0;overflow:hidden;opacity:0;transition:max-height .45s var(--ease),opacity .35s}
.org[aria-expanded="true"] .org-role{max-height:60px;opacity:1}
.org .plus{position:absolute;right:20px;top:50%;margin-top:-9px;transition:transform .4s var(--ease)}
.org[aria-expanded="true"] .plus{transform:rotate(45deg)}
.fact{grid-column:span 2;grid-row:span 2;padding:28px 28px 24px;display:flex;flex-direction:column;justify-content:space-between;background:var(--paper)}
.fact p{font-family:var(--serif);font-weight:300;font-size:clamp(1.4rem,2vw,1.85rem);line-height:1.2;margin:0;max-width:22ch}
.fact-src{font-size:14px;color:var(--ink-3)}
.proof-grid .cell:nth-child(4){grid-column:3 / 5;grid-row:1 / 3}

/* products */
.products{padding-bottom:var(--space)}
.products-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:40px}
.products-head .h2{max-width:16ch}
.rail-ctrl{display:flex;align-items:center;gap:8px}
.rail-count{margin-right:12px;color:var(--ink-3)}
.rail-count b{color:var(--ink);font-weight:500}
.rail{display:flex;gap:clamp(16px,2.4vw,32px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--gutter),(100% - 1240px)/2);padding:0 max(var(--gutter),(100% - 1240px)/2) 8px;scrollbar-width:none;outline:none}
.rail::-webkit-scrollbar{display:none}
.product{flex:0 0 min(1120px,88vw);scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(20px,3vw,44px);align-items:stretch}
.frame{padding:clamp(14px,2vw,26px);position:relative}
.frame-cyan{background:var(--cyan)}
.frame-mint{background:var(--mint)}
.frame-stone{background:var(--stone)}
.frame-charcoal{background:var(--ink)}
.stage{position:relative;aspect-ratio:16/10;background:var(--paper);border:1px solid var(--ink);overflow:hidden}
.slide{position:absolute;inset:0;clip-path:inset(0 100% 0 0);transition:clip-path .9s var(--ease);visibility:hidden}
.slide.on{clip-path:inset(0 0 0 0);visibility:visible}
.slide.leaving{clip-path:inset(0 0 0 0);visibility:visible;z-index:0}
.slide.on{z-index:1}
.slide img,.slide video{width:100%;height:100%;object-fit:cover}
.slide-tag{position:absolute;left:12px;top:12px;z-index:2;font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;background:var(--paper);border:1px solid var(--ink);padding:3px 7px}
.tabs{display:flex;gap:8px;margin-top:14px}
.tab{flex:1;height:22px;padding:0;border:0;background:none;cursor:pointer;position:relative}
.tab::before,.tab i{content:"";position:absolute;left:0;right:0;top:10px;height:2px;background:color-mix(in srgb,var(--ink) 25%,transparent)}
.tab i{right:auto;width:0;background:var(--ink)}
.frame-charcoal .tab::before{background:rgba(248,246,242,.3)}
.frame-charcoal .tab i{background:var(--cyan)}
.tab.done i{width:100%}
.caption{margin:12px 0 0;font-size:15px;line-height:1.45;min-height:2.9em;color:var(--ink)}
.frame-charcoal .caption{color:var(--paper)}
.p-info{display:flex;flex-direction:column;padding:6px 0}
.p-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line-strong);color:var(--ink-3)}
.status{display:inline-flex;align-items:center;gap:8px;color:var(--ink)}
.status::before{content:"";width:8px;height:8px;background:var(--ink-3)}
.status.live::before{background:var(--cyan);border:1px solid var(--ink);animation:blink 2.4s steps(1) infinite}
@keyframes blink{50%{opacity:.35}}
.p-name{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,3.4vw,3rem);line-height:1.05;letter-spacing:-.02em;margin:24px 0 14px}
.p-sum{color:var(--ink-2);margin:0 0 24px;max-width:42ch}
.stack{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 28px}
.stack li{font:400 12px var(--mono);letter-spacing:.04em;border:1px solid var(--line-strong);padding:4px 9px}
.p-link{margin-top:auto;align-self:flex-start}
.also{display:flex;gap:28px;align-items:baseline;margin-top:56px;padding-top:20px;border-top:1px solid var(--line)}
.also-h{color:var(--ink-3);flex:none}
.also-list{display:flex;flex-wrap:wrap;gap:8px 32px;list-style:none;margin:0;padding:0}
.also-list li{font-size:15px}
.also-list b{font-weight:500}
.also-list span{color:var(--ink-3)}

/* mocks (illustrative previews) */
.mock{position:absolute;inset:0;padding:8% 7% 7%;display:flex;flex-direction:column;font-size:clamp(11px,1.05vw,14px);background:var(--paper)}
.m-bar{display:flex;align-items:center;gap:10px;font:500 .78em var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);padding-bottom:.9em;border-bottom:1px solid var(--line-strong);margin-bottom:1em}
.m-bar i{width:.8em;height:.8em;background:var(--ink)}
.m-rows{list-style:none;margin:0;padding:0;display:grid;gap:.55em}
.m-rows li{display:flex;justify-content:space-between;gap:1em;padding:.8em 1em;border:1px solid var(--line-strong);background:#fff}
.m-rows li:first-child{background:var(--cyan);border-color:var(--ink)}
.m-rows span{color:var(--ink-3);font-family:var(--mono);font-size:.82em;white-space:nowrap}
.m-phone{align-items:center;justify-content:center;background:var(--ground-2)}
.m-device{height:100%;aspect-ratio:9/16;background:#fff;border:1px solid var(--ink);padding:5% 6%;display:flex;flex-direction:column;gap:.6em}
.m-pic{flex:1;border:1px solid var(--ink);background:linear-gradient(var(--stone) 0 46%,var(--cyan) 46% 50%,var(--mint) 50% 72%,var(--ink) 72% 76%,var(--ground-2) 76%);position:relative}
.m-pic::after{content:"";position:absolute;left:58%;top:22%;width:16%;aspect-ratio:1;background:var(--paper);border:1px solid var(--ink)}
.m-title{font-family:var(--serif);font-size:1.15em;line-height:1.15;margin:0}
.m-chips{display:flex;gap:.3em;flex-wrap:wrap}
.m-chips span{font:500 .72em var(--mono);border:1px solid var(--line-strong);padding:.1em .5em}
.m-cta{background:var(--ink);color:var(--paper);text-align:center;padding:.55em;font-weight:500;font-size:.85em}
.m-kpis{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-strong);border-left:1px solid var(--line-strong)}
.m-kpis div{padding:.8em 1em;border-right:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}
.m-kpis b{display:block;font-family:var(--serif);font-weight:300;font-size:1.9em;line-height:1}
.m-kpis span{font-size:.8em;color:var(--ink-3)}
.m-bars{flex:1;display:flex;align-items:flex-end;gap:4%;padding-top:1.2em;border-bottom:1px solid var(--ink)}
.m-bars i{flex:1;height:var(--h);background:var(--ink)}
.m-bars i:first-child{background:var(--cyan);border:1px solid var(--ink)}
.m-map{padding:0;background:#E9E4DC}
.m-map .streets{position:absolute;inset:0;background-image:linear-gradient(rgba(36,33,30,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(36,33,30,.13) 1px,transparent 1px);background-size:59px 47px}
.m-map .river{position:absolute;left:-10%;right:-10%;top:58%;height:16%;background:var(--mint);transform:rotate(-8deg);border-block:1px solid var(--ink)}
.m-map .pin{position:absolute;width:14px;height:14px;background:var(--cyan);border:1px solid var(--ink);transform:translate(-50%,-50%) rotate(45deg)}
.m-map .m-card{position:absolute;left:6%;bottom:8%;background:#fff;border:1px solid var(--ink);padding:.6em 1em;font:500 .85em var(--mono);letter-spacing:.04em}
.m-steps{flex:1;display:flex;align-items:center;justify-content:space-between;position:relative;padding:0 2%}
.m-steps::before{content:"";position:absolute;left:6%;right:6%;top:50%;height:1px;background:var(--ink)}
.m-step{position:relative;display:flex;flex-direction:column;align-items:center;gap:.7em;font:500 .8em var(--mono);letter-spacing:.06em;text-transform:uppercase}
.m-step i{width:2.4em;height:2.4em;border:1px solid var(--ink);background:var(--paper);display:grid;place-items:center}
.m-step.done i{background:var(--ink)}
.m-step.done i::after{content:"";width:.9em;height:.5em;border-left:2px solid var(--paper);border-bottom:2px solid var(--paper);transform:rotate(-45deg) translateY(-15%)}
.m-step.run i{background:var(--cyan);animation:pulse 1.6s var(--ease) infinite}
.m-step span{position:absolute;top:calc(100% + 1.4em);white-space:nowrap}
.m-step:nth-child(even) span{top:auto;bottom:calc(100% + 1.4em)}
@keyframes pulse{50%{box-shadow:0 0 0 .5em rgba(63,227,221,.25)}}

/* statement */
.statement{padding:var(--space) 0;border-top:1px solid var(--line)}
.statement-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:clamp(32px,6vw,96px);align-items:center}
.statement-text{font-family:var(--serif);font-weight:300;font-size:clamp(1.9rem,3.6vw,3.3rem);line-height:1.14;letter-spacing:-.02em;margin:0;max-width:24ch}
.js .statement-text .w{color:color-mix(in srgb,var(--ink) calc(var(--o,1)*100%),var(--ground-3))}
.cube{width:220px;fill:none;stroke:var(--ink);stroke-width:1.2;stroke-linejoin:round}
.cube .cube-in{stroke:var(--cyan-ink)}
.js .cube path{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--c,0))}

/* toolkit */
.toolkit{padding:var(--space) 0;background:var(--ground-2)}
.toolkit-title{max-width:18ch;margin-bottom:56px}
.tk-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0;border-top:1px solid var(--line-strong);border-left:1px solid var(--line-strong)}
.tk{border-right:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;gap:12px;min-height:400px}
.tk p{margin:0;color:var(--ink-2);max-width:40ch;font-size:16px}
.tk-build{grid-column:span 7}.tk-ai{grid-column:span 5}.tk-qa{grid-column:span 5}.tk-pm{grid-column:span 7}
.tk-art{margin-top:auto;padding-top:28px}
.build-art{display:flex;align-items:center;gap:18px}
.ba-code{display:grid;gap:6px;padding:16px;border:1px solid var(--ink);background:var(--paper);min-width:140px}
.ba-code span::before{content:"› ";color:var(--cyan-ink)}
.ba-app{flex:1;max-width:240px;aspect-ratio:4/3;background:var(--cyan);border:1px solid var(--ink);padding:12px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr;gap:8px}
.ba-app i{background:var(--paper);border:1px solid var(--ink)}
.ba-app i:first-child{grid-column:span 2;height:14px}
.ba-app i.c{background:var(--ink)}
.agent-art svg{width:100%;max-width:420px;overflow:visible}
.ag-line{fill:none;stroke:var(--ink);stroke-width:1;stroke-dasharray:4 4;animation:flow 1.2s linear infinite}
@keyframes flow{to{stroke-dashoffset:-8}}
.ag-node{fill:var(--paper);stroke:var(--ink);stroke-width:1}
.ag-core{fill:var(--ink)}
.agent-art text{font:500 8px var(--mono);letter-spacing:.08em;text-anchor:middle;fill:var(--ink)}
.qa-art{list-style:none;margin:auto 0 0;padding:28px 0 0;display:grid;gap:0;border-top:0;text-transform:none;letter-spacing:.02em;font-size:13px}
.qa-art li{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line-strong)}
.qa-art b{font-weight:500;padding:1px 8px;border:1px solid var(--ink)}
.qa-art .ok{background:var(--paper)}
.qa-art .run{background:var(--cyan)}
.pm-art{display:grid;gap:10px}
.pm-row{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:12px;position:relative}
.pm-row span{color:var(--ink-3)}
.pm-row i{height:18px;border:1px solid var(--ink);background:var(--paper);margin-left:var(--s);width:var(--w)}
.pm-row i.c{background:var(--cyan)}

/* capability */
.capability{padding:var(--space) 0}
.cap-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center}
.cap-sheet-wrap{position:relative;perspective:1600px;padding:4% 8% 8% 0}
.cap-sheet{position:relative;z-index:2;background:#fff;border:1px solid var(--ink);aspect-ratio:8.5/11;padding:7% 7% 6%;font-size:clamp(6px,.62vw,8.4px);line-height:1.4;transform:rotateX(14deg) rotateZ(-6deg) rotateY(10deg);transform-origin:50% 60%;box-shadow:24px 30px 40px -18px rgba(36,33,30,.35);transition:transform .9s var(--ease)}
.cap-sheet-wrap:hover .cap-sheet{transform:rotateX(6deg) rotateZ(-3deg) rotateY(4deg)}
.cap-sheet-under{position:absolute;inset:8% 2% 2% 8%;z-index:1;background:var(--cyan);transform:rotateX(14deg) rotateZ(-6deg) rotateY(10deg);box-shadow:none;padding:0}
.cap-copy .h2{margin-bottom:20px}
.cap-summary{color:var(--ink-2);margin:0 0 32px;max-width:52ch}
.cap-sub{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin:0 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0 0 32px;padding:0}
.chips li{border:1px solid var(--ink);padding:6px 12px;font-size:14px;background:var(--paper)}
.codes{display:grid;grid-template-columns:auto 1fr;margin:0 0 36px;border-top:1px solid var(--line-strong)}
.codes dt,.codes dd{padding:11px 0;border-bottom:1px solid var(--line-strong);margin:0}
.codes dt{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);padding-right:28px}
.codes dd{font-variant-numeric:tabular-nums}
.codes .pending{color:var(--ink-3);font-style:italic}

/* sheet internals, shared with capability.html */
.cs-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1.5px solid var(--ink);padding-bottom:1.2em;margin-bottom:1.4em}
.cs-brand{display:flex;align-items:center;gap:.6em;font:600 2.2em/1 var(--sans);letter-spacing:-.02em}
.cs-brand svg{width:1.2em;height:1.2em}
.cs-title{font:500 .95em var(--mono);letter-spacing:.12em;text-transform:uppercase;text-align:right;color:var(--ink-3)}
.cs-title b{display:block;color:var(--ink);font-size:1.3em}
.cs-sum{font-family:var(--serif);font-size:1.55em;line-height:1.3;font-weight:300;margin:0 0 1.4em}
.cs-cols{display:grid;grid-template-columns:1fr 1fr;gap:1.6em 2.4em}
.cs-block h4{font:500 .95em var(--mono);letter-spacing:.12em;text-transform:uppercase;margin:0 0 .7em;padding-bottom:.4em;border-bottom:1px solid var(--ink);display:flex;align-items:center;gap:.6em}
.cs-block h4::before{content:"";width:.7em;height:.7em;background:var(--cyan);border:1px solid var(--ink)}
.cs-block ul{margin:0;padding:0;list-style:none;display:grid;gap:.45em}
.cs-block li{padding-left:1em;position:relative;font-size:1.15em}
.cs-block li::before{content:"";position:absolute;left:0;top:.6em;width:.4em;height:1px;background:var(--ink)}
.cs-exp li b{display:block;font-weight:600}
.cs-codes{display:grid;grid-template-columns:auto 1fr;gap:.35em 1.2em;font-size:1.15em}
.cs-codes dt{font-family:var(--mono);color:var(--ink-3);text-transform:uppercase;font-size:.85em;letter-spacing:.06em}
.cs-codes dd{margin:0}
.cs-foot{margin-top:1.6em;padding-top:1em;border-top:1.5px solid var(--ink);display:flex;justify-content:space-between;font:500 1em var(--mono);letter-spacing:.06em}

/* about */
.about{padding:var(--space) 0;border-top:1px solid var(--line)}
.about-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}
.about-grid .h2{grid-column:1 / 6}
.about-body{grid-column:6 / 13;font-size:18px;color:var(--ink-2)}
.about-body p{margin:0 0 20px;max-width:58ch}
p,.caption,.p-sum,li{text-wrap:pretty}
.creds{margin:36px 0 0;display:grid;border-top:1px solid var(--line-strong)}
.creds div{display:grid;grid-template-columns:140px 1fr;padding:12px 0;border-bottom:1px solid var(--line-strong)}
.creds dt{color:var(--ink-3);padding-top:3px}
.creds dd{margin:0;color:var(--ink)}

/* contact */
.contact{padding:var(--space) 0;background:var(--ink);color:var(--paper)}
.contact-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(32px,6vw,96px)}
.contact-copy p{color:rgba(248,246,242,.75);max-width:40ch;margin:24px 0 40px}
.next{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid rgba(248,246,242,.25);text-transform:none;letter-spacing:.02em;font-size:14px}
.next li{display:flex;gap:16px;align-items:center;padding:14px 0;border-bottom:1px solid rgba(248,246,242,.25)}
.next span{width:24px;height:24px;display:grid;place-items:center;background:var(--cyan);color:var(--ink);font-weight:500}
.contact ::selection{background:var(--cyan);color:var(--ink)}
.form{display:grid;gap:18px;padding:clamp(20px,3vw,36px);border:1px solid rgba(248,246,242,.35);position:relative}
.form::before,.form::after{content:"";position:absolute;width:7px;height:7px;background:var(--cyan)}
.form::before{left:-4px;top:-4px}.form::after{right:-4px;bottom:-4px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.field{display:grid;gap:8px}
.field > span{font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:rgba(248,246,242,.75)}
.field em{font-style:normal;text-transform:none;letter-spacing:0;opacity:.7}
.field input,.field select,.field textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(248,246,242,.45);color:var(--paper);padding:10px 0;font-size:16px;border-radius:0;transition:border-color .25s}
.field select{appearance:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F8F6F2' stroke-width='1.6'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") right center/16px no-repeat;padding-right:24px}
.field select option{color:var(--ink)}
.field textarea{resize:vertical;min-height:120px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--cyan)}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{box-shadow:0 1px 0 var(--cyan)}
.field input::placeholder{color:rgba(248,246,242,.5)}
.field.err input,.field.err select,.field.err textarea{border-bottom-color:#FF9C85}
.field .msg{font-size:13px;color:#FFB8A8}
.contact :focus-visible{outline-color:var(--cyan)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.contact .btn-ink{background:var(--cyan);color:var(--ink);border-color:var(--cyan)}
.contact .btn-ink:hover{background:var(--paper);border-color:var(--paper)}
.form-status{margin:0;font-size:15px}
.form-status.ok{color:var(--cyan)}
.form-status.bad{color:#FFB8A8}
.form.sent .field,.form.sent .field-row,.form.sent .cf-turnstile{opacity:.4;pointer-events:none}

/* footer */
.foot{padding:40px 0;background:var(--ink);color:var(--paper);border-top:1px solid rgba(248,246,242,.18)}
.foot .mark{fill:var(--paper)}
.foot-row{display:flex;align-items:center;gap:32px;flex-wrap:wrap}
.foot-links{display:flex;gap:24px;list-style:none;margin:0;padding:0;font-size:15px}
.foot-links a{text-decoration:none;color:rgba(248,246,242,.8)}
.foot-links a:hover{color:var(--paper);text-decoration:underline}
.foot-meta{margin:0 0 0 auto;color:rgba(248,246,242,.6)}

/* reveal */
.js .rv{opacity:.25;transform:translateY(16px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* responsive */
@media (max-width:1000px){
  .hero-grid{grid-template-columns:1fr}
  .hero-art{max-width:560px;margin:0 auto;width:100%}
  .proof-head .h2{grid-column:1 / 13}
  .proof-grid{grid-template-columns:repeat(2,1fr)}
  .proof-grid .cell:nth-child(4){grid-column:1 / 3;grid-row:auto}
  .product{grid-template-columns:1fr;flex-basis:88vw}
  .tk-build,.tk-ai,.tk-qa,.tk-pm{grid-column:span 12}
  .tk{min-height:0}
  .cap-grid{grid-template-columns:1fr}
  .cap-sheet-wrap{max-width:460px;margin:0 auto 24px}
  .cap-sheet{font-size:clamp(5px,1.35vw,8px)}
  .about-grid .h2,.about-body{grid-column:1 / 13}
  .contact-grid{grid-template-columns:1fr}
  .statement-grid{grid-template-columns:1fr}
  .cube{width:150px}
}
@media (max-width:700px){
  body{font-size:16px}
  .nav-links{display:none}
  .nav-row{gap:16px}
  .nav .btn-sm{margin-left:auto}
  .products-head{flex-direction:column;align-items:flex-start}
  .field-row{grid-template-columns:1fr}
  .also{flex-direction:column;gap:12px}
  .proof-grid .cell{min-height:96px}
  .blocks{right:0}
  .creds div{grid-template-columns:110px 1fr}
  .foot-meta{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .p-face{stroke-dashoffset:0;fill-opacity:1}
  .js .p-ui,.js .p-label-g,.js .p-shadow,.js .callout,.js .blocks span,.js .ground{opacity:1}
  .js .rv{opacity:1;transform:none}
  .js .statement-text .w{color:var(--ink)}
  .js .cube path{stroke-dashoffset:0}
  .grid-lines .cell::after{transform:scale(1)}
}
.proof-grid .cell:last-child{grid-column:span 2}
@media (max-width:1000px){.proof-grid .cell:last-child{grid-column:span 2}}
/* phone mock: two devices, front one readable */
.m-phone{padding:5% 8%}
.m-device{height:100%;flex:none}
@media (max-width:1000px){
  .proof-grid .fact{order:-1;grid-column:1 / 3}
  .proof-grid .cell:nth-child(4){grid-column:1 / 3}
  .cap-sheet-wrap{padding:4% 10% 10% 6%}
  .cap-sheet,.cap-sheet-under{transform:rotateX(10deg) rotateZ(-3deg) rotateY(6deg)}
}
@media (max-width:700px){
  .mock{font-size:11px}
}
.cs-prod{margin-top:1.6em}
.cs-tiles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--ink)}
.cs-tile{display:flex;flex-direction:column;gap:.15em;padding:0 .9em .8em;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink);font-size:1.05em}
.cs-tile i{display:block;height:1.6em;margin:0 -.9em .6em;border-bottom:1px solid var(--ink)}
.cs-tile b{font-family:var(--serif);font-weight:400;font-size:1.35em;line-height:1.15}
.cs-tile span{color:var(--ink-3)}
.cs-tile em{font:500 .85em var(--mono);font-style:normal;letter-spacing:.04em;margin-top:.3em}
.f-cyan{background:var(--cyan)}.f-mint{background:var(--mint)}.f-stone{background:var(--stone)}.f-charcoal{background:var(--ink)}
/* spotlight (flagship product) */
#spotlight{margin-bottom:clamp(56px,7vw,96px)}
.product.feature{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:clamp(24px,3.4vw,56px);scroll-snap-align:none}
.product.feature .p-name{font-size:clamp(2.6rem,4.6vw,4.2rem)}
.product.feature .p-sum{font-size:18px}
.flag{display:inline-flex;align-items:center;gap:8px;background:var(--cyan);color:var(--ink);border:1px solid var(--ink);padding:3px 9px;font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase}
/* rail bar */
.rail-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;padding-top:20px;border-top:1px solid var(--line)}
.play-btn{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border:1px solid var(--line-strong);background:transparent;cursor:pointer;font:500 14px var(--sans);margin-right:4px;transition:background .25s var(--ease)}
.play-btn:hover{background:var(--ink);color:var(--paper)}
.play-btn .i-play{display:none}
.play-btn[aria-pressed="false"] .i-play{display:block}
.play-btn[aria-pressed="false"] .i-pause{display:none}
.p-link .ico{width:16px;height:16px}
@media (max-width:1000px){.product.feature{grid-template-columns:1fr}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.p-link{position:relative}
@media (max-width:700px){.m-phone{padding-top:16%}}

/* ===== services: six cards, each with a motion graphic ===== */
.tk-build{grid-column:span 7}.tk-ai{grid-column:span 5}
.tk-qa{grid-column:span 5}.tk-pm{grid-column:span 7}
.tk-train{grid-column:span 7}.tk-docs{grid-column:span 5}
.tk{min-height:clamp(340px,32vw,420px)}
.tk-art{position:relative;min-height:150px}
/* sequencer: [data-seq] elements turn .on in order while the card is in view */
.js [data-seq]{transition:opacity .45s var(--ease),transform .6s var(--ease),background-color .35s,clip-path .8s var(--ease)}

/* build */
.build-art{display:flex;align-items:center;gap:clamp(10px,2vw,18px);flex-wrap:wrap}
.ba-code{min-width:clamp(110px,22vw,140px)}
.js .ba-code span{opacity:0;transform:translateX(-6px)}
.js .ba-code span.on{opacity:1;transform:none}
.js .ba-arrow{opacity:.2}
.js .ba-arrow.on{opacity:1;animation:nudge 1.2s var(--ease) infinite}
@keyframes nudge{50%{transform:translateX(4px)}}
.ba-app{position:relative;flex:1;min-width:150px}
.js .ba-app i{transform:scale(.6);opacity:0}
.js .ba-app i.on{transform:none;opacity:1}
.ba-ship{position:absolute;right:-6px;bottom:-12px;background:var(--ink);color:var(--paper);padding:3px 8px;font-size:11px}
.js .ba-ship{opacity:0;transform:translateY(6px) scale(.9)}
.js .ba-ship.on{opacity:1;transform:none}

/* ai */
.ag-line{stroke-dasharray:4 4}
.js .ag-g{opacity:.25}
.js .ag-g.on{opacity:1}
.ag-eye{fill:var(--paper)}
.js .ag-core-g.on .ag-eye{fill:var(--cyan);animation:blinkeye 2.4s steps(1) infinite}
@keyframes blinkeye{90%{fill:var(--paper)}}
.ag-packet{fill:var(--cyan);stroke:var(--ink);stroke-width:1;opacity:0}
.tk.live .ag-packet{opacity:1}
.ag-packet.p1{offset-path:path("M64 60 H120 L200 24");}
.ag-packet.p2{offset-path:path("M64 60 H120 L200 60")}
.ag-packet.p3{offset-path:path("M64 60 H120 L200 96")}
.ag-packet{offset-rotate:0deg;animation:packet 2.6s var(--ease) infinite;animation-play-state:paused}
.ag-packet.p2{animation-delay:.6s}.ag-packet.p3{animation-delay:1.2s}
.tk.live .ag-packet,.tk.live .ag-line{animation-play-state:running}
.ag-line{animation-play-state:paused}
@keyframes packet{from{offset-distance:0%}to{offset-distance:100%}}

/* qa */
.qa-art li{align-items:center}
.qa-art b{position:relative;display:inline-grid;min-width:5.6em;text-align:center;padding:1px 8px;border:1px solid var(--ink);background:var(--paper);font-weight:500}
.qa-art b i{grid-area:1/1;font-style:normal;transition:opacity .3s}
.qa-art b .p{opacity:1}.qa-art b .q{opacity:0}
.js .qa-art li:not(.on) b .p{opacity:0}
.js .qa-art li:not(.on) b .q{opacity:1;color:var(--ink-3)}
.js .qa-art li:not(.on) b{border-color:var(--line-strong);background:transparent}
.js .qa-art li.on + li:not(.on) b{background:var(--cyan);border-color:var(--ink)}
.js .qa-art li.on + li:not(.on) b .q{color:var(--ink)}
.qa-art .qa-sum{border-bottom:0;padding-top:14px}
.qa-art .qa-sum span{font-weight:500;color:var(--ink)}
.qa-art b.ship{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.js .qa-art .qa-sum{opacity:.25}
.js .qa-art .qa-sum.on{opacity:1}

/* delivery */
.pm-art{position:relative;padding-right:4px}
.pm-row{grid-template-columns:clamp(56px,10vw,72px) 1fr}
.pm-track{position:relative;height:18px}
.pm-track i{position:absolute;top:0;bottom:0;left:var(--s);width:var(--w);margin:0;height:auto;border:1px solid var(--ink);background:var(--paper);transform-origin:left}
.pm-track i.c{background:var(--cyan)}
.js .pm-track i{transform:scaleX(0)}
.js .pm-track i.on{transform:none}
.pm-today{position:absolute;top:-10px;bottom:-6px;left:calc(clamp(56px,10vw,72px) + 12px);width:1px;background:var(--ink);opacity:0}
.pm-today span{position:absolute;top:-16px;left:-14px;font-size:10px}
.tk.live .pm-today{opacity:1;animation:today 7s linear infinite}
@keyframes today{from{transform:translateX(0)}to{transform:translateX(calc(var(--track-w,300px)))}}

/* training */
.train-art{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(14px,3vw,28px);align-items:center}
.tr-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tr-list li{display:grid;grid-template-columns:minmax(0,1fr) 22px;grid-template-areas:"n ok" "bar ok";column-gap:12px;row-gap:6px;align-items:center}
.tr-name{grid-area:n;font-size:14px;font-weight:500}
.tr-bar{grid-area:bar;height:8px;border:1px solid var(--ink);background:var(--paper);position:relative;overflow:hidden}
.tr-bar i{position:absolute;inset:0;background:var(--ink);transform-origin:left;transition:transform 1s var(--ease)}
.tr-list li:last-child .tr-bar i{background:var(--cyan)}
.tr-ok{grid-area:ok;width:22px;height:22px;border:1px solid var(--ink);background:var(--ink);position:relative;transition:background .3s,transform .4s var(--ease)}
.tr-ok::after{content:"";position:absolute;left:6px;top:5px;width:8px;height:5px;border-left:2px solid var(--paper);border-bottom:2px solid var(--paper);transform:rotate(-45deg)}
.js .tr-list li:not(.on) .tr-bar i{transform:scaleX(0)}
.js .tr-list li:not(.on) .tr-ok{background:transparent;transform:scale(.7)}
.js .tr-list li:not(.on) .tr-ok::after{opacity:0}
.tr-cert{width:clamp(92px,16vw,120px);aspect-ratio:3/4;border:1px solid var(--ink);background:var(--paper);padding:12px 10px;display:flex;flex-direction:column;gap:6px;position:relative}
.tr-cert span{font-size:9px}
.tr-cert i{height:4px;background:var(--ink);opacity:.5}
.tr-cert i.short{width:60%}
.tr-cert::after{content:"";position:absolute;right:-12px;bottom:-12px;width:34px;height:34px;background:var(--cyan);border:1px solid var(--ink);transform:rotate(45deg)}
.js .tr-cert{opacity:.25;transform:rotate(-4deg) translateY(6px)}
.js .tr-cert.on{opacity:1;transform:rotate(-4deg)}

/* documentation */
.dc-page{position:relative;border:1px solid var(--ink);background:var(--paper);padding:14px 16px 16px;display:grid;gap:9px;max-width:340px}
.dc-tabs{display:flex;gap:4px;margin-bottom:4px}
.dc-tabs span{border:1px solid var(--line-strong);padding:1px 7px;font-size:10px;transition:background .3s}
.dc-tabs span.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dc-page > i{height:6px;width:var(--w);background:var(--ink);opacity:.55;transform-origin:left}
.js .dc-page > i{transform:scaleX(0)}
.js .dc-page > i.on{transform:none}
.dc-flow{display:flex;align-items:center;margin-top:6px}
.dc-flow b{width:30px;height:22px;border:1px solid var(--ink);background:#fff}
.dc-flow b.c{background:var(--cyan)}
.dc-flow em{flex:1;height:1px;background:var(--ink);transform-origin:left}
.js .dc-flow b{opacity:0;transform:scale(.6)}
.js .dc-flow b.on{opacity:1;transform:none}
.js .dc-flow em{transform:scaleX(0)}
.js .dc-flow em.on{transform:none}
.dc-stamp{position:absolute;right:12px;top:12px;border:1.5px solid var(--cyan-ink);color:var(--cyan-ink);padding:2px 8px;font-size:11px;transform:rotate(-8deg)}
.js .dc-stamp{opacity:0;transform:rotate(-8deg) scale(1.6)}
.js .dc-stamp.on{opacity:1;transform:rotate(-8deg) scale(1)}

@media (max-width:1000px){.tk-train,.tk-docs{grid-column:span 12}}
@media (max-width:520px){.train-art{grid-template-columns:1fr}.tr-cert{justify-self:start}}
@media (prefers-reduced-motion:reduce){
  .js [data-seq]{opacity:1!important}
  .ag-packet,.pm-today{display:none}
}
@media (max-width:1000px){.tk-build,.tk-ai,.tk-qa,.tk-pm,.tk-train,.tk-docs{grid-column:span 6}}
@media (max-width:680px){.tk-build,.tk-ai,.tk-qa,.tk-pm,.tk-train,.tk-docs{grid-column:span 12}}
.proof-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1000px){.proof-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:440px){
  .proof-grid{grid-template-columns:minmax(0,1fr)}
  .proof-grid .fact,.proof-grid .cell:nth-child(4),.proof-grid .cell:last-child{grid-column:1 / -1}
  .org{padding:18px 48px 18px 18px}
}

/* ===== hero: continuous motion after the entrance ===== */
.js .plane > g{animation:settle 1.4s var(--ease) both,float 7s ease-in-out infinite;animation-delay:calc(.25s + var(--i) * .22s),calc(1.8s + var(--i) * .35s)}
@keyframes float{0%,100%{translate:0 0}50%{translate:0 calc(-6px - var(--k) * 7px)}}
.js .p-face{animation:draw 1.1s var(--ease) forwards,fillin .6s var(--ease) forwards;animation-delay:calc(.25s + var(--i) * .22s),calc(1s + var(--i) * .22s)}
.scan{fill:var(--cyan);opacity:0}
.js .hero .scan{animation:scan 3.2s var(--ease) 2.4s infinite}
@keyframes scan{0%{opacity:0;transform:translateY(0)}10%{opacity:.9}70%{opacity:.9;transform:translateY(150px)}100%{opacity:0;transform:translateY(150px)}}
.js .callout circle{animation:ping 2.4s ease-out 2.4s infinite}
@keyframes ping{0%{r:4}50%{r:7}100%{r:4}}
.js .blocks span{animation:step .01s steps(1) forwards,blockcycle 6s steps(1) infinite;animation-delay:calc(1.6s + var(--d) * .14s),calc(3s + var(--d) * .5s)}
@keyframes blockcycle{0%,100%{background:var(--ink)}33%{background:var(--stone)}66%{background:var(--cyan)}}
.blocks span.soft{animation-name:step,blockcycle2}
@keyframes blockcycle2{0%,100%{background:var(--stone)}33%{background:var(--cyan)}66%{background:var(--ink)}}

/* ===== experience: logo collage marquee ===== */
.proof-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px 24px;margin-bottom:clamp(32px,4vw,48px)}
.proof-head .h2{grid-column:1 / 9}
.proof-fact{grid-column:9 / 13;align-self:end;margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(1.1rem,1.5vw,1.35rem);line-height:1.3}
.proof-fact .fact-src{display:block;margin-top:10px;color:var(--ink-3);font-family:var(--mono)}
.marquee{display:grid;gap:12px;overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-track{display:flex;gap:12px;width:max-content;margin:0;padding:0;list-style:none;animation:mq 60s linear infinite}
.mq-rev .mq-track{animation-direction:reverse;animation-duration:70s}
.marquee:hover .mq-track,.marquee:focus-within .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-item{flex:none;height:clamp(64px,7vw,84px);min-width:clamp(150px,15vw,200px);padding:0 clamp(16px,2vw,26px);display:grid;place-items:center;border:1px solid var(--line-strong);background:var(--paper);position:relative}
.mq-item::after{content:"";position:absolute;right:-4px;bottom:-4px;width:7px;height:7px;background:var(--cyan);border:1px solid var(--ink)}
.mq-item img{max-height:62%;max-width:150px;object-fit:contain;filter:grayscale(1) contrast(1.05);mix-blend-mode:multiply;opacity:.85;transition:filter .3s,opacity .3s}
.mq-item:hover img{filter:none;opacity:1}
.mq-item span{font-weight:500;font-size:clamp(14px,1.2vw,16px);letter-spacing:-.01em;text-align:center;line-height:1.2;white-space:nowrap}
@media (prefers-reduced-motion:reduce){.mq-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}.marquee{-webkit-mask:none;mask:none;padding-inline:var(--gutter)}.mq-row.mq-rev{display:none}}

/* ===== services: starting-at price ===== */
.price{margin:2px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;padding-top:12px;border-top:1px solid var(--line-strong);max-width:40ch}
.price .mono{color:var(--ink-3)}
.price b{font-family:var(--serif);font-weight:400;font-size:1.6rem;letter-spacing:-.01em;color:var(--ink);line-height:1}
.price-unit{font-size:14px;color:var(--ink-2)}

/* ===== about: company framing + career timeline ===== */
.about-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,3vw,40px) 24px}
.about-lead{grid-column:1 / 6}
.about-body{grid-column:6 / 13}
.founder{display:flex;align-items:center;gap:14px;margin:28px 0 0}
.founder-mark{width:52px;height:52px;display:grid;place-items:center;background:var(--ink);color:var(--paper);font:600 17px var(--sans);position:relative}
.founder-mark::after{content:"";position:absolute;right:-5px;bottom:-5px;width:12px;height:12px;background:var(--cyan);border:1px solid var(--ink)}
.founder b{display:block;font-weight:500;font-size:18px}
.founder .mono{color:var(--ink-3)}
.career{grid-column:1 / 13;margin-top:clamp(16px,3vw,32px)}
.career .h3{margin-bottom:20px}
.timeline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));border-top:1px solid var(--line-strong);border-left:1px solid var(--line-strong)}
.timeline li{padding:16px 18px;border-right:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);display:grid;gap:4px;background:var(--ground);transition:background .3s}
.timeline li:hover{background:var(--paper)}
.timeline .yr{font:500 12px var(--mono);letter-spacing:.06em;color:var(--cyan-ink)}
.timeline b{font-weight:500;font-size:16px;line-height:1.25}
.timeline span{font-size:14px;color:var(--ink-2)}
.timeline li:first-child{background:var(--cyan)}
.timeline li:first-child .yr{color:var(--ink)}

/* ===== contact: consent ===== */
.consent{display:grid;gap:12px;padding-top:4px}
.check{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;font-size:13.5px;line-height:1.5;color:rgba(248,246,242,.82);cursor:pointer}
.check input{appearance:none;width:20px;height:20px;margin:1px 0 0;border:1px solid rgba(248,246,242,.6);background:transparent;display:grid;place-items:center;cursor:pointer}
.check input::after{content:"";width:9px;height:5px;border-left:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg) translate(1px,-1px);opacity:0}
.check input:checked{background:var(--cyan);border-color:var(--cyan)}
.check input:checked::after{opacity:1}
.check input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.check a{color:var(--cyan)}
.consent.err .check:first-child input{border-color:#FF9C85}
.consent .msg{font-size:13px;color:#FFB8A8;padding-left:32px}

/* ===== capability: pdf icon ===== */
.pdf-ico{width:18px;height:21px;flex:none;overflow:visible}
.pdf-sheet{fill:var(--paper);stroke:currentColor;stroke-width:1.4}
.pdf-fold{fill:none;stroke:currentColor;stroke-width:1.4}
.pdf-tag{fill:var(--cyan)}
.pdf-ico text{font:700 6px var(--sans);fill:var(--ink);text-anchor:middle}
.btn-ink .pdf-sheet{fill:var(--ink)}

/* ===== footer ===== */
.foot{padding:clamp(48px,6vw,72px) 0 28px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px}
.foot-brand p{color:rgba(248,246,242,.7);max-width:34ch;margin:16px 0 20px;font-size:15px}
.foot-cta{border-color:var(--cyan);color:var(--cyan)}
.foot-cta:hover{background:var(--cyan);color:var(--ink)}
.foot-col h3{margin:0 0 14px;color:rgba(248,246,242,.55);font-weight:500}
.foot-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.foot-col a{color:rgba(248,246,242,.85);text-decoration:none;font-size:15px}
.foot-col a:hover{color:var(--paper);text-decoration:underline}
.foot-base{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:clamp(40px,5vw,56px);padding-top:20px;border-top:1px solid rgba(248,246,242,.18);color:rgba(248,246,242,.55)}

@media (max-width:1000px){
  .proof-head .h2,.proof-fact{grid-column:1 / -1}
  .about-lead,.about-body{grid-column:1 / -1}
  .foot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot-brand{grid-column:1 / -1}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){.js .plane > g{animation:none}}
/* contact: required marks + thank-you */
.req{color:#FF7A66;text-decoration:none;font-weight:600;margin-left:2px;font-family:var(--sans)}
.req-note{margin:0 0 -4px;font-size:13px;color:rgba(248,246,242,.7)}
.thanks{padding:clamp(24px,4vw,44px);border:1px solid rgba(248,246,242,.35);position:relative;display:grid;gap:18px;align-content:start;outline:none}
.thanks::before{content:"";position:absolute;left:-4px;top:-4px;width:7px;height:7px;background:var(--cyan)}
.thanks .h2{color:var(--paper)}
.thanks p{margin:0;color:rgba(248,246,242,.78);max-width:44ch}
.thanks-mark{width:56px;height:56px}
.thanks-mark rect{fill:var(--cyan);stroke:var(--cyan)}
.thanks-mark path{fill:none;stroke:var(--ink);stroke-width:3.5;stroke-linecap:square;stroke-dasharray:40;stroke-dashoffset:40;animation:tick .6s var(--ease) .2s forwards}
@keyframes tick{to{stroke-dashoffset:0}}
.thanks .btn-line{border-color:rgba(248,246,242,.45);color:var(--paper);justify-self:start}
.thanks .btn-line:hover{background:var(--paper);color:var(--ink)}
.thanks:not([hidden]){animation:rise .6s var(--ease) both}
@media (prefers-reduced-motion:reduce){.thanks-mark path{stroke-dashoffset:0}}
.thanks[hidden],.form[hidden]{display:none}
.field > span.msg{font:400 13px/1.4 var(--sans);text-transform:none;letter-spacing:0;color:#FFB8A8}