:root { color-scheme: dark; }
html, body { background:#0A1420; overflow-x:hidden; }
body { font-family:'Inter',system-ui,sans-serif; color:#E9F0F6; -webkit-font-smoothing:antialiased; }
::selection { background:#34D6C4; color:#06121d; }

/* Scrollbar */
::-webkit-scrollbar { width:11px; }
::-webkit-scrollbar-track { background:#0A1420; }
::-webkit-scrollbar-thumb { background:#1E3953; border-radius:99px; border:3px solid #0A1420; }
::-webkit-scrollbar-thumb:hover { background:#2E6E9E; }

.font-display { font-family:'Space Grotesk',sans-serif; }

/* Gradient text */
.text-grad { background:linear-gradient(100deg,#67E8D8 0%,#4C97C9 55%,#C08F62 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* Aurora / glow blobs */
.glow { position:absolute; border-radius:9999px; filter:blur(90px); opacity:.55; pointer-events:none; }

/* Scroll reveal */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); will-change:transform,opacity; }
.reveal.is-visible { opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.08s } .reveal[data-delay="2"]{ transition-delay:.16s }
.reveal[data-delay="3"]{ transition-delay:.24s } .reveal[data-delay="4"]{ transition-delay:.32s }
.reveal[data-delay="5"]{ transition-delay:.40s }

/* Card hover sheen */
.card { position:relative; transition:transform .35s cubic-bezier(.22,1,.36,1), border-color .35s, box-shadow .35s; }
.card:hover { transform:translateY(-6px); border-color:rgba(52,214,196,.5); box-shadow:0 24px 60px -24px rgba(52,214,196,.35); }

/* Animations */
@keyframes floaty { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-16px) } }
@keyframes floaty-sm { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-9px) } }
@keyframes bob { 0%,100%{ transform:translateY(0) rotate(-1.2deg) } 50%{ transform:translateY(-12px) rotate(1.2deg) } }
@keyframes blink { 0%,92%,100%{ transform:scaleY(1) } 96%{ transform:scaleY(.1) } }
@keyframes wave { 0%{ transform:translateX(0) } 100%{ transform:translateX(-50%) } }
@keyframes ripple { 0%{ transform:scale(.6); opacity:.5 } 100%{ transform:scale(1.8); opacity:0 } }
@keyframes shimmer { 0%{ background-position:200% 0 } 100%{ background-position:-200% 0 } }
@keyframes pulse-ring { 0%{ box-shadow:0 0 0 0 rgba(52,214,196,.45) } 70%{ box-shadow:0 0 0 14px rgba(52,214,196,0) } 100%{ box-shadow:0 0 0 0 rgba(52,214,196,0) } }
@keyframes spin-slow { to{ transform:rotate(360deg) } }
@keyframes marquee { from{ transform:translateX(0) } to{ transform:translateX(-25%) } }

.anim-floaty { animation:floaty 6s ease-in-out infinite }
.anim-floaty-sm { animation:floaty-sm 5s ease-in-out infinite }
.anim-bob { animation:bob 5.5s ease-in-out infinite; transform-origin:50% 60% }
.anim-blink { animation:blink 5s ease-in-out infinite; transform-origin:center }
.anim-spin-slow { animation:spin-slow 26s linear infinite }
.pulse-ring { animation:pulse-ring 2.4s ease-out infinite }

.marquee-track { display:flex; width:max-content; animation:marquee 32s linear infinite; will-change:transform; }
.marquee-item { padding:0 2rem; white-space:nowrap; font-family:'Space Grotesk',sans-serif; font-weight:600; font-size:1.125rem; color:#9FB3C4; opacity:.7; }
.marquee-sep { padding:0 0.5rem; white-space:nowrap; font-size:1.125rem; color:#34D6C4; }
.marquee:hover .marquee-track { animation-play-state:paused; }

.ripple-dot { position:absolute; border:2px solid rgba(52,214,196,.6); border-radius:9999px; animation:ripple 3.4s ease-out infinite; }

/* Grid backdrop */
.grid-bg {
  background-image:linear-gradient(rgba(76,151,201,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(76,151,201,.07) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(ellipse 100% 90% at 50% 0%,#000 55%,transparent 92%);
  mask-image:radial-gradient(ellipse 100% 90% at 50% 0%,#000 55%,transparent 92%);
}

.glass { background:rgba(15,30,48,.55); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }

.link-underline { position:relative; }
.link-underline::after { content:''; position:absolute; left:0; bottom:-4px; height:2px; width:0; background:#34D6C4; transition:width .3s ease; }
.link-underline:hover::after { width:100% }

.btn-glow { box-shadow:0 10px 30px -8px rgba(52,214,196,.5); }
.btn-glow:hover { box-shadow:0 14px 40px -8px rgba(52,214,196,.7); }

/* Alternating section background */
.section-alt { background-color:#0D1929; }
.section-alt::before {
  content:'';
  position:absolute;
  inset-x:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(52,214,196,.3) 30%,rgba(76,151,201,.45) 50%,rgba(52,214,196,.3) 70%,transparent 100%);
  pointer-events:none;
}

/* nav state */
#nav.scrolled { background:rgba(8,18,29,.78); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-color:rgba(76,151,201,.18); box-shadow:0 10px 40px -20px rgba(0,0,0,.8); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1 !important; transform:none !important; }
}