:root{--bg:#0a0a0a;--fg:#fff;--mut:#9a9a9a;--line:#2e2e2e;--ease:cubic-bezier(.7,0,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:'Space Grotesk',system-ui,sans-serif;line-height:1.5;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{max-width:100%}
.mono{font-family:'Space Mono',monospace;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(20px,5vw,72px)}
header.top{position:fixed;top:16px;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(16px,3vw,40px);pointer-events:none}
.pill{pointer-events:auto;background:rgba(14,14,14,.92);border:1px solid #3a3a3a;border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.logo{display:flex;align-items:center;gap:10px;padding:8px 20px 8px 10px;font-weight:700;font-size:18px}
.logo img{width:30px;height:30px;border-radius:50%;background:#fff;padding:3px}
nav.pill{display:flex;gap:4px;padding:5px}
.navl{padding:9px 18px;border-radius:999px;font-size:15px;font-weight:500;transition:background .3s,color .3s}
.navl:hover{background:#fff;color:#000}.navl.cta{background:#fff;color:#000}.navl.cta:hover{background:#d8d8d8}
.hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:140px 0 80px;overflow:hidden}
.hero .ghost{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(120px,26vw,380px);font-weight:700;color:transparent;-webkit-text-stroke:1px #2a2a2a;line-height:1;white-space:nowrap;z-index:0;user-select:none}
.hero .wrap{position:relative;z-index:1}
h1{font-size:clamp(40px,7vw,96px);line-height:1;letter-spacing:-.035em;margin:18px 0 28px;font-weight:700}
.rise{display:block;overflow:hidden}.rise>span{display:block;transform:translateY(105%);animation:rise .9s var(--ease) forwards}
.rise:nth-child(2)>span{animation-delay:.12s}.rise:nth-child(3)>span{animation-delay:.24s}
@keyframes rise{to{transform:none}}
.lead{max-width:600px;font-size:clamp(17px,2vw,21px);color:#cfcfcf;margin:0 0 32px}
.btns{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;padding:17px 30px;border-radius:999px;border:2px solid #fff;font-weight:700;background:linear-gradient(#fff,#fff) no-repeat left/0% 100%;transition:background-size .45s var(--ease),color .45s}
.btn:hover{background-size:100% 100%;color:#000}
.btn.solid{background:#fff;color:#000}.btn.solid:hover{background:#d8d8d8}
.badge{position:absolute;right:clamp(16px,6vw,90px);bottom:70px;width:130px;height:130px;z-index:1}
.badge svg{animation:spin 14s linear infinite;width:100%;height:100%}@keyframes spin{to{transform:rotate(360deg)}}
.marq{overflow:hidden;border-block:1px solid var(--line);padding:18px 0;white-space:nowrap}
.marq .tr{display:inline-flex;gap:48px;animation:mq 38s linear infinite;padding-right:48px}
.marq.out .tr{animation-direction:reverse;animation-duration:55s}
.marq span{font-size:clamp(22px,3vw,38px);font-weight:700}
.marq.out span{color:transparent;-webkit-text-stroke:1px #888}
@keyframes mq{to{transform:translateX(-50%)}}
section.s{padding:clamp(70px,10vw,130px) 0}
.sl{color:var(--mut);margin:0 0 28px}
h2{font-size:clamp(34px,5vw,64px);letter-spacing:-.03em;line-height:1.02;margin:0 0 40px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.stat b{display:block;font-size:clamp(64px,9vw,128px);line-height:1;letter-spacing:-.04em}
.stat span{color:var(--mut)}
.row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:26px 0;border-top:1px solid #555;position:relative}
.rows .row:last-child{border-bottom:1px solid #555}
.row .n{width:70px;color:var(--mut)}
.row .t{flex:1;font-size:clamp(30px,5.4vw,76px);font-weight:700;letter-spacing:-.03em;line-height:1.2;display:inline-block;overflow:hidden;height:1.2em;position:relative}
.row .t i{display:block;font-style:normal;transition:transform .5s var(--ease)}
.row .t i+i{position:absolute;left:0;top:100%}
.row:hover .t i{transform:translateY(-100%)}
.row .tag{color:var(--mut)}
.row .arrow{font-size:28px;transition:transform .4s var(--ease)}.row:hover .arrow{transform:translate(6px,-6px)}
.prev{display:none}
@media (hover:hover) and (min-width:800px){
.prev{display:block;order:3;flex:0 0 100%;height:0;overflow:hidden;clip-path:inset(0 100% 0 0);transition:clip-path .6s var(--ease),height .6s var(--ease)}
.row:hover .prev,.row:focus-visible .prev{clip-path:inset(0);height:260px}
.prev .in{height:240px;margin-top:8px;display:flex;gap:20px;align-items:stretch}
.prev .vid{aspect-ratio:16/9;height:100%;background:#151515;border-radius:12px;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;color:var(--mut)}
.prev .vid.p{aspect-ratio:9/16;width:135px}
.prev iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.prev .side{align-self:flex-end;max-width:460px;color:#cfcfcf}
.prev .side b{display:inline-block;border:1px solid #fff;border-radius:999px;padding:8px 16px;margin-top:10px}
}
.srow{display:flex;flex-wrap:wrap;align-items:baseline;gap:16px;padding:24px 0;border-top:1px solid #555}
.srow .n{width:70px;color:var(--mut)}.srow .t{flex:1;font-size:clamp(26px,4vw,52px);font-weight:700;letter-spacing:-.025em}
.sinfo{flex:0 0 100%;padding-left:86px;color:#cfcfcf;max-width:900px}
@media (hover:hover) and (min-width:800px){.sinfo{max-height:0;overflow:hidden;transition:max-height .6s var(--ease)}.srow:hover .sinfo{max-height:220px}}
.sinfo a{text-decoration:underline;text-underline-offset:4px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}
.step{border:1px solid var(--line);border-radius:16px;padding:26px;transition:background .4s,color .4s}
.step:hover{background:#fff;color:#000}.step:hover p{color:#333}.step h3{margin:6px 0 8px;font-size:24px}.step p{margin:0;color:var(--mut)}
.about{display:grid;grid-template-columns:1fr 1.4fr;gap:50px;align-items:start}
.about img{width:100%;max-width:340px;border-radius:20px;filter:grayscale(1);display:block}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.chip{border:1px solid #444;border-radius:999px;padding:6px 14px;font-size:14px}
.form{display:grid;gap:18px;max-width:760px}
.form label{display:block;margin-bottom:6px;color:var(--mut);font-size:14px}
.form input,.form select,.form textarea{width:100%;background:#111;color:#fff;border:1px solid #444;border-radius:12px;padding:14px 16px;font:inherit}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid #fff;border-color:#fff}
.form textarea{min-height:140px}.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hp{position:absolute;left:-9999px;top:-9999px}
.cbig{font-size:clamp(70px,14.5vw,230px);font-weight:700;letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1px #444;white-space:nowrap;overflow:hidden;margin-top:70px;user-select:none}
footer{border-top:1px solid var(--line);padding:30px 0 50px;color:var(--mut);font-size:14px}
footer .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px}
.crumb{color:var(--mut);margin-bottom:20px;display:block}
.pagehero{padding:150px 0 50px}
.vwrap{aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#111;margin:10px 0 30px}.vwrap.p{aspect-ratio:9/16;max-width:380px}
.vwrap iframe{width:100%;height:100%;border:0}
.cols{display:grid;grid-template-columns:1.5fr 1fr;gap:50px}.cols ul{padding-left:20px;color:#cfcfcf}.cols li{margin-bottom:8px}
details{border-top:1px solid #555;padding:18px 0}details:last-of-type{border-bottom:1px solid #555}summary{cursor:pointer;font-size:20px;font-weight:700}details p{color:#cfcfcf;margin:10px 0 0;max-width:760px}
.rel{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}.rel a{border:1px solid var(--line);border-radius:14px;padding:22px;transition:background .3s,color .3s}.rel a:hover{background:#fff;color:#000}.rel small{display:block;color:var(--mut)}
@media(max-width:800px){.about,.cols,.two{grid-template-columns:1fr}.badge{display:none}.sinfo{padding-left:0}.row .n,.srow .n{width:auto}.row .tag{display:none}.navl{padding:8px 12px;font-size:14px}.navl.hide{display:none}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rise>span{transform:none}}
.vwrap.s{aspect-ratio:4/3;max-width:900px}
@media (hover:hover) and (min-width:800px){.prev .vid.s{aspect-ratio:4/3}}

.vgrid{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}.vgrid .vwrap{flex:1 1 380px;margin:10px 0}.vgrid .vwrap.p{flex:0 1 340px}.vwrap.q{aspect-ratio:1/1;max-width:560px}.vgrid .vwrap.q{flex:1 1 300px}@media (hover:hover) and (min-width:800px){.prev .vid.q{aspect-ratio:1/1}}

.vwrap video{width:100%;height:100%;display:block;background:#000;object-fit:contain}

/* custom video player */
.vwrap{position:relative}
.vwrap video{-webkit-touch-callout:none}
.pv-ui{position:absolute;inset:0;pointer-events:none;font-family:'Space Mono',ui-monospace,monospace}
.pv-ui button,.pv-ui input{pointer-events:auto}
.pv.pv-idle{cursor:none}
.pv-big{position:absolute;left:50%;top:50%;width:104px;height:104px;margin:-52px 0 0 -52px;border-radius:50%;border:1.5px solid #fff;background:rgba(0,0,0,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:700 13px/1 'Space Mono',monospace;letter-spacing:.14em;cursor:pointer;display:flex;align-items:center;justify-content:center}
.pv-big span{position:relative;padding-left:.14em}
.pv-ring{position:absolute;inset:-2px;border-radius:50%;border:1.5px solid #fff;pointer-events:none}
.pv-bar{position:absolute;left:14px;right:14px;bottom:14px;display:flex;align-items:center;gap:12px;padding:8px 16px;border-radius:999px;background:rgba(10,10,10,.72);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;font-size:11px;letter-spacing:.08em}
.pv-bar button{all:unset;cursor:pointer;color:#fff;font:700 11px/1 'Space Mono',monospace;letter-spacing:.12em;padding:6px 4px;display:inline-flex;align-items:center}
.pv-bar button:focus-visible,.pv-big:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:999px}
.pv-pp svg{width:18px;height:18px;fill:#fff;display:block}
.pv-time,.pv-dur{font-variant-numeric:tabular-nums;color:#cfcfcf;min-width:38px}
.pv-seek{--th:10px;--p:0%;-webkit-appearance:none;appearance:none;flex:1;min-width:0;height:22px;background:transparent;cursor:pointer;margin:0}
.pv-seek::-webkit-slider-runnable-track{height:2px;border-radius:2px;background:linear-gradient(to right,#fff var(--p),rgba(255,255,255,.28) var(--p))}
.pv-seek::-webkit-slider-thumb{-webkit-appearance:none;width:var(--th);height:var(--th);border-radius:50%;background:#fff;border:0;margin-top:calc((2px - var(--th))/2)}
.pv-seek::-moz-range-track{height:2px;border-radius:2px;background:rgba(255,255,255,.28)}
.pv-seek::-moz-range-progress{height:2px;border-radius:2px;background:#fff}
.pv-seek::-moz-range-thumb{width:var(--th);height:var(--th);border-radius:50%;background:#fff;border:0}
.pv-seek:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:4px}
.vwrap.pv:fullscreen{max-width:none;width:100%;height:100%;aspect-ratio:auto;border-radius:0;margin:0;background:#000}
.vwrap.pv:-webkit-full-screen{max-width:none;width:100%;height:100%;aspect-ratio:auto;border-radius:0;margin:0;background:#000}
@media (max-width:560px){.pv-bar{left:8px;right:8px;bottom:8px;gap:8px;padding:6px 12px}.pv-dur{display:none}.pv-big{width:84px;height:84px;margin:-42px 0 0 -42px}}

.pv-bar,.pv-bar button,.pv-bar input{pointer-events:auto}
.car{margin:10px 0 0;outline:0}.car-stage{overflow:hidden;padding:20px 0 24px;touch-action:pan-y}
.car-track{display:flex;align-items:center;gap:28px;width:max-content;will-change:transform;--h:min(62vh,560px)}
.cs{flex:none;width:min(86vw,calc(var(--h)*var(--r)));aspect-ratio:var(--r);border-radius:16px;overflow:hidden;background:#111;position:relative;cursor:pointer;display:block;border:1px solid var(--line)}
.cs.on{cursor:default}.cs iframe{width:100%;height:100%;border:0;display:block}
.cs .ph{position:absolute;inset:0;display:flex;align-items:flex-end;padding:18px;font-family:'Space Mono',monospace;font-size:12px;color:var(--mut);pointer-events:none}
.car-ui{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.car-cap{flex:1 1 260px;display:flex;flex-direction:column;gap:4px;min-height:64px}.car-cap b{font-size:22px;font-weight:500}.car-cap a{text-decoration:underline;color:#cfcfcf;width:max-content}.car-cap span{color:var(--mut)}
.car-count{font-family:'Space Mono',monospace;font-size:13px;color:var(--mut)}
.car-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:transparent;color:#fff;font-size:20px;cursor:pointer;transition:background .3s,color .3s}.car-btn:hover:not(:disabled){background:#fff;color:#000}.car-btn:disabled{opacity:.3;cursor:default}
.car-bar{height:2px;background:var(--line);margin-top:18px}.car-bar i{display:block;height:100%;background:#fff;transform-origin:left;transform:scaleX(.1)}
.cs.vwrap{margin:0;max-width:none}.cs:not(.on)>*{pointer-events:none}.cs.vwrap video{width:100%;height:100%}
.herobg{position:absolute;inset:0;overflow:hidden;z-index:0;container-type:size;background:#0a0a0a;opacity:0;transition:opacity 1.4s ease}.herobg.on{opacity:1}
.herobg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.herobg::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,10,10,.45),rgba(10,10,10,.7))}
.hero .ghost{opacity:.5}
