@font-face{font-family:Unbounded;src:url(/fonts/unbounded-latin-ext-wght-normal.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Unbounded;src:url(/fonts/unbounded-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Onest;src:url(/fonts/onest-latin-ext-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Onest;src:url(/fonts/onest-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
 --black:#000;--night:#03111a;--panel:#061924;--line:#123544;--line-soft:rgba(61,227,245,.14);
 --cyan:#3de3f5;--blue:#2f7bff;--chrome:#c3ccd2;--ink:#eaf4f7;--fog:#97aab4;
 --display:Unbounded,"Arial Black",system-ui,sans-serif;--body:Onest,system-ui,-apple-system,"Segoe UI",sans-serif;
 --wrap:1180px;--gutter:clamp(16px,4vw,40px);--r-lg:28px;--r-md:16px;
 color-scheme:dark
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--black);color:var(--ink);font:400 17px/1.65 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%;height:auto}
a{color:var(--cyan);text-underline-offset:3px}
a:hover{color:#8ff0fa}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--cyan);color:#001;padding:10px 14px;border-radius:10px;font-weight:600}
.skip:focus{top:12px}
.wrap{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto}
.narrow{width:min(100% - 2*var(--gutter),760px)}
.sec{padding-block:clamp(72px,11vw,140px)}
.h1,.h2{font-family:var(--display);font-weight:400;letter-spacing:-.02em;line-height:1.12;margin:0 0 .5em;text-wrap:balance}
.h1{font-size:clamp(30px,5vw,52px)}
.h2{font-size:clamp(26px,4.2vw,46px);max-width:20ch}
.lead{font-size:clamp(17px,1.9vw,20px);color:var(--fog);max-width:58ch;margin:0 0 2.2em}

/* header */
.bar{position:fixed;inset:0 0 auto;z-index:50;background:rgba(0,0,0,.62);backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid rgba(61,227,245,.08)}
.bar-in{width:min(100% - 2*var(--gutter),var(--wrap));margin-inline:auto;height:68px;display:flex;align-items:center;gap:24px}
.brand img{height:40px;width:auto;mix-blend-mode:screen}
.nav{margin-left:auto;display:flex;align-items:center;gap:28px}
.nav ul{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.nav a{color:var(--ink);text-decoration:none;font-size:15px;opacity:.86}
.nav a:hover{opacity:1;color:var(--cyan)}
.langs{display:flex;gap:2px;border:1px solid var(--line);border-radius:999px;padding:3px}
.langs a,.langs span{font:500 12px/1 var(--display);letter-spacing:.04em;padding:7px 10px;border-radius:999px}
.langs span{background:var(--cyan);color:#001}
.langs a{opacity:.8}
.menu-btn{display:none;margin-left:auto;width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer}
.menu-ico,.menu-ico::before,.menu-ico::after{display:block;width:18px;height:2px;background:currentColor;margin:auto;border-radius:2px;transition:transform .2s}
.menu-ico{position:relative}.menu-ico::before,.menu-ico::after{content:"";position:absolute;left:0}
.menu-ico::before{top:-6px}.menu-ico::after{top:6px}
.menu-btn[aria-expanded=true] .menu-ico{background:transparent}
.menu-btn[aria-expanded=true] .menu-ico::before{transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded=true] .menu-ico::after{transform:translateY(-6px) rotate(-45deg)}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:110px 0 70px;overflow:hidden;
 background:radial-gradient(80% 60% at 72% 40%,rgba(47,123,255,.16),transparent 70%),radial-gradient(50% 40% at 20% 85%,rgba(61,227,245,.08),transparent 70%),var(--black)}
.route{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.route path{fill:none;stroke-linecap:round}
.route-glow{stroke:rgba(61,227,245,.18);stroke-width:18;filter:blur(10px)}
.route-line{stroke:url(#rg);stroke-width:3.5;stroke-dasharray:1;stroke-dashoffset:0}
.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(24px,5vw,72px);align-items:center}
.hero-logo{margin:0 0 6px;margin-left:-3%}
.hero-logo img{width:min(100%,640px);mix-blend-mode:screen}
.slogan{font:300 clamp(24px,3.6vw,40px)/1.15 var(--display);letter-spacing:-.015em;margin:0 0 22px;color:var(--ink)}
.hero-lead{color:var(--fog);font-size:clamp(17px,1.7vw,19px);max-width:52ch;margin:0 0 22px}
.status{display:inline-flex;align-items:center;gap:10px;font-size:14px;color:var(--chrome);border:1px solid var(--line);border-radius:999px;padding:7px 14px 7px 12px;margin:0 0 30px;background:rgba(6,25,36,.6)}
.dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(61,227,245,.16)}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 24px;border-radius:999px;font:500 15px/1 var(--body);text-decoration:none;transition:background .2s,color .2s,border-color .2s}
.btn-main{background:var(--cyan);color:#00141a}
.btn-main:hover{background:#8ff0fa;color:#00141a}
.btn-ghost{border:1px solid rgba(61,227,245,.35);color:var(--ink)}
.btn-ghost:hover{border-color:var(--cyan);color:var(--cyan)}
.hero-phone{perspective:1400px;justify-self:center}
.phone{position:relative;width:min(340px,70vw);border-radius:44px;padding:9px;background:linear-gradient(160deg,#1b2b33,#05090c 40%,#0b1a22);
 box-shadow:0 0 0 1px rgba(61,227,245,.22),0 40px 90px -20px rgba(47,123,255,.45),0 0 60px -10px rgba(61,227,245,.25)}
.phone img{border-radius:36px;width:100%}
.hero-phone .phone{transform:rotateY(-14deg) rotateX(5deg) rotateZ(1deg);transform-style:preserve-3d}

/* modes */
.modes{background:linear-gradient(180deg,var(--black),var(--night) 30%,var(--night) 70%,var(--black))}
.tabs{display:inline-flex;gap:4px;padding:5px;border:1px solid var(--line);border-radius:999px;background:rgba(6,25,36,.7);margin-bottom:48px}
.tab{appearance:none;border:0;background:transparent;color:var(--fog);font:500 15px/1 var(--body);padding:13px 24px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.tab:hover{color:var(--ink)}
.tab[aria-selected=true]{background:var(--ink);color:#00141a}
.panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(32px,6vw,96px);align-items:center}
.panel[hidden]{display:none}
.panel h3,.goals h3{font:400 clamp(21px,2.4vw,28px)/1.2 var(--display);margin:0 0 24px;letter-spacing:-.01em}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:56ch}
.ticks li{position:relative;padding-left:34px;color:var(--chrome)}
.ticks li::before{content:"";position:absolute;left:0;top:.5em;width:18px;height:10px;border-left:2px solid var(--cyan);border-bottom:2px solid var(--cyan);border-bottom-left-radius:6px}
.note{margin:26px 0 0;font-size:15px;color:var(--fog);border-left:2px solid var(--blue);padding-left:14px}
.panel-media{margin:0;display:grid;justify-items:center;gap:14px}
.panel-media figcaption{font-size:13px;color:var(--fog);text-align:center;max-width:32ch}
.bike-art{width:min(340px,70vw);border-radius:40px;box-shadow:0 0 0 1px rgba(61,227,245,.2)}
.panel .phone{animation:none}

/* tech */
.tech-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(32px,6vw,96px);align-items:center}
.specs{margin:0;display:grid;gap:0;border-top:1px solid var(--line)}
.specs div{display:grid;grid-template-columns:minmax(150px,.8fr) 1.4fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}
.specs dt{font-weight:600;color:var(--ink)}
.specs dd{margin:0;color:var(--fog)}
.compare{--pos:50%;position:relative;width:min(380px,80vw);aspect-ratio:420/933;border-radius:40px;overflow:hidden;box-shadow:0 0 0 1px rgba(61,227,245,.22),0 40px 90px -30px rgba(47,123,255,.5);touch-action:pan-y}
.cmp-layer{position:absolute;inset:0}
.cmp-layer img{width:100%;height:100%;object-fit:cover}
.cmp-day{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.cmp-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--cyan);box-shadow:0 0 18px var(--cyan);pointer-events:none}
.cmp-handle::after{content:"";position:absolute;top:50%;left:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#001;border:2px solid var(--cyan)}
.cmp-range{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize}
.compare:has(.cmp-range:focus-visible) .cmp-handle::after{box-shadow:0 0 0 4px rgba(61,227,245,.45)}
.cmp-tag{position:absolute;top:16px;font:500 12px/1 var(--display);padding:8px 12px;border-radius:999px;background:rgba(0,0,0,.6);pointer-events:none}
.cmp-tag-day{left:16px}.cmp-tag-night{right:16px}

/* about */
.about-in{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.about p{color:var(--chrome);max-width:62ch}
.goals{border:1px solid var(--line);border-radius:var(--r-lg);padding:32px;background:linear-gradient(160deg,rgba(47,123,255,.08),rgba(6,25,36,.4))}
.goals ul{margin:0;padding:0;list-style:none;display:grid;gap:16px}
.goals li{padding-left:22px;position:relative;color:var(--chrome)}
.goals li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--cyan)}

/* founders */
.founders{background:linear-gradient(180deg,var(--black),var(--night) 50%,var(--black))}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,48px)}
.person{display:grid;gap:22px;align-content:start}
.portrait{display:block;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;position:relative;box-shadow:0 0 0 1px rgba(61,227,245,.18),0 30px 80px -30px rgba(47,123,255,.45)}
.portrait img{width:100%;height:100%;object-fit:cover}
.portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(0,0,0,.45));pointer-events:none}
.person h3{font:400 clamp(22px,2.6vw,30px)/1.15 var(--display);margin:0 0 6px;letter-spacing:-.01em}
.role{color:var(--cyan);margin:0 0 12px;font-weight:500}
.person p:last-child{color:var(--chrome);margin:0;max-width:52ch}

/* apps */
.apps-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center}
.stores{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(200px,1fr));gap:16px}
.store{display:grid;grid-template-columns:36px 1fr;grid-template-rows:auto auto auto;column-gap:14px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--r-md);background:rgba(6,25,36,.55)}
.store svg{grid-row:1/3;width:32px;height:32px;color:var(--ink);opacity:.9}
.store-name{font:500 17px/1.2 var(--display)}
.store-sub{font-size:14px;color:var(--fog)}
.soon{grid-column:1/-1;margin-top:16px;justify-self:start;font-size:13px;color:var(--cyan);border:1px solid rgba(61,227,245,.35);border-radius:999px;padding:5px 12px}

/* legal + contact */
.legal{padding-top:150px}
.legal h2{font:400 21px/1.3 var(--display);margin:2.2em 0 .6em;letter-spacing:-.01em}
.legal p{color:var(--chrome);max-width:68ch}
.updated{color:var(--fog);font-size:14px}
.contact-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:8px 28px 22px;background:rgba(6,25,36,.55);margin-top:24px}
.email a{font:400 clamp(20px,3vw,28px)/1.3 var(--display)}
.nf{min-height:70svh;padding-top:170px}

/* footer */
.foot{border-top:1px solid var(--line);padding:56px 0 30px;background:var(--black)}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
.foot-brand img{width:170px;mix-blend-mode:screen;margin-left:-10px}
.foot-brand p{color:var(--fog);margin:8px 0 0}
.foot h2{font:500 13px/1 var(--display);color:var(--fog);margin:6px 0 16px;letter-spacing:.02em}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.foot a{color:var(--chrome);text-decoration:none}
.foot a:hover{color:var(--cyan)}
.foot-small{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:44px;padding-top:22px;border-top:1px solid rgba(18,53,68,.6);font-size:13px;color:var(--fog)}
.foot-small a{color:var(--fog)}

/* language offer */
.lang-offer{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:60;width:min(100% - 32px,560px);display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:14px 16px;border-radius:var(--r-md);background:rgba(3,17,26,.94);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.6);font-size:15px}
.lang-offer[hidden]{display:none}
.lang-offer p{margin:0;flex:1 1 220px}
.lang-offer .btn{min-height:40px;padding:0 16px;font-size:14px}
.lang-offer button.btn{background:transparent;border:1px solid var(--line);color:var(--fog);cursor:pointer}

/* motion: one orchestrated moment – the route draws on load */
@media (prefers-reduced-motion:no-preference){
 .route-line{stroke-dashoffset:1;animation:draw 2.4s cubic-bezier(.6,.05,.25,1) .25s forwards}
 .route-glow{opacity:0;animation:glow 1.2s ease 2s forwards}
 .hero-phone .phone{animation:settle 1.6s cubic-bezier(.2,.7,.2,1) .1s both}
 @keyframes draw{to{stroke-dashoffset:0}}
 @keyframes glow{to{opacity:1}}
 @keyframes settle{from{opacity:0;transform:rotateY(-26deg) rotateX(10deg) translateY(30px)}}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* responsive */
@media (max-width:980px){
 .hero-in,.panel,.tech-in,.about-in,.apps-in{grid-template-columns:1fr}
 .hero{padding-top:100px}
 .hero-phone{margin-top:20px}
 .hero-phone .phone{transform:none}
 .panel-media{order:-1}
 .compare{justify-self:center}
}
@media (max-width:860px){
 .menu-btn{display:block}
 .nav{position:fixed;inset:68px 0 auto;flex-direction:column;align-items:stretch;gap:18px;padding:20px var(--gutter) 28px;background:rgba(0,0,0,.96);border-bottom:1px solid var(--line);display:none}
 .nav.open{display:flex}
 .nav ul{flex-direction:column;gap:0}
 .nav ul a{display:block;padding:14px 0;font-size:18px;border-bottom:1px solid rgba(18,53,68,.7)}
 .langs{align-self:flex-start}
}
@media (max-width:700px){
 body{font-size:16px}
 .stores{grid-template-columns:1fr}
 .foot-in{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}
 .specs div{grid-template-columns:1fr;gap:4px}
 .tabs{display:flex;width:100%}.tab{flex:1;padding:13px 10px}
 .hero-logo{margin-left:-4%}
}
@media (max-width:520px){.duo{grid-template-columns:1fr}}
@media (max-width:980px){.route{opacity:.35}.route-glow{display:none}}