/* ==========================================================================
   SACRED MODERNITY DESIGN TOKENS
   Strict adherence to Sankalp & My Sanatan visual system
   ========================================================================== */

@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/eb-garamond-400.woff2') format('woff2');
}

@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/eb-garamond-500.woff2') format('woff2');
}

@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../assets/fonts/eb-garamond-600.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/inter-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/inter-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../assets/fonts/inter-600.woff2') format('woff2');
}

:root {
  /* Color Palette - Sacred Modernity */
  --color-surface: #FFF8F5;
  --color-surface-dim: #F5EAE4;
  --color-surface-card: #FFFFFF;
  --color-surface-low: #FFF1EB;
  --color-surface-pill: rgba(255, 243, 224, 0.7);
  --color-on-surface: #241913;
  --color-on-surface-variant: #574237;
  --color-on-surface-muted: #7E6A5E;

  --color-primary: #964400;
  --color-primary-bright: #E06D14;
  --color-gradient-start: #FF9800;
  --color-gradient-end: #E06D14;

  --color-gold: #D4AF37;
  --color-gold-light: rgba(212, 175, 55, 0.2);
  --color-gold-border: rgba(212, 175, 55, 0.45);
  --color-gold-shimmer: rgba(212, 175, 55, 0.65);

  --color-outline: #8A7265;
  --color-outline-variant: #DEC1B1;
  --color-chip-bg: #FFF3E0;
  --color-chip-text: #964400;
  --color-error: #BA1A1A;

  /* Typography */
  --font-serif: 'EB Garamond', Georgia, serif;
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --fs-hero-umbrella: clamp(0.78rem, 1.3vw, 0.95rem);
  --fs-hero-title: clamp(2.5rem, 6vw, 4.25rem);
  --fs-h2: clamp(1.85rem, 4vw, 2.75rem);
  --fs-h3: clamp(1.2rem, 2.3vw, 1.6rem);
  --fs-body-lg: 1.15rem;
  --fs-body: 1rem;
  --fs-body-sm: 0.875rem;
  --fs-label: 0.75rem;

  --lh-heading: 1.22;
  --lh-body: 1.68;
  --ls-umbrella: 0.24em;
  --ls-caps: 0.08em;

  /* Spacing - Relaxed, Breathable, Calm */
  --space-xs: 0.25rem;  /* 4px */
  --space-sm: 0.5rem;   /* 8px */
  --space-md: 0.75rem;  /* 12px */
  --space-lg: 1rem;     /* 16px */
  --space-xl: 1.5rem;   /* 24px */
  --space-xxl: 2.5rem;  /* 40px */
  --space-section: clamp(5rem, 9vw, 8rem);

  --container-max: 1180px;
  --container-pad: clamp(1.5rem, 5vw, 3rem);

  /* Radius */
  --radius-sm: 6px;
  --radius-default: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-phone: 36px;
  --radius-full: 9999px;

  /* Shadows */
  --shadow-subtle: 0 4px 20px rgba(150, 68, 0, 0.06);
  --shadow-card: 0 10px 32px rgba(36, 25, 19, 0.06);
  --shadow-glow: 0 0 28px rgba(212, 175, 55, 0.35);
}
