:root{--night:#061316;--panel:#0c2529;--panel2:#113238;--cream:#f1ecd9;--paper:#fff9e9;--mint:#35d79a;--red:#f0503b;--amber:#ffc14d;--cyan:#64c9e6;--brass:#caa15b;--muted:#9fb0ad;--line:rgba(156,205,194,.18);--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--cream);font:17px/1.55 var(--sans);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:linear-gradient(rgba(100,201,230,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(100,201,230,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 75%)}
a{color:inherit}
.wrap{width:min(1200px,calc(100% - 48px));margin:auto}
header,footer{display:flex;justify-content:space-between;align-items:center;padding:22px 0}
header{border-bottom:1px solid var(--line)}
header nav,footer nav{display:flex;gap:24px;align-items:center}
header nav a,footer a{color:var(--muted);text-decoration:none;font-size:14px}
header nav a:hover,footer a:hover{color:var(--mint)}
.brand{display:flex;gap:13px;align-items:center;text-decoration:none}
.brand b{font-size:22px;letter-spacing:-.03em}
.brand small{display:block;color:var(--mint);font:700 9px var(--mono);letter-spacing:.15em}
.points-mark{width:38px;height:38px;border:1px solid var(--line);border-radius:11px;position:relative;background:var(--panel)}
.points-mark:before,.points-mark:after{content:"";position:absolute;left:10px;right:8px;height:3px;border-radius:4px;background:var(--mint);transform-origin:left}
.points-mark:before{top:16px;transform:rotate(-25deg)}
.points-mark:after{top:20px;transform:rotate(25deg)}
.eyebrow{color:var(--mint);font:700 11px var(--mono);letter-spacing:.15em;text-transform:uppercase}
.hero{min-height:760px;display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center;padding:82px 0}
.hero-copy h1,.legal h1{font-size:clamp(52px,6.4vw,91px);line-height:.93;letter-spacing:-.065em;margin:16px 0 28px;max-width:760px}
.hero-copy>p:not(.eyebrow){font-size:21px;color:var(--muted);max-width:580px}
.actions{display:flex;gap:18px;align-items:center;margin-top:34px}
.button,#route{display:inline-flex;align-items:center;justify-content:center;min-height:54px;border:0;border-radius:14px;background:var(--mint);color:var(--night);font-weight:800;text-decoration:none;padding:14px 20px;box-shadow:0 12px 30px rgba(53,215,154,.18);transition:.2s transform,.2s box-shadow}
.button:hover,#route:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(53,215,154,.28)}
.actions span{font:12px var(--mono);color:var(--muted)}
.works-plate{position:relative;background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:28px;padding:36px;box-shadow:0 35px 80px rgba(0,0,0,.34);overflow:hidden}
.works-plate:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 5%,rgba(53,215,154,.15),transparent 36%)}
.works-plate>*{display:block;position:relative}
.works-plate small{font:700 10px var(--mono);letter-spacing:.12em;color:var(--brass)}
.works-plate>strong{font:700 clamp(58px,8vw,105px)/1 var(--mono);letter-spacing:-.07em;margin:20px 0;color:var(--paper)}
.works-plate>span{font:12px var(--mono);color:var(--muted)}
.works-plate dl{margin:34px 0 0;border-top:1px solid var(--line)}
.works-plate dl div{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}
.works-plate dt{color:var(--muted);font:10px var(--mono);letter-spacing:.12em}
.works-plate dd{font:700 12px var(--mono);margin:0}
.works-plate dd:before{content:"";display:inline-block;width:8px;height:8px;background:var(--amber);border-radius:50%;margin-right:8px;box-shadow:0 0 15px var(--amber)}
.yard{display:grid;grid-template-columns:.72fr 1.28fr;gap:70px;padding:110px 0;align-items:center}
.yard h2,.depth h2,.trust h2,.app-tour h2{font-size:clamp(38px,5vw,66px);line-height:1;letter-spacing:-.045em;margin:12px 0 22px}
.yard-copy>p:not(.eyebrow),.depth p,.trust p{color:var(--muted)}
.demo-status{font:12px var(--mono);border-left:3px solid var(--amber);padding:10px 14px;color:var(--cream)!important}
.tracks{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:26px;padding:24px;color:var(--paper);box-shadow:0 30px 65px rgba(0,0,0,.25);overflow:hidden}
.lane{display:grid;grid-template-columns:130px 1fr;min-height:96px;align-items:center;position:relative}
.lane b{font:700 9px var(--mono);letter-spacing:.06em;color:var(--muted)}
.lane b:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--lane,var(--cyan));margin-right:8px;box-shadow:0 0 14px var(--lane,var(--cyan))}
.ready{--lane:var(--mint)}
.test{--lane:var(--amber)}
.workshop{--lane:var(--red)}
.track{height:17px;border-top:2px solid #7b9290;border-bottom:2px solid #7b9290;background:repeating-linear-gradient(90deg,transparent 0 10px,#061316 11px 16px)}
.wagon{position:absolute;right:7%;background:var(--panel2);border:1px solid var(--lane,var(--cyan));border-left:5px solid var(--lane,var(--cyan));border-radius:8px;color:white;padding:10px 14px;font:700 11px var(--mono);font-style:normal;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.ready .target{opacity:0;transform:translateX(100px)}
.test .target-origin{opacity:1}
.tracks[data-routed=true] .ready .target{opacity:1;transform:none}
.tracks[data-routed=true] .test .target-origin{opacity:0;transform:translateX(-100px)}
.wagon,.target-origin{transition:.32s transform cubic-bezier(.2,.8,.2,1),.2s opacity}
.outcomes{background:var(--cream);color:var(--night);padding:105px 0}
.outcomes .eyebrow{color:#08744f}
.waybills{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.waybills article{background:var(--paper);padding:30px;border:1px solid rgba(6,19,22,.1);border-radius:20px}
.waybills b{font:700 10px var(--mono);color:#9c3527}
.waybills h2{font-size:27px;letter-spacing:-.025em}
.how{padding:105px 0}
.how ol{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;list-style:none;padding:0}
.how li{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:25px}
.how strong,.how span{display:block}
.how strong{font-size:24px;margin-bottom:8px}
.how span{color:var(--muted)}
.depth{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;padding:105px 0}
.depth ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.depth li{padding:16px 0;border-bottom:1px solid var(--line)}
.depth li:before{content:"→";color:var(--mint);margin-right:14px}
.app-tour{padding:7rem 0}
.tour-intro{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.7fr);column-gap:5rem;align-items:end}
.tour-intro .eyebrow,.tour-intro h2{grid-column:1}
.tour-intro>p:not(.eyebrow),.tour-intro .proof-link{grid-column:2}
.tour-intro>p:not(.eyebrow){grid-row:1 / span 2;color:var(--muted);align-self:end;margin:0 0 1.5rem}
.proof-link{display:inline-block;color:var(--mint);font:700 12px var(--mono)}
.gallery-signal{display:grid;grid-template-columns:auto auto 1fr auto;align-items:center;gap:14px;margin:4.5rem 0 1.5rem;color:var(--brass);font:700 11px var(--mono);letter-spacing:.14em}
.gallery-signal:after{content:"";grid-column:3;grid-row:1;height:12px;background:repeating-linear-gradient(90deg,transparent 0 13px,#02090a 13px 19px);border-top:2px solid #69807d;border-bottom:2px solid #69807d}
.gallery-signal span,.gallery-signal i{display:block;width:10px;height:10px;background:var(--mint);box-shadow:0 0 18px rgba(53,215,154,.55)}
.gallery-signal i{grid-column:4;grid-row:1;background:var(--red);box-shadow:0 0 18px rgba(240,80,59,.5)}
.gallery-signal.tablet span{background:var(--amber);box-shadow:0 0 18px rgba(255,193,77,.5)}
.phone-gallery{display:flex;gap:1.25rem;overflow-x:auto;padding:.5rem 0 2rem;scroll-snap-type:x mandatory;scrollbar-color:var(--mint) var(--panel);overscroll-behavior-inline:contain}
.phone-gallery figure{flex:0 0 clamp(230px,23vw,310px);margin:0;scroll-snap-align:start;background:var(--panel);border:1px solid var(--line);border-top:4px solid var(--mint);box-shadow:0 24px 55px rgba(0,0,0,.3)}
.phone-gallery figure:nth-child(3n+2){border-top-color:var(--amber)}
.phone-gallery figure:nth-child(3n){border-top-color:var(--red)}
.phone-gallery img,.ipad-gallery img{display:block;width:100%;height:auto}
.phone-gallery figcaption,.ipad-gallery figcaption{padding:1rem 1.1rem 1.15rem;border-top:1px solid var(--line)}
.phone-gallery figcaption b,.phone-gallery figcaption span,.ipad-gallery figcaption b,.ipad-gallery figcaption span{display:block}
.phone-gallery figcaption b,.ipad-gallery figcaption b{font:700 11px var(--mono);letter-spacing:.07em;color:var(--cream)}
.phone-gallery figcaption span,.ipad-gallery figcaption span{margin-top:.35rem;color:var(--muted);font-size:.82rem}
.ipad-gallery{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.ipad-gallery figure{margin:0;background:var(--panel);border:1px solid var(--line);border-left:5px solid var(--red);box-shadow:0 28px 65px rgba(0,0,0,.3)}
.ipad-gallery figure.wide{grid-column:1 / -1;border-left-color:var(--mint)}
.trust{display:grid;grid-template-columns:1fr 420px;gap:70px;padding:105px 0}
.ticket{background:linear-gradient(145deg,var(--panel2),var(--panel));border:1px solid var(--line);padding:30px;border-radius:24px;box-shadow:0 25px 55px rgba(0,0,0,.3)}
.ticket>*{display:block}
.ticket small{font:700 10px var(--mono);color:var(--brass)}
.ticket strong{font-size:27px;margin:10px 0}
.ticket span,.ticket p{color:var(--muted)}
.ticket li{margin:9px 0}
footer{border-top:1px solid var(--line);margin-top:35px}
footer>div span{display:block;color:var(--muted)}
.legal{max-width:840px;padding:75px 0}
.legal h1{font-size:58px}
.legal h2{margin-top:38px}
.legal p,.legal li{color:var(--muted)}
@media(max-width:850px){.hero,.yard,.depth,.trust{grid-template-columns:1fr;gap:45px}
.hero{min-height:auto}
.waybills,.how ol{grid-template-columns:1fr}
.tour-intro{grid-template-columns:1fr}
.tour-intro .eyebrow,.tour-intro h2,.tour-intro>p:not(.eyebrow),.tour-intro .proof-link{grid-column:1;grid-row:auto}
.ipad-gallery{grid-template-columns:1fr}
.ipad-gallery figure.wide{grid-column:auto}
}
@media(max-width:570px){.wrap{width:min(100% - 32px,1200px)}
header nav a:not(:last-child){display:none}
.brand small{display:none}
.hero{padding:55px 0}
.hero-copy h1{font-size:50px}
.actions{align-items:flex-start;flex-direction:column}
.works-plate{padding:24px}
.lane{grid-template-columns:100px 1fr}
.lane b{font-size:8px}
.wagon{right:2%;padding:8px}
.trust{grid-template-columns:1fr}
footer,footer nav{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.tracks[data-routed=true] .ready .target{opacity:1}
.tracks[data-routed=true] .test .target-origin{display:none}
}
