@font-face{font-family:"Cinzel Decorative";src:url("../fonts/cinzel-decorative.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Bodoni Moda";src:url("../fonts/bodoni-moda-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("../fonts/hanken-grotesk.woff2") format("woff2");font-weight:400 600;font-style:normal;font-display:swap}

:root{
  --bg:#04060C;
  --ink:#EAF0FA;
  --ink-2:#D5DEEE;
  --ink-3:#93A0B8;
  --ice:#BFDCFF;
  --accent:#4DA3FF;
  --line:rgba(160,196,255,.26);
  --glass:rgba(10,18,36,.55);
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--bg);color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Hanken Grotesk","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ---------- motion ---------- */
@keyframes gv-rise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes gv-fade{from{opacity:0}to{opacity:1}}
@keyframes gv-sheen{from{background-position:0% 0}to{background-position:-200% 0}}
@keyframes gv-kb{from{transform:translateX(var(--gv-x,-50%)) scale(1.09)}to{transform:translateX(var(--gv-x,-50%)) scale(1)}}
@keyframes gv-sway-a{from{transform:rotate(-16deg)}to{transform:rotate(4deg)}}
@keyframes gv-sway-b{from{transform:rotate(15deg)}to{transform:rotate(-5deg)}}
@keyframes gv-eq{from{transform:scaleY(.16)}to{transform:scaleY(1)}}
@keyframes gv-drift{from{background-position:40px 60px,120px 200px,10px 320px}to{background-position:-300px -460px,380px -180px,-170px -320px}}
.rise{animation:gv-rise 1.3s cubic-bezier(.16,.84,.24,1) both}
.fade{animation:gv-fade 2s ease both}
.d1{animation-delay:.3s}.d2{animation-delay:.5s}.d3{animation-delay:.75s}.d4{animation-delay:.95s}.d5{animation-delay:1.2s}

/* ---------- stage ---------- */
.stage{position:relative;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;overflow:hidden;background:var(--bg)}
.photo{position:absolute;inset:0;overflow:hidden}
.photo img{position:absolute;top:0;left:50%;height:100%;width:auto;max-width:none;filter:saturate(.92);transform:translateX(var(--gv-x,-50%));transform-origin:50% 28%;animation:gv-kb 26s ease-in-out infinite alternate;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 24%,#000 76%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 24%,#000 76%,transparent 100%)}
.tint{position:absolute;inset:0;background:#1E55B3;mix-blend-mode:color;opacity:.18}
.shade{position:absolute;inset:0;background:radial-gradient(60% 34% at 50% 82%,rgba(77,163,255,.26),transparent 70%),linear-gradient(180deg,rgba(4,6,12,.7) 0%,rgba(4,6,12,.1) 14%,rgba(4,6,12,.1) 30%,rgba(4,6,12,.66) 52%,rgba(4,6,12,.93) 74%,#04060C 100%)}
.beam{position:absolute;top:-6%;height:118%;width:70%;transform-origin:50% 0;filter:blur(24px);mix-blend-mode:screen;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 55%,transparent 96%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 55%,transparent 96%)}
.beam-a{left:-30%;background:conic-gradient(from 168deg at 50% 0%,transparent 0deg,rgba(77,163,255,.36) 12deg,transparent 24deg);animation:gv-sway-a 14s ease-in-out infinite alternate}
.beam-b{right:-30%;background:conic-gradient(from 170deg at 50% 0%,transparent 0deg,rgba(96,112,255,.34) 10deg,transparent 20deg);animation:gv-sway-b 18s ease-in-out infinite alternate}
.dust{position:absolute;inset:0;pointer-events:none;opacity:.45;background-image:radial-gradient(rgba(234,240,250,.55) 1px,transparent 1.6px),radial-gradient(rgba(125,184,255,.5) 1px,transparent 1.6px),radial-gradient(rgba(234,240,250,.35) 1.3px,transparent 2px);background-size:340px 520px,260px 380px,180px 640px;animation:gv-drift 70s linear infinite;-webkit-mask-image:radial-gradient(70% 62% at 50% 42%,#000,transparent);mask-image:radial-gradient(70% 62% at 50% 42%,#000,transparent)}

/* ---------- layout ---------- */
.wrap{position:relative;z-index:2;width:100%;max-width:1280px;margin:0 auto;padding-inline:clamp(20px,5.5vw,80px)}
.top{display:flex;justify-content:flex-end;padding-top:24px}
.lang{display:flex;align-items:center;gap:2px;padding:0 6px;border:1px solid var(--line);border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.lang button{min-width:44px;min-height:44px;background:transparent;border:0;color:#A9B5CB;font-size:13px;font-weight:600;letter-spacing:.14em;transition:color .3s}
.lang button[aria-pressed="true"]{color:var(--ink)}
.lang button:hover{color:#fff}

main.wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:clamp(14px,2.6vh,26px);padding-top:clamp(110px,26vh,360px);padding-bottom:clamp(24px,4vh,40px);text-align:center}

/* two languages share one cell, so switching never moves anything */
.swap{display:grid;justify-items:center}
.swap>*{grid-area:1/1}
.swap>.off{visibility:hidden}

.eyebrow{display:flex;align-items:center;gap:16px;font-size:13px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:var(--ice);text-shadow:0 2px 18px rgba(4,6,12,.95)}
.eyebrow .rule{flex:0 1 40px;width:40px;height:1px;background:var(--ice)}
.eyebrow .swap span{white-space:nowrap}

h1{margin:0;font-family:"Cinzel Decorative",Cinzel,"Trajan Pro",Georgia,serif;font-weight:400;font-size:clamp(30px,min(10vw,15.5vh),148px);line-height:1.1;letter-spacing:.04em;white-space:nowrap;background-image:linear-gradient(100deg,#EAF0FA 0%,#EAF0FA 34%,#7DB8FF 45%,#FFFFFF 50%,#7DB8FF 55%,#EAF0FA 66%,#EAF0FA 100%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:gv-sheen 8s linear infinite}

.wave{display:flex;align-items:center;justify-content:center;gap:5px;height:48px;max-width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 24%,#000 76%,transparent);mask-image:linear-gradient(90deg,transparent,#000 24%,#000 76%,transparent)}
.wave span{display:block;flex:none;width:3px;height:100%;border-radius:3px;background:linear-gradient(180deg,#EAF0FA,var(--accent));box-shadow:0 0 14px rgba(77,163,255,.55);animation:gv-eq 1.1s ease-in-out infinite alternate}
.wave span:nth-child(2n){animation-duration:1.5s;animation-delay:-.4s}
.wave span:nth-child(3n){animation-duration:.9s;animation-delay:-.7s}
.wave span:nth-child(5n){animation-duration:1.8s;animation-delay:-.2s}
.wave span:nth-child(7n){animation-duration:1.25s;animation-delay:-1.1s}

.soon{margin:0;text-wrap:balance;font-family:"Bodoni Moda",Didot,"Bodoni MT",Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(28px,3.4vw,46px);line-height:1.15;color:var(--ink)}

.social{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:4px}
.social a{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 24px;border:1px solid var(--line);border-radius:999px;background:var(--glass);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);color:var(--ink);text-decoration:none;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;transition:background-color .35s,color .35s,border-color .35s,transform .5s cubic-bezier(.2,.7,.1,1),box-shadow .5s}
.social a:hover{background:var(--ink);color:var(--bg);border-color:var(--ink);transform:translateY(-3px);box-shadow:0 18px 50px rgba(77,163,255,.45)}
.social svg{width:18px;height:18px;flex:none;fill:currentColor}

footer.wrap{padding-top:8px;padding-bottom:22px;text-align:center;font-size:13px;color:var(--ink-3)}

/* ---------- phones ---------- */
@media (max-width:760px){
  .photo img{height:640px;--gv-x:-41%;-webkit-mask-image:linear-gradient(180deg,#000 50%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 18%,#000 82%,transparent 100%);mask-image:linear-gradient(180deg,#000 50%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 18%,#000 82%,transparent 100%);-webkit-mask-composite:source-in;mask-composite:intersect}
  .shade{background:radial-gradient(70% 22% at 50% 60%,rgba(77,163,255,.22),transparent 70%),linear-gradient(180deg,rgba(4,6,12,.55) 0%,rgba(4,6,12,.05) 12%,rgba(4,6,12,.1) 36%,rgba(4,6,12,.72) 56%,#04060C 76%)}
  .beam{width:150%}
  .beam-a{left:-95%}
  .beam-b{right:-95%}
  .top{padding-top:14px}
  main.wrap{padding-top:300px;gap:18px;padding-bottom:24px}
  .eyebrow{font-size:12px;letter-spacing:.2em}
  .eyebrow .rule{display:none}
  h1{font-size:15.5vw;line-height:1.08}
  h1 span{display:block}
  .soon{font-size:min(30px,7.6vw)}
  .wave{height:40px}
  .social{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:400px}
  .social a{justify-content:center;padding:0 12px;letter-spacing:.12em}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}