* { box-sizing: border-box; }
:root {
  --navy: #071522;
  --navy2: #0b2030;
  --orange: #ff642d;
  --gold: #ffb45e;
  --white: #f5f7fa;
  --muted: #a7b2bf;
}
html, body { margin: 0; min-height: 100%; }
body {
  min-height: 100vh; overflow-x: hidden; color: var(--white);
  background: radial-gradient(ellipse at 50% 42%, #12283a 0%, var(--navy) 55%, #030a11 100%);
  font-family: Inter, Arial, sans-serif; display: grid; place-items: center;
  position: relative;
}
#particles { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.ambient { position: fixed; width: 34rem; height: 34rem; border-radius: 50%; filter: blur(100px); opacity: .14; pointer-events: none; }
.ambient-one { background: var(--orange); top: -19rem; left: -10rem; animation: drift 12s ease-in-out infinite alternate; }
.ambient-two { background: #176b9d; right: -18rem; bottom: -22rem; animation: drift 15s ease-in-out infinite alternate-reverse; }
.coming-soon { width: min(100% - 36px, 1000px); min-height: 100vh; position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 42px 0 28px; text-align: center; }
.brand { display: flex; align-items: center; gap: 12px; margin-bottom: clamp(42px, 8vh, 76px); }
.brand img {  height: auto; object-fit: contain; }
.brand span { font-family: Orbitron, sans-serif; letter-spacing: .14em; font-size: 13px; color: #fff; }
.brand b { color: var(--orange); font-weight: 600; }
.eyebrow { display: flex; align-items: center; justify-content: center; gap: 10px; color: #b8c6d2; font-size: 11px; letter-spacing: .24em; font-weight: 600; margin: 0 0 23px; }
.pulse-dot { width: 7px; height: 7px; background: var(--orange); border-radius: 50%; box-shadow: 0 0 14px var(--orange); animation: pulse 1.7s infinite; }
h1 { margin: 0; font-family: Orbitron, sans-serif; font-size: clamp(2.40rem, 7vw, 5rem); line-height: 1.08; font-weight: 700; letter-spacing: -.015em; text-transform: uppercase; }
.line { display: block; opacity: 0; animation: rise .8s cubic-bezier(.2,.8,.2,1) forwards; }
.line:nth-child(1) { animation-delay: .15s; }
.line:nth-child(2) { animation-delay: .35s; }
.line:nth-child(3) { animation-delay: .55s; }
.accent { color: var(--orange); text-shadow: 0 0 32px #ff642d40; }
.description { max-width: 570px; margin: 25px auto 0; color: var(--muted); font-size: 16px; line-height: 1.85; font-weight: 400; }
.countdown { display: flex; align-items: center; gap: clamp(9px, 2.5vw, 22px); margin: 43px 0 30px; }
.time-card { min-width: clamp(62px, 12vw, 110px); padding: 16px 10px 13px; border: 1px solid #ffffff17; border-radius: 12px; background: linear-gradient(145deg, #ffffff0b, #ffffff03); box-shadow: inset 0 1px #ffffff08, 0 12px 35px #00000016; backdrop-filter: blur(8px); }
.time-card span { display: block; font-family: Orbitron, sans-serif; font-size: clamp(1.45rem, 4vw, 2.5rem); font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }
.time-card small {     display: block;
    color: #aebbc7;
    font-size: 11px;
    letter-spacing: .1em;
    margin-top: 8px;
    font-weight: 600; }
.countdown > i { font-style: normal; color: var(--orange); font-family: Orbitron, sans-serif; font-size: 24px; margin-top: -14px; animation: blink 1s steps(2) infinite; }
.launch { display: flex; align-items: center; gap: 13px; padding: 13px 20px; border: 1px solid #ffb45e30; border-radius: 10px; background: #ff9b3a0a; text-align: left; }
.launch-icon { color: var(--gold); font-size: 22px; filter: drop-shadow(0 0 8px #ffb45e70); }
.launch small { display: block; color: #a6b0bb; font-size: 8px; letter-spacing: .19em; margin-bottom: 5px; }
.launch strong { display: block; font-family: Orbitron, sans-serif; color: #f6d3a3; font-size: clamp(9px, 2.4vw, 12px); letter-spacing: .08em; }
.launch em { color: var(--orange); font-style: normal; padding: 0 5px; }
.bottom-line { display: flex; width: 100%; justify-content: space-between; color: #647483; font-size: 8px; letter-spacing: .2em; margin-top: auto; padding-top: 25px; }
.reveal { animation: fade-in .9s ease both; }
@keyframes rise { from { opacity: 0; transform: translateY(28px); filter: blur(5px); } to { opacity: 1; transform: translateY(0); filter: blur(0); } }
@keyframes fade-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes pulse { 50% { opacity: .4; box-shadow: 0 0 3px var(--orange); } }
@keyframes blink { 50% { opacity: .25; } }
@keyframes drift { to { transform: translate(50px, 40px) scale(1.1); } }
@media (max-width: 560px) {
  .coming-soon { padding: 30px 0 22px; }
  .brand { margin-bottom: 48px; }
  .brand img { }
  .brand span { font-size: 10px; }
  .eyebrow { font-size: 8px; letter-spacing: .15em; }
  .description { font-size: 12px; max-width: 340px; }
  .countdown { gap: 6px; margin: 34px 0 25px; }
  .time-card { min-width: 0; width: 20vw; padding: 14px 4px 12px; border-radius: 9px; }
  .time-card small { font-size: 7px; letter-spacing: .12em; }
  .countdown > i { font-size: 17px; }
  .launch { padding: 12px 13px; }
  .bottom-line { font-size: 7px; letter-spacing: .12em; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; } }