@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Playfair+Display:wght@700;800;900&display=swap');

:root {
  --font-sans: 'Inter', sans-serif;
  --font-display: 'Playfair Display', serif;
  --bg-dark: #0f1419;
  --bg-card: #1a2332;
  --primary: #7eb8da;
  --accent: #a8d4a8;
  --secondary: #f4a7a7;
  --text-main: #e8ecf1;
  --text-muted: #8899aa;
  --border: #2a3a4e;
}

body {
  font-family: var(--font-sans);
  background-color: var(--bg-dark);
  color: var(--text-main);
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-display {
  font-family: var(--font-display);
}

.scroll-mt-20 { scroll-margin-top: 5rem; }
.scroll-mt-32 { scroll-margin-top: 8rem; }

/* Modal specific styles */
.modal-overlay {
  position: fixed;
  inset: 0;
  background-color: rgba(15, 20, 25, 0.9);
  backdrop-filter: blur(12px);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.modal-overlay.active {
  display: flex;
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.animate-shimmer {
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.1) 50%, transparent 100%);
  background-size: 200% 100%;
  animation: shimmer 3s infinite linear;
}