html { scroll-behavior: smooth; }
body { background: #0A0A0B; color: #FAFAFA; font-family: 'Inter', sans-serif; }

/* Hero background image with gradient overlay */
.hero-bg {
  background-image:
    linear-gradient(180deg, rgba(15,30,60,0.55) 0%, rgba(10,10,11,0.78) 60%, rgba(10,10,11,1) 100%),
    url('https://images.unsplash.com/photo-1494412519320-aa613dfb7738?auto=format&fit=crop&w=2400&q=80');
  background-size: cover;
  background-position: center;
}

/* Compact hero (for inner pages) */
.hero-bg-compact {
  background-image:
    linear-gradient(180deg, rgba(15,30,60,0.5) 0%, rgba(10,10,11,0.85) 75%, rgba(10,10,11,1) 100%),
    url('https://images.unsplash.com/photo-1494412519320-aa613dfb7738?auto=format&fit=crop&w=2400&q=80');
  background-size: cover;
  background-position: center;
}

/* Subtle grain overlay */
.grain::after {
  content: '';
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' /%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  opacity: 0.08; pointer-events: none; mix-blend-mode: overlay;
}

/* Fog blobs — drifting blue glow like harbor mist */
.fog { position: absolute; border-radius: 9999px; filter: blur(70px); pointer-events: none; mix-blend-mode: screen; }
.fog-1 { width: 640px; height: 640px; top: 6%; left: -8%; opacity: 0.22;
         background: radial-gradient(circle, #3B82F6 0%, transparent 65%);
         animation: drift1 22s ease-in-out infinite alternate; }
.fog-2 { width: 540px; height: 540px; top: 35%; right: -6%; opacity: 0.18;
         background: radial-gradient(circle, #1D4ED8 0%, transparent 65%);
         animation: drift2 26s ease-in-out infinite alternate; }
.fog-3 { width: 420px; height: 420px; bottom: 18%; left: 28%; opacity: 0.14;
         background: radial-gradient(circle, #60A5FA 0%, transparent 65%);
         animation: drift3 30s ease-in-out infinite alternate; }
@keyframes drift1 { to { transform: translate(70px, 50px); } }
@keyframes drift2 { to { transform: translate(-50px, -60px); } }
@keyframes drift3 { to { transform: translate(50px, -40px); } }

/* Route line + pulse */
.route-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.route-dash { stroke-dasharray: 4 10; animation: dashFlow 7s linear infinite; }
@keyframes dashFlow { to { stroke-dashoffset: -84; } }

/* Fade-up on load */
.fade-up { opacity: 0; transform: translateY(16px); animation: fadeUp 0.9s cubic-bezier(.2,.7,.2,1) forwards; }
.fade-up.d1 { animation-delay: 0.1s; }
.fade-up.d2 { animation-delay: 0.25s; }
.fade-up.d3 { animation-delay: 0.4s; }
.fade-up.d4 { animation-delay: 0.55s; }
@keyframes fadeUp { to { opacity: 1; transform: none; } }

/* Marquee for logos */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { animation: marquee 40s linear infinite; }

/* Button shine */
.btn-accent {
  position: relative; overflow: hidden;
  transition: transform .2s ease, box-shadow .2s ease;
}
.btn-accent:hover { transform: translateY(-1px); box-shadow: 0 12px 32px -10px rgba(37,99,235,0.55); }
.btn-accent::after {
  content: ''; position: absolute; top: 0; left: -120%;
  width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: left .6s ease;
}
.btn-accent:hover::after { left: 130%; }

/* Stat number */
.stat-num { font-feature-settings: "ss01", "tnum"; }

/* Glossary alphabet jumper */
.alpha-jumper a { color: #71717A; transition: color .2s ease; }
.alpha-jumper a:hover { color: #FAFAFA; }
.alpha-jumper a.has-terms { color: #D4D4D8; }
.alpha-jumper a.has-terms:hover { color: #3B82F6; }

/* Form success state */
.form-success { display: none; }
.form-submitted .form-success { display: block; }
.form-submitted .form-fields { display: none; }
