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

:root {
  --bg: #f8f9ff;
  --panel: #ffffff;
  --text: #1a1a2e;
  --muted: rgba(26, 26, 46, 0.55);
  --line: rgba(26, 26, 46, 0.1);
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
  --shadow-lg: 0 18px 60px rgba(0, 0, 0, 0.1);

  /* Bold Color Palette */
  --accent: #FF0052;
  --accent2: #0055DA;
  --accent3: #003d9e;
  --accent4: #FFD400;
  --accent5: #00C68D;
  --accent6: #1a1a2e;
  --accent7: #FFD400;
  --accent-light: rgba(255, 0, 82, 0.1);
  --danger: #dc2626;
  --radius: 14px;
  --radius-sm: 10px;
  --container: 1180px;

  /* --- Font Cascade System --- */
  --font-display: 'Sora', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji",
    "Segoe UI Emoji";
  --font: 'Inter', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Apple Color Emoji",
    "Segoe UI Emoji";
  --mono: 'Space Grotesk', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
    monospace;

  /* Base Scale */
  --fs-base: 16px;
  --fs-xs: 0.6875rem;
  --fs-sm: 0.75rem;
  --fs-body: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;

  /* Fluid Headings */
  --h1-size: clamp(1.75rem, 4vw, 2.5rem);
  --h2-size: clamp(1.375rem, 3vw, 1.75rem);
  --h3-size: clamp(1.125rem, 2.5vw, 1.375rem);
  --h4-size: clamp(1rem, 2vw, 1.125rem);

}

/* Base font */
html { font-size: var(--fs-base); }
body { font-family: var(--font); font-size: var(--fs-body); line-height: 1.6; color: var(--text); }

/* Headings cascade */
h1, .h1 { font-family: var(--font-display); font-size: var(--h1-size); font-weight: 700; line-height: 1.2; }
h2, .h2 { font-family: var(--font-display); font-size: var(--h2-size); font-weight: 700; line-height: 1.25; }
h3, .h3 { font-family: var(--font-display); font-size: var(--h3-size); font-weight: 600; line-height: 1.35; }
h4, .h4 { font-family: var(--font-display); font-size: var(--h4-size); font-weight: 600; line-height: 1.4; }

/* Utility font classes */
.fs-xs { font-size: var(--fs-xs); }
.fs-sm { font-size: var(--fs-sm); }
.fs-body { font-size: var(--fs-body); }
.fs-md { font-size: var(--fs-md); }
.fs-lg { font-size: var(--fs-lg); }
.fs-xl { font-size: var(--fs-xl); }
.fs-2xl { font-size: var(--fs-2xl); }
.fs-3xl { font-size: var(--fs-3xl); }
.fs-4xl { font-size: var(--fs-4xl); }
.fw-400 { font-weight: 400; }
.fw-500 { font-weight: 500; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
    transition: none !important;
    animation: none !important;
  }
}