/* =========================================================
   Amoney.kz — дизайн-токены
   Подключать первым. Все переменные с префиксом --am-.
   Тёмной темы в дизайне нет (сайт только светлый).
   ========================================================= */

/* Шрифт: Jost (Google Fonts) как замена фирменного Circe.
   Подключение в <head> каждой страницы:
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600;700&display=swap">
   Если на сервере есть лицензия Circe — поставить 'Circe' первым в --am-font. */

:root {
  /* ---------- Цвета бренда (палитра текущего сайта) ---------- */
  --am-green-900: #102317;   /* тёмный: CTA-баннер, текст на accent */
  --am-green-750: #1F4A2F;   /* hover для primary */
  --am-green-700: #2B5C3C;   /* primary: кнопки, hero, активные состояния */
  --am-green-400: #73CC87;   /* accent — ТОЛЬКО с тёмным текстом (--am-green-900) */
  --am-green-450: #62BD77;   /* hover для accent */

  /* ---------- Текст ---------- */
  --am-ink: #1E2444;         /* заголовки */
  --am-text: #333333;        /* основной текст */
  --am-muted: #5B6270;       /* подписи, дисклеймеры (контраст 6:1) */
  --am-on-dark: #FFFFFF;     /* текст на зелёном/тёмном */

  /* ---------- Фоны и линии ---------- */
  --am-page: #F9F9F9;        /* фон страницы */
  --am-surface: #FFFFFF;     /* карточки */
  --am-blue-50: #ECF1F8;     /* soft-кнопки, плитки, трек слайдера */
  --am-line: #E3E8EF;        /* разделители */
  --am-line-strong: #D6DEE9; /* обводки чипов */
  --am-line-input: #C5CFDC;  /* обводка пустого поля */

  /* ---------- Статусы (текст / фон / рамка) ---------- */
  --am-success: #2B5C3C;  --am-success-bg: #E3F3E7;  --am-success-line: #73CC87;
  --am-warning: #8A5A00;  --am-warning-bg: #FFF4DB;  --am-warning-line: #E8B64C;
  --am-danger:  #B03025;  --am-danger-bg:  #FFF4F2;  --am-danger-line:  #C0392B;
  --am-info:    #1E4E8C;  --am-info-bg:    #ECF1F8;  --am-info-line:    #8FB0DA;
  --am-neutral: #5B6270;  --am-neutral-bg: #F1F3F6;  --am-neutral-line: #C5CFDC;

  /* ---------- Шрифт ---------- */
  --am-font: 'Jost', 'Circe', 'Segoe UI', Roboto, Arial, sans-serif;
  --am-fw-regular: 400;
  --am-fw-medium: 500;
  --am-fw-semibold: 600;
  --am-fw-bold: 700;

  /* Размеры — мобильные значения; десктопные переопределены ниже */
  --am-fs-h1: 36px;   --am-lh-h1: 40px;   --am-ls-h1: -0.8px;
  --am-fs-h2: 30px;   --am-lh-h2: 34px;   --am-ls-h2: -0.6px;
  --am-fs-h3: 21px;   --am-lh-h3: 27px;
  --am-fs-num: 34px;  --am-lh-num: 38px;  /* крупные суммы */
  --am-fs-lead: 16px; --am-lh-lead: 24px;
  --am-fs-body: 16px; --am-lh-body: 24px;
  --am-fs-sm: 14px;   --am-lh-sm: 20px;
  --am-fs-xs: 13px;   --am-lh-xs: 19px;   /* минимум для текста */

  /* ---------- Отступы (шаг 4/8) ---------- */
  --am-space-1: 4px;
  --am-space-2: 8px;
  --am-space-3: 12px;
  --am-space-4: 16px;
  --am-space-5: 20px;
  --am-space-6: 24px;
  --am-space-8: 32px;
  --am-space-10: 40px;
  --am-space-12: 48px;
  --am-space-14: 56px;
  --am-space-16: 64px;
  --am-space-26: 104px;

  --am-gutter: 12px;          /* боковой отступ страницы */
  --am-section-gap: 56px;     /* отступ между секциями */
  --am-container: 1400px; /* было 1200px — шире под большие мониторы (Trello #144) */

  /* ---------- Радиусы ---------- */
  --am-r-xs: 6px;     /* бейджи-метки */
  --am-r-chip: 10px;  /* чипы выбора */
  --am-r-btn: 14px;   /* кнопки, поля */
  --am-r-md: 18px;    /* меню, FAQ, строки */
  --am-r-card: 24px;  /* карточки, бенто */
  --am-r-hero: 26px;  /* hero, баннер (32 на десктопе) */
  --am-r-pill: 999px;

  /* ---------- Тени ---------- */
  --am-shadow-nav: 0 4px 24px rgba(30, 36, 68, 0.08);
  --am-shadow-card: 0 12px 32px rgba(30, 36, 68, 0.10);
  --am-shadow-float: 0 30px 60px rgba(16, 35, 23, 0.30);
  --am-shadow-badge: 0 10px 24px rgba(16, 35, 23, 0.25);
  --am-shadow-sticky: 0 -6px 20px rgba(16, 35, 23, 0.10);

  /* ---------- Прочее ---------- */
  --am-focus: 0 0 0 3px rgba(115, 204, 135, 0.8);
  --am-btn-h: 52px;
  --am-btn-h-sm: 44px;
  --am-input-h: 52px;
  --am-transition: 0.15s ease;
}

/* Контрольные точки (mobile-first): 480 / 768 / 1200 */
@media (min-width: 480px) {
  :root { --am-gutter: 16px; }
}
@media (min-width: 768px) {
  :root {
    --am-gutter: 24px;
    --am-fs-h1: 48px;  --am-lh-h1: 54px;  --am-ls-h1: -1px;
    --am-fs-h2: 38px;  --am-lh-h2: 44px;
    --am-fs-lead: 18px; --am-lh-lead: 28px;
    --am-section-gap: 80px;
    --am-btn-h: 56px;
  }
}
@media (min-width: 1200px) {
  :root {
    --am-gutter: 40px;
    --am-fs-h1: 60px;  --am-lh-h1: 64px;  --am-ls-h1: -1.2px;
    --am-fs-h2: 44px;  --am-lh-h2: 50px;  --am-ls-h2: -0.8px;
    --am-fs-h3: 22px;  --am-lh-h3: 28px;
    --am-fs-num: 38px; --am-lh-num: 40px;
    --am-fs-lead: 20px; --am-lh-lead: 30px;
    --am-fs-body: 17px; --am-lh-body: 26px;
    --am-section-gap: 104px;
    --am-r-hero: 32px;
  }
}