/* Daler's Boiler — site v3 (zero-gravity scroll film on pure black with brand-blue haze; the page below it in brand blue) */
:root{
  --deep:#2a2383;--blue:#1563b5;--sky:#8fbcf5;
  --ink:#000;--ink2:#06070b;--ink3:#0c0e16;
  --text:#eef1fb;--muted:#9ca3c7;--line:rgba(255,255,255,.09);--line2:rgba(143,188,245,.22);
  --card:rgba(255,255,255,.035);
  --grad:linear-gradient(135deg,#1563b5 0%,#2a2383 100%);
  --display:'Oswald','Montserrat',system-ui,sans-serif;
  --body:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:16px;--r-sm:12px;--max:1200px;--gutter:clamp(16px,4vw,56px);
  --ease:cubic-bezier(.2,.7,.2,1);
  /* tiling haze textures (SVG turbulence): brand blue, brand indigo, and a pale one for the blue page */
  --fog-a:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='520'%3E%3Cfilter id='f' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0032 .0085' numOctaves='3' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .13 0 0 0 0 .45 0 0 0 0 1 1.55 0 0 0 -.74'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  --fog-b:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='520'%3E%3Cfilter id='f' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0032 .0085' numOctaves='3' seed='23' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .33 0 0 0 0 .27 0 0 0 0 1 1.55 0 0 0 -.74'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  --fog-c:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='520'%3E%3Cfilter id='f' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.0032 .0085' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .62 0 0 0 0 .78 0 0 0 0 1 1.55 0 0 0 -.74'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--ink)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit}
h1,h2,h3,.h2{font-family:var(--display);font-weight:600;line-height:1.02;margin:0;text-transform:uppercase;letter-spacing:.005em}
.h2{font-size:clamp(32px,4.4vw,58px)}
.grad{background:linear-gradient(90deg,#8fbcf5,#e3ecff);-webkit-background-clip:text;background-clip:text;color:transparent}
.mono{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.eyebrow{margin:0 0 12px;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--sky);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--sky)}
.sub{color:var(--muted);font-size:clamp(15px,1.35vw,18px);max-width:620px;margin:14px 0 0}
.wrap{width:min(var(--max),100% - 2*var(--gutter));margin-inline:auto}
.section{padding:clamp(72px,9vw,128px) 0}
.sec-head{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:end}
@media(max-width:900px){.sec-head{grid-template-columns:1fr;gap:24px}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:15px 24px;border-radius:999px;font-weight:700;font-size:15px;line-height:1;border:1px solid transparent;cursor:pointer;transition:transform .25s var(--ease),box-shadow .25s,background .25s,border-color .25s;white-space:nowrap;color:#fff}
.btn--primary{background:var(--grad);box-shadow:0 12px 32px rgba(21,99,181,.35)}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(21,99,181,.45)}
.btn--ghost{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.04)}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.btn--sm{padding:10px 16px;font-size:13px}
.btn--wide{width:100%}
.btn:active{transform:scale(.98)}
.btn[disabled]{opacity:.6;cursor:wait}

/* ---------- header ---------- */
.top{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--gutter);padding-top:max(12px,env(safe-area-inset-top));transition:background .35s,box-shadow .35s}
.top.is-scrolled{background:rgba(8,9,44,.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
@media(max-width:900px),(pointer:coarse){.top.is-scrolled{background:rgba(8,9,44,.95);backdrop-filter:none;-webkit-backdrop-filter:none}.grain{display:none}}
.top__logo img{height:32px;width:auto}
.top__nav{display:flex;gap:28px;font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.02em}
.top__nav a{transition:color .2s}
.top__nav a:hover{color:#fff}
.top__right{display:flex;align-items:center;gap:10px}
.lang{background:transparent;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:999px;padding:9px 12px;font-family:var(--mono);font-size:12px;font-weight:600;cursor:pointer;letter-spacing:.06em}
.burger{display:none;width:44px;height:44px;border:0;background:transparent;cursor:pointer;position:relative;padding:0}
.burger span,.burger span::before,.burger span::after{content:"";position:absolute;left:11px;width:22px;height:2px;background:#fff;border-radius:2px;transition:transform .3s,top .3s,background .3s}
.burger span{top:21px}
.burger span::before{top:-7px;left:0}
.burger span::after{top:7px;left:0}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
@media(max-width:900px){
  .top__nav{display:none;position:fixed;top:0;left:0;right:0;padding:calc(76px + env(safe-area-inset-top)) var(--gutter) 28px;flex-direction:column;gap:4px;background:rgba(8,9,44,.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-size:20px;z-index:-1;box-shadow:0 30px 60px rgba(0,0,0,.5)}
  .top__nav a{padding:12px 0;border-bottom:1px solid var(--line)}
  .top__nav.open{display:flex}
  .burger{display:block}
  .top .btn--sm{display:none}
}

/* ---------- film: scroll-scrubbed zero-gravity teardown ---------- */
.film{position:relative;height:calc(var(--stops,10) * 100vh);height:calc(var(--stops,10) * 100svh);background:#000}
.film__sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:#000;touch-action:none}
.film__stage{position:absolute;inset:0;opacity:0;will-change:transform,opacity}
/* zero-gravity drift of the whole stage: always running (on the compositor), so the picture never snaps when the float
   starts or ends — it used to jump back in the middle of the reassembly */
.film__stage{animation:drift 16s ease-in-out infinite alternate}
@keyframes drift{0%{transform:translate3d(-.45%,.3%,0) rotate(-.22deg) scale(1.012)}50%{transform:translate3d(.3%,-.4%,0) rotate(.16deg) scale(1.02)}100%{transform:translate3d(.45%,.3%,0) rotate(.26deg) scale(1.012)}}
.film__canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.film__dim{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none}
/* cinematic haze: two tiling fog layers (brand blue + indigo) sliding slowly across the black backdrop, over a low blue
   stage light. A mask keeps them to the edges and the floor, so the centre (the boiler) stays clean and the black stays black. */
.film__fog{position:absolute;inset:0;overflow:hidden;pointer-events:none;opacity:0;-webkit-mask-image:radial-gradient(ellipse 50% 56% at 50% 46%,transparent 46%,rgba(0,0,0,.45) 78%,#000 100%);mask-image:radial-gradient(ellipse 50% 56% at 50% 46%,transparent 46%,rgba(0,0,0,.45) 78%,#000 100%)}
.film__fog i{position:absolute;top:-10%;left:0;width:200%;height:120%;background:var(--fog-a) 0 0/50% 100% repeat-x;opacity:.62;animation:fogDrift 80s linear infinite;will-change:transform}
.film__fog i+i{top:-30%;height:160%;background-image:var(--fog-b);opacity:.5;animation-duration:125s;animation-direction:reverse}
.film__fog b{position:absolute;inset:0;background:radial-gradient(64% 36% at 50% 112%,rgba(28,112,235,.5),transparent 72%),radial-gradient(38% 56% at -8% 34%,rgba(52,42,190,.42),transparent 72%),radial-gradient(38% 56% at 108% 62%,rgba(21,99,181,.42),transparent 72%)}
@media(max-width:820px),(pointer:coarse){.film__fog i+i{animation:none}}
@keyframes fogDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.film__dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0;transition:opacity 1.2s}
.film.is-float .film__dust{opacity:1}

/* the scattered parts as live 3D objects: looping clips on black (screen-blended) laid over their own place in the frame;
   the one in focus is the same element flown to the front */
.film__parts{position:absolute;pointer-events:none}
.part{position:absolute;opacity:0;transform-origin:50% 50%;mix-blend-mode:screen;will-change:transform,opacity;transition:filter .5s var(--ease)}
@media(min-width:821px) and (hover:hover){.part.is-back{filter:blur(5px)}}
.part img,.part video{position:absolute;display:block;max-width:none}
.part img{left:50%;top:50%;transform:translate(-50%,-50%)}
.part video{inset:0;width:100%;height:100%;object-fit:contain;opacity:0}
.part.is-live video{opacity:1}
.part.is-live img{opacity:0}

/* opening logo */
.film__logo{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;pointer-events:none;background:radial-gradient(60% 46% at 50% 46%,rgba(24,84,190,.26),transparent 70%)}
.film__logo-mark{position:relative;width:min(440px,62vw);animation:logoIn 2.2s cubic-bezier(.16,1,.3,1) both}
.film__logo-mark img{width:100%;height:auto;display:block;filter:drop-shadow(0 0 28px rgba(143,188,245,.28))}
.film__logo-mark::after{content:"";position:absolute;inset:-40% -10%;background:radial-gradient(50% 50% at 50% 50%,rgba(143,188,245,.2),transparent 70%);z-index:-1;animation:glow 4.5s ease-in-out infinite alternate}
.film__logo-tag{margin:0;font-family:var(--mono);font-size:clamp(10px,1vw,13px);letter-spacing:.42em;text-transform:uppercase;color:var(--muted);text-align:center;padding:0 16px;animation:tagIn 2.2s var(--ease) .9s both}
.film__logo-line{width:150px;height:1px;background:rgba(255,255,255,.12);display:block;position:relative;overflow:hidden;transition:opacity .8s}
.film__logo-line b{position:absolute;inset:0;width:0;background:#fff;transition:width .25s}
.film.is-ready .film__logo-line{opacity:0}
@keyframes logoIn{0%{opacity:0;transform:scale(1.16);filter:blur(18px)}100%{opacity:1;transform:none;filter:blur(0)}}
@keyframes glow{0%{opacity:.45;transform:scale(.92)}100%{opacity:1;transform:scale(1.06)}}
@keyframes tagIn{0%{opacity:0;letter-spacing:.9em}100%{opacity:1;letter-spacing:.42em}}
.scroll-hint{position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:9;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--muted);font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;opacity:0;transition:opacity .6s;pointer-events:none}
.film.is-ready.is-hint .scroll-hint{opacity:1}
.scroll-hint span{width:22px;height:34px;border:1px solid rgba(255,255,255,.35);border-radius:12px;position:relative}
.scroll-hint span::after{content:"";position:absolute;left:50%;top:6px;width:2px;height:7px;margin-left:-1px;border-radius:2px;background:#fff;animation:wheel 1.6s infinite}
@keyframes wheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}

/* chapters (why Daler — the part in focus) */
.chapter{position:absolute;z-index:6;top:50%;width:min(400px,calc(100% - 2*var(--gutter)));opacity:0;visibility:hidden;transform:translate3d(0,-50%,0);will-change:opacity,transform}
.chapter--r{right:calc(var(--gutter) + 34px)}
.chapter--l{left:calc(var(--gutter) + 34px)}
.chapter__head{display:flex;align-items:center;gap:14px;color:var(--sky);margin-bottom:16px;font-weight:600}
.chapter__head span:first-child{color:#fff;opacity:.55}
.chapter__head::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line2),transparent)}
.chapter h2{font-size:clamp(30px,3.4vw,52px);margin-bottom:14px;text-shadow:0 6px 30px #000}
.chapter p{margin:0;color:#c9cfeb;font-size:15px;text-shadow:0 2px 16px #000}
.specs{margin:22px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.specs div{display:flex;flex-direction:column;gap:4px}
.specs dt{color:var(--muted);font-size:10px}
.specs dd{margin:0;color:#fff;font-family:var(--display);font-size:20px;font-weight:600;text-transform:none;letter-spacing:0;line-height:1.1}

/* finale */
.finale{position:absolute;inset:0;z-index:6;pointer-events:none;opacity:0;visibility:hidden}
.finale__copy{position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);max-width:min(520px,36%)}
.finale.is-on .finale__copy{pointer-events:auto}
.finale__copy h2{font-size:clamp(40px,5vw,84px);text-shadow:0 10px 40px rgba(0,0,0,.6)}
.finale__copy p{color:var(--muted);margin:18px 0 26px;max-width:420px;font-size:clamp(15px,1.25vw,18px)}
.finale__cta{display:flex;gap:12px;flex-wrap:wrap}
.finale__stats{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:22px;text-align:right}
.finale__stats li{display:flex;flex-direction:column;gap:2px}
.finale__stats b{font-family:var(--display);font-size:clamp(26px,2.6vw,40px);font-weight:600;line-height:1;color:#fff}
.finale__stats span{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* film chrome */
.film__bar{position:absolute;right:calc(var(--gutter) - 28px);top:50%;width:1px;height:160px;margin-top:-80px;background:rgba(255,255,255,.12);z-index:7;display:block;opacity:0;transition:opacity .5s}
.film.is-ready .film__bar{opacity:1}
.film__bar b{position:absolute;left:-1px;top:0;width:3px;height:100%;border-radius:2px;background:#fff;transform-origin:0 0;transform:scaleY(0)}
.film__skip{position:absolute;right:var(--gutter);bottom:max(22px,env(safe-area-inset-bottom));z-index:9;font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding:10px 0;opacity:.8;transition:opacity .5s,color .2s}
.film.is-end .film__skip{opacity:0;pointer-events:none}
.film__skip:hover{color:#fff}
.film__lang{position:absolute;right:var(--gutter);top:max(18px,env(safe-area-inset-top));z-index:9;opacity:0;transition:opacity .5s}
.film.is-ready .film__lang{opacity:.7}
.film.is-end .film__lang{opacity:0;pointer-events:none}

/* header + fab stay hidden while the film plays */
.top{transition:background .35s,box-shadow .35s,transform .6s var(--ease),opacity .4s}
body.film-on .top{transform:translateY(-110%);opacity:0;pointer-events:none}
body.film-in .fab{opacity:0;pointer-events:none}
.fab{transition:opacity .4s}

@media(max-width:820px),(max-aspect-ratio:9/10){
  .chapter,.chapter--l,.chapter--r{top:auto;left:16px;right:16px;bottom:max(26px,calc(16px + env(safe-area-inset-bottom)));width:auto;transform:none}
  .chapter h2{font-size:clamp(26px,7.6vw,34px);margin-bottom:10px}
  .chapter p{font-size:14px}
  .chapter__head{margin-bottom:10px}
  .specs{margin-top:14px;padding-top:12px;gap:8px}
  .specs dd{font-size:17px}
  .finale__copy{inset:0;transform:none;max-width:none;display:flex;flex-direction:column;padding:calc(88px + env(safe-area-inset-top)) 16px calc(26px + env(safe-area-inset-bottom))}
  .finale__copy .eyebrow{margin:0 0 8px;font-size:10px}
  .finale__copy h2{font-size:clamp(30px,9.4vw,46px)}
  .finale__copy p{margin:auto 0 14px;font-size:14px;max-width:none}
  .finale__cta .btn{flex:1;padding:14px 12px;font-size:14px}
  .finale::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.6) 0,transparent 26%,transparent 66%,rgba(0,0,0,.88) 86%)}
  .finale__stats{display:none}
  .film__bar{display:none}
  .film__skip{right:16px;bottom:auto;top:max(16px,env(safe-area-inset-top));padding:8px 0}
  .film__lang{display:none}
  .film__logo-tag{letter-spacing:.28em;line-height:1.9}
  @keyframes tagIn{0%{opacity:0;letter-spacing:.6em}100%{opacity:1;letter-spacing:.28em}}
}
@media(prefers-reduced-motion:reduce){
  .film__stage,.film__logo-mark,.film__logo-mark::after,.film__logo-tag,.film__fog i{animation:none}
}

/* ---------- the page below the film: brand blue ----------
   The film ends on black; the page under it dawns out of that black into the brand's indigo and blue. Pale haze lies
   across the seam (the film's fog carried over), two slow lights wander further down (desktops only — the sky is a
   still picture on phones, where big moving layers cost smoothness). Colours are re-pointed for blue. */
.rest{position:relative;isolation:isolate;
  --muted:#c3cef3;--sky:#bdd9ff;--line:rgba(255,255,255,.15);--line2:rgba(255,255,255,.42);--card:rgba(255,255,255,.075);
  background:linear-gradient(180deg,#000 0,#03041c 120px,#0b0d47 400px,#1a1a72 860px,#2a2383 24%,#1d4dad 50%,#2a2383 76%,#1a1866 100%)}
.rest__sky{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.rest__sky i{position:absolute;border-radius:50%}
.rest__sky i:nth-child(1){top:150px;left:50%;width:1700px;height:720px;margin-left:-850px;background:radial-gradient(50% 50% at 50% 50%,rgba(58,136,255,.4),rgba(21,99,181,.15) 48%,transparent 72%)}
.rest__sky i:nth-child(2){top:27%;left:38%;width:120vmax;height:120vmax;max-width:1900px;max-height:1900px;background:radial-gradient(closest-side,rgba(46,140,255,.36),transparent 72%)}
.rest__sky i:nth-child(3){top:60%;right:36%;width:120vmax;height:120vmax;max-width:1900px;max-height:1900px;background:radial-gradient(closest-side,rgba(128,96,255,.3),transparent 72%)}
.rest__sky b{position:absolute;top:0;left:0;width:200%;height:1000px;background:var(--fog-c) 0 0/50% 100% repeat-x;opacity:.42;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 34%,#000 56%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 34%,#000 56%,transparent 100%)}
@keyframes aurora{from{transform:translate3d(-7%,-5%,0) scale(1)}to{transform:translate3d(8%,6%,0) scale(1.14)}}
@media(min-width:1000px) and (hover:hover) and (prefers-reduced-motion:no-preference){
  .rest__sky i:nth-child(2){animation:aurora 28s ease-in-out infinite alternate;will-change:transform}
  .rest__sky i:nth-child(3){animation:aurora 36s ease-in-out infinite alternate-reverse;will-change:transform}
}
.rest .btn--primary{background:#fff;color:var(--deep);box-shadow:0 14px 34px rgba(4,6,48,.35)}
.rest .btn--primary:hover{box-shadow:0 18px 44px rgba(4,6,48,.5)}
.rest .btn--ghost{border-color:rgba(255,255,255,.5)}

/* ---------- numbers ---------- */
.numbers{padding:34px 0;border-bottom:1px solid var(--line)}
.numbers__row{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.num b{display:flex;align-items:baseline;gap:4px;font-family:var(--display);font-size:clamp(34px,3.6vw,54px);font-weight:600;line-height:1;color:#fff}
.num small{font-size:15px;color:var(--sky);font-family:var(--mono);letter-spacing:.04em}
.num > span{display:block;font-size:12px;color:var(--muted);margin-top:6px}
@media(max-width:900px){.numbers__row{grid-template-columns:repeat(3,1fr);gap:20px 12px}}
@media(max-width:520px){.numbers__row{grid-template-columns:repeat(2,1fr)}}

/* ---------- why ---------- */
.why__in{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:start}
.why__list{list-style:none;padding:0;margin:0}
.why__list li{display:grid;grid-template-columns:52px 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--line);font-size:16px;font-weight:600;align-items:center;line-height:1.35}
.why__list li:last-child{border-bottom:1px solid var(--line)}
.why__list b{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--sky);letter-spacing:.1em}
@media(max-width:900px){.why__in{grid-template-columns:1fr;gap:28px}.why__list li{font-size:15px;padding:14px 0}}

/* ---------- models ---------- */
.pickers{display:flex;flex-direction:column;gap:14px;align-items:flex-start;justify-self:end}
@media(max-width:900px){.pickers{justify-self:start}}
.vol{display:inline-flex;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid var(--line);max-width:100%;overflow:auto}
.vol button{border:0;background:transparent;color:var(--muted);font-weight:700;font-size:14px;padding:10px 18px;border-radius:999px;cursor:pointer;transition:.25s;white-space:nowrap}
.vol button.is-on{background:#fff;color:var(--deep)}
.swatches{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.swatches button{width:28px;height:28px;border-radius:50%;border:2px solid #1c1b70;box-shadow:0 0 0 1px rgba(255,255,255,.4);cursor:pointer;transition:transform .2s,box-shadow .2s;padding:0}
.swatches button.is-on{transform:scale(1.15);box-shadow:0 0 0 2px #fff}
.swatches .swatches__label{color:var(--muted);margin-left:4px}
/* two models: two wide cards, picture beside the text (stacked on narrower screens) */
.models__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:36px}
.model{position:relative;border-radius:var(--r);background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.04));border:1px solid var(--line);padding:26px;display:flex;gap:26px;transition:transform .35s var(--ease),border-color .35s}
.model__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:14px}
.model:hover{transform:translateY(-4px);border-color:var(--line2)}
.model--hot{border-color:var(--line2);box-shadow:0 30px 70px rgba(4,6,48,.4)}
.model__tag{position:absolute;top:18px;left:18px;z-index:1;font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22)}
.model--hot .model__tag{background:#fff;border-color:#fff;color:var(--deep)}
.model__pic{--ph:330px;flex:0 0 42%;min-height:340px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;background:radial-gradient(56% 58% at 50% 60%,rgba(170,205,255,.3),transparent 72%)}
.model__pic img{height:calc(var(--ph)*var(--k,1));width:auto;max-width:100%;object-fit:contain;filter:drop-shadow(0 30px 30px rgba(3,4,40,.6));transition:opacity .3s}
.model h3{font-size:30px}
.model__note{color:var(--muted);font-size:14px;margin:0}
.model__chips{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.model__chips li{font-family:var(--mono);font-size:11px;padding:6px 9px;border-radius:6px;border:1px solid var(--line);color:#eaf1ff;letter-spacing:.03em}
.model__price{display:flex;align-items:baseline;gap:10px;margin-top:auto;padding-top:8px;border-top:1px solid var(--line)}
.model__price b{font-family:var(--display);font-size:40px;line-height:1;font-weight:600}
.model__ask{font-size:18px!important;font-family:var(--body)!important;text-transform:none;font-weight:600!important;color:var(--sky)}
.model__price small{color:var(--muted);font-family:var(--mono);font-size:11px;letter-spacing:.06em}
.model__uzs{color:var(--muted);font-size:13px;margin:-8px 0 0}
.model .btn{margin-top:4px}
.note{color:var(--muted);font-size:11px;margin:22px 0 0;text-transform:none;letter-spacing:.02em}
@media(max-width:1100px){.model{flex-direction:column;gap:14px;padding:22px}.model__pic{--ph:270px;flex:none;min-height:0;height:290px}}
@media(max-width:700px){.models__grid{grid-template-columns:1fr}.model__pic{--ph:250px;height:270px}}

/* ---------- factory ---------- */
.stats{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:12px;justify-self:end;width:100%;max-width:440px}
@media(max-width:900px){.stats{justify-self:start;max-width:none}}
.stats li{padding:16px 18px;border-radius:var(--r-sm);background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:4px}
.stats b{font-family:var(--display);font-size:32px;line-height:1;color:#fff;font-weight:600}
.stats span{font-size:12px;color:var(--muted)}
.factory__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.factory__grid figure{margin:0;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:var(--card)}
.factory__grid img{width:100%;height:230px;object-fit:cover}
.factory__grid figcaption{padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.factory__grid figcaption b{font-size:15px}
.factory__grid figcaption span{color:var(--muted);font-size:13px}
.cert{margin-top:24px;display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center;padding:24px;border-radius:var(--r);background:var(--card);border:1px solid var(--line)}
.cert img{border-radius:10px;width:100%}
.cert h3{font-size:28px;margin-bottom:10px}
.cert p{color:var(--muted);margin:0 0 12px;font-size:15px}
.cert ul{margin:0;padding-left:18px;color:#dbe7ff;display:flex;flex-direction:column;gap:5px;text-transform:none;letter-spacing:.02em;font-size:12px}
@media(max-width:900px){.factory__grid{grid-template-columns:1fr}.factory__grid img{height:200px}.cert{grid-template-columns:1fr}.cert img{max-width:240px}}

/* ---------- band ---------- */
.band{padding:8px 0}
.band__in{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:clamp(28px,5vw,56px);border-radius:var(--r);background:linear-gradient(135deg,#fff 0%,#dfe9ff 100%);color:var(--deep);box-shadow:0 30px 80px rgba(4,6,48,.45)}
.band .h2{font-size:clamp(26px,3.4vw,42px)}
.band .sub{color:#4b4f8a}
.band__cta{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
.rest .band .btn--primary{background:var(--grad);color:#fff;box-shadow:0 12px 32px rgba(21,99,181,.35)}
.rest .band .btn--ghost{border-color:rgba(42,35,131,.35);background:transparent;color:var(--deep)}
.rest .band .btn--ghost:hover{border-color:var(--deep);background:rgba(42,35,131,.06)}
@media(max-width:900px){.band__in{flex-direction:column;align-items:flex-start}}

/* ---------- contact ---------- */
.contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.contact__list{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-direction:column;gap:18px}
.contact__list li{display:flex;flex-direction:column;gap:2px}
.contact__list span{color:var(--muted);margin-bottom:4px;font-size:10px}
.contact__list a{font-size:18px;font-weight:600;width:fit-content}
.contact__list a:hover{color:var(--sky)}
.form{padding:26px;border-radius:var(--r);background:var(--card);border:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.form label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.form input,.form select,.form textarea{width:100%;font:inherit;font-size:16px;color:#fff;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:12px 14px;outline:none;transition:border-color .2s;-webkit-appearance:none;appearance:none}
.form select{background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:36px}
.form input:focus,.form select:focus,.form textarea:focus{border-color:#fff;background:rgba(255,255,255,.13)}
.form select option{color:#111}
.form textarea{resize:vertical}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form__msg{margin:0;font-size:14px;min-height:1.2em;color:#9be0b0}
.form__msg.err{color:#ffb4b4}
@media(max-width:820px){.contact__grid{grid-template-columns:1fr;gap:32px}.form{padding:18px}}

/* ---------- footer ---------- */
.foot{border-top:1px solid var(--line);padding:48px 0 calc(40px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(6,7,36,.25),rgba(6,7,36,.8))}
.foot__in{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;color:var(--muted);font-size:14px}
.foot__logo{height:28px;width:auto;margin-bottom:14px}
.foot__nav{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.foot__nav a:hover{color:#fff}
.foot__copy{grid-column:1/-1;margin:8px 0 0;font-size:10px;display:flex;gap:10px;flex-wrap:wrap;text-transform:none;letter-spacing:.03em}
@media(max-width:700px){.foot__in{grid-template-columns:1fr}.foot{padding-bottom:calc(96px + env(safe-area-inset-bottom))}}

/* ---------- floating call button (mobile) ---------- */
.fab{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:55;width:54px;height:54px;border-radius:50%;display:none;align-items:center;justify-content:center;background:#fff;color:var(--deep);box-shadow:0 12px 30px rgba(4,6,48,.5)}
@media(max-width:900px){.fab{display:flex}}