/*
  Locked constraints for every variation in this batch.
  Source: sitm-homepage-variations.md (2026-04-22)
  DO NOT modify per-variant. If a variant needs different values, the
  divergence is the design choice — override in the variant CSS.
*/

@import url('https://fonts.googleapis.com/css2?family=Fraunces:wght@400;500;600;700&family=DM+Serif+Display&family=Inter:wght@400;500;600;700&family=Manrope:wght@400;500;600;700&display=swap');

:root {
  /* palette — locked */
  --teal: #61BDB7;
  --teal-dark: #1F3B3D;
  --navy: #242253;
  --pink: #F082B4;
  --cream: #FAF5EE;
  --ink: #242253;
  --ink-muted: #5a5d7a;
  --line: #e8e0d2;
  --white: #ffffff;

  /* typography — locked direction */
  --font-serif: 'Fraunces', 'DM Serif Display', Georgia, serif;
  --font-serif-display: 'DM Serif Display', 'Fraunces', Georgia, serif;
  --font-sans: 'Inter', 'Manrope', -apple-system, system-ui, sans-serif;

  /* spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* radii */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* elevation */
  --shadow-soft: 0 4px 24px -8px rgba(36, 34, 83, 0.12);
  --shadow-card: 0 8px 32px -12px rgba(36, 34, 83, 0.18);

  /* breakpoints (reference — use in media queries directly) */
  --bp-mobile: 768px;
}