@font-face{font-family:"Archivo";src:url(fonts/archivo-wdth.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo";src:url(fonts/archivo-wdth-italic.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:italic;font-display:swap}
@font-face{font-family:"Mono";src:url(fonts/mono.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --bg:#05070a;--bg-2:#0a0e14;--bg-3:#101620;--panel:rgba(14,20,30,.62);
  --ink:#eef3f8;--ink-2:#b8c3cf;--mute:#7d8a99;
  --blue:#1d6ff2;--sky:#4db6ff;--ice:#bfe4ff;--chrome:#dfe6ee;
  --line:rgba(160,200,240,.14);--line-2:rgba(160,200,240,.28);
  --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --cut:14px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--bg);color:var(--ink);font-family:"Archivo",ui-sans-serif,system-ui,sans-serif;font-stretch:100%;font-size:17px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
::selection{background:var(--blue);color:#fff}
.wrap{width:min(1320px,100% - 32px);margin-inline:auto}
.mono{font-family:"Mono",ui-monospace,Menlo,monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.tag{font-family:"Mono",monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);display:flex;align-items:center;gap:12px}
.tag b{color:var(--sky);font-weight:500}
.tag::before{content:"";width:28px;height:1px;background:var(--sky)}
h1,h2,h3,.disp{font-weight:850;font-stretch:118%;text-transform:uppercase;letter-spacing:-.01em;line-height:.9}
h2{font-size:clamp(40px,6.2vw,104px)}
.it{font-style:italic;font-weight:300;font-stretch:100%;text-transform:none;letter-spacing:-.02em;background:linear-gradient(100deg,var(--ice),var(--sky) 45%,var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.08em}
.chrome{background:linear-gradient(180deg,#fff 0%,#dfe6ee 38%,#8796a6 52%,#eef3f8 70%,#aab6c3 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
p{text-wrap:pretty}

/* buttons: bevelled */
.btn{--c:var(--blue);position:relative;display:inline-flex;align-items:center;gap:14px;height:56px;padding:0 26px;font-weight:700;font-stretch:110%;font-size:14px;letter-spacing:.06em;text-transform:uppercase;clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut));transition:transform .25s var(--ease),background .25s,color .25s;white-space:nowrap;cursor:pointer;border:0}
.btn:active{transform:scale(.97)}
.btn svg{width:18px;height:18px;flex:none}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
.btn-blue:hover{background:#2f82ff}
.btn-ghost{background:rgba(255,255,255,.04);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn-ghost:hover{background:rgba(77,182,255,.12)}
.btn-wa{background:#1ebe5d;color:#04170b}
.btn-wa:hover{background:#2bd56d}

/* LOADER */
#loader{position:fixed;inset:0;z-index:200;background:var(--bg);display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s}
#loader.done{opacity:0;visibility:hidden}
#loader .in{display:grid;justify-items:center;gap:22px}
#loader img{width:min(260px,60vw);filter:drop-shadow(0 0 30px rgba(29,111,242,.45));animation:breathe 2.2s ease-in-out infinite}
@keyframes breathe{50%{filter:drop-shadow(0 0 50px rgba(77,182,255,.7))}}
#loader .bar{width:220px;height:2px;background:var(--line);overflow:hidden}
#loader .bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--sky));transition:width .3s}

/* NAV */
.nav{position:fixed;inset:0 0 auto;z-index:60;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(5,7,10,.78);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.nav .logo img{height:50px;width:auto;filter:drop-shadow(0 0 14px rgba(29,111,242,.35))}
.nav-links{display:flex;gap:30px}
.nav-links a{font-family:"Mono",monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);transition:color .2s}
.nav-links a:hover{color:var(--sky)}
.nav .btn{height:46px;padding:0 18px}
.open-pill{display:inline-flex;align-items:center;gap:8px;color:var(--ink-2)}
.open-pill i{width:7px;height:7px;border-radius:50%;background:#2fdc78;box-shadow:0 0 10px #2fdc78}

/* 3D STAGE */
#stage{position:fixed;inset:0;z-index:0;pointer-events:none}
#stage canvas{display:block;width:100%;height:100%}
#stage .fallback{position:absolute;inset:0;background:#000 center/cover no-repeat;opacity:.55;display:none}
#stage.nogl .fallback{display:block}
.stage-fade{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(120% 80% at 50% 40%,transparent 40%,rgba(5,7,10,.75));}
.hud{position:fixed;left:0;right:0;bottom:0;z-index:5;pointer-events:none;transition:opacity .5s}
.hud .wrap{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-bottom:22px}
.hud .meter{display:flex;gap:28px;color:var(--mute)}
.hud .meter b{color:var(--ink);font-weight:500}
.hud .prog{flex:1;max-width:340px;height:2px;background:var(--line);position:relative}
.hud .prog i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--blue),var(--sky))}
.hud.off{opacity:0}

/* HERO + CHAPTERS (scroll over the stage) */
main{position:relative;z-index:2}
.hero{min-height:100svh;display:grid;align-items:end;padding:120px 0 120px}
.hero h1{font-size:clamp(50px,8.2vw,148px);line-height:.86;font-stretch:112%}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hero h1 .ln>span{display:block;transform:translateY(105%);transition:transform 1.2s var(--ease)}
body.ready .hero h1 .ln>span{transform:none}
.hero-row{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:end;margin-top:30px}
.hero .lead{font-size:clamp(17px,1.35vw,21px);color:var(--ink-2);max-width:520px}
.ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.proof{display:inline-flex;align-items:center;gap:12px;padding:8px 16px 8px 8px;background:rgba(10,14,20,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);margin-bottom:22px}
.proof .g{width:30px;height:30px;border-radius:50%;background:#fff;display:grid;place-items:center}
.stars{color:#ffc94d;letter-spacing:2px}
.fade{opacity:0;transform:translateY(16px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
body.ready .fade{opacity:1;transform:none}

.chapter{min-height:115vh;display:flex;align-items:center;padding:12vh 0}
.chapter .wrap{display:flex}
.chapter.r .wrap{justify-content:flex-end}
.glass{width:min(460px,100%);padding:34px 34px 30px;background:var(--panel);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--line);position:relative;clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px)}
.glass::before{content:"";position:absolute;left:0;top:0;width:60px;height:2px;background:linear-gradient(90deg,var(--sky),transparent)}
.glass .num{font-family:"Mono",monospace;font-size:12px;color:var(--sky);letter-spacing:.1em}
.glass h3{font-size:clamp(34px,3.6vw,54px);margin:14px 0 16px}
.glass p{color:var(--ink-2)}
.glass ul{list-style:none;margin-top:18px;display:grid;gap:8px}
.glass li{display:flex;gap:10px;font-size:15px;color:var(--ink-2)}
.glass li::before{content:"";flex:none;width:8px;height:8px;margin-top:8px;background:var(--sky);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.glass blockquote{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:15px;color:var(--ink)}
.glass cite{display:block;margin-top:6px;font-style:normal;color:var(--mute)}
.reveal{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.reveal.on{opacity:1;transform:none}

/* LAKSTUDIO (interactive on 3D) */
.lab{min-height:240vh;position:relative}
.lab-sticky{position:sticky;top:0;height:100svh;display:flex;align-items:flex-end;padding-bottom:84px}
.lab-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px;align-items:end}
.lab-head h2{font-size:clamp(38px,5vw,84px)}
.lab-head p{color:var(--ink-2);max-width:460px;margin-top:14px}
.lab-ui{width:min(520px,100%);background:var(--panel);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid var(--line);padding:22px;pointer-events:auto;clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.steps-pick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.steps-pick button{position:relative;padding:14px 8px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);cursor:pointer;text-align:left;transition:border-color .25s,background .25s}
.steps-pick button .mono{color:var(--mute);font-size:10px}
.steps-pick button b{display:block;font-stretch:105%;text-transform:uppercase;font-size:13px;margin-top:4px;overflow-wrap:anywhere}
.steps-pick button[aria-pressed=true]{border-color:var(--sky);background:rgba(77,182,255,.12)}
.steps-pick button[aria-pressed=true] .mono{color:var(--sky)}
.lab-row{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.swatches{display:flex;gap:8px;align-items:center}
.swatches button{width:28px;height:28px;border:2px solid transparent;cursor:pointer;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);outline:1px solid var(--line-2);outline-offset:2px}
.swatches button[aria-pressed=true]{outline-color:var(--sky)}
.toggle{display:inline-flex;align-items:center;gap:10px;cursor:pointer;color:var(--ink-2);user-select:none}
.toggle input{appearance:none;width:42px;height:22px;background:rgba(255,255,255,.08);border:1px solid var(--line-2);position:relative;cursor:pointer;transition:background .25s}
.toggle input::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:var(--ink-2);transition:transform .3s var(--ease),background .3s}
.toggle input:checked{background:rgba(29,111,242,.5)}
.toggle input:checked::after{transform:translateX(20px);background:#fff}
.gloss{margin-top:16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px}
.gloss .track{height:4px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.gloss .track i{position:absolute;inset:0 auto 0 0;width:20%;background:linear-gradient(90deg,var(--blue),var(--sky));transition:width .9s var(--ease)}
.gloss b{font-family:"Mono",monospace;font-weight:500;min-width:52px;text-align:right}
.lab-ui .btn{width:100%;justify-content:space-between;margin-top:16px}

/* CONTENT SECTIONS (solid) */
.solid{position:relative;z-index:3;background:var(--bg)}
.pad{padding:clamp(80px,10vw,150px) 0}
.head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:40px;align-items:end;margin-bottom:56px}
.head p{color:var(--ink-2);font-size:18px}
.hexbg{position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='146' viewBox='0 0 84 146'%3E%3Cpath d='M42 1 83 24.5v47L42 95 1 71.5v-47Z M42 95v51 M0 122l42-27 42 27' fill='none' stroke='%234db6ff' stroke-opacity='.07'/%3E%3C/svg%3E");mask-image:radial-gradient(70% 60% at 50% 40%,#000,transparent)}

.ticker{background:var(--blue);color:#fff;overflow:hidden;padding:18px 0;position:relative;z-index:3}
.track{display:flex;width:max-content;animation:mq 42s linear infinite}
.track span{font-weight:850;font-stretch:118%;text-transform:uppercase;font-size:clamp(26px,3.2vw,46px);white-space:nowrap;padding-right:48px;display:flex;align-items:center;gap:48px}
.track span::after{content:"";width:16px;height:16px;background:#fff;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
@keyframes mq{to{transform:translateX(-50%)}}

.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.stat{padding:32px 24px 8px 0}
.stat+.stat{padding-left:24px;border-left:1px solid var(--line)}
.stat b{display:block;font-size:clamp(56px,7vw,112px);font-weight:850;font-stretch:112%;line-height:.9;letter-spacing:-.02em}
.stat span{color:var(--mute)}

/* BEFORE / AFTER — left = Voor (dirty), right = Na (clean). Drag right = clean */
.ba-wrap{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.6fr);gap:44px;align-items:end}
.ba{position:relative;aspect-ratio:1392/752;overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:pan-y;cursor:ew-resize;background:#111}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba .clean{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--x,12%)) 0 0)}
.ba .clean img{inset:auto;left:-2.368%;top:-2.739%;width:103%;height:103%}
.ba .shine{position:absolute;inset:0;background:linear-gradient(110deg,transparent 40%,rgba(255,255,255,.2) 50%,transparent 60%);transform:translateX(-70%);animation:shine 5s var(--ease-io) infinite}
@keyframes shine{55%,100%{transform:translateX(70%)}}
.ba .handle{position:absolute;top:0;bottom:0;left:var(--x,12%);width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 22px var(--sky);z-index:3}
.ba .knob{position:absolute;top:50%;left:var(--x,12%);width:56px;height:56px;margin:-28px 0 0 -28px;background:var(--blue);color:#fff;display:grid;place-items:center;z-index:4;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.ba .knob svg{width:22px;height:22px}
.scale{display:flex;justify-content:space-between;margin-top:14px;color:var(--mute)}
.scale b{color:var(--ink);font-weight:500}
.scale span:last-child b{color:var(--sky)}
.ba-side p{color:var(--ink-2);margin:22px 0}
.ba-side blockquote{border-top:1px solid var(--line);padding-top:18px}
.ba-side cite{display:block;margin-top:8px;font-style:normal;color:var(--mute)}

/* SERVICES */
.svc{display:grid;grid-template-columns:80px minmax(0,1.1fr) minmax(0,1fr) 52px;gap:20px;align-items:center;padding:26px 0;border-top:1px solid var(--line);position:relative;cursor:pointer}
.svc:last-child{border-bottom:1px solid var(--line)}
.svc::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(29,111,242,.18),transparent 70%);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.svc>*{position:relative}
.svc h3{font-size:clamp(28px,3.4vw,52px);transition:transform .5s var(--ease),color .3s}
.svc p{color:var(--ink-2);font-size:16px}
.svc .n{color:var(--mute)}
.svc .arr{width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line-2);transition:background .3s,transform .5s var(--ease)}
.svc:hover::before{transform:scaleX(1)}
.svc:hover h3{transform:translateX(14px);color:var(--sky)}
.svc:hover .arr{background:var(--blue);border-color:var(--blue);transform:rotate(-45deg)}
.peek{position:fixed;left:0;top:0;width:250px;aspect-ratio:3/4;overflow:hidden;pointer-events:none;z-index:40;opacity:0;scale:.9;transition:opacity .25s,scale .4s var(--ease);clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.peek.on{opacity:1;scale:1}
.peek img{width:100%;height:100%;object-fit:cover}

/* WORKSHOP */
.shop{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}
.tile{position:relative;overflow:hidden;background:var(--bg-3);min-height:280px;clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.tile img,.tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.tile:hover img{transform:scale(1.05)}
.tile .cap{position:absolute;left:0;right:0;bottom:0;padding:24px;background:linear-gradient(transparent,rgba(5,7,10,.92))}
.tile .cap h3{font-size:clamp(26px,2.4vw,38px);margin:8px 0 6px}
.tile .cap p{color:var(--ink-2);font-size:15px;max-width:420px}
.t-video{grid-column:span 7;min-height:560px}
.t-rupes{grid-column:span 5}
.t-hex{grid-column:span 5}
.t-moto{grid-column:span 4;min-height:420px}
.t-van{grid-column:span 8;min-height:420px}
.t-txt{grid-column:span 7;background:linear-gradient(140deg,rgba(29,111,242,.22),rgba(10,14,20,.9) 60%);padding:34px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.t-txt h3{font-size:clamp(32px,3.4vw,56px)}
.t-txt p{color:var(--ink-2)}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills span{font-family:"Mono",monospace;font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:8px 12px;border:1px solid var(--line-2);color:var(--ink-2)}

/* GALLERY */
.gal{display:flex;gap:12px;overflow-x:auto;padding:0 max(16px,calc((100vw - 1320px)/2)) 18px;scrollbar-width:none;cursor:grab;scroll-snap-type:x proximity}
.gal::-webkit-scrollbar{display:none}
.gal.drag{cursor:grabbing;scroll-snap-type:none}
.gal figure{flex:0 0 auto;height:min(64vh,540px);aspect-ratio:3/4;position:relative;overflow:hidden;scroll-snap-align:start;clip-path:inset(0 100% 0 0);transition:clip-path 1.1s var(--ease-io)}
.gal figure.w{aspect-ratio:1/1}
.gal figure.on{clip-path:inset(0 0 0 0)}
.gal img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.gal figcaption{position:absolute;left:0;bottom:0;background:rgba(5,7,10,.8);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:8px 12px;border-top:1px solid var(--line)}
.galbar{height:2px;background:var(--line);margin-top:22px;position:relative}
.galbar i{position:absolute;top:0;bottom:0;left:0;background:var(--sky)}

/* REVIEWS */
.score{display:flex;align-items:end;gap:18px}
.score b{font-size:clamp(100px,13vw,200px);font-weight:850;font-stretch:112%;line-height:.78}
.revs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.rev{padding:28px;background:var(--bg-2);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:space-between;gap:20px}
.rev p{color:var(--ink);font-size:17px}
.rev.big{grid-column:span 2;background:linear-gradient(140deg,rgba(29,111,242,.25),var(--bg-2) 70%)}
.rev.big p{font-size:clamp(24px,2.6vw,38px);font-weight:700;font-stretch:100%;line-height:1.15}
.rev .who{color:var(--mute)}

/* STEPS */
.proc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}
.proc .s{padding:30px 30px 10px 0;position:relative}
.proc .s+.s{padding-left:30px;border-left:1px solid var(--line)}
.proc .n{font-weight:850;font-stretch:118%;font-size:110px;line-height:.85;color:transparent;-webkit-text-stroke:1.5px var(--sky)}
.proc h3{font-size:36px;margin:18px 0 10px}
.proc p{color:var(--ink-2)}
.proc .ln{position:absolute;top:-1px;left:0;height:2px;width:0;background:var(--sky);transition:width 1.3s var(--ease)}
.proc.on .ln{width:100%}
.proc.on .s:nth-child(2) .ln{transition-delay:.25s}
.proc.on .s:nth-child(3) .ln{transition-delay:.5s}

/* QUOTE FORM (prêt-à-chiffrer) */
.quote{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:48px;align-items:start}
.quote-side{position:sticky;top:110px}
.quote-side p{color:var(--ink-2);margin:20px 0}
.quote-side ul{list-style:none;display:grid;gap:10px;color:var(--ink-2)}
.quote-side li{display:flex;gap:10px}
.quote-side li b{color:var(--sky);font-family:"Mono",monospace;font-weight:500}
form.q{background:var(--bg-2);border:1px solid var(--line);padding:28px;clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px)}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px}
.tabs button{padding:12px 14px;background:rgba(255,255,255,.03);border:1px solid var(--line);cursor:pointer;font-weight:700;font-stretch:110%;text-transform:uppercase;font-size:13px;letter-spacing:.04em;transition:border-color .2s,background .2s}
.tabs button[aria-selected=true]{background:var(--blue);border-color:var(--blue);color:#fff}
fieldset{border:0;border-top:1px solid var(--line);padding:22px 0 6px;margin:0}
legend{font-family:"Mono",monospace;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--sky);padding-right:12px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.grid .full{grid-column:1/-1}
.grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
label.f,div.f{display:block;font-size:14px;color:var(--ink-2)}
.f input,.f select,.f textarea,.f .chips{display:block;margin-top:7px}
.f .chips{display:flex}
label.f .req{color:var(--sky)}
.f input,.f select,.f textarea{width:100%;background:#070a0f;border:1px solid var(--line-2);padding:13px 14px;font-size:16px;outline:none;transition:border-color .2s,box-shadow .2s;border-radius:0}
.f textarea{min-height:110px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--sky);box-shadow:0 0 0 3px rgba(77,182,255,.15)}
.f .cnt{display:block;text-align:right;margin-top:4px;font-family:"Mono",monospace;font-size:11px;color:var(--mute)}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.cards.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.cards.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{position:relative;cursor:pointer}
.card input{position:absolute;opacity:0;pointer-events:none}
.card span{display:grid;gap:4px;height:100%;padding:16px 14px;border:1px solid var(--line-2);background:rgba(255,255,255,.02);transition:border-color .2s,background .2s}
.card b{font-stretch:110%;text-transform:uppercase;font-size:15px}
.card small{color:var(--mute);font-size:13px;line-height:1.35}
.card input:checked+span{border-color:var(--sky);background:rgba(77,182,255,.1)}
.card input:focus-visible+span{box-shadow:0 0 0 3px rgba(77,182,255,.3)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;cursor:pointer}
.chip input{position:absolute;opacity:0}
.chip span{display:inline-block;padding:10px 14px;border:1px solid var(--line-2);font-size:14px;transition:all .2s}
.chip input:checked+span{background:var(--blue);border-color:var(--blue);color:#fff}
.chip input:focus-visible+span{box-shadow:0 0 0 3px rgba(77,182,255,.3)}
.pane{display:none}
.pane.on{display:block;animation:pin .5s var(--ease)}
@keyframes pin{from{opacity:0;transform:translateY(8px)}}
.missing{display:none;margin-top:16px;padding:14px 16px;border:1px solid #ff6b6b;background:rgba(255,107,107,.08);color:#ffd2d2;font-size:14px}
.missing.on{display:block}
.send{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px}
.send small{color:var(--mute);max-width:320px}
.sent{display:none;margin-top:16px;padding:14px 16px;border:1px solid rgba(47,220,120,.5);background:rgba(47,220,120,.08);font-size:14px}
.sent.on{display:block}

/* FAQ */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px}
details{border-top:1px solid var(--line)}
details:last-child{border-bottom:1px solid var(--line)}
summary{list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font-size:20px;font-weight:700;cursor:pointer}
summary::-webkit-details-marker{display:none}
summary .pm{font-family:"Mono",monospace;color:var(--sky);transition:transform .35s var(--ease)}
details[open] summary .pm{transform:rotate(45deg)}
details .a{padding:0 60px 24px 0;color:var(--ink-2)}

/* VISIT */
.visit{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);border:1px solid var(--line)}
.visit .info{padding:38px}
.addr{font-size:clamp(30px,3.2vw,50px);margin:16px 0 26px;font-stretch:105%;overflow-wrap:anywhere}
.hours{width:100%;border-collapse:collapse;font-size:15px}
.hours td{padding:9px 0;border-top:1px solid var(--line);color:var(--ink-2)}
.hours td:last-child{text-align:right;font-family:"Mono",monospace;font-size:13px}
.hours tr.today td{color:var(--sky)}
.map{min-height:480px;border-left:1px solid var(--line);background:#0c1118}
.map iframe{width:100%;height:100%;min-height:480px;border:0;filter:invert(.92) hue-rotate(185deg) saturate(.6) contrast(.9)}

/* CTA + FOOTER */
.cta{position:relative;overflow:hidden;text-align:center}
.cta h2{font-size:clamp(60px,11vw,190px);line-height:.84}
.cta .ctas{justify-content:center;margin-top:40px}
.cta .glow{position:absolute;inset:auto -10% -40% -10%;height:80%;background:radial-gradient(50% 50% at 50% 50%,rgba(29,111,242,.35),transparent 70%);pointer-events:none}
.cta .logo-big{width:min(340px,70vw);margin:0 auto 34px;filter:drop-shadow(0 0 40px rgba(29,111,242,.5))}
footer{position:relative;z-index:3;background:var(--bg);border-top:1px solid var(--line);padding:28px 0 110px;color:var(--mute)}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}
footer .made{color:var(--ink-2)}
footer .made b{color:var(--sky);font-weight:500}

/* DOCK */
.dock{position:fixed;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));z-index:70;display:none;gap:6px;transform:translateY(160%);transition:transform .5s var(--ease)}
.dock.on{transform:none}
.dock .btn{flex:1;justify-content:center;height:52px}

@media (max-width:1000px){
  .nav-links,.nav .open-pill{display:none}
  .hero-row,.head,.ba-wrap,.faq,.visit,.quote{grid-template-columns:minmax(0,1fr);gap:28px}
  .quote-side{position:static}
  .chapter .wrap,.chapter.r .wrap{justify-content:center}
  .chapter{min-height:100vh;align-items:flex-end;padding-bottom:16vh}
  .lab-panel{grid-template-columns:minmax(0,1fr)}
  .lab-head p{display:none}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat:nth-child(3){padding-left:0;border-left:0}
  .stat:nth-child(n+3){border-top:1px solid var(--line)}
  .svc{grid-template-columns:40px minmax(0,1fr) 46px}
  .svc p{display:none}
  .peek{display:none}
  .shop>*{grid-column:1/-1!important}
  .t-video{min-height:420px}
  .revs{grid-template-columns:minmax(0,1fr)}
  .rev.big{grid-column:auto}
  .proc{grid-template-columns:minmax(0,1fr)}
  .proc .s+.s{padding-left:0;border-left:0;border-top:1px solid var(--line)}
  .map{border-left:0;border-top:1px solid var(--line)}
  .dock{display:flex}
  .hud .meter span:nth-child(n+2){display:none}
  .glass ul,.glass blockquote{display:none}
  .hero{padding-bottom:90px}
  .dock.inlab{transform:translateY(160%)}
}
@media (max-width:600px){
  h2{font-size:clamp(28px,8.6vw,44px);font-stretch:106%}
  .hero h1{font-stretch:104%}
  .nav .btn span{display:none}
  .nav .btn{width:46px;padding:0;justify-content:center}
  .nav .logo img{height:40px}
  .ctas .btn{flex:1;justify-content:center}
  .grid,.grid3,.cards,.cards.c4{grid-template-columns:minmax(0,1fr)}
  .cards.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
  form.q{padding:20px}
  .glass{padding:26px 22px}
  .steps-pick{grid-template-columns:repeat(2,minmax(0,1fr))}
  .visit .info{padding:24px}
  .hud{display:none}
  .lab-sticky{padding-bottom:20px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .reveal,.fade{opacity:1;transform:none}
  .hero h1 .ln>span{transform:none}
  .gal figure{clip-path:none}
}

/* partners (top) */
.partners{margin-top:34px;display:flex;align-items:center;gap:18px;padding:14px 18px;background:rgba(10,14,20,.62);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);max-width:860px}
.plabel{color:var(--sky);white-space:nowrap}
.pmask{overflow:hidden;flex:1;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ptrack{display:flex;width:max-content;animation:mq 26s linear infinite}
.ptrack span{font-weight:800;font-stretch:112%;text-transform:uppercase;font-size:18px;letter-spacing:.02em;color:var(--ink);padding-right:34px;display:flex;align-items:center;gap:34px;white-space:nowrap}
.ptrack span::after{content:"";width:7px;height:7px;background:var(--sky);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.gpic{margin:-34px -34px 22px;height:170px;overflow:hidden;position:relative}
.gpic img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
.glass:hover .gpic img{transform:scale(1.05)}
.gpic::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(14,20,30,.85))}
.photo-run{overflow:hidden;background:var(--bg);padding:14px 0;position:relative;z-index:3}
.prun{display:flex;gap:12px;width:max-content;animation:mq 70s linear infinite}
.prun img{height:220px;width:auto;aspect-ratio:3/4;object-fit:cover;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
.dealers{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.45fr) minmax(0,.45fr);gap:14px;margin-top:56px;align-items:stretch}
.dealers>div{padding:34px;background:linear-gradient(140deg,rgba(29,111,242,.2),var(--bg-2) 70%);border:1px solid var(--line);display:flex;flex-direction:column;gap:16px}
.dealers h3{font-size:clamp(30px,3vw,48px)}
.dealers p{color:var(--ink-2)}
.dnames{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.dnames span{font-weight:800;font-stretch:110%;text-transform:uppercase;font-size:14px;padding:9px 12px;border:1px solid var(--line-2)}
.dealers figure{overflow:hidden;min-height:340px}
.dealers img{width:100%;height:100%;object-fit:cover}
.photo-band{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;padding:0 12px 12px;background:var(--bg)}
.photo-band img{width:100%;height:clamp(240px,34vw,460px);object-fit:cover}
@media (max-width:1000px){
  .partners{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 14px}
  .pmask{width:100%}
  .dealers{grid-template-columns:1fr 1fr}
  .dealers>div{grid-column:1/-1}
  .dealers figure{min-height:240px}
  .photo-band{grid-template-columns:1fr 1fr}
  .photo-band img:first-child{grid-column:1/-1}
  .gpic{height:130px}
}
@media (max-width:600px){.gpic{margin:-26px -22px 18px;height:110px}.prun img{height:160px}.ptrack span{font-size:15px}}

/* mobile cut-off fix: the endless dealer strip must never widen the hero */
.hero{grid-template-columns:minmax(0,1fr)}
.hero>.wrap,.hero-row>*,.partners,.pmask{min-width:0}
.partners{max-width:min(860px,100%)}
@media (max-width:600px){.dealers>div{padding:22px}.dealers h3{font-size:clamp(24px,7.4vw,32px);overflow-wrap:anywhere}.svc h3{font-size:clamp(22px,6.6vw,30px);overflow-wrap:anywhere}}

/* Safari (iPhone) fix: gradient text on italic words gets clipped at the slanted edge */
.it,.chrome{display:inline-block;padding:0 .14em .06em 0;margin-right:-.06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hero h1 .ln{padding-right:.18em;margin-right:-.18em}
@supports (-webkit-touch-callout:none){
  /* iOS: plain colour instead of gradient-clip, so nothing can be cut off */
  .it{background:none;-webkit-text-fill-color:var(--sky);color:var(--sky)}
  .chrome{background:none;-webkit-text-fill-color:#eef3f8;color:#eef3f8}
}