/* ============================================================
   tokens.css — дизайн-токени БА «Константа»
   Єдине джерело правди для кольорів, типографіки, відступів.
   ============================================================ */

:root {
  /* === Бренд === */
  --color-brand-primary: #0B2545;        /* Deep Trust Blue — основний */
  --color-brand-primary-700: #082040;
  --color-brand-primary-500: #1E4575;
  --color-brand-primary-200: #B3C5DC;
  --color-brand-primary-50:  #EEF3F9;

  --color-brand-accent: #13795B;         /* Emerald — акцент, CTA */
  --color-brand-accent-600: #0F6249;
  --color-brand-accent-100: #D4EBE2;

  --color-brand-gold: #C9A961;           /* Gold — елементи довіри */
  --color-brand-gold-700: #A8893E;

  /* === Нейтралі === */
  --color-ink:        #0E1424;           /* Основний текст */
  --color-ink-muted:  #5A6478;
  --color-ink-subtle: #5A6478;          /* WCAG 2.1 AA: затемнено з #8B95A7 (контраст < 4.5:1) */
  --color-surface:    #FFFFFF;
  --color-surface-2:  #F7F9FC;           /* Альтернативний фон секцій */
  --color-surface-3:  #EEF2F8;
  --color-border:     #E1E7F0;
  --color-border-strong: #C9D2E1;

  /* === Семантичні === */
  --color-success: #1A8754;
  --color-warning: #D89614;
  --color-danger:  #C73E3E;

  /* === Прозорі для glass === */
  --glass-white-90: rgba(255, 255, 255, 0.90);
  --glass-white-70: rgba(255, 255, 255, 0.70);
  --glass-blue-10:  rgba(11, 37, 69, 0.08);

  /* === Типографіка === */
  --font-display: 'Playfair Display', 'Times New Roman', serif;
  --font-body: 'Inter', 'Montserrat', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Шкала розмірів — fluid через clamp() */
  --fs-hero-h1: clamp(2.5rem, 5vw + 1rem, 4.5rem);   /* 40 → 72 */
  --fs-h1:      clamp(2.25rem, 3vw + 1rem, 3.5rem);  /* 36 → 56 */
  --fs-h2:      clamp(1.75rem, 2vw + 0.75rem, 2.5rem);/* 28 → 40 */
  --fs-h3:      clamp(1.375rem, 1vw + 0.9rem, 1.75rem);/* 22 → 28 */
  --fs-h4:      clamp(1.125rem, 0.5vw + 1rem, 1.25rem);/* 18 → 20 */
  --fs-body-l:  clamp(1rem, 0.4vw + 0.9rem, 1.125rem);/* 16 → 18 */
  --fs-body:    clamp(0.9375rem, 0.3vw + 0.875rem, 1rem);/* 15 → 16 */
  --fs-small:   clamp(0.8125rem, 0.2vw + 0.78rem, 0.875rem);/* 13 → 14 */
  --fs-caption: 0.75rem;                              /* 12 */

  --lh-tight: 1.15;
  --lh-snug:  1.35;
  --lh-base:  1.65;
  --lh-loose: 1.75;

  /* === Простір — база 4px === */
  --space-1:  0.25rem;   /* 4  */
  --space-2:  0.5rem;    /* 8  */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-5:  1.25rem;   /* 20 */
  --space-6:  1.5rem;    /* 24 */
  --space-8:  2rem;      /* 32 */
  --space-10: 2.5rem;    /* 40 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */
  --space-20: 5rem;      /* 80 */
  --space-24: 6rem;      /* 96 */
  --space-32: 8rem;      /* 128 */

  /* Вертикальні відступи секцій — fluid */
  --section-y: clamp(3.5rem, 6vw, 7rem);

  /* === Радіуси === */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;

  /* === Тіні === */
  --shadow-xs: 0 1px 2px rgba(11, 37, 69, 0.05);
  --shadow-sm: 0 2px 8px rgba(11, 37, 69, 0.06);
  --shadow-md: 0 8px 24px rgba(11, 37, 69, 0.08);
  --shadow-lg: 0 20px 48px rgba(11, 37, 69, 0.12);
  --shadow-glow: 0 0 0 4px rgba(19, 121, 91, 0.15);  /* focus */

  /* === Контейнер і сітка === */
  --container-max: 1200px;
  --container-wide: 1320px;
  --container-pad: clamp(1rem, 4vw, 2.5rem);

  /* === Рух === */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-micro: 0.18s;
  --dur-base: 0.25s;
  --dur-reveal: 0.55s;

  /* === Шари (z-index) === */
  --z-header: 100;
  --z-drawer: 200;
  --z-float: 150;
  --z-modal: 300;
  --z-toast: 400;

  /* === Розміри елементів === */
  --header-h: 76px;
  --field-h: 52px;
}

@media (max-width: 640px) {
  :root {
    --header-h: 64px;
    --field-h: 48px;
  }
}