*{box-sizing:border-box}
:root{
  --navy:#030816;
  --navy2:#071225;
  --blue:#08b9ff;
  --blue2:#1678ff;
  --lime:#a8ed00;
  --text:#f7fbff;
  --muted:#9aa9bd;
}
html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--navy);color:var(--text)}
body{min-height:100vh;overflow:hidden;position:relative}
.grid{position:fixed;inset:0;opacity:.15;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black,transparent 90%);pointer-events:none}
.ambient{position:fixed;border-radius:50%;filter:blur(90px);pointer-events:none;opacity:.2}
.ambient-one{width:520px;height:520px;background:#0078ff;top:-260px;left:-120px}
.ambient-two{width:500px;height:500px;background:#8ee800;right:-230px;bottom:-280px;opacity:.11}
.navbar{height:92px;display:flex;align-items:center;padding:0 5vw;position:relative;z-index:5}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand img{width:148px;height:auto;display:block;filter:drop-shadow(0 8px 22px rgba(0,0,0,.35))}
.hero{min-height:calc(100vh - 142px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;position:relative;z-index:2;padding:20px 24px 70px}
.eyebrow{font-size:11px;letter-spacing:.28em;font-weight:700;color:#aab9cd;display:flex;align-items:center;gap:14px;margin-bottom:22px}
.eyebrow span{width:30px;height:1px;background:linear-gradient(90deg,var(--blue),var(--lime))}
h1{font-size:clamp(60px,9vw,124px);line-height:.92;letter-spacing:-.065em;margin:0;font-weight:800}
h1 em{font-style:normal;background:linear-gradient(100deg,#fff 15%,#9fefff 52%,#a8ed00 94%);-webkit-background-clip:text;background-clip:text;color:transparent}
.subcopy{color:var(--muted);font-size:clamp(15px,1.5vw,19px);line-height:1.75;margin:25px 0 42px}
.subcopy strong{color:#fff;font-weight:700}
.countdown{display:flex;align-items:center;justify-content:center;gap:12px}
.time-card{width:clamp(74px,9vw,124px);padding:18px 10px 14px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.025));box-shadow:0 20px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(14px)}
.time-card div{font-size:clamp(32px,4.2vw,55px);font-weight:800;letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.time-card span{display:block;margin-top:5px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:#7f90a7;font-weight:700}
.separator{font-size:34px;color:#53657c;transform:translateY(-5px)}
.progress-wrap{width:min(610px,82vw);margin-top:38px}
.progress-label{display:flex;justify-content:space-between;color:#6f8097;font-size:10px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:9px}
.progress{height:3px;background:rgba(255,255,255,.09);border-radius:100px;overflow:hidden}
.progress-bar{height:100%;width:0;background:linear-gradient(90deg,var(--blue),var(--lime));box-shadow:0 0 18px rgba(8,185,255,.5);animation:load 1.6s ease-out forwards}
@keyframes load{to{width:72%}}
.tagline{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#667890;margin-top:28px}
footer{position:fixed;bottom:24px;left:5vw;right:5vw;display:flex;justify-content:center;align-items:center;gap:12px;color:#52637a;font-size:10px;letter-spacing:.08em;z-index:5}
.dot{width:3px;height:3px;border-radius:50%;background:#7690aa}
@media(max-width:620px){
  .navbar{height:76px;padding:0 24px}
  .brand img{width:118px}
  .hero{min-height:calc(100vh - 120px);padding-bottom:60px}
  .eyebrow{font-size:9px;letter-spacing:.2em}
  .desktop-break{display:none}
  .countdown{gap:5px}
  .time-card{width:67px;padding:14px 5px 11px;border-radius:14px}
  .separator{font-size:22px}
  .time-card div{font-size:28px}
  .time-card span{font-size:7px}
  .tagline{font-size:8px;letter-spacing:.12em}
  footer{bottom:16px;font-size:8px}
}
@media(max-width:390px){
  .time-card{width:61px}
  .time-card div{font-size:25px}
  .separator{font-size:18px}
}