/* =====================================================================
   GeoWise — дизайн-токены.
   Все значения сняты из макетов Figma (файл ZpYnJJUfZRyaQwdZpB39J8,
   страница «Главная»: Home v5 + все внутренние страницы, 1440 / 768 / 390).
   Единственный источник цветов, шрифтов, размеров и отступов.
   Новые значения не добавлять. Нужно другое — сначала сверить с Figma.
   ===================================================================== */

@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(/styles/fonts/inter-400.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url(/styles/fonts/inter-700.woff2) format("woff2")}

:root{
  /* ---------- Цвета (только эти) ---------- */
  --blue:#0A5CFF;          /* кнопки, ссылки, надзаголовки, подписи карточек, пузырь вопроса */
  --blue-ink:#0A3FA8;      /* текст и ссылки на светло-голубой плашке #EAF1FF */
  --navy:#1C2950;          /* текст на голубой плашке «Обычный путь» #E3ECFF */
  --slate:#3A4A6B;         /* редкий второстепенный текст на голубом */
  --blue-on-dark:#7AA7FF;  /* надзаголовки и подписи на чёрном фоне */
  --blue-soft:#E3ECFF;     /* плашка «Обычный путь», иконки-кружки */
  --blue-tint:#EAF1FF;     /* плашка «Бесплатная проверка сайта», «Наш ответ», статусы */
  --blue-light:#C9DAFF;    /* столбики диаграмм */

  --ink:#1D1D1F;           /* заголовки, основной текст, ссылки меню */
  --gray:#6E6E73;          /* второстепенный текст, подзаголовки, подписи в подвале */
  --gray-2:#A1A1A6;        /* серая вторая строка заголовка, мелкие подписи «ВЫ ПИШЕТЕ» */
  --gray-on-dark:#717174;  /* серая вторая строка заголовка на чёрном фоне */
  --gray-3:#C7C7CC;        /* неактивные элементы */

  --line:#E8E8ED;          /* обводка белых карточек на белом фоне, тонкие разделители в карточках */
  --line-2:#D2D2D7;        /* линии списков/FAQ/подвала, обводка вторичной кнопки, полей ввода */
  --divider:#E5E5EA;       /* разделитель внутри карточки «Как спрашивают» */

  --bg:#FFFFFF;
  --bg-soft:#F5F5F7;       /* серые секции, карточки на белом фоне */
  --bg-dark:#000000;       /* тёмные секции */
  --card-dark:#1C1C1E;     /* карточки на чёрном фоне */
  --card-dark-2:#2C2C2E;   /* чипы на тёмных карточках */
  --tariff-dark:#0B0D17;   /* тёмная карточка тарифа «Продвижение» */

  --tg-from:#37AEE2;       /* кнопка Telegram — фирменный градиент Telegram */
  --tg-to:#1E96C8;

  /* ---------- Шрифт ---------- */
  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  /* В макетах только два начертания: 400 (Regular) и 700 (Bold). Трекинг 0. */

  /* ---------- Типографика: десктоп 1440 (ниже — планшет и телефон) ---------- */
  --fs-h1:64px;        --lh-h1:68px;        /* заголовок первого экрана внутренних страниц, финальный CTA */
  --fs-h1-hero:58px;   --lh-h1-hero:64px;   /* заголовок первого экрана главной (замер по ширине строк в home_1440.png: 58, не 60) */
  --fs-h2:56px;        --lh-h2:60px;        /* заголовки секций (двухцветные) */
  --fs-lead:22px;      --lh-lead:32px;      /* подзаголовок под H2 */
  --fs-eyebrow:17px;   --lh-eyebrow:21px;   /* синий надзаголовок секции */
  --fs-body:17px;      --lh-body:24px;      /* основной текст */
  --fs-small:15px;     --lh-small:20px;     /* текст в мелких карточках, пункты списков */
  --fs-caption:13px;   --lh-caption:16px;   /* подвал, сноски */
  --fs-label:13px;     --lh-label:16px;     /* ПОДПИСЬ КАРТОЧКИ ВЕРХНИМ РЕГИСТРОМ */
  --fs-micro:11px;     --lh-micro:13px;     /* «ВЫ ПИШЕТЕ», «КЛИЕНТ СПРАШИВАЕТ» */

  --fs-title-s:20px;   --lh-title-s:26px;   /* заголовок карточки (обычный) */
  --fs-title-m:22px;   --lh-title-m:28px;   /* заголовок карточки «Что покажет проверка» */
  --fs-title-l:24px;   --lh-title-l:30px;   /* заголовок шага, крупной карточки */
  --fs-title-xl:28px;  --lh-title-xl:34px;  /* название тарифа, крупный заголовок карточки */

  --fs-stat:44px;      --lh-stat:53px;      /* «10 нейросетей», «12 вопросов» (методика) */
  --fs-bignum:64px;    --lh-bignum:68px;    /* «9 из 10», «2 из 100» */
  --fs-price:48px;     --lh-price:58px;     /* цена на странице тарифа */
  --fs-price-s:32px;   --lh-price-s:39px;   /* цена в карточке тарифа */

  --fs-banner:19px;    --lh-banner:23px;    /* текст голубой плашки «Обычный путь» */
  --fs-conclusion:24px; --lh-conclusion:30px; /* жирный вывод под блоком */
  --fs-faq-q:20px;     --lh-faq-q:29px;     /* вопрос FAQ */
  --fs-faq-a:19px;     --lh-faq-a:28px;     /* ответ FAQ */
  --fs-bubble:17px;    --lh-bubble:21px;    /* вопрос клиента в чате первого экрана ([С] 12.10: 19 → 17) */

  --fs-nav:16px;       /* меню в шапке */
  --fs-logo:24px;
  --fs-btn:17px;       /* основная кнопка */
  --fs-btn-s:15px;     /* малая кнопка */
  --fs-btn-header:15px;

  /* ---------- Сетка и отступы ---------- */
  --container:1200px;          /* ширина контента */
  --gutter:40px;               /* поле для окон 1024–1279; на 1440 контейнер центрируется → поля 120 */
  --section-y:104px;           /* отступ секции сверху и снизу (утверждено: 104 / 80 / 56) */
  --gap:24px;                  /* между карточками в сетке */
  --gap-head:42px;             /* от заголовка секции (или lead) до контента */
  --gap-eyebrow:16px;          /* от надзаголовка до H2 */
  --gap-lead:24px;             /* от H2 до lead */
  --gap-actions:32px;          /* от текста до кнопок */

  --card-py:32px;  --card-px:30px;   /* внутренние отступы карточки */
  --card-lg-py:36px; --card-lg-px:36px; /* формы, тарифы, крупные плитки */

  /* ---------- Скругления ---------- */
  --r-xl:36px;     /* тарифы, формы, крупные плитки, фото */
  --r-lg:32px;     /* карточки на белом фоне, чат первого экрана */
  --r-md:28px;     /* карточки на сером фоне, плашка «Обычный путь» */
  --r-sm:16px;     /* вложенные белые блоки («Пример», ответ нейросети) */
  --r-xs:12px;     /* строки рейтинга, бейджи */
  --r-bubble:18px; /* синий пузырь вопроса */
  --r-pill:999px;

  /* ---------- Кнопки, шапка, Telegram ---------- */
  --btn-h:60px;   --btn-px:30px;
  --btn-s-h:48px; --btn-s-px:24px;
  --btn-header-h:40px; --btn-header-px:20px;
  --header-h:84px;
  --nav-gap:36px;
  --burger:24px;
  --tg-size:60px; --tg-icon:30px; --tg-bottom:32px;

  /* ---------- Анимации шапки, меню и кнопок (возвращены из staging 2, [С] 12.10) ---------- */
  --ease:cubic-bezier(.25,.1,.25,1);
  --t-hover:240ms;      /* наведение: пункты меню, кнопки, выпадающий список */
  --t-press:120ms;      /* нажатие */
  --t-menu:400ms;       /* бургер → крест, полотно меню */
  --blue-hover:#2B72FF; /* фон синей кнопки при наведении */
  --white-hover:#F2F3F5;/* фон белой кнопки при наведении */
  --sh-btn-blue:0 6px 18px rgba(10,92,255,.22);
  --sh-btn-ghost:0 6px 18px rgba(0,0,0,.12);
  --sh-btn-white:0 6px 18px rgba(0,0,0,.22);
  --sh-drop:0 12px 32px rgba(0,0,0,.08);
  --drop-gap:14px;      /* зазор между пунктом «О GEO» и панелью (перекрыт мостом) */
  --fs-mmenu:24px;      /* пункт мобильного меню, Bold */
}

/* ---------- Планшет: 768–1023 (макет 768) ---------- */
@media (max-width:1023px){
  :root{
    --fs-h1:48px;      --lh-h1:52px;
    --fs-h1-hero:48px; --lh-h1-hero:52px;
    --fs-h2:40px;      --lh-h2:44px;
    --fs-lead:20px;    --lh-lead:30px;
    --fs-eyebrow:16px; --lh-eyebrow:19px;
    --fs-label:12px;   --lh-label:15px;
    --fs-title-s:19px; --lh-title-s:25px;
    --fs-title-m:20px; --lh-title-m:26px;
    --fs-title-l:22px; --lh-title-l:28px;
    --fs-title-xl:24px;--lh-title-xl:30px;
    --fs-stat:27px;    --lh-stat:33px;     /* так в макете 768 (на 390 — 32) */
    --fs-price:40px;   --lh-price:48px;
    --fs-price-s:30px; --lh-price-s:36px;
    --fs-banner:17px;  --lh-banner:21px;
    --fs-conclusion:19px; --lh-conclusion:25px;
    --fs-faq-a:18px;   --lh-faq-a:27px;
    --lh-faq-q:28px;   /* в макете 768 шаг строк вопроса 27,8 */
    --fs-btn-header:13px;

    --gutter:48px;
    --section-y:80px;
    --gap:16px;
    --gap-head:30px;
    --gap-eyebrow:12px;
    --gap-lead:20px;
    --gap-actions:28px;
    --card-py:24px; --card-px:22px;
    --card-lg-py:24px; --card-lg-px:22px;

    --r-xl:28px; --r-lg:28px; --r-md:24px;

    --btn-h:58px; --btn-px:28px;
    --btn-header-h:34px; --btn-header-px:14px;
    --header-h:70px;
    --tg-bottom:32px;
  }
}

/* ---------- Телефон: до 767 (макет 390) ---------- */
@media (max-width:767px){
  :root{
    --fs-h1:36px;      --lh-h1:40px;
    --fs-h1-hero:36px; --lh-h1-hero:40px;
    --fs-h2:30px;      --lh-h2:34px;
    --fs-lead:18px;    --lh-lead:27px;
    --fs-eyebrow:15px; --lh-eyebrow:18px;
    --fs-title-s:18px; --lh-title-s:24px;
    --fs-title-m:20px; --lh-title-m:26px;
    --fs-title-l:20px; --lh-title-l:26px;
    --fs-title-xl:22px;--lh-title-xl:28px;
    --fs-stat:32px;    --lh-stat:39px;
    --fs-bignum:44px;  --lh-bignum:48px;
    --fs-faq-q:18px;   --lh-faq-q:24px;   /* в макете 390 шаг строк вопроса 23,7 */
    --fs-conclusion:18px; --lh-conclusion:24px;
    --fs-faq-a:17px;   --lh-faq-a:24px;
    --fs-logo:22px;

    --gutter:20px;
    --section-y:56px;
    --gap:12px;
    --gap-head:29px;
    --gap-lead:18px;
    --gap-actions:24px;

    --header-h:62px;
    --btn-h:56px;
    --btn-header-px:12.65px;   /* кнопка шапки 142,3 в макете 390 */
    --tg-size:56px; --tg-icon:28px; --tg-bottom:24px;
  }
}