:root{
  --bg:#0B0F14; --fg:#E5E7EB; --muted:#94A3B8; --accent:#00E5FF; --accent-soft: rgba(0,229,255,.16);
  --digit-w:80px; --digit-h:112px; --fs:92px;
}
html { scroll-behavior: smooth; }
body{
  background: radial-gradient(1200px 600px at 70% -10%, rgba(0,229,255,.08), transparent 60%),
              radial-gradient(800px 400px at 10% 20%, rgba(124,58,237,.10), transparent 60%),
              var(--bg);
  color: var(--fg);
  font-family: "Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}
.navbar{
  --bs-navbar-color: var(--fg);
  --bs-navbar-hover-color: var(--accent);
  --bs-navbar-brand-color: var(--fg);
  --bs-navbar-brand-hover-color: var(--accent);
  backdrop-filter: saturate(120%) blur(6px);
  background: linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.25));
}
.nav-link.active{ color: var(--accent) !important; }
.btn-accent{
  --bs-btn-bg: var(--accent);
  --bs-btn-border-color: var(--accent);
  --bs-btn-hover-bg: #0fd7ea;
  --bs-btn-hover-border-color: #0fd7ea;
  --bs-btn-color:#001015;
  --bs-btn-focus-shadow-rgb: 0,229,255;
}
section{ padding: 5rem 0; }
.card{ background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 1rem; }
.badge-soft{ background: var(--accent-soft); color: var(--accent); border: 1px solid rgba(0,229,255,.35); }
.reveal{ opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .7s ease; }
.reveal.show{ opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity: 1; transform:none; } html { scroll-behavior: auto; } }
.hero{ padding-top: 8rem; padding-bottom: 6rem; }
.glow{ text-shadow: 0 0 18px rgba(0,229,255,.45), 0 0 36px rgba(0,229,255,.25); }
.divider{ height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.15), transparent); }
footer{ color: var(--muted); border-top: 1px solid rgba(255,255,255,.08); background: linear-gradient(to top, rgba(0,0,0,.35), rgba(0,0,0,0)); }

/* Brand-Headings */
section h2, .card h3, .card h5{
  color: var(--fg);
  font-weight: 800;
  letter-spacing: .3px;
  text-shadow: 0 0 14px rgba(0,229,255,.22), 0 0 28px rgba(0,229,255,.12);
}
section h2{ position: relative; }
section h2::after{
  content:"";
  display:block;
  margin-top:.4rem;
  width:64px; height:2px;
  background: linear-gradient(90deg, var(--accent), transparent);
}

/* Flip Countdown */
.countdown-wrap { margin-top: 1rem; }
.flip-clock{ display:flex; flex-wrap:wrap; gap:.8rem; justify-content:flex-start; align-items:flex-start; }
.flip-unit{ background: rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.08); border-radius:.8rem; padding:.8rem; }
.flip-unit .digits{ display:flex; gap:.6rem; }
.flip-unit .label{ display:block; text-align:center; margin-top:.45rem; color:var(--muted); font-size:.85rem; }

.digit{ width:var(--digit-w); height:var(--digit-h); position:relative; perspective:900px; }
.digit .layer{ position:absolute; left:0; right:0; overflow:hidden; border-radius:.6rem; background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 6px 16px rgba(0,0,0,.25); }
.digit .base{ top:0; height:100%; z-index:1; }
.digit .base .half{ position:absolute; left:0; right:0; height:50%; }
.digit .base .half.top{ top:0; border-radius:.6rem .6rem 0 0; background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); }
.digit .base .half.bottom{ bottom:0; border-radius:0 0 .6rem .6rem; background:linear-gradient(0deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); }
.digit .top-flip{ top:0; height:50%; z-index:3; display:none; transform-origin:50% 100%; backface-visibility:hidden; }
.digit .bottom-flip{ bottom:0; height:50%; z-index:2; display:none; transform-origin:50% 0%; backface-visibility:hidden; }

.digit .text{ position:absolute; left:0; right:0; width:100%; height:var(--digit-h); line-height:var(--digit-h);
  display:flex; align-items:center; justify-content:center; text-align:center; color: var(--fg);
  font: 800 var(--fs)/var(--digit-h) "Space Grotesk", system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.digit .base .half.top  .text, .digit .top-flip .text{ transform: translateY(0); }
.digit .base .half.bottom .text, .digit .bottom-flip .text{ transform: translateY(-50%); }

@keyframes flipTop { 0% { transform: rotateX(0deg); } 100% { transform: rotateX(-90deg); } }
@keyframes flipBottom { 0% { transform: rotateX(90deg); } 100% { transform: rotateX(0deg); } }
.digit.flip-top .top-flip{ display:block; animation: flipTop .32s ease-in forwards; }
.digit.flip-bottom .bottom-flip{ display:block; animation: flipBottom .32s ease-out .04s forwards; }

.digit::after{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:linear-gradient(90deg, transparent, rgba(0,229,255,.35), transparent); transform:translateY(-.5px); }
.digit.flip-top   .base .half.top{    visibility:hidden; }
.digit.flip-bottom .base .half.bottom{ visibility:hidden; }

@media (max-width: 576px){
  :root{ --digit-w:64px; --digit-h:90px; --fs:76px; }
}