/* Ukids КЭВ — токены 2026 «Тёплая академия».
   Единственный источник значений для нового визуального мира.
   Спецификация: DESIGN-SYSTEM-2026.md. Прежний tokens.css не подключать вместе с этим. */

@font-face{font-family:'FuturaPT';src:url('fonts/FuturaPT-Book.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'FuturaPT';src:url('fonts/FuturaPT-Medium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'FuturaPT';src:url('fonts/FuturaPT-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}

:root{
  --check-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.4 4.6 9 10 3.2' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* ---- база ---- */
  --bg:#F7F4EE;
  --bg-warm:#F0E9DC;
  /* фон подложки мокапа планшетов: снят пипеткой с самой картинки,
     чтобы секция и изображение сливались без видимой вставки */
  --bg-lesson:#DAE1B9;
  --bg-card:#FFFFFF;
  --ink:#12241F;
  --ink-soft:#5A6B64;
  --line:#E2DCD0;
  --line-dark:#2C4139;
  /* полотно тёмных секций — изумруд ADR-007 из design-system/tokens.css */
  --canvas:#19372C;
  /* Ступени текста и линий НА тёмном полотне. До этого они жили хардкодом в
     diagnostic-page.css (26 значений), поэтому полотно нельзя было поменять
     одним движением, а близкие оттенки размножались. */
  --on-canvas:#DCEAE5;        /* список преимуществ, самый светлый текст */
  --on-canvas-soft:#C6DDD6;   /* подписи и лид на полотне */
  --on-canvas-mute:#B7C6C0;   /* третичный текст, примечания */
  --on-canvas-dim:#8FA69E;    /* надстрочники, зачёркнутая цена, микроподписи */
  --canvas-line-strong:#3C5850; /* граница выделенной плитки на полотне */
  --energy-hover:#DCB863;     /* золото при наведении */
  --energy-deep:#4A3B12;      /* текст на золотой заливке */

  /* ---- бренд ---- */
  --brand:#006456;
  --brand-deep:#00433A;
  --brand-soft:#E1EDE8;

  /* ---- энергия: золото герба ---- */
  --energy:#E8C87E;        /* только заливка — 1.47:1 на базе */
  --energy-ink:#8A6A1C;    /* золото как текст на бумаге — 4.60:1 */
  --energy-lift:#F2E0B4;   /* золото как мелкий текст на изумруде — 5.44:1 */

  /* ---- диагностическая шкала: пороги и заливки по контракту ---- */
  --dg-low:#d95a49;
  --dg-mid:#d4a237;
  --dg-high:#299f6a;
  --dg-low-ink:#B23F30;
  --dg-mid-ink:#8A6A1C;
  --dg-high-ink:#1A6E4C;   /* ступень green-700: 5,1:1 на светлой зелёной плашке */

  /* ---- типографика ---- */
  --font:'FuturaPT',-apple-system,'Segoe UI',Arial,sans-serif;
  --fs-display:clamp(40px,4.6vw,60px);
  --fs-h2:clamp(30px,3.6vw,48px);
  --fs-h3:24px;
  --fs-body-lg:19px;
  --fs-body:17px;
  --fs-caption:14px;
  --fs-label:12px;
  --fs-stat:clamp(44px,5vw,64px);

  /* ---- пространство ---- */
  --container:1120px;
  --pad-x:max(24px,calc((100vw - var(--container)) / 2));
  --s-4:4px;  --s-8:8px;   --s-12:12px; --s-16:16px; --s-24:24px;
  --s-32:32px;--s-48:48px; --s-64:64px; --s-96:96px; --s-120:120px; --s-160:160px;
  --section-y:120px;
  --section-y-m:72px;

  /* ---- форма ---- */
  --r-tag:8px;
  --r-media:20px;
  --r-card:24px;
  --r-pill:999px;
  --shadow:0 14px 36px rgba(18,36,31,.09);
  --shadow-brand:0 14px 36px rgba(0,100,86,.16);

  /* ---- движение ---- */
  --ease:cubic-bezier(.2,.7,.3,1);
  --dur:260ms;
}

@media (max-width:760px){
  :root{
    --fs-display:32px;
    --fs-h2:27px;
    --fs-body-lg:18px;
    --section-y:var(--section-y-m);
  }
}

@media (prefers-reduced-motion:reduce){
  :root{--dur:1ms}
}