:root{
  --ink:#073763;--ink-2:#0B5294;--night:#0A1B2C;--rubber:#24292f;
  --orange:#F06A25;--orange-btn:#C04A12;--orange-ink:#B8460F;--orange-soft:#FFB48C;--orange-pale:#FFF1E9;
  --bg:#F4F6F9;--paper:#fff;--mist:#E9EEF4;--mist-2:#D6DFE8;--slate:#516478;--text:#10243A;--line:rgba(7,55,99,.10);--ok:#17703C;--ok-bg:#E5F5EC;
  --f-display:"Urbanist","Avenir Next",Arial,sans-serif;--f-body:"Figtree","Avenir Next",Arial,sans-serif;--f-mono:"IBM Plex Mono",Menlo,monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 16.5px/1.6 var(--f-body);overflow-x:clip}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--f-display);margin:0;letter-spacing:-.02em}
.mono{font-family:var(--f-mono)}
.skip{position:absolute;left:-9999px}.skip:focus{left:12px;top:12px;z-index:100;background:#fff;padding:10px 14px;border-radius:10px}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.wrap{max-width:1200px;margin:0 auto;padding:0 18px}.narrow{max-width:860px}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;padding:12px 20px;font:600 15px/1.1 var(--f-body);text-decoration:none;border:0;cursor:pointer;transition:background .25s,color .25s,transform .25s,box-shadow .25s;white-space:nowrap}
.btn-lg{padding:15px 24px;font-size:16px}
.btn-o{background:var(--orange-btn);color:#fff}.btn-o:hover{background:#A63C0B;transform:translateY(-1px);box-shadow:0 14px 26px -14px rgba(192,74,18,.8)}
.btn-line2{background:#fff;color:var(--ink);border:1px solid var(--mist-2)}.btn-line2:hover{border-color:var(--ink)}
.btn-line{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.55)}.btn-line:hover{background:#fff;color:var(--orange-btn)}

/* header */
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.97);border-bottom:1px solid var(--line)}
.top-in{max-width:1200px;margin:0 auto;padding:10px 18px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);--logo-on:#fff}
.brand-mark{width:54px;height:36px;flex:none}
.brand-txt{display:flex;flex-direction:column;line-height:1.05;color:var(--ink)}.brand-txt b{font:700 18px/1 var(--f-display);letter-spacing:-.01em}.brand-txt small{font:500 11.5px/1.3 var(--f-mono);color:var(--orange-ink);letter-spacing:.02em}
.nav{display:flex;gap:18px;margin-left:8px}.nav a{text-decoration:none;font-weight:500;font-size:15px;color:var(--slate);transition:color .2s}.nav a:hover{color:var(--ink)}
.top-tel{margin-left:auto;text-decoration:none;font-size:14px;color:var(--slate)}.top-tel:hover{color:var(--ink)}
@media (max-width:1060px){.nav{display:none}}
@media (max-width:640px){.top-tel{display:none}.top-cta{margin-left:auto;padding:10px 14px;font-size:14px}.brand-mark{width:44px;height:30px}.brand-txt b{font-size:16px}}

/* ---------- RUN: pinned scroll stage ---------- */
.run{position:relative;background:#EEF2F7}
.run.js{height:440vh}
.run-stage{position:relative;height:calc(100svh - 57px);min-height:520px;overflow:hidden;background:linear-gradient(#E6ECF3,#EEF2F7 55%,#E4E9EF)}
.run.js .run-stage{position:sticky;top:57px}
.run-stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important;opacity:0;transition:opacity .9s}
.run-stage.ready canvas{opacity:1}
.run-stage .t3d-poster{position:absolute;left:50%;bottom:6%;width:min(520px,86vw);transform:translateX(-50%);transition:opacity .6s}
.run-stage.ready .t3d-poster{opacity:0}
.run-bar{position:absolute;left:0;right:0;top:0;height:4px;background:rgba(7,55,99,.08);z-index:3}.run-bar i{display:block;height:100%;background:var(--orange);transform-origin:0 0;transform:scaleX(0)}
.run-intro{position:absolute;left:50%;top:6%;width:min(860px,calc(100% - 24px));transform:translateX(-50%);text-align:center;padding:28px 28px 26px;z-index:2;transition:opacity .5s,transform .5s;isolation:isolate}
.run-intro::before{content:"";position:absolute;inset:-30px -60px;z-index:-1;border-radius:48px;background:radial-gradient(closest-side,rgba(244,246,249,.92),rgba(244,246,249,.78) 60%,rgba(244,246,249,0));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent);mask-image:radial-gradient(closest-side,#000 62%,transparent)}
.run.started .run-intro{opacity:0;transform:translate(-50%,-30px);pointer-events:none;visibility:hidden;transition:opacity .5s,transform .5s,visibility 0s .5s}
.kicker{display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;font:500 13px/1.3 var(--f-mono);color:var(--slate);background:rgba(255,255,255,.75);border:1px solid var(--line);border-radius:999px;padding:7px 13px}
.kicker .dot{width:8px;height:8px;border-radius:50%;background:#2fbf71;box-shadow:0 0 0 4px rgba(47,191,113,.18)}
.run h1{font:300 clamp(48px,8vw,108px)/.92 var(--f-display);letter-spacing:-.045em;color:var(--ink);margin:0 0 18px}
.run h1 span{font-weight:800;color:var(--orange)}
.run .lead{font-size:clamp(16px,1.5vw,19px);line-height:1.55;color:var(--slate);max-width:36em;margin:0 auto}
.scroll-hint{display:inline-flex;align-items:center;gap:10px;margin:22px 0 0;font:600 13px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--orange-ink)}
.mouse{width:20px;height:30px;border:2px solid var(--orange-ink);border-radius:12px;position:relative}.mouse i{position:absolute;left:50%;top:6px;width:3px;height:6px;margin-left:-1.5px;border-radius:2px;background:var(--orange-ink);animation:wheel 1.6s infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(-2px)}40%{opacity:1}100%{opacity:0;transform:translateY(8px)}}
/* HUD */
.hud{position:absolute;left:16px;right:16px;top:18px;display:flex;gap:10px;align-items:flex-start;z-index:2;opacity:0;transform:translateY(-10px);transition:opacity .5s,transform .5s;pointer-events:none}
.run.started .hud{opacity:1;transform:none}
.pl{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:16px;padding:10px 12px;display:grid;grid-template-columns:auto auto;gap:4px 10px;align-items:center;min-width:190px;box-shadow:0 16px 30px -24px rgba(7,40,80,.5)}
.pl .nm{grid-column:1/-1;font:600 11.5px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--slate)}
.pl.fill .nm{color:var(--orange-ink)}
.pl .g{height:10px;border-radius:6px;background:var(--mist);overflow:hidden;width:120px;--v:1}.pl .g i{display:block;height:100%;width:calc(var(--v)*100%);background:var(--ink-2);transition:width .2s}
.pl.fill .g i{background:var(--orange)}
.pl b{font:700 18px/1 var(--f-display);color:var(--ink)}
.pl .st{grid-column:1/-1;justify-self:start;font:600 12px/1 var(--f-body);padding:5px 9px;border-radius:999px;background:var(--ok-bg);color:var(--ok)}
.pl .st.bad{background:var(--orange-pale);color:var(--orange-ink)}
.meter{margin-left:auto;background:var(--ink);color:#fff;border-radius:16px;padding:10px 14px;display:grid;grid-template-columns:auto auto;gap:2px 14px;align-items:baseline}
.meter span{font:500 11px/1.4 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:#9FB6CC}.meter b{font:700 22px/1.1 var(--f-mono);color:#fff;text-align:right}
.run-pop{position:absolute;left:0;right:0;top:34%;height:0;z-index:2;text-align:center;pointer-events:none}
.pp{position:absolute;left:50%;top:0;transform:translate(-50%,0) scale(.6);font:800 clamp(28px,4.4vw,56px)/1 var(--f-display);color:var(--orange);letter-spacing:-.02em;white-space:nowrap;text-shadow:0 3px 0 #fff,0 10px 30px rgba(240,106,37,.35);animation:pop 1.4s cubic-bezier(.2,.8,.2,1) forwards}
.pp.ok{color:var(--ink)}.pp.bad{color:#B42318;margin-top:60px}
@keyframes pop{0%{opacity:0;transform:translate(-50%,10px) scale(.6)}15%{opacity:1;transform:translate(-50%,0) scale(1.08)}70%{opacity:1;transform:translate(-50%,-20px) scale(1)}100%{opacity:0;transform:translate(-50%,-50px) scale(.96)}}
.run-end{position:absolute;left:50%;bottom:5%;width:min(760px,calc(100% - 32px));transform:translate(-50%,30px);opacity:0;pointer-events:none;z-index:3;background:#fff;border:1px solid var(--line);border-radius:28px;padding:26px 28px;box-shadow:0 40px 70px -40px rgba(7,40,80,.6);transition:opacity .5s,transform .5s}
.run.ended .run-end{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.run-end .k{margin:0 0 8px}.run-end h2{font:300 clamp(24px,3vw,36px)/1.1 var(--f-display);color:var(--ink);margin:0 0 10px}.run-end h2 span{font-weight:800;color:var(--orange-ink)}
.run-end>p{margin:0 0 16px;color:var(--slate)}.end-cta{display:flex;gap:10px;flex-wrap:wrap}
.t3d-poster .pg{stroke:#9FB6CC;stroke-width:3}.t3d-poster .psh{fill:rgba(7,40,80,.15)}.t3d-poster .pt{fill:#26292d}.t3d-poster .ptr{fill:none;stroke:#3a4148;stroke-width:12;stroke-dasharray:18 12}
.t3d-poster .pcb{fill:#3a4148}.t3d-poster .pc2{fill:#F06A25}.t3d-poster .pcl{stroke:#C9D1D9;stroke-width:2}.t3d-poster .pr{fill:#D6DCE2}.t3d-poster .ph{fill:#1b2733}.t3d-poster .pn{stroke:#8f9ba7;stroke-width:6;stroke-linecap:round}

/* proof strip + hazard ticker */
.proof{background:#fff;border-bottom:1px solid var(--line)}
.proof-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-top:26px;padding-bottom:26px}
.proof-in div{padding:4px 18px}.proof-in div+div{border-left:1px solid var(--line)}
.proof b{display:block;font:800 34px/1 var(--f-display);color:var(--ink);letter-spacing:-.02em}.proof span{display:block;margin-top:6px;font-size:14px;color:var(--slate);line-height:1.4}
.hazard{position:relative;background:repeating-linear-gradient(-45deg,var(--orange) 0 22px,#E25A16 22px 44px);overflow:hidden}
.hz-track{display:flex;width:max-content;animation:tick 38s linear infinite}
.hz-track span{display:inline-flex;align-items:center;gap:8px;padding:11px 26px;font:700 14px/1 var(--f-display);letter-spacing:.06em;text-transform:uppercase;color:#fff}
@keyframes tick{to{transform:translateX(-50%)}}

/* sections */
.sec{padding:96px 0}
.sec-mist{background:var(--mist)}.sec-white{background:#fff}
.sec-head{max-width:760px;margin-bottom:38px}
.k{margin:0 0 12px;font:600 12.5px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--orange-ink)}
.sec-head h2,.at-txt h2{font:300 clamp(32px,4.2vw,54px)/1.04 var(--f-display);color:var(--ink);margin:0 0 16px;text-wrap:balance}
.sec-head h2 span,.at-txt h2 span{font-weight:700}
.sec-head p{margin:0;font-size:17.5px;color:var(--slate);max-width:44em}
.note{font-size:13.5px;color:var(--slate);line-height:1.5}

/* process: front view + section A-A, one shared level, a scrubber with 4 stops */
.proc{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:28px;align-items:start}
.proc-vis{background:#fff;border:1px solid var(--line);border-radius:30px;padding:22px 22px 18px;box-shadow:0 40px 60px -50px rgba(7,40,80,.5);background-image:linear-gradient(rgba(7,55,99,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(7,55,99,.04) 1px,transparent 1px);background-size:20px 20px}
#proc-svg{width:100%;height:auto;font-family:var(--f-mono);overflow:visible}
#proc-svg .cl{stroke:var(--slate);stroke-width:1;stroke-dasharray:10 4 2 4;opacity:.6}
#proc-svg .cut{stroke:var(--ink);stroke-width:1.4;stroke-dasharray:14 5 3 5}#proc-svg .cutl{font:700 14px var(--f-mono);fill:var(--ink)}
#proc-svg .p-lugs rect{fill:#2f353c}#proc-svg .p-tread{fill:#262b31}
#proc-svg .p-air{fill:#EAF4FD}
#proc-svg .p-pu{fill:#F06A25;transition:fill .3s}#proc-svg .p-cure{opacity:0}
#proc-svg .p-rim{fill:#D6DCE2;stroke:#8f9ba7;stroke-width:1.4}#proc-svg .p-rim2{fill:#E8ECF0;stroke:#B7C1CB}
#proc-svg .p-hub{fill:var(--ink)}#proc-svg .p-bolt circle{fill:#8f9ba7}
#proc-svg .p-valve{fill:#5b6773}
#proc-svg .p-hose{fill:none;stroke:var(--orange);stroke-width:8;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;opacity:0;transition:stroke-dashoffset .8s ease,opacity .3s}
#proc-svg .p-pump{fill:var(--ink)}#proc-svg .pumpt{font:700 13px var(--f-mono);fill:#fff}
#proc-svg .p-wall{stroke:#20262d;stroke-width:1.2}
#proc-svg .p-bub circle{fill:#fff;stroke:#7FA3C4;stroke-width:1.5}#proc-svg .p-bub .puff{fill:#DCEBF8;stroke:#5E8DB8;stroke-width:1.4}#proc-svg .p-bub .out{fill:#cfe3f5;stroke:none}
#proc-svg .lvl{stroke:var(--orange-ink);stroke-width:1.5;stroke-dasharray:6 5}#proc-svg .lvlt{font:600 12px var(--f-mono);fill:var(--orange-ink)}
#proc-svg .cap{font:600 11.5px var(--f-mono);fill:var(--slate);text-transform:uppercase;letter-spacing:.06em}
#proc-svg .dim path{fill:none;stroke:var(--ink);stroke-width:1.2}#proc-svg .dim text{font-size:12px;fill:var(--ink)}
#proc-svg .ck{fill:var(--ok)}#proc-svg .ckm{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}#proc-svg .ckt{font:600 13px var(--f-body);fill:var(--ink);paint-order:stroke;stroke:#fff;stroke-width:4px}
#proc-svg .stamp{fill:#fff;stroke:var(--ok);stroke-width:4}#proc-svg .stampt{font:800 30px var(--f-display);fill:var(--ok);letter-spacing:.06em}
#p-checks,#p-ready,#p-level{transition:opacity .35s}
.proc-read{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 14px}
.proc-read div{background:var(--bg);border-radius:14px;padding:10px 12px}.proc-read span{display:block;font:600 11px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--slate)}
.proc-read b{display:block;margin-top:4px;font:700 17px/1.1 var(--f-display);color:var(--ink)}.proc-read em{font-style:normal;color:var(--orange-ink);font-variant-numeric:tabular-nums}
.proc-read .st b{color:var(--ok)}
.proc-ctl{display:flex;align-items:flex-start;gap:14px}
.play{flex:none;width:48px;height:48px;border-radius:50%;border:0;background:var(--orange-btn);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 22px -12px rgba(192,74,18,.8);transition:background .2s,transform .2s}
@media (hover:hover){.play:hover{background:#A63C0B;transform:scale(1.05)}}.play .i-pause{display:none}.playing .play .i-play{display:none}.playing .play .i-pause{display:block}
.scrub{flex:1;position:relative;padding-top:11px}
.scrub input{width:100%;display:block}
.stops{position:relative;height:44px;margin:4px 11px 0}
.stops button{all:unset;cursor:pointer;position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;font:600 12px/1.1 var(--f-body);color:var(--slate);white-space:nowrap}
.stops button:first-child{transform:translateX(-11px);align-items:flex-start}.stops button:last-child{transform:translateX(calc(-100% + 11px));align-items:flex-end}
.stops i{font-style:normal;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid var(--mist-2);font:700 11px var(--f-mono);color:var(--slate);transition:all .2s}
.stops button.on{color:var(--ink)}.stops button.on i{background:var(--orange);border-color:var(--orange);color:#fff}
.stops button:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:8px}
.proc-hint{margin:6px 0 0;font-size:12px;color:var(--slate);text-align:center}
.proc-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.proc-steps button{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:44px 1fr;column-gap:14px;row-gap:4px;width:100%;padding:16px;border-radius:20px;background:#fff;border:1px solid var(--line);transition:border-color .25s,box-shadow .25s,transform .25s}
.proc-steps .n{grid-row:span 2;width:44px;height:44px;border-radius:14px;background:var(--mist);color:var(--ink);display:grid;place-items:center;font:700 18px/1 var(--f-display);transition:background .25s,color .25s}
.proc-steps b{font:600 18px/1.25 var(--f-display);color:var(--ink)}
.proc-steps button>span:last-child{font-size:14.5px;color:var(--slate);line-height:1.5}
.proc-steps li.on button{border-color:var(--orange);box-shadow:0 22px 36px -28px rgba(192,74,18,.7)}
.proc-steps li.on .n{background:var(--orange);color:#fff}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:40px}
.facts div{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px}
.facts b{font:700 13px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--orange-ink)}
.facts p{margin:8px 0 0;font-size:15.5px}

/* machines */
.mach-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.mach-tabs button{all:unset;box-sizing:border-box;cursor:pointer;background:#fff;border:1px solid var(--line);border-radius:20px;padding:10px 10px 14px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;transition:border-color .25s,transform .25s,box-shadow .25s}
@media (hover:hover){.mach-tabs button:hover{transform:translateY(-3px);box-shadow:0 22px 36px -30px rgba(7,40,80,.6)}}
.mach-tabs button[aria-selected="true"]{border-color:var(--orange);box-shadow:0 0 0 2px var(--orange) inset}
.mach-tabs img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.mach-tabs span{font:600 14.5px/1.2 var(--f-display);color:var(--ink)}
.mach-panel{margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:28px;padding:26px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start;box-shadow:0 40px 60px -50px rgba(7,40,80,.5)}
.mp-vis{display:grid;gap:12px}
.mp-img{background:#fff;border:1px solid var(--line);border-radius:20px;aspect-ratio:16/10;padding:14px;position:sticky;top:90px;background-image:linear-gradient(rgba(7,55,99,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(7,55,99,.04) 1px,transparent 1px);background-size:20px 20px}
.mp-img img{width:100%;height:100%;object-fit:contain}
.mp-art{margin:0 0 10px;background:var(--bg);border-radius:20px;padding:10px 8px 4px;background-image:linear-gradient(rgba(7,55,99,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(7,55,99,.05) 1px,transparent 1px);background-size:20px 20px}
.mp-txt h3{font:700 28px/1.1 var(--f-display);color:var(--ink);margin:0 0 10px}
.mp-txt p{margin:0 0 14px;color:var(--slate);font-size:16.5px}
.mp-k{font:600 12px/1 var(--f-mono)!important;text-transform:uppercase;letter-spacing:.06em;color:var(--text)!important;margin-bottom:10px!important}
.mp-sizes{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.szc{cursor:pointer;background:#fff;display:inline-flex;align-items:center;gap:6px;font:600 14px/1 var(--f-mono);padding:9px 12px;border-radius:12px;border:1px solid var(--mist-2);color:var(--ink)}
.szc.done{background:var(--orange-pale);border-color:#FFD2B8;color:var(--orange-ink)}
.szc[aria-pressed="true"]{box-shadow:0 0 0 2px var(--ink) inset}
.mp-read{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 12px}
.mp-read div{background:var(--bg);border-radius:14px;padding:10px 12px}.mp-read dt{font:600 11px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--slate)}
.mp-read dd{margin:6px 0 0;font:700 20px/1 var(--f-display);color:var(--ink)}.mp-read div:first-child dd{color:var(--orange-ink)}
.mp-note{display:flex;align-items:center;gap:6px;font-size:13px!important;color:var(--orange-ink)!important;margin:0!important}
.tyre-draw{width:100%;height:auto;font-family:var(--f-mono)}
.tyre-draw .ground{stroke:var(--slate);stroke-width:1.5}
.tyre-draw .t-tyre{fill:#262b31}.tyre-draw .t-tread{fill:none;stroke:#3d454e;stroke-width:6}
.tyre-draw .t-rim{fill:#C9D1D9;stroke:#9aa6b2}.tyre-draw .t-hub{fill:var(--ink)}.tyre-draw .t-hole{fill:#8f9ba7}
.tyre-draw .cl{stroke:var(--slate);stroke-width:1;stroke-dasharray:8 4 2 4}
.tyre-draw .t-cutbg{fill:#3a4148}.tyre-draw .t-cutline{stroke:#C9D1D9;stroke-width:1.2}
.tyre-draw .t-wall{fill:#262b31}.tyre-draw .t-fill{fill:var(--orange)}.tyre-draw .t-rimline{stroke:#9aa6b2;stroke-width:6}
.tyre-draw .dim path{fill:none;stroke:var(--ink);stroke-width:1.2}.tyre-draw .dim text,.tyre-draw .cap{font-size:12.5px;fill:var(--ink)}.tyre-draw .cap{fill:var(--slate);font-size:11.5px;text-transform:uppercase;letter-spacing:.06em}

/* savings calculator: four questions */
.sv{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:16px;align-items:start}
.card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:26px;box-shadow:0 40px 60px -50px rgba(7,40,80,.5);margin:0}
.q{padding:0 0 20px;margin:0 0 20px;border-bottom:1px solid var(--mist)}
.ql{display:flex;align-items:center;gap:10px;margin:0 0 12px;font:700 18px/1.25 var(--f-display);color:var(--ink)}
.ql i{font-style:normal;flex:none;width:28px;height:28px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font:700 13px var(--f-mono)}
.mpick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mpick button{all:unset;box-sizing:border-box;cursor:pointer;border:1px solid var(--mist-2);border-radius:16px;padding:6px 6px 9px;text-align:center;font:600 12.5px/1.2 var(--f-body);color:var(--ink);background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
@media (hover:hover){.mpick button:hover{transform:translateY(-2px)}}
.mpick button img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.mpick button[aria-pressed="true"]{border-color:var(--orange);box-shadow:0 0 0 2px var(--orange) inset;background:var(--orange-pale)}
.mpick button:focus-visible,.seg4 button:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.stepper{display:inline-grid;grid-template-columns:52px 96px 52px;border:1px solid var(--mist-2);border-radius:16px;overflow:hidden;background:#fff}
.stepper button{all:unset;cursor:pointer;display:grid;place-items:center;font:600 24px/1 var(--f-body);color:var(--ink);background:var(--bg);transition:background .2s,color .2s}
@media (hover:hover){.stepper button:hover{background:var(--orange);color:#fff}}.stepper button:focus-visible{outline:3px solid var(--orange);outline-offset:-3px}
.stepper input{border:0!important;border-radius:0!important;text-align:center;font:700 22px/1 var(--f-display)!important;color:var(--ink);padding:12px 0!important;box-shadow:none!important;background:#fff!important;width:100%}
.seg4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.seg4 button{all:unset;box-sizing:border-box;cursor:pointer;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--mist-2);border-radius:14px;padding:10px 6px;background:#fff;transition:all .2s}
.seg4 b{display:block;font:800 22px/1 var(--f-display);color:var(--ink)}.seg4 span{display:block;margin-top:4px;font-size:12.5px;color:var(--slate)}
@media (hover:hover){.seg4 button:hover{border-color:var(--ink)}}
.seg4 button[aria-checked="true"]{background:var(--ink);border-color:var(--ink)}.seg4 button[aria-checked="true"] b{color:#fff}.seg4 button[aria-checked="true"] span{color:#C8D7E6}
.money{display:flex;align-items:center;border:1px solid var(--mist-2);border-radius:16px;background:#fff;overflow:hidden;max-width:260px;transition:border-color .2s,box-shadow .2s}
.money:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px rgba(11,82,148,.16)}
.money input{border:0!important;box-shadow:none!important;font:700 22px/1 var(--f-display)!important;color:var(--ink);padding:12px 14px!important;width:100%;min-width:0;background:transparent!important}
.money span{padding:0 14px;font:600 13px var(--f-mono);color:var(--slate);background:var(--bg);align-self:stretch;display:flex;align-items:center}
.money.sm{max-width:200px}.money.sm input{font-size:17px!important;padding:9px 12px!important}
.hint{margin:8px 0 0;font-size:13.5px;color:var(--slate);line-height:1.45}
.more{border:1px solid var(--mist-2);border-radius:16px;background:var(--bg)}
.more summary{list-style:none;cursor:pointer;padding:13px 44px 13px 16px;position:relative;font:600 14.5px/1.2 var(--f-body);color:var(--ink)}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"";position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%23C04A12' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat;transition:transform .25s}
.more[open] summary::after{transform:rotate(180deg)}
.more-in{padding:4px 16px 16px;display:grid;gap:14px}
.more label{display:grid;gap:7px;font:600 14px/1.25 var(--f-body);color:var(--text)}
.more select{font:500 16px/1.2 var(--f-body);border-radius:14px;padding:11px 40px 11px 13px;background-color:#fff;width:100%}
.rng{grid-template-columns:1fr auto!important;align-items:center}.rng input{grid-column:1/-1;width:100%}.rng output{font:700 15px/1 var(--f-mono);color:var(--ink);grid-row:1;grid-column:2}
.price small{font-weight:400;color:var(--slate)}
.res{position:sticky;top:80px}
.hero-n{background:var(--ink);color:#fff;border-radius:24px;padding:24px 26px;margin-bottom:12px;position:relative;overflow:hidden}
.hero-n::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;border:34px solid rgba(240,106,37,.25)}
.hero-n span{display:block;font:600 12px/1.2 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:#9FB6CC}
.hero-n b{position:relative;z-index:1;display:inline-block;font:800 clamp(40px,5vw,60px)/1 var(--f-display);letter-spacing:-.03em;margin:10px 8px 8px 0;color:#fff}
.hero-n em{position:relative;z-index:1;font-style:normal;font-size:16px;color:var(--orange-soft)}
.hero-n p{margin:0;color:#D8E3EE;font-size:15.5px;line-height:1.5;position:relative;z-index:1;max-width:34em}
.sv.neg .hero-n b{color:var(--orange-soft)}
.bars{background:#fff;border:1px solid var(--line);border-radius:20px;padding:16px 18px;display:grid;gap:14px;margin-bottom:12px}
.bar{display:grid;grid-template-columns:118px 1fr auto;gap:4px 12px;align-items:center}
.bar .bl{font:600 14px/1.2 var(--f-body);color:var(--ink)}.bar.fill .bl{color:var(--orange-ink)}
.bar .bt{height:14px;border-radius:8px;background:var(--mist);overflow:hidden}
.bar .bt i{display:block;height:100%;border-radius:8px;transition:width .5s cubic-bezier(.2,.7,.2,1)}
.bar.air .bt i{background:#0B5294}.bar.fill .bt i{background:#C04A12}
.bar b{font:700 16px/1 var(--f-display);color:var(--ink);text-align:right;min-width:96px}
.bar small{grid-column:2/-1;font-size:12px;color:var(--slate)}
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.kpis div{background:var(--bg);border-radius:16px;padding:12px 14px}.kpis span{display:block;font-size:12.5px;color:var(--slate);line-height:1.3}.kpis b{display:block;font:700 22px/1.15 var(--f-display);color:var(--ink);margin-top:4px}
.sv-hyp{margin:0}
.sv-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:12px;background:var(--orange-pale);border-radius:18px;padding:14px 16px}
.sv-cta p{margin:0;font-weight:500;color:var(--ink);font-size:15px}

/* fit */
.fit{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fit>div{border-radius:28px;padding:28px;background:#fff;border:1px solid var(--line)}
.fit .fit-n{background:var(--bg)}
.fit h3{font:700 24px/1.2 var(--f-display);margin:0 0 14px;color:var(--ink)}
.fit ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.fit li{position:relative;padding-left:32px;font-size:16px}
.fit li::before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/14px no-repeat}
.fit-n li::before{background:#9FB6CC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E") center/12px no-repeat}

/* workshop */
.at{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
.at-txt>p{color:var(--slate);font-size:17.5px;margin:0 0 24px}
.svc{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.svc li{display:flex;gap:12px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px}
.svc svg{flex:none;color:var(--orange-ink)}.svc b{display:block;font:600 16px/1.3 var(--f-display);color:var(--ink)}.svc span{display:block;font-size:14px;color:var(--slate);margin-top:3px;line-height:1.45}
.at-board{background:#fff;border:1px solid var(--line);border-radius:26px;padding:8px;box-shadow:0 40px 60px -50px rgba(7,40,80,.5)}
.board-h{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;font-size:12.5px;color:var(--slate);text-transform:uppercase;letter-spacing:.08em}
.live{display:inline-flex;align-items:center;gap:7px;color:var(--ok)}.live i{width:8px;height:8px;border-radius:50%;background:#2fbf71;animation:blink 1.6s infinite}
@keyframes blink{50%{opacity:.25}}
.board-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:16px;border-top:1px solid var(--mist)}
.board-row span{color:var(--slate);font-size:15px}.board-row b{font-size:22px;color:var(--ink);white-space:nowrap}
.board-who{padding:16px;border-top:1px solid var(--mist)}.board-who>span{font:500 12px/1 var(--f-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--slate)}
.board-who ul{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px}.board-who li{font-size:13.5px;padding:7px 11px;border-radius:999px;background:var(--bg);color:var(--ink)}

/* faq */
.faq details{background:#fff;border:1px solid var(--line);border-radius:18px;margin:10px 0;transition:box-shadow .25s}
.faq details[open]{box-shadow:0 24px 40px -32px rgba(7,40,80,.5)}
.faq summary{list-style:none;cursor:pointer;padding:18px 56px 18px 22px;position:relative;font:600 18px/1.35 var(--f-display);color:var(--ink)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:20px;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;background:var(--mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23073763' stroke-width='2.4' stroke-linecap='round' d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .3s,background-color .3s}
.faq details[open] summary::after{transform:rotate(45deg);background-color:var(--orange-pale)}
.faq details p{margin:0;padding:0 22px 20px;color:var(--slate);font-size:16.5px}

/* end + footer */
.end{background:linear-gradient(120deg,var(--orange-btn),#E25A16);color:#fff;padding:64px 0;position:relative;overflow:hidden}
.end::after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;border:60px solid rgba(255,255,255,.1)}
.end-in{display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;position:relative;z-index:1}
.end h2{font:300 clamp(30px,3.6vw,46px)/1.05 var(--f-display);margin:0 0 10px}.end h2 span{font-weight:800}
.end p{margin:0;max-width:36em;color:#FFE5D6;font-size:17px}
.end-b{display:flex;gap:10px;flex-wrap:wrap}.end .btn-o{background:#fff;color:var(--orange-btn)}.end .btn-o:hover{background:var(--ink);color:#fff}
.foot{background:var(--ink);color:#C8D7E6;padding:54px 0 0}
.foot-logo{color:#fff;--logo-on:#073763;--logo-txt:#fff;display:inline-block}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr .8fr;gap:30px}
.foot-logo svg{width:180px;height:auto}
.foot p{font-size:14.5px;line-height:2;margin:14px 0 0}.foot p a{display:inline-block;padding:2px 0}.foot a{text-decoration:none}.foot a:hover{color:#fff}
.foot h3{font:600 15px/1 var(--f-body);color:#fff;margin:0 0 4px}
.foot-main{display:inline-block;margin-top:14px;color:var(--orange-soft);font-weight:600}
.foot-b{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:18px;padding-bottom:22px;font-size:12.5px;color:#9FB6CC}
.mbar{display:none}
.nojs{position:fixed;bottom:0;left:0;right:0;margin:0;background:#fff;padding:10px;text-align:center;z-index:60}

/* responsive */
@media (max-width:980px){
  .proc,.sv,.fit,.at{grid-template-columns:1fr}.res{position:static}.proc-read{grid-template-columns:1fr 1fr}
  .mach-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.mach-panel{grid-template-columns:1fr}
  .facts{grid-template-columns:1fr}.foot-in{grid-template-columns:1fr 1fr}.proof-in{grid-template-columns:1fr 1fr;row-gap:18px}.proof-in div:nth-child(3){border-left:0}
}
@media (max-width:640px){
  body{padding-bottom:64px}
  .sec{padding:66px 0}.wrap{padding:0 16px}
  .run.js{height:400vh}.run-intro{top:3%;padding:18px 12px}.seg4 span{font-size:11.5px}.bar{grid-template-columns:96px 1fr auto}.bar b{min-width:0;font-size:14px}
  .hud{flex-wrap:wrap;left:10px;right:10px;top:12px;gap:6px}.pl{min-width:0;flex:1;padding:8px 10px}.pl .g{width:64px}.pl b{font-size:15px}
  .meter{margin-left:0;width:100%;grid-template-columns:auto auto auto auto;justify-content:space-between;padding:8px 12px}.meter b{font-size:17px}
  .run-end{padding:18px}.end-cta .btn{width:100%}
  .proof b{font-size:26px}.proof span{font-size:12.5px}.proof-in div{padding:4px 12px}
  .mach-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.mach-panel{padding:16px}.mp-read dd{font-size:17px}
  .card{padding:18px}.kpis{grid-template-columns:1fr 1fr}.kpis div:last-child:nth-child(odd){grid-column:1/-1}
  .svc{grid-template-columns:1fr}.foot-in{grid-template-columns:1fr}
  .mbar{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:55;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid var(--line)}
  .mbar a{display:flex;align-items:center;justify-content:center;border-radius:999px;padding:13px;font:600 15px/1 var(--f-body);text-decoration:none;color:var(--ink);border:1px solid var(--mist-2)}
  .mbar a.o{background:var(--orange-btn);border-color:var(--orange-btn);color:#fff}
}
@media (prefers-reduced-motion:reduce){
  .hz-track,.live i,.mouse i{animation:none}.pp{animation-duration:.01s}
  .btn,.mach-tabs button,.proc-steps button{transition:none}
}

/* guided request: tyre-size chips and count (the panel itself comes from the main site, see css/ask.css) */
.szpick{margin:0 0 14px}.szpick .label{display:block;font:600 12px/1.3 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--slate);margin-bottom:8px}.szchips{display:flex;flex-wrap:wrap;gap:6px}.szc2{border:1px solid var(--mist-2);background:#fff;border-radius:999px;padding:11px 13px;font:600 13.5px/1 var(--f-mono);color:var(--ink);cursor:pointer;transition:all .15s}@media (hover:hover){.szc2:hover{border-color:var(--ink)}}.szc2[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}.szc2:focus-visible{outline:3px solid var(--orange);outline-offset:2px}.askn{display:flex!important;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;font:600 14px/1.2 var(--f-body);color:var(--text)}.ask .stepper{display:inline-grid;grid-template-columns:44px 72px 44px;border:1px solid var(--mist-2);border-radius:14px;overflow:hidden;background:#fff}.ask .stepper button{all:unset;cursor:pointer;display:grid;place-items:center;font:600 20px/1 var(--f-body);color:var(--ink);background:var(--bg)}@media (hover:hover){.ask .stepper button:hover{background:var(--orange);color:#fff}}.ask .stepper input{border:0!important;border-radius:0!important;text-align:center;font:700 18px/1 var(--f-display)!important;padding:9px 0!important;box-shadow:none!important;width:100%}
.mbar{grid-template-columns:1fr 1fr 1.2fr!important}

/* ---------- phones: details from the mobile review ---------- */
.pl .nm,.meter span,.proc-read span,.mp-read dt,.brand-txt small,.seg4 span{font-size:12px}
.foot p a{padding:6px 0}
@media (hover:none){.scroll-hint{display:none}}
@media (max-width:640px){
  .top-cta{padding:12px 16px}
  .run-stage{height:calc(100svh - 57px - 64px);min-height:480px}
  .run h1{font-size:clamp(40px,12vw,52px)}.run .lead{font-size:15.5px}
  .run-pop{top:24%}
  .stops{height:40px}
  .stops button,.stops button:first-child,.stops button:last-child{transform:translateX(-50%);align-items:center;justify-content:center;width:40px;height:40px;font-size:0;gap:0}
  #proc-svg .cap{font-size:25px}#proc-svg .dim text{font-size:26px}#proc-svg .ckt{font-size:30px;stroke-width:7px}
  #proc-svg .lvlt{font-size:26px}#proc-svg .cutl{font-size:28px}#proc-svg .pumpt{font-size:19px}#proc-svg .stampt{font-size:40px}
  .tyre-draw .dim text{font-size:20px}.tyre-draw .cap{font-size:18px}
  .mach-tabs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;margin:0 -16px;padding:4px 16px 12px;scrollbar-width:none}
  .mach-tabs::-webkit-scrollbar{display:none}
  .mach-tabs button{flex:0 0 40%;scroll-snap-align:start}
  .szc{padding:12px 14px}
  .board-row{flex-wrap:wrap;gap:4px 16px}.board-row b{font-size:19px}
  .end-b{width:100%}.end-b .btn{flex:1 1 100%}
}
.brand-txt b,.brand-txt small{white-space:nowrap}
@media (max-width:400px){.top-cta{padding:12px 13px;font-size:13.5px}.brand-mark{width:40px;height:27px}.brand{gap:8px}}
