:root{
  --white:#fff;
  --black:#000;
  --shell:min(1460px,calc(100vw - 72px));
  --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#fff}
body{
  margin:0;
  background:#fff;
  color:#000;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{display:block;max-width:100%}
.section-shell{width:var(--shell);margin-inline:auto}

.progress{
  position:fixed;left:0;top:0;width:100%;height:2px;background:rgba(0,0,0,.06);
  z-index:100;pointer-events:none
}
.progress span{display:block;width:0;height:100%;background:#000}

.topbar{
  width:var(--shell);margin:0 auto;height:96px;display:grid;
  grid-template-columns:1fr auto 1fr;align-items:center;position:relative;z-index:20
}
.identity{display:flex;align-items:center;gap:13px;width:max-content;font-size:13px;font-weight:750;letter-spacing:.24em}
.identity img{width:34px;height:34px;object-fit:contain}
.desktop-nav{display:flex;gap:40px;font-size:13px}
.desktop-nav a{position:relative}
.desktop-nav a:after{
  content:"";position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:#000;
  transition:right .35s var(--ease)
}
.desktop-nav a:hover:after{right:0}
.top-actions{justify-self:end;display:flex;align-items:center;gap:15px}
.lang-button{border:0;background:none;cursor:pointer;font-size:11px;padding:10px;letter-spacing:.12em}
.outline-button{
  border:1px solid #000;border-radius:999px;padding:13px 20px;font-size:12px;
  transition:background .3s,color .3s
}
.outline-button:hover{background:#000;color:#fff}

.hero{background:#fff;min-height:calc(100vh - 96px);position:relative;overflow:hidden}
.hero-grid{
  width:var(--shell);margin:0 auto;display:grid;grid-template-columns:1.02fr .98fr;
  gap:70px;align-items:center;min-height:calc(100vh - 150px);position:relative;z-index:2
}
.microline{display:flex;align-items:center;gap:10px;text-transform:uppercase;font-size:10px;letter-spacing:.18em}
.signal{width:7px;height:7px;border-radius:50%;background:#000;position:relative}
.signal:after{
  content:"";position:absolute;inset:-6px;border:1px solid rgba(0,0,0,.2);
  border-radius:50%;animation:signal 2s infinite
}
@keyframes signal{0%{transform:scale(.7);opacity:1}100%{transform:scale(1.8);opacity:0}}
.hero h1{
  margin:28px 0 30px;font-size:clamp(72px,8.4vw,150px);letter-spacing:-.075em;
  line-height:.82;font-weight:700;max-width:920px
}
.hero h1 span{display:block}
.hero h1 .outline{
  color:#fff;-webkit-text-stroke:1.5px #000;font-weight:700;margin-left:7vw
}
.hero-copy>p{font-size:17px;line-height:1.65;max-width:570px;margin:0;color:rgba(0,0,0,.68)}
.hero-actions{display:flex;align-items:center;gap:24px;margin-top:38px}
.solid-button{
  display:inline-flex;align-items:center;justify-content:center;background:#000;color:#fff;
  border-radius:999px;padding:15px 22px;font-size:12px;min-width:170px
}
.availability{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(0,0,0,.48)}

.live-object{height:min(70vh,720px);display:flex;align-items:center;justify-content:center}
.live-frame{
  width:min(650px,100%);aspect-ratio:1;position:relative;border:1px solid #000;background:#fff;
  overflow:hidden
}
.live-frame:before,.live-frame:after{
  content:"";position:absolute;z-index:0;background:rgba(0,0,0,.10)
}
.live-frame:before{left:50%;top:0;bottom:0;width:1px}
.live-frame:after{top:50%;left:0;right:0;height:1px}
.cross{position:absolute;width:18px;height:18px}
.cross:before,.cross:after{content:"";position:absolute;background:#000}
.cross:before{width:18px;height:1px;top:8px}
.cross:after{height:18px;width:1px;left:8px}
.cross-a{left:18px;top:18px}.cross-b{right:18px;bottom:18px}
.scan-line{
  position:absolute;left:0;right:0;top:0;height:1px;background:#000;opacity:.22;
  animation:scan 6s linear infinite
}
@keyframes scan{0%{transform:translateY(0)}100%{transform:translateY(650px)}}
.radar{
  position:absolute;left:50%;top:50%;border:1px solid rgba(0,0,0,.18);
  border-radius:50%;transform:translate(-50%,-50%)
}
.radar-1{width:28%;height:28%}.radar-2{width:58%;height:58%}.radar-3{width:86%;height:86%}
.core{
  position:absolute;left:50%;top:50%;width:112px;height:112px;border-radius:50%;
  transform:translate(-50%,-50%);background:#fff;border:1px solid #000;display:grid;place-items:center;z-index:3
}
.core img{width:78px}
.event{position:absolute;display:flex;align-items:center;gap:9px;font-size:10px;z-index:4}
.event i{width:9px;height:9px;background:#000;border-radius:50%;box-shadow:0 0 0 7px rgba(0,0,0,.06)}
.event div{display:flex;flex-direction:column}.event b{font-size:10px}.event span{font-size:9px;color:rgba(0,0,0,.55)}
.event-a{left:14%;top:31%}.event-b{left:22%;bottom:20%}.event-c{right:13%;top:28%}.event-d{right:18%;bottom:24%}
.coords{position:absolute;bottom:16px;left:18px;font-size:9px;letter-spacing:.12em}
.hero-word{
  position:absolute;left:-.025em;bottom:-.20em;font-size:22vw;line-height:.8;font-weight:800;
  letter-spacing:-.085em;color:rgba(0,0,0,.025);white-space:nowrap;pointer-events:none
}

.principle{padding:125px 0 140px;background:#fff}
.principle .section-shell{display:grid;grid-template-columns:140px 1fr;gap:50px}
.index{font-size:11px;padding-top:14px}
.super-statement{
  font-size:clamp(58px,6.5vw,116px);font-weight:650;line-height:.96;letter-spacing:-.065em;
  margin:0;max-width:1180px
}

.live-section{background:#000;color:#fff;padding:150px 0}
.live-head{display:grid;grid-template-columns:1.2fr .8fr;gap:100px;align-items:end;margin-bottom:100px}
.section-tag{font-size:10px;letter-spacing:.18em;text-transform:uppercase;display:block;margin-bottom:30px}
.live-head h2,.experience-head h2,.trust-copy h2{
  margin:0;font-size:clamp(58px,6vw,110px);line-height:.9;letter-spacing:-.065em;font-weight:650
}
.live-head>p{font-size:16px;line-height:1.7;color:rgba(255,255,255,.62);margin:0 0 5px;max-width:540px}

.world-board{height:720px;border:1px solid rgba(255,255,255,.38);position:relative;overflow:hidden}
.board-grid{
  position:absolute;inset:0;background-image:
  linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);
  background-size:64px 64px
}
.routes{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:rgba(255,255,255,.38);stroke-width:1}
.city{position:absolute;display:grid;grid-template-columns:12px auto auto;align-items:center;gap:9px;font-size:10px}
.city i{width:8px;height:8px;background:#fff;border-radius:50%;box-shadow:0 0 0 9px rgba(255,255,255,.06)}
.city b{font-size:11px}.city span{font-size:9px;color:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.25);padding:3px 6px;border-radius:999px}
.city-1{left:19%;top:58%}.city-2{left:18%;top:24%}.city-3{left:47%;top:37%}.city-4{right:18%;top:25%}.city-5{right:23%;bottom:18%}
.board-label{position:absolute;font-size:9px;letter-spacing:.18em;color:rgba(255,255,255,.55)}
.board-top{left:20px;top:18px}.board-bottom{right:20px;bottom:18px}

.experience{background:#fff;padding:160px 0 180px}
.dark-tag{color:rgba(0,0,0,.55)}
.experience-head h2{max-width:1150px}
.device-gallery{margin-top:105px;display:flex;flex-direction:column;gap:145px}
.device-card{
  min-height:680px;display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;
  border-top:1px solid #000;padding-top:70px
}
.device-card.reverse{grid-template-columns:1.25fr .75fr}
.device-card.reverse .device-copy{order:2}
.device-card.reverse .phone{order:1}
.device-copy{max-width:500px}
.device-copy>span{font-size:10px;letter-spacing:.18em}
.device-copy h3{font-size:clamp(54px,5vw,88px);letter-spacing:-.06em;margin:28px 0 18px}
.device-copy p{font-size:16px;line-height:1.7;color:rgba(0,0,0,.62);max-width:440px}

.phone{
  justify-self:center;width:340px;height:700px;background:#fff;border:1px solid #000;
  border-radius:44px;padding:18px;box-shadow:22px 25px 0 #000;overflow:hidden
}
.phone-status{height:30px;padding:0 9px;display:flex;justify-content:space-between;font-size:9px}
.phone-head{font-size:36px;font-weight:650;letter-spacing:-.04em;padding:20px 8px}
.mini-map{height:480px;border:1px solid #000;position:relative;overflow:hidden;background:#fff}
.road{position:absolute;height:1px;background:#000;transform-origin:left}
.r1{width:500px;left:-60px;top:180px;transform:rotate(31deg)}
.r2{width:440px;left:15px;top:330px;transform:rotate(-36deg)}
.r3{width:520px;left:70px;top:-10px;transform:rotate(77deg)}
.map-pin{position:absolute;width:18px;height:18px;border:5px solid #000;border-radius:50%;background:#fff}
.p1{left:64px;top:128px}.p2{right:64px;top:260px}.p3{left:155px;bottom:105px}
.map-count{position:absolute;left:18px;right:18px;bottom:18px;background:#000;color:#fff;padding:14px 16px;display:flex;align-items:center;justify-content:space-between}
.map-count b{font-size:28px}.map-count span{font-size:9px;letter-spacing:.12em;text-transform:uppercase}
.chips{display:flex;gap:7px;margin-top:13px}.chips span{border:1px solid #000;border-radius:999px;padding:7px 9px;font-size:9px}

.plan-phone{box-shadow:-22px 25px 0 #000}
.plan-visual{height:320px;background:#000;color:#fff;position:relative;overflow:hidden}
.plan-visual>span{position:absolute;z-index:2;left:15px;top:15px;font-size:9px;letter-spacing:.12em}
.sun{width:320px;height:320px;border-radius:50%;border:1px solid #fff;position:absolute;left:55px;top:95px;box-shadow:0 0 0 45px rgba(255,255,255,.06),0 0 0 90px rgba(255,255,255,.035)}
.plan-info{padding:20px 8px}
.plan-info small{font-size:9px;letter-spacing:.16em}
.plan-info h4{font-size:35px;letter-spacing:-.045em;margin:10px 0 8px}
.plan-info p{font-size:12px;color:rgba(0,0,0,.58)}
.attendees{display:flex;align-items:center;margin:24px 0}
.attendees i{width:26px;height:26px;border-radius:50%;background:#000;border:2px solid #fff;margin-right:-7px}
.attendees span{font-size:9px;margin-left:14px}
.plan-info button{width:100%;border:1px solid #000;background:#000;color:#fff;border-radius:999px;padding:14px}

.check-phone{box-shadow:22px 25px 0 #000}
.check-content{text-align:center;padding-top:105px}
.qr-grid{
  width:190px;height:190px;margin:0 auto 50px;border:1px solid #000;padding:17px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px
}
.qr-grid i{background:#000}.qr-grid i:nth-child(2),.qr-grid i:nth-child(6),.qr-grid i:nth-child(8){background:#fff;border:1px solid #000}
.check-content h4{font-size:36px;margin:0 0 8px;letter-spacing:-.04em}
.check-content p{font-size:12px;color:rgba(0,0,0,.55)}
.checkmark{width:58px;height:58px;border-radius:50%;background:#000;color:#fff;display:grid;place-items:center;margin:35px auto;font-size:22px}

.trust-section{background:#000;color:#fff;padding:150px 0}
.trust-layout{display:grid;grid-template-columns:1fr 1fr;min-height:850px;align-items:center;gap:110px}
.trust-copy>p{font-size:16px;line-height:1.7;color:rgba(255,255,255,.6);max-width:560px}
.trust-list{margin-top:60px;border-top:1px solid rgba(255,255,255,.3)}
.trust-list div{display:grid;grid-template-columns:60px 1fr;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.3)}
.trust-list span{font-size:9px;color:rgba(255,255,255,.5)}.trust-list b{font-size:13px;font-weight:500}
.trust-visual{position:relative;aspect-ratio:1;display:grid;place-items:center}
.trust-orbit{position:absolute;border:1px solid rgba(255,255,255,.25);border-radius:50%}
.orbit-1{width:88%;height:88%}.orbit-2{width:62%;height:62%}.orbit-3{width:36%;height:36%}
.trust-center{width:145px;height:145px;border-radius:50%;background:#fff;display:grid;place-items:center;z-index:2}
.trust-center img{width:95px}
.trust-label{position:absolute;font-size:9px;letter-spacing:.18em;color:rgba(255,255,255,.6)}
.label-1{top:7%;left:46%}.label-2{right:2%;top:49%}.label-3{bottom:8%;left:45%}.label-4{left:1%;top:49%}

.manifesto{background:#fff;padding:190px 0}
.manifesto .section-shell{text-align:center}
.manifesto-mark{width:78px;margin:0 auto 55px}
.manifesto p{font-size:clamp(56px,6.3vw,112px);line-height:.94;letter-spacing:-.065em;font-weight:650;margin:0 auto;max-width:1300px}

.launch{background:#fff;padding-bottom:80px}
.launch-panel{background:#000;color:#fff;min-height:700px;padding:58px;display:flex;flex-direction:column;justify-content:space-between}
.launch-top,.launch-bottom{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}
.launch-top>span{font-size:9px;letter-spacing:.15em;color:rgba(255,255,255,.6)}
.launch-brand{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:.22em}
.launch-brand img{width:42px;filter:invert(1)}
.launch-panel h2{font-size:clamp(68px,8.1vw,145px);line-height:.86;letter-spacing:-.07em;margin:80px 0;max-width:1180px}
.launch-bottom p{font-size:15px;color:rgba(255,255,255,.65)}
.white-button{background:#fff;color:#000;border-radius:999px;padding:15px 24px;font-size:12px}

.footer{
  background:#fff;padding:35px 0 60px;display:flex;justify-content:space-between;
  border-top:1px solid #000;font-size:10px;letter-spacing:.08em
}

.reveal{opacity:0;transform:translateY(32px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.magnetic{will-change:transform}

@media(max-width:1000px){
  :root{--shell:min(100% - 38px,1460px)}
  .topbar{grid-template-columns:1fr 1fr}.desktop-nav{display:none}
  .hero-grid{grid-template-columns:1fr;padding:8vh 0 100px;gap:60px}
  .hero{min-height:auto}.hero h1{font-size:clamp(70px,14vw,130px)}.hero h1 .outline{margin-left:0}
  .live-object{height:auto}.live-frame{max-width:680px}
  .principle .section-shell{grid-template-columns:1fr}.index{padding:0}
  .live-head{grid-template-columns:1fr;gap:35px}
  .device-card,.device-card.reverse{grid-template-columns:1fr;gap:60px}.device-card.reverse .device-copy{order:1}.device-card.reverse .phone{order:2}
  .device-copy{max-width:680px}.phone,.plan-phone,.check-phone{box-shadow:14px 16px 0 #000}
  .trust-layout{grid-template-columns:1fr;gap:80px;padding:80px 0}.trust-visual{max-width:700px;width:100%;margin:auto}
}

@media(max-width:620px){
  :root{--shell:min(100% - 28px,1460px)}
  .topbar{height:76px}.identity span{font-size:10px}.identity img{width:27px}
  .outline-button{display:none}.top-actions{gap:3px}
  .hero-grid{padding-top:7vh}.hero h1{font-size:17vw;line-height:.88}.hero h1 .outline{-webkit-text-stroke:.8px #000}
  .hero-copy>p{font-size:14px}.hero-actions{align-items:flex-start;flex-direction:column}
  .live-frame{width:100%}.event-c,.event-d{display:none}.core{width:90px;height:90px}.core img{width:60px}
  .principle,.experience,.manifesto{padding:110px 0}.super-statement{font-size:13vw}
  .live-section,.trust-section{padding:100px 0}.live-head h2,.experience-head h2,.trust-copy h2{font-size:13vw}
  .world-board{height:520px}.city-3,.city-4{display:none}
  .device-gallery{margin-top:80px;gap:110px}.device-card{min-height:auto;padding-top:45px}.device-copy h3{font-size:13vw}
  .phone{width:285px;height:590px;border-radius:38px;padding:15px}.mini-map{height:390px}.plan-visual{height:265px}.check-content{padding-top:70px}.qr-grid{width:160px;height:160px}
  .trust-layout{min-height:auto}.trust-visual{margin-top:20px}
  .manifesto p{font-size:13vw}
  .launch-panel{min-height:590px;padding:30px}.launch-panel h2{font-size:18vw}.launch-bottom{align-items:flex-end;gap:20px}.launch-bottom p{max-width:180px}
  .footer{flex-direction:column;gap:12px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}

.verification-label{
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin:0 auto 16px;
  color:rgba(0,0,0,.5);
}
.phone, .live-frame, .world-board, .launch-panel{
  transform:translateZ(0);
}
@media(max-width:620px){
  .hero-grid{padding-top:4.5vh}
  .hero h1{font-size:16vw;line-height:.9}
  .hero-actions{margin-top:28px}
  .solid-button{width:100%;max-width:240px}
  .principle{padding:88px 0 100px}
  .super-statement{font-size:12.5vw;line-height:.98}
  .live-section{padding:88px 0}
  .world-board{height:430px}
  .experience{padding:90px 0 110px}
  .device-gallery{gap:90px}
  .device-card{gap:42px}
  .device-copy p{font-size:14px}
  .trust-section{padding:88px 0}
  .manifesto{padding:100px 0}
  .manifesto p{font-size:12vw;line-height:.98}
  .launch-panel{min-height:520px}
  .launch-panel h2{font-size:16vw;line-height:.9}
  .launch-bottom{flex-direction:column;align-items:flex-start}
  .white-button{margin-top:12px}
}
