/* ============================================================
   Mira v2 — Design Tokens & Custom Fonts
   ============================================================ */

/* --- Custom Font Faces --- */
@font-face {
  font-family: 'Halimun';
  src: url('../assets/fonts/Halimun.woff2') format('woff2'),
       url('../assets/fonts/Halimun.woff') format('woff'),
       url('../assets/fonts/Halimun.ttf') format('truetype'),
       url('../assets/fonts/Halimun.otf') format('opentype');
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy';
  src: url('../assets/fonts/Gilroy-Regular.woff2') format('woff2'),
       url('../assets/fonts/Gilroy-Regular.woff') format('woff'),
       url('../assets/fonts/Gilroy-Regular.ttf') format('truetype'),
       url('../assets/fonts/Gilroy-Regular.otf') format('opentype');
  font-weight: 400;
  font-display: swap;
}

:root {
  /* --- Colors --- */
  --color-black: #000000;
  --color-white: #FFFFFF;
  --color-bg: #FFFFFF;
  --color-bg-light: #F5F5F0;
  --color-bg-gray: #F7F7F7;
  --color-text: #000000;
  --color-text-light: #666666;
  --color-text-muted: #999999;
  --color-border: #E0E0E0;
  --color-border-light: #EFEFEF;
  --color-whatsapp: #25D366;
  --color-danger: #DC3545;
  --color-success: #28a745;

  /* --- Fonts --- */
  --font-script: 'Halimun', 'Sacramento', cursive;
  --font-body: 'Gilroy', 'DM Sans', sans-serif;

  /* --- Typography Scale --- */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.25rem;
  --fs-2xl: 1.5rem;
  --fs-3xl: 2rem;
  --fs-4xl: 2.5rem;
  --fs-5xl: 3.5rem;
  --fs-hero: 5rem;

  /* --- Spacing --- */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  /* --- Border Radius --- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 9999px;

  /* --- Shadows --- */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);

  /* --- Transitions --- */
  --transition-fast: 150ms ease;
  --transition-base: 300ms ease;
  --transition-slow: 500ms ease;

  /* --- Layout --- */
  --max-width: 1200px;
  --navbar-height: 64px;
}