/* ПРОЯВЛЕНИЕ: цветовые и типографические токены сайта (правка 2, 13.md).
   Источник цветов и шкалы: tokens-proyavlenie-v2.css. Олива светлее на два тона,
   добавлены оттенки кэмела, уменьшена шкала, компактные отступы секций.
   Значения в oklch, hex в комментариях. Все цвета, шрифты и размеры сайта берутся только отсюда. */

:root {
  /* --- Фоны --- */
  --color-bg:            oklch(0.954 0.012 96.4);  /* #F2F0E7 кремовый */
  --color-surface:       oklch(0.979 0.008 91.5);  /* #FAF8F2 слоновая кость */
  --color-bg-alt:        oklch(0.899 0.030 80.7);  /* #E8DCC8 песок */

  /* --- Бренд --- */
  --color-primary:       oklch(0.485 0.048 122.0); /* #5E6A47 олива светлее: заголовки, надзаголовки, кнопки, иконки, ссылки */
  --color-primary-hover: oklch(0.426 0.050 121.7); /* #4A5334 олива логотипа: ховер кнопок, карточка Элит, мелкий текст на песке */
  --color-primary-on-alt: var(--color-primary-hover); /* текст мельче 24 px на песке: #4A5334 на #E8DCC8 = 6.0:1 (у #5E6A47 4.27:1) */
  --color-sage:          oklch(0.716 0.055 119.5); /* #9FA982 шалфей логотипа: мелкий декор */
  --color-sage-light:    oklch(0.839 0.038 117.1); /* #C8CEB2 прожилки: рамки */

  /* --- Кэмел и его оттенки --- */
  --color-accent:        oklch(0.739 0.068 75.5);  /* #C4A57A кэмел: цитата, пакет Стандарт, линия под надзаголовком */
  --color-accent-soft:   oklch(0.836 0.044 78.0);  /* #DCC6A4 светлый кэмел: линии, рамки, подложки */
  --color-accent-dark:   oklch(0.560 0.062 68.0);  /* #8E6F49 тёмный кэмел: крупные цифры (от 24 px, контраст 3.4–4.4) */

  /* --- Текст --- */
  --color-text:          oklch(0.295 0.015 124.0); /* #2B2E26 графит: основной текст, текст на кэмеле (5.9:1) */
  --color-text-muted:    oklch(0.508 0.025 121.4); /* #636858 серый мох: подписи, только на bg и surface */
  --color-text-invert:   oklch(0.954 0.012 96.4);  /* #F2F0E7 текст на оливе */

  /* --- Линии --- */
  --color-border:        oklch(0.839 0.038 117.1); /* #C8CEB2 */
  --color-border-soft:   oklch(0.899 0.030 80.7);  /* #E8DCC8 */

  /* --- Типографика (менять пару только здесь) --- */
  --font-heading: "Prata", Georgia, "Times New Roman", serif;
  --font-body:    "Golos Text", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;

  /* Шкала уменьшена: H1 максимум 3rem */
  --step--1: clamp(0.82rem, 0.8rem + 0.1vw, 0.88rem);
  --step-0:  clamp(0.95rem, 0.92rem + 0.15vw, 1rem);
  --step-1:  clamp(1.1rem, 1.05rem + 0.25vw, 1.25rem);
  --step-2:  clamp(1.4rem, 1.25rem + 0.7vw, 1.75rem);
  --step-3:  clamp(1.7rem, 1.45rem + 1.1vw, 2.25rem);
  --step-4:  clamp(2.1rem, 1.7rem + 1.6vw, 3rem);
  --step-5:  clamp(4rem, 3rem + 4vw, 6.5rem);   /* крупная цифра «11» */

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;

  --lh-heading: 1.12;
  --lh-body: 1.55;
  --tracking-label: 0.08em;   /* только надзаголовки (текстовый шрифт), не заголовки */
  --tracking-num: -0.02em;
  --hero-phrase-gap: 0.3em;   /* между фразами h1 первого экрана, больше межстрочного */    /* декоративные номера текстовым шрифтом */
  --measure: 68ch;
  --measure-lead: 36rem;      /* вводные абзацы: около 70 знаков в строке при 16 px */

  /* --- Сетка и отступы --- */
  --wrap: 1280px;
  --gutter: clamp(1rem, 4vw, 3rem);
  --section-y: clamp(2.5rem, 4vh + 1rem, 4.5rem);
  --gap: clamp(1rem, 2vw, 1.5rem);

  --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;

  /* --- Элементы --- */
  --header-h: 72px;
  --logo-header-height: 64px;
  --logo-header-height-mobile: 44px;
  --logo-footer-width: clamp(240px, 26vw, 340px);
  --icon-size: 32px;
  --eyebrow-line-w: 40px;
  --control-height: 48px;
  --control-height-mobile: 48px;
  --tap-min: 44px;
  --checkbox-size: 20px;
  /* Стрелка поля «Пакет»: галочка вниз 12×8, линия 1.5 px, олива логотипа #4A5334 */
  --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%234A5334' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --select-arrow-w: 12px;
  --select-arrow-h: 8px;
  --select-arrow-inset: 20px;
  --select-pad-right: 52px;
  --table-min-w: 640px;
  --photo-ratio: 4 / 5;        /* рамка фото первого экрана и «Идеи клуба» */
  --photo-w: 388px;            /* ширина этих фото на десктопе, высота 485 px */
  --plan-price-size: 2.75rem;  /* 44 px: цена в карточке пакета */
  --plan-name-size: 2rem;      /* 32 px: название пакета */
  --plan-pad-y: 20px;          /* внутренний отступ карточки пакета снизу */
  --plan-pad-top: 24px;        /* сверху: половина плашки «Рекомендуем» (~13 px) + зазор до названия */
  --plan-price-pad-top: 9px;     /* у цифр Prata внизу ~11 px запаса шрифта: сверху добавляем, снизу 0, от линий до цифр поровну (8 px) */
  --plan-price-pad-bottom: 0px;
  --plan-item-gap: 6px;        /* интервал между пунктами списка в пакете */
  --line: 1px;
  --line-strong: 2px;

  --radius: 4px;
  --radius-lg: 12px;
  --radius-pill: 999px;

  --duration: 200ms;
}