/* ============================================================
   modify.by — общая тема: шрифты, токены, базовая типографика,
   кнопки, фокус. Подключается на витрине и на всех подстраницах.
   ============================================================ */

/* ---- Шрифты (самохостинг, latin + cyrillic, OFL) ---- */
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/manrope-700-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;src:url("/fonts/manrope-700-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:"Manrope";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/manrope-800-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Manrope";font-style:normal;font-weight:800;font-display:swap;src:url("/fonts/manrope-800-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:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/inter-400-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/inter-400-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:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/inter-500-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/inter-500-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:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/inter-600-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/inter-600-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;}

:root {
  /* --- Фоны: двухуровневость по вертикали ---
     Центральная колонка с контентом — тёмная (--bg-deep), поля по бокам
     светлее (--bg), переход между ними мягкий (см. body::before). */
  --bg:        #1B1E24;   /* поля по бокам — светлый уровень */
  --bg-deep:   #101216;   /* колонка с контентом — тёмный уровень */
  --bg-hero:   #101216;   /* утилити-полоса, шапка, футер — во всю ширину */
  --bg-elev:   #1C1F26;   /* всплывающие панели: модалка, заявка */
  --surface:   #23272F;   /* карточки, панели */
  --surface-2: #2A2F39;   /* инпуты, чипы, hover-поверхности */

  /* --- Линии и текст --- */
  --line:        rgba(255,255,255,.09);
  --line-strong: rgba(255,255,255,.16);
  --text:    #F3F4F6;
  --muted:   #9BA3B2;
  --muted-2: #6E7686;

  /* --- Бренд-красный (точное значение из вектора бренд-бука) --- */
  --red:      #DB012A;
  --red-600:  #AE0121;                 /* hover / pressed */
  --red-soft: #FF5C78;                 /* красный текст и ссылки на тёмном */
  --red-tint: rgba(219,1,42,.14);      /* мягкий фон активного пункта */
  --red-ring: rgba(219,1,42,.34);      /* фокус-кольцо, свечения */

  /* --- Тёплые нейтрали из брендбука --- */
  --kraft:       #C9A981;
  --kraft-tint:  rgba(201,169,129,.16);
  --ivory:       #F4EFE7;              /* фон светлых секций-передышек */
  --ivory-ink:   #1A1712;              /* текст на ivory */
  --ivory-muted: #6B6154;              /* приглушённый текст на ivory */
  --thumb:       #EDE7DE;              /* подложка миниатюры товара */

  /* --- Статусы --- */
  --ok:     #35C08A;
  --warn:   #E7A93B;
  --danger: #F0596A;

  /* --- Форма и тень --- */
  --radius:      14px;
  --radius-sm:   10px;
  --radius-pill: 999px;
  --shadow:      0 12px 34px rgba(0,0,0,.38);
  --shadow-red:  0 10px 30px rgba(219,1,42,.28);

  /* --- Шкала отступов (4px) --- */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px;
  --s8:32px; --s10:40px; --s12:48px; --s16:64px;
  --container:1200px; --gutter:20px;

  /* --- Шрифты --- */
  --font-head:"Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --font-body:"Inter",   -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

h1, h2, h3 { font-family: var(--font-head); font-weight: 800; letter-spacing: -.015em; }

/* --- Фокус: одно кольцо на весь сайт --- */
:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--red-ring); border-radius: var(--radius-sm); }

/* --- Кнопки --- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s2);
  min-height: 44px; padding: 12px 22px; border-radius: var(--radius-pill);
  font-family: var(--font-head); font-size: 15px; font-weight: 700; line-height: 1;
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  transition: background-color .16s, border-color .16s, color .16s, transform .16s, box-shadow .16s;
}
.btn-primary { background: var(--red); color: #fff; box-shadow: var(--shadow-red); }
.btn-primary:hover { background: var(--red-600); }
.btn-primary:active { transform: translateY(1px); }
.btn-ghost { background: transparent; color: var(--text); border-color: var(--line-strong); }
.btn-ghost:hover { border-color: var(--red); color: var(--red-soft); }
.btn-sm { min-height: 38px; padding: 9px 16px; font-size: 14px; }

/* --- Уважение к настройкам движения --- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
}