/* =========================================================
   LOUNATA - дизайн-токены (черновик по референсу)
   Все цвета, шрифты и размеры сайта задаются здесь.
   Поменяли значение - поменялось на всём сайте.
   ========================================================= */

/* Шрифты подключены локально в css/fonts.css (подключать первым).
   Если захочешь грузить их с Google Fonts вместо этого:
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;1,400&family=Lora:ital,wght@0,400;0,500;1,400&family=Montserrat:wght@400;500&display=swap" rel="stylesheet">
   Все три шрифта поддерживают кириллицу и французские буквы (é, è, ç). */

:root {
  /* ---------- Цвета: фон ---------- */
  --color-bg:        #050d17;   /* основной фон секций (снят с референса) */
  --color-bg-2:      #07111c;   /* фон чередующихся секций, чуть светлее */
  --color-surface:   #0c1724;   /* карточки, плашки */

  /* ---------- Цвета: текст ---------- */
  --color-text:       #ecebee;  /* основной текст */
  --color-text-muted: #8c8e94;  /* описания, подписи */

  /* ---------- Цвета: золото (акцент) ---------- */
  --color-gold:       #d2a866;
  --color-gold-light: #f2cb8a;
  --color-gold-dark:  #bf8e4b;
  --gradient-gold: linear-gradient(90deg, #d4a862 0%, #bf8e4b 100%);

  /* ---------- Цвета из референса: шапка/подвал, меню ---------- */
  --color-bg-deep: #020911;   /* шапка и подвал */
  --color-nav:     #90a3b0;   /* пункты меню */

  /* ---------- Светлые секции (страница "Лицензии": форма, шаги, FAQ) ---------- */
  --color-cream:      #ecded1;  /* фон светлых секций (снят с макета) */
  --color-cream-2:    #f2e4d5;  /* чуть светлее - чередование секций */
  --color-field:      #fcf0e5;  /* фон полей формы */
  --color-ink:        #2b2622;  /* текст и иконки на светлом */
  --color-ink-muted:  #6b5e54;  /* подписи на светлом */
  --color-error:      #a3321f;  /* сообщения об ошибках в форме */
  --gradient-bronze: linear-gradient(90deg, #3a2c20 0%, #7a5937 100%);  /* кнопки на светлом */

  /* ---------- Линии и затемнения ---------- */
  --color-line: rgba(209, 161, 92, 0.22);   /* тонкие разделители между секциями */
  --color-line-soft: rgba(236, 227, 211, 0.12);
  /* Затемнение поверх фото, чтобы текст слева читался */
  --overlay-left: linear-gradient(90deg, rgba(5, 13, 23, 0.92) 0%, rgba(5, 13, 23, 0.55) 45%, rgba(5, 13, 23, 0) 75%);
  /* Затемнение снизу карточки под подписью */
  --overlay-bottom: linear-gradient(180deg, rgba(5, 13, 23, 0) 40%, rgba(5, 13, 23, 0.85) 100%);

  /* ---------- Шрифты ---------- */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;   /* заголовки */
  --font-text: "Lora", Georgia, "Times New Roman", serif;                  /* основной текст */
  --font-ui: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif; /* кнопки, меню, подписи */

  /* ---------- Размеры шрифтов (от телефона к ПК) ---------- */
  --fs-hero:  clamp(52px, 11vw, 120px);  /* LOUNATA на первом экране */
  --fs-h2:    clamp(30px, 4.2vw, 46px);  /* заголовки секций */
  --fs-h3:    clamp(18px, 1.6vw, 20px);  /* подписи карточек */
  --fs-lead:  clamp(20px, 2vw, 24px);    /* крупный текст под заголовком */
  --fs-body:  17px;                      /* Lora крупнее Cormorant, 17px читается как прежние 18 */
  --fs-label: 11px;                      /* меню, кнопки, надписи капсом */

  --tracking-label: 0.2em;   /* разрядка у надписей капсом */
  --tracking-title: 0.06em;  /* разрядка у заголовков */

  /* ---------- Форма и отступы ---------- */
  --radius-card: 4px;
  --radius-pill: 999px;
  --gap: 16px;
  --section-pad: clamp(56px, 8vw, 96px);
  --container: 1240px;

  /* ---------- Движение ---------- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --duration: 0.35s;
}

@media (min-width: 768px) {
  :root { --gap: 32px; }
}
