/* ==========================================================================
   Mizhhirya Mountain Resort — design tokens
   Mirrors the Figma variables and text styles 1:1.
   Every value in the project must reference a token from this file.
   ========================================================================== */

:root {
  /* --- Color: surfaces --- */
  --color-bg-page: #f8f7f2;
  --color-bg-section: #f1efe8;
  --color-bg-surface: #ffffff;
  --color-bg-dark: #1a2921;
  --color-bg-dark-deep: #142019;
  --color-surface-placeholder: #e4e2d8;

  /* --- Color: text --- */
  --color-text-primary: #24261f;
  --color-text-muted: #6c6d63;
  --color-text-on-dark: #f1efe8;
  --color-text-on-dark-muted: #b5b3a7;

  /* --- Color: accent --- */
  --color-accent-gold: #a98a4f;
  --color-accent-gold-on-dark: #c7a66b;

  /* --- Color: components --- */
  --color-button-primary-bg: #1a2921;
  --color-button-primary-text: #f8f7f2;

  /* --- Typefaces --- */
  --font-display: "Prata", Georgia, serif;
  --font-body: "Golos Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-script: "Great Vibes", cursive;

  /* --- Type scale (fluid: mobile -> desktop) --- */
  --fs-display-hero: clamp(2.375rem, 1.4rem + 4.2vw, 4.5rem);   /* 38 -> 72 */
  --fs-display-section: clamp(1.75rem, 1.3rem + 1.9vw, 2.5rem); /* 28 -> 40 */
  --fs-display-card: clamp(1.15rem, 1.05rem + 0.4vw, 1.3125rem);/* 18 -> 21 */
  --fs-script-l: clamp(2.25rem, 1.5rem + 3.2vw, 3.5rem);        /* 36 -> 56 */
  --fs-script-m: clamp(2rem, 1.6rem + 1.7vw, 2.75rem);          /* 32 -> 44 */
  --fs-body-lg: clamp(1rem, 0.95rem + 0.22vw, 1.125rem);        /* 16 -> 18 */
  --fs-body-base: 1rem;                                          /* 16 */
  --fs-body-sm: 0.875rem;                                        /* 14 */
  --fs-caption: 0.8125rem;                                       /* 13 */
  --fs-label: 0.6875rem;                                         /* 11 */
  --fs-button: 0.75rem;                                          /* 12 */
  --fs-stat: clamp(1.5rem, 1.2rem + 1.3vw, 1.75rem);            /* 24 -> 28 */
  --fs-quote: clamp(1.25rem, 1rem + 1.1vw, 1.75rem);            /* 20 -> 28 */

  /* --- Line heights --- */
  --lh-display-hero: 1.17;
  --lh-display-section: 1.3;
  --lh-display-card: 1.33;
  --lh-script: 1.22;
  --lh-body: 1.7;
  --lh-tight: 1.45;

  /* --- Letter spacing --- */
  --ls-label: 1.76px;
  --ls-button: 1.2px;

  /* --- Spacing scale --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-30: 120px;

  /* --- Layout --- */
  --page-max: 1440px;
  --gutter: clamp(1.25rem, 0.5rem + 4vw, 7.5rem); /* 20px -> 120px */
  --section-py: clamp(3.5rem, 2rem + 5vw, 6rem);  /* 56  -> 96px  */

  /* --- Radii --- */
  --radius-xs: 2px;
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;

  /* --- Shadow --- */
  --shadow-card: 0 12px 20px rgba(20, 26, 20, 0.12);

  /* --- Motion --- */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-fast: 0.25s;
  --dur-base: 0.6s;
}