:root {
  --navy: #001f3f;
  --navy-dark: #001122;
  --gold: #D4AF37;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: 'Inter', system-ui, sans-serif;
  color: #0a0a2e;
}

.font-display {
  font-family: 'Playfair Display', 'Inter', serif;
  letter-spacing: -0.02em;
}

.text-navy { color: var(--navy); }
.bg-navy { background-color: var(--navy); }
.bg-navy-dark { background-color: var(--navy-dark); }
.text-gold { color: var(--gold); }
.bg-gold { background-color: var(--gold); }
.border-navy { border-color: var(--navy); }
.hover\:bg-navy-dark:hover { background-color: var(--navy-dark); }
.hover\:text-gold:hover { color: var(--gold); }
.hover\:border-gold:hover { border-color: var(--gold); }

.blueprint-bg {
  background-image:
    linear-gradient(var(--navy) 1px, transparent 1px),
    linear-gradient(90deg, var(--navy) 1px, transparent 1px);
  background-size: 40px 40px;
}

.pattern-dots {
  background-image: radial-gradient(var(--navy) 1.5px, transparent 1.5px);
  background-size: 24px 24px;
  opacity: 0.08;
}

html {
  scroll-behavior: smooth;
}

body::-webkit-scrollbar { width: 10px; }
body::-webkit-scrollbar-track { background: #f5f5f5; }
body::-webkit-scrollbar-thumb { background: var(--navy); border-radius: 10px; }

.method-card, .program-item, .cert-card, .stps-banner {
  will-change: transform, opacity;
}

@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

.animate-marquee {
  animation: marquee 35s linear infinite;
  width: max-content;
}

.animate-marquee:hover {
  animation-play-state: paused;
}

@media (max-width: 768px) {
  .font-display { letter-spacing: -0.01em; }
}

.hero-content, .hero-visual {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeUp 1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
.hero-visual { animation-delay: 0.2s; }

@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}