/* =============================================================================
   L2H дизайн токени — ЕДИНСТВЕНИЯТ източник на цветове/шрифтове/отстояния
   за целия сайт. Нула цветове или шрифтове извън този файл.

   Статус на всеки токен:
   - „потвърден"  — стойността е извадена дословно от рендър CSS-а на
     двигателя (templates/l2h_growth_report.html.j2, l1_variant_*.html.j2,
     l2h_growth_report_static.html) — визуалната фамилия на докладите.
   - „начален"    — placeholder, чака Figma variables; лесно обратим.
   ============================================================================= */
:root {
  /* --- Злато ---------------------------------------------------------- */
  /* начален — зададен от Възложителя за уеба; чака Figma. ЗАБЕЛЕЖКА:
     рендер CSS-ът на двигателя НЕ съдържа #cda24c — докладното злато е
     #c9a961 (по-долу); разминаването е докладвано като находка. */
  --color-gold: #cda24c;
  /* потвърден — основното злато на L2 доклада (l2h_growth_report.html.j2) */
  --color-gold-report: #c9a961;
  /* потвърден — златото на L1 вариантите (l1_variant_*.html.j2) */
  --color-gold-l1: #c5a55a;
  /* потвърден — светло злато от докладите */
  --color-gold-light: #d9be7a;
  /* потвърден — дълбоко злато от докладите */
  --color-gold-deep: #b49350;

  /* --- Тъмни (мастило) ------------------------------------------------- */
  /* потвърден — най-тъмният фон/мастило на докладите (L2 + L1) */
  --color-ink: #0f0f11;
  /* потвърден — вторият тъмен тон на докладите */
  --color-ink-soft: #1a1a1a;
  /* потвърден — сивото на основния текст в докладите */
  --color-text: #4a4a4a;
  /* потвърден — приглушен текст/детайли от докладите */
  --color-text-muted: #b8b5ad;

  /* --- Крем (фонове) ---------------------------------------------------- */
  /* потвърден — основният крем фон на докладите */
  --color-cream: #f8f2e4;
  /* потвърден — най-светлият крем (почти бяло) от докладите */
  --color-cream-bright: #fafaf7;
  /* потвърден — дълбокият крем акцент от докладите */
  --color-cream-deep: #ede6d4;
  /* потвърден — меката граница/линия от докладите */
  --color-border-soft: #d8d4ca;
  /* потвърден — сивото на мокъп панелите/плейсхолдърите в дизайна
     (1:51, 1:458) — ползва се и с alpha */
  --color-mock-gray: #d9d9d9;
  /* потвърден — чисто бяло, използвано в докладите */
  --color-white: #ffffff;
  /* потвърден — мекото почти-бяло на панелния текст (1:434, 1:457) */
  --color-white-soft: #fbfbfb;

  /* --- Семантични ------------------------------------------------------- */
  /* потвърден — зеленото „успех" от статичния L2 шаблон */
  --color-success: #5cb85c;
  /* потвърден — червеното „внимание" от статичния L2 шаблон */
  --color-danger: #d9534f;

  /* --- Шрифтове --------------------------------------------------------- */
  /* потвърден — Jost е текстовият шрифт на дизайна (одит 2026-07-29);
     self-host woff2 в static/fonts/ (OFL лиценз до файловете), нула CDN */
  --font-sans: "Jost", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* начален — placeholder за заглавния шрифт; чака лицензно решение:
     Argent CF (платен, Connary Fagen) или свободна алтернатива с кирилица
     (кандидати от одита: Fraunces, Cormorant) */
  --font-display: Georgia, "Times New Roman", serif;
  /* потвърден като фамилията на PDF докладите (рендър CSS-а на двигателя);
     за уеб заглавията се ползва --font-display, не този */
  --font-serif: Georgia, "Times New Roman", serif;

  /* --- Типографска стълбица --------------------------------------------- */
  /* начални — работна скала, чака Figma */
  --text-xs: 0.75rem;
  /* потвърден — 14px: eyebrow-ите и чекбокс текстовете (Body XS) */
  --text-sm: 0.875rem;
  /* потвърден — 15px: етикетите на бутоните и дребните подсказки (Button) */
  --text-btn: 0.9375rem;
  /* потвърден — 16px: телата на картите и списъците (Body M) */
  --text-base: 1rem;
  /* потвърден — 17px: отговорите във FAQ и по-дългите тела (Body L) */
  --text-body-l: 1.0625rem;
  /* потвърден — 18px: водещите параграфи (Subheading L) */
  --text-lg: 1.125rem;
  /* потвърден — 20px: въпросите във FAQ акордеона (1:742…) */
  --text-xl: 1.25rem;
  /* потвърден — 24px: субзаглавията на статистиките (1:422/1:427/1:432) */
  --text-2xl: 1.5rem;
  /* потвърден — 28px: заглавията на proof картите (1:49, 1:719) */
  --text-xxl: 1.75rem;
  /* потвърден — 32px: заглавията на ценовите карти (1:529/1:566/…) */
  --text-3xl: 2rem;
  /* потвърден — 48px: секционните H2 в дизайна (и Figma variable
     „Text Sizes/Heading 2" = 48) */
  --text-4xl: 3rem;
  /* потвърден — 64px: hero заглавието и числата 6/24/0–100 */
  --text-5xl: 4rem;

  /* --- Отстояния --------------------------------------------------------- */
  /* начални — 4px базова стъпка, чака Figma */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* --- Форма -------------------------------------------------------------- */
  /* начален — базов радиус (дребни елементи), чака Figma */
  --radius: 4px;
  /* потвърден — 14px: радиусът на CTA бутоните в дизайна (1:355, 1:380) */
  --radius-btn: 14px;
  /* потвърден — 8px: снимките в „От въпросник до доклад" (1:460) */
  --radius-md: 8px;
  /* потвърден — 16px: широките секционни панели (1:435) */
  --radius-panel: 16px;
  /* потвърден — 18px: портрети/декоративни кантове (1:495) */
  --radius-lg: 18px;
  /* потвърден — 32px: ценовите карти (1:522/1:559/1:609/1:654/1:701) */
  --radius-card: 32px;
  /* потвърден — 1332px: широката съдържателна колона на дизайна */
  --container-max: 85.25rem;    /* 1364 = съдържание 1332 + 2×16 поле */
  /* потвърден — 1132px: тясната съдържателна колона (1:408, 1:434, 1:495) */
  --container-narrow: 72.75rem; /* 1164 = съдържание 1132 + 2×16 поле */

  /* --- Тъмна повърхностна гама (сайтът е тъмна тема) ---------------------- */
  /* Седемте сурови сиви от одита, сведени до семантични роли; стойностите
     са потвърдени (дословно от дизайна), РОЛИТЕ са начални — именувани по
     наблюдаваната употреба, чакат потвърждение при секционните импорти. */
  /* потвърден — черно: доказано с пикселен анализ на export рендера на
     Desktop-4 (най-тъмните проби в празните полета падат до ~#020201,
     което изключва по-светъл плътен fill; повдигането идва от глоу/линии
     блеед); съгласувано и с hero overlay-я, който завършва в черно */
  --surface-base: #000000;
  /* потвърден — фон на ценовите карти (1:510) */
  --surface-card: #1c1c1c;
  /* потвърден — футър картата (1:855; в дизайна с alpha 0.61) */
  --surface-footer: #191919;
  /* потвърден — чекбоксовете на контактната форма (1:844) */
  --color-input-border: #bdbdbd;
  /* потвърден — по-светъл панел: FAQ (1:733) */
  --surface-soft: #2b2b2b;
  /* потвърден — панели/карти в 1:434, 1:719, 1:791 */
  --surface-panel: #3c3c3c;
  /* потвърден — нав контейнера и икона-бутоните (в дизайна с alpha 0.4) */
  --surface-veil: #393939;
  /* потвърден — фон на сивите вторични бутони („Свържете се…", 1:510) */
  --surface-action-muted: #535353;
  /* потвърден КАТО СТОЙНОСТ — „Виж нивата" (hero 1:363); в Figma това е
     Disabled/Dark вариант, ползван като нормален бутон — дефект, докладван
     на дизайн екипа; тук е буквален импорт до фикса */
  --surface-action-dark: #474a52;
  /* потвърден — приглушени елементи върху тъмното (1:719) */
  --text-faint: #767676;

  /* --- Градиентно злато и акценти (CTA, декори) --------------------------- */
  /* потвърден — тъмният край на CTA градиента */
  --color-gold-grad-end: #865f10;
  /* потвърден — 2px кант на градиентните CTA бутони */
  --color-gold-border: #8f6717;
  /* потвърден — светъл златен акцент (1:719) */
  --color-gold-bright: #ffc249;
  /* потвърден — оранжевият акцент: hero overlay, glow, декоративни кантове */
  --color-accent-orange: #d97b15;
  /* начален КАТО ЪГЪЛ: дизайнът има два ъгъла (155.93°/144.92°) — дефект,
     докладван на дизайн екипа; тук един ъгъл до унификация */
  --gradient-gold: linear-gradient(156deg, var(--color-gold) 5%, var(--color-gold-grad-end) 97%);
  /* потвърден — hero overlay: оранжево 60% → черно 60% до 47.9% (1:331) */
  --gradient-hero-overlay: linear-gradient(
    180deg,
    color-mix(in srgb, var(--color-accent-orange) 60%, transparent) 0%,
    rgba(0, 0, 0, 0.6) 47.9%
  );

  /* --- Фонови ефекти (целият сайт под hero) ------------------------------- */
  /* потвърден — вертикалните линии: бяло на 10% (stroke-opacity 0.1) */
  --color-line: color-mix(in srgb, var(--color-white) 10%, transparent);
  /* разделителни линии в акордеона и футъра (Figma 15:2376 / 15:2877) */
  --color-divider: #2b2b2b;
  /* по-тъмната линия на акордеона (Figma „color-gray-900") */
  --color-divider-dark: #1c1c1c;
  /* светлият чип на етикета в блога (Figma 26:3236) */
  --color-tag-bg: #eeeeee;
  /* потвърден — глоу правоъгълниците: злато на 66% (rgba(205,162,76,0.66)),
     с blur 150px в слоя */
  --glow-gold: color-mix(in srgb, var(--color-gold) 66%, transparent);

  /* --- Типографски детайли ------------------------------------------------ */
  /* потвърден (редизайн 15:1771) — eyebrow: 1.96px при 14px = 0.14em */
  --tracking-eyebrow: 0.14em;
  /* потвърден — етикетите на бутоните: 0.32px при 16px = 0.02em */
  --tracking-btn: 0.02em;
  /* потвърден — текстовата сянка върху тъмните секции */
  --shadow-text: 0 0 5.9px rgba(0, 0, 0, 0.5);
  /* потвърден — оранжевото сияние на featured ценовата карта (1:559) */
  --shadow-featured: -1px 15px 13.9px 0 color-mix(in srgb, var(--color-accent-orange) 34%, transparent);
}

/* =============================================================================
   Self-hosted шрифтове (нула външни заявки — ЕС хостинг, §12).
   Jost: Google Fonts, OFL лиценз — static/fonts/OFL-Jost.txt.
   Uprights са ЕДИН вариативен woff2 (wght 100–900); италикът е отделен.
   ============================================================================= */
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/jost-variable-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Jost";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/jost-variable-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: "Jost";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jost-italic-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Jost";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jost-italic-cyrillic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}