/* ЧИСТОЗВУК — вариант в стиле «Земляк v4» (розовый speech).
   Источник: ~/Sites/zemlyak-v4 на маке — соседний лендинг VPN, собранный
   на Tailwind 3. Здесь перенесён СТИЛЬ, а не стек: палитра, типографика,
   подложка героя, трактовка карточки и кнопки. Пересобирать наши девять
   страниц на Tailwind ради этого не нужно — вся система и так на токенах.

   Снято из скомпилированного styles.css (21 КБ) и разметки:
     сигнал      #C52062, hover #A81B53
     нейтраль    zinc: #09090B / #27272A / #71717A / #D4D4D8 / #E4E4E7 / #F4F4F5 / #F8F8F9
     розовая подложка #FDEDF3, розовая рамка #E6C7D6, тёмная слива #2A0B18
     гарнитура   Golos Text 400–700 (кириллица есть), моно — системный
     дисплей     clamp(40px,5.2vw,64px) / 1.02 / -.03em / 700
     карточка    радиус 14px, рамка 1px #E4E4E7, белая, поле 24px
     кнопка      пилюля, поле 12px 24px, кегль 14px, min-height 48px
   Контраст каждой текстовой пары измерен по WCAG, все проходят AA. */

:root {
  /* ===== ПАЛИТРА ===== */
  --canvas: #FFFFFF;             /* холст. ink на нём 19.90:1 */
  --paper: #FFFFFF;              /* карточка — та же белая, отделяется рамкой, не заливкой */
  --island: #F4F4F5;             /* утопленная поверхность */
  --ink: #09090B;                /* заголовки. 19.90:1 на холсте */
  --text: #27272A;               /* тело. 14.89:1 на холсте, 14.03:1 на полосе */
  --secondary: #71717A;          /* подписи и оговорки. 4.83:1 на холсте, 4.55:1 на полосе */
  --hairline: #E4E4E7;           /* разделитель и рамка карточки, 1px */
  --hairline-strong: #D4D4D8;    /* тот же разделитель на hover соседа */
  --panel-bg: #2A0B18;           /* тёмная слива — заливка одной плитки в ряду чисел */
  --panel-text: #FFFFFF;         /* 18.11:1 на сливе */
  --panel-text-muted: #E6C7D6;   /* 11.65:1 на сливе */
  --panel-hairline: rgba(255,255,255,.18);
  --accent-decor: #C52062;       /* дорожка «После», штрих, точка */
  --accent-text: #C52062;        /* ссылки. 5.59:1 на холсте, 5.27:1 на полосе */
  --accent-hover: #A81B53;       /* 7.13:1 на холсте */
  --band: #F8F8F9;               /* полоса-чередование */
  --accent-wash: #FDEDF3;        /* розовая подложка: под иконку, под выделенную колонку */
  --signal: #C52062;             /* целевое действие */
  --signal-hover: #A81B53;
  --signal-ink: #FFFFFF;         /* 5.59:1 на заливке сигнала */
  --pink-line: #E6C7D6;          /* розовая рамка выделенного блока */
  --grain-opacity: .06;          /* шум поверх подложки героя, mix-blend-mode:overlay */
  --shadow: rgba(9,9,11,.10);

  /* ===== ГАРНИТУРЫ ===== */
  --font-display: "Golos Text", "Inter", system-ui, sans-serif;
  --font-text: "Golos Text", "Inter", system-ui, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
  --weight-strong: 700;
  --weight-medium: 600;
  --weight-regular: 400;

  /* ===== КЕГЛИ — текучие, как в источнике ===== */
  --fs-h1: clamp(40px, 5.2vw, 64px);   --fs-h1-mob: clamp(40px, 5.2vw, 64px);
  --fs-h2: clamp(32px, 3.4vw, 46px);   --fs-h2-mob: clamp(32px, 3.4vw, 46px);
  --fs-h3: 20px;       --fs-h3-mob: 19px;
  --fs-h4: 17px;       --fs-h4-mob: 16px;
  --fs-lead: 18px;     --fs-lead-mob: 17px;
  --fs-text: 16px;
  --fs-small: 14px;
  --fs-caption: 13px;  --fs-caption-mob: 12px;
  --fs-num: 44px;      --fs-num-mob: 34px;
  --fs-eyebrow: 11px;

  --track-display: -0.03em;
  --track-heading: -0.025em;
  --track-eyebrow: .18em;
  --track-num: -.02em;

  /* ===== ОТСТУПЫ ===== */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-7: 32px;  --sp-8: 48px;
  --sp-9: 64px;  --sp-10: 80px; --sp-11: 112px; --sp-12: 160px;
  --gap-grid: 24px;
  --gap-opis: 28px;
  --gap-head: 40px;
  --gap-row: 72px;

  --rhythm-tight-top: 64px;       --rhythm-tight-bottom: 56px;
  --rhythm-tight-top-mob: 48px;   --rhythm-tight-bottom-mob: 40px;
  --rhythm-base-top: 112px;       --rhythm-base-bottom: 80px;
  --rhythm-base-top-mob: 72px;    --rhythm-base-bottom-mob: 56px;
  --rhythm-major-top: 160px;      --rhythm-major-bottom: var(--rhythm-base-bottom);
  --rhythm-major-top-mob: 112px;  --rhythm-major-bottom-mob: var(--rhythm-base-bottom-mob);

  --container-max: 1200px;
  --pad-narrow: 20px;
  --pad-mid: 40px;
  --pad-wide: 60px;
  --header-h: 72px;      --header-h-mob: 60px;
  --measure-narrow: 46ch;
  --measure-book: 62ch;

  /* ===== РАДИУСЫ ===== */
  --radius-flat: 6px;
  --radius-plate: 14px;
  --radius-pill: 999px;

  /* ===== ДВИЖЕНИЕ ===== */
  --dur-fast: 180ms;
  --dur-base: 240ms;
  --dur-reveal: 420ms;
  --ease-standard: cubic-bezier(.4,0,.2,1);

  --grain-uri: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}