/* ── North Axis Digital — Shared Styles ──────────────────────────────────── */

/* Base */
body { font-family: 'Inter', sans-serif; background-color: #011135; }
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }

/* Star field canvas */
#starfield { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; }
nav, main, footer { position: relative; z-index: 1; }

/* Keyframes */
@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(60px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes pulseGlow {
  0%, 100% { opacity: 0.12; transform: scale(1); }
  50%       { opacity: 0.25; transform: scale(1.1); }
}
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-18px); }
}

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.85s cubic-bezier(0.16,1,0.3,1),
              transform 0.85s cubic-bezier(0.16,1,0.3,1);
}
.reveal.from-left  { transform: translateX(-50px); }
.reveal.from-right { transform: translateX(50px); }
.reveal.visible { opacity: 1; transform: translate(0,0); }
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; }
.delay-6 { transition-delay: 0.6s; }

/* Glow orbs */
.glow-orb { border-radius: 50%; filter: blur(80px); animation: pulseGlow 7s ease-in-out infinite; }
.glow-orb-2 { animation-delay: 3.5s; }

/* Float */
.float-slow { animation: float 8s ease-in-out infinite; }

/* Nav */
nav { transition: background 0.4s ease, box-shadow 0.4s ease; }
nav.scrolled { background: rgba(1,17,53,0.92) !important; box-shadow: 0 1px 0 rgba(147,204,255,0.08); }

/* Button */
.btn-primary { position: relative; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.btn-primary::after { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,0.12); transform: translateX(-100%); transition: transform 0.3s ease; }
.btn-primary:hover::after { transform: translateX(0); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 8px 30px rgba(147,204,255,0.25); }

/* Mobile nav */
#mobile-menu { max-height: 0; overflow: hidden; opacity: 0; transition: max-height 0.4s ease, opacity 0.3s ease; }
#mobile-menu.open { max-height: 400px; opacity: 1; }
#mobile-menu-btn span { display: block; width: 24px; height: 2px; background: white; transition: transform 0.3s ease, opacity 0.3s ease; transform-origin: center; }
#mobile-menu-btn.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
#mobile-menu-btn.open span:nth-child(2) { opacity: 0; }
#mobile-menu-btn.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }