:root {
  --navy: #031d2b;
  --teal: #0a5964;
  --orange: #f36b16;
  --gold: #d8a33f;
  --white: #ffffff;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #031d2b; font-family: Arial, Helvetica, sans-serif; color: var(--white); }
body { min-height: 100vh; }
.holding-page { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at 72% 18%, #17485a 0%, #082f40 32%, #031d2b 62%, #01131c 100%); }
.banner { display: block; width: 100%; height: auto; max-height: 78vh; object-fit: contain; background: transparent; }
.countdown-panel { width: min(980px, calc(100% - 32px)); margin: 18px auto 26px; text-align: center; }
.countdown-heading { margin-bottom: 14px; }
.eyebrow { display: block; color: var(--orange); font-weight: 800; letter-spacing: .22em; font-size: .75rem; }
h1 { margin: 6px 0 0; font-size: clamp(1.3rem, 2.5vw, 2rem); }
.countdown { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.time-box { border: 1px solid rgba(243, 107, 22, .75); border-radius: 14px; padding: 14px 8px 12px; background: rgba(0, 0, 0, .28); box-shadow: 0 0 20px rgba(243, 107, 22, .12); }
.time-box strong { display: block; font-size: clamp(1.8rem, 5vw, 3.4rem); line-height: 1; }
.time-box span { display: block; margin-top: 7px; color: #f5c07d; text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; font-weight: 700; }
.launch-note { margin: 14px 0 0; opacity: .85; letter-spacing: .08em; }
@media (max-width: 650px) {
  .holding-page { justify-content: flex-start; }
  .banner { max-height: none; }
  .countdown { grid-template-columns: repeat(2, 1fr); }
}
