/* base.css — сброс, шрифты, типографика, сетка, body. Мобайл-first. Зависит от tokens.css. */

/* ── Self-host шрифты (нулевой зарубежный egress; woff2 заливаются в assets/fonts/) ── */
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-Regular.woff2") format("woff2");
  font-weight: 400; font-display: swap; font-style: normal;
}
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-Medium.woff2") format("woff2");
  font-weight: 500; font-display: swap; font-style: normal;
}
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-SemiBold.woff2") format("woff2");
  font-weight: 600; font-display: swap; font-style: normal;
}
@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-Bold.woff2") format("woff2");
  font-weight: 700; font-display: swap; font-style: normal;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/source-serif/SourceSerif4-Regular.woff2") format("woff2");
  font-weight: 400; font-display: swap; font-style: normal;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("/assets/fonts/source-serif/SourceSerif4-SemiBold.woff2") format("woff2");
  font-weight: 600; font-display: swap; font-style: normal;
}

/* ── Сброс ── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body, h1, h2, h3, h4, p, ul, ol, li, figure, blockquote { margin: 0; padding: 0; }
/* Списки сбрасываем ТОЧЕЧНО (Б7: глобальный reset убил бы маркеры в юр-документах) */
.site-menu ul, .cards, .plain-list, .steps, .faq-list, .site-footer__legal ul { list-style: none; padding: 0; }
img, picture, svg { max-width: 100%; display: block; }
img { height: auto; }  /* P1-12: против искажения при HTML width/height */
button, input, textarea, select { font: inherit; color: inherit; }
a { color: inherit; }

/* Юр-документы: маркеры списков возвращаются (Б7) */
.legal-content ul { list-style: disc; padding-inline-start: 1.5rem; }
.legal-content ol { list-style: decimal; padding-inline-start: 1.5rem; }
.legal-content li + li { margin-top: var(--space-2); }

/* ── Body ── */
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: var(--fw-regular);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-wrap: anywhere;      /* перенос длинных email/URL/реквизитов (Геша) */
  min-height: 100vh;            /* fallback для старых браузеров (Б11) */
  min-height: 100svh;           /* small viewport unit для мобильных панелей */
}

/* ── Типографика ── */
h1, h2, h3 { line-height: var(--lh-head); font-weight: var(--fw-bold); color: var(--ink); }
h1 { font-size: var(--fs-h1); letter-spacing: -0.01em; }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-weight: var(--fw-semibold); }
p { font-size: var(--fs-body); }

a { text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { text-decoration-color: var(--cta-press); }

strong, b { font-weight: var(--fw-semibold); }

/* ── Контейнер (читаемая колонка, мобайл-first) ──
   ТОЛЬКО .section — НЕ main>section (Б1: иначе hero и #funnel-root,
   будучи прямыми <section>, схлопнулись бы в узкую колонку 720px). */
.section {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
  padding-block: var(--space-7);
}

/* ── Единый видимый фокус (Б20; для CTA, burger, FAQ, cookie-кнопок, полей, тарифов) ── */
:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: var(--focus-width) solid var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-radius: var(--radius-sm);
}
/* На тёмном hero фокус-кольцо светлое (Б4) */
.site-header[data-variant="on-hero"] :where(a, button):focus-visible,
.hero :where(a, button):focus-visible {
  outline-color: var(--ink-on-dark);
}

/* ── Progressive enhancement: меню (Б3, Б4, Б14) ──
   Без JS меню видимо строкой. Бургер и скрытие меню включаются ТОЛЬКО когда
   menu.js поставил .menu-ready (после регистрации обработчиков) — иначе при
   упавшем JS остался бы нерабочий бургер и скрытое меню. */
.burger { display: none; }
html.menu-ready .burger { display: inline-flex; }
html.menu-ready .site-menu { display: none; }

html:not(.menu-ready) .site-header { flex-wrap: wrap; }
html:not(.menu-ready) .site-menu { flex: 1 0 100%; }
html:not(.menu-ready) .site-menu ul { justify-content: flex-start; }

/* ── Утилиты ── */
.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
[hidden] { display: none !important; }