/* ============================================================
   VOLNA EDUCATION — дизайн-токены
   Извлечены из Tilda-экспорта volnaeducation.ru.
   Единственный источник правды по цветам/шрифтам/размерам.
   ============================================================ */

/* ---------- Шрифты ---------- */
@font-face { font-family: 'Onest'; src: url('/fonts/Onest-Light_2.woff') format('woff'); font-weight: 300; font-display: swap; }
@font-face { font-family: 'Onest'; src: url('/fonts/Onest-Regular_2.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Onest'; src: url('/fonts/Onest-Medium_2.woff') format('woff'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Onest'; src: url('/fonts/Onest-SemiBold_3.woff') format('woff'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Onest'; src: url('/fonts/Onest-Bold_2.woff') format('woff'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Bebas Neue'; src: url('/fonts/BebasNeue-Regular.woff') format('woff'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Bebas Neue'; src: url('/fonts/BebasNeue-Bold.woff') format('woff'); font-weight: 700; font-display: swap; }

:root {
  /* ---------- Цвета ---------- */
  --c-bg:          #ffffff;   /* фон страницы */
  --c-ink:         #000000;   /* заголовки, маркер, круг-стрелка */
  --c-text:        #2a2a2a;   /* основной body-текст */
  --c-muted:       #6f7385;   /* приглушённый текст, подписи */
  --c-btn:         #292929;   /* фон кнопок */
  --c-btn-hover:   #414141;   /* hover кнопок */
  --c-on-dark:     #ffffff;   /* текст на тёмном */
  --c-badge:       #e5f1f5;   /* голубой бейдж / светлый акцентный фон */
  --c-badge-2:     #ecf6f9;   /* более светлый голубой */
  --c-tint:        #d0ecf3;   /* насыщенный голубой фон карточек */
  --c-surface:     #f9f9f9;   /* светло-серый фон секций */
  --c-surface-2:   #f2f2f2;   /* очень светло-серый */
  --c-border:      #c9c9c9;   /* границы карточек/полей */
  --c-border-soft: #e2e6ea;   /* мягкий разделитель */
  --c-accent:      #6094ba;   /* сине-голубой акцент (внутренние страницы) */
  --c-accent-soft: #92c5d9;   /* светлый акцент */
  --c-success:     #27d061;   /* галочки/успех */
  --c-link:        #1d98dc;   /* ссылки/иконки */

  /* ---------- Типографика ---------- */
  --font-body: 'Onest', -apple-system, 'Segoe UI', Arial, sans-serif;
  --font-display: 'Bebas Neue', 'Onest', Impact, sans-serif;

  /* адаптивные размеры (clamp: mobile → desktop) */
  --fs-hero:   clamp(40px, 7vw, 78px);
  --fs-h1:     clamp(34px, 5.2vw, 63px);
  --fs-section:clamp(30px, 4.4vw, 54px);   /* капсовые заголовки секций */
  --fs-h3:     clamp(22px, 2.6vw, 34px);
  --fs-lead:   clamp(17px, 1.6vw, 23px);
  --fs-body:   16px;
  --fs-sm:     14px;
  --fs-xs:     12px;

  --lh-tight:  1.12;
  --lh-head:   1.25;
  --lh-body:   1.55;

  /* ---------- Радиусы ---------- */
  --r-sm:   8px;
  --r-md:   15px;   /* карточки */
  --r-lg:   26px;   /* крупные карточки */
  --r-btn:  32px;   /* кнопки */
  --r-pill: 999px;  /* бейджи, круглые элементы */

  /* ---------- Отступы ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --section-y: clamp(56px, 8vw, 110px);  /* вертикальный отступ секции */

  /* ---------- Раскладка ---------- */
  --container: 1200px;
  --gutter: clamp(16px, 4vw, 40px);

  /* ---------- Прочее ---------- */
  --shadow-card: 0 6px 24px rgba(20, 30, 45, 0.06);
  --shadow-pop:  0 20px 60px rgba(20, 30, 45, 0.18);
  --ease: 0.25s ease;
  --header-h: 72px;
}