/* EngineXpress. Единая настройка шрифтов, цветов текста и отступов в духе крупных маркетплейсов.
   Подключается последним на всех страницах и переопределяет общие правила.
   Принципы:
   1. Текст одного цвета, а важность задаётся прозрачностью: основной 100%, второстепенный 64%, подписи 46%.
   2. Жирность умеренная: заголовки 700, подписи и навигация 500 с прозрачностью, обычный текст 400.
   3. Заголовки небольшие и плотные, отступы между блоками компактные, контент собран в скруглённые панели. */

:root {
  --ink: #0b1033;
  --ink-2: rgba(11, 16, 51, .64);
  --ink-3: rgba(11, 16, 51, .46);
  --line: rgba(11, 16, 51, .09);
  --line-strong: rgba(11, 16, 51, .3);
  --bg-alt: #f2f3f7;
  --bg-sunken: #e9ebf1;
  --on-brand-muted: rgba(255, 255, 255, .66);
  --sec-y: 56px;
  --block-gap: 24px;
}

body { font-size: 16px; line-height: 24px; letter-spacing: 0; }

/* ---------- Заголовки ---------- */
.hero__title { font-size: 48px !important; line-height: 52px !important; letter-spacing: -.025em !important; }
.sec__title, .finder__title, .warranty__title, .cat__title, .doc h1, .page-title { font-size: 28px !important; line-height: 34px !important; letter-spacing: -.015em !important; font-weight: 700 !important; }
.cat__title, .doc h1 { font-size: 30px !important; line-height: 36px !important; }
.pinfo__title { font-size: 24px; line-height: 30px; letter-spacing: -.01em; }
.ex-lead__title { font-size: 24px; line-height: 30px; letter-spacing: -.01em; }
.psec__title, .cat__seo h2, .doc h2, .pabout__head h2 { font-size: 20px !important; line-height: 26px !important; letter-spacing: -.005em; }
.cat__vin h2, .cat__empty h2 { font-size: 20px; line-height: 26px; }
.pterms h3, .doc h3, .buy__deliv h2 { font-size: 16px; line-height: 22px; font-weight: 600; }

/* ---------- Второстепенный текст: тот же цвет, меньше прозрачность ---------- */
.sec__lead, .hero__lead, .finder__lead, .cat__seo p, .psec__text, .doc p, .doc li, .info__lead { font-size: 16px !important; line-height: 24px !important; }
.hero__lead { font-size: 17px !important; line-height: 26px !important; max-width: 460px; }
.info__lead { color: var(--ink-2) !important; }
.sec__lead { margin-top: 8px; }

/* Навигация и подписи: средняя жирность с прозрачностью */
.hsub a, .crumbs a, .tree__a, .tree__b, .tree__m, .info__nav a, .prod__tabs a, .prod__tool, .hact__a, .ex-footer a { font-weight: 500; }
.hsub a, .crumbs a, .prod__tabs a, .info__nav a { color: var(--ink-2); }
.hsub a:hover, .crumbs a:hover, .prod__tabs a:hover, .info__nav a:hover { color: var(--ink); }
.crumbs { padding: 16px 0 12px; }
.crumbs ol { font-size: 14px; color: var(--ink-3); }
.hact__a { color: var(--ink-2); font-weight: 500; }
.hact__a .ex-ic { color: var(--ink); opacity: .8; }
.hact__a:hover .ex-ic { color: var(--brand); opacity: 1; }
.pvar__label, .pabout__list dt, .pspecs dt, .buy__deliv dd, .info__req dt { color: var(--ink-3); }
.pabout__list dd, .pspecs dd { color: var(--ink); }
.tree__a span, .tree__b span, .tree__m span, .flt .ex-check i, .cat__next-a span { color: var(--ink-3); font-weight: 500; }
.flt__g legend { font-size: 15px; font-weight: 600; }
.ex-check { color: var(--ink); }

/* Карточка товара в списках */
.pcard__title { font-size: 16px; line-height: 22px; font-weight: 500; }
.pcard__fit { color: var(--ink-2); font-size: 14px; line-height: 20px; }
.pcard__mf { color: var(--ink-3); }
.pcard .ex-specs li { color: var(--ink-2); font-weight: 500; }
.pcard .ex-price { font-size: 20px; line-height: 26px; font-weight: 700; letter-spacing: -.01em; }
.pcard__body { gap: 4px; padding-top: 12px; }
.pcard__code { font-weight: 700; }

/* Кнопки: средняя жирность, как у маркетплейсов */
.ex-btn { font-weight: 600; letter-spacing: 0; }
.ex-btn--sm { font-weight: 500; }

/* Цены */
.ex-price { font-weight: 700; letter-spacing: -.01em; }
.buy__price .ex-price--lg { font-size: 32px; line-height: 38px; }

/* ---------- Отступы между блоками ---------- */
.sec { padding: var(--sec-y) 0; }
.sec__head { margin-bottom: var(--block-gap); }
.sec > .wrap > .sec__title { margin-bottom: var(--block-gap); }
.hero { padding-top: 24px; }
.hero__grid { gap: 40px; }
.hero__actions { margin-top: 28px; }
.hero__brands { padding-top: 32px; padding-bottom: 32px; }
.stock { padding-top: 8px; }
.stock__head { margin-bottom: var(--block-gap); }
.stock__grid { gap: 28px 16px; }
.finder { padding-top: 24px; }
.finder__box { padding: 36px 40px; border-radius: 20px; }
.finder__top { margin-bottom: 24px; }
.steps, .warranty { padding: var(--sec-y) 0; }
.final { padding: var(--sec-y) 0; }

/* Каталог */
.cat { padding-bottom: 56px; }
.cat__head { margin-bottom: 20px; }
.cat__layout { gap: 32px; }
.cat__grid { gap: 28px 16px; }
.cat__bar { margin-bottom: 16px; }
.cat__seo { margin-top: 56px; padding-top: 32px; }
.cat__vin { padding: 24px 28px; border-radius: 20px; }
.pager { margin-top: 32px; }
.tree__a, .tree__b { padding: 8px 12px; }

/* Карточка товара */
.prod { padding-bottom: 56px; }
.prod__top { gap: 28px; }
.prod__tabs { margin-top: 48px; }
.psec { padding-top: 36px; }
.psec__title { margin-bottom: 16px; }
.prel { margin-top: 56px; }
.prel__grid { gap: 28px 16px; }
.buy__box, .buy__deliv { border-radius: 20px; }
.pvar { margin-top: 20px; }
.pabout { margin-top: 28px; }

/* Информационные страницы */
.info { padding-bottom: 56px; }
.info__layout { gap: 40px; }
.doc h2 { margin: 32px 0 10px !important; }
.info__photo, .lead-block { margin: 32px 0 !important; }
.lead-block { border-radius: 20px; padding: 32px; }

/* Панели и скругления: одна система, без лишних теней */
.ex-lead { border-radius: 20px; }
.ex-lead__form { border-radius: 16px; }
.ex-faq summary { font-size: 16px; font-weight: 500; padding: 18px 0; }
.ex-faq p { color: var(--ink-2); }
.ex-footer h4 { color: rgba(255, 255, 255, .5); font-weight: 500; }

@media (max-width: 860px) {
  :root { --sec-y: 40px; --block-gap: 20px; }
  .hero__title { font-size: 34px !important; line-height: 38px !important; }
  .sec__title, .finder__title, .warranty__title, .cat__title, .doc h1 { font-size: 24px !important; line-height: 30px !important; }
  .finder__box { padding: 24px 18px; }
  .pinfo__title { font-size: 22px; line-height: 28px; }
}

/* ---------- Уведомление о cookie: компактная светлая полоска в стиле сайта ---------- */
.cookie { position: fixed; left: 24px; bottom: 24px; z-index: 90; display: flex; align-items: center; gap: 16px; max-width: 520px; padding: 12px 12px 12px 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg); box-shadow: 0 8px 28px rgba(11, 16, 51, .14);
  opacity: 0; transform: translateY(16px); transition: opacity .45s var(--ease), transform .6s var(--ease); }
.cookie.is-shown { opacity: 1; transform: none; }
.cookie[hidden] { display: none; }
.cookie__text { flex: 1; font-size: 14px; line-height: 20px; color: var(--ink-2); }
.cookie__text a { color: var(--brand); font-weight: 500; text-decoration: none; white-space: nowrap; }
.cookie__text a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cookie__ok { flex: none; height: 38px; padding: 0 18px; }
@media (max-width: 860px) {
  .cookie { left: 12px; right: 12px; max-width: none; bottom: calc(84px + env(safe-area-inset-bottom)); padding: 10px 10px 10px 14px; }
  .cookie__text { font-size: 13px; line-height: 18px; }
}

/* Первый экран ниже: слайдер 5:4 вместо квадрата, меньше пустоты вокруг заголовка */
.hs { aspect-ratio: 5 / 4; border-radius: 20px; }
.odo { font-size: clamp(48px, 6vw, 88px); }
@media (max-width: 860px) { .hs { aspect-ratio: 4 / 3.4; } }

/* ---------- Отклик на наведение: активные элементы мягко приближаются ---------- */
/* Только для устройств с мышью, на телефонах эффекты наведения не нужны */
.ex-btn, .cookie__ok, .chat__send, .chat__q, .chat__ch, .pager__a, .ex-chip, .cat__next-a, .tag,
.pcard, .pcard__media, .pcard__img, .pcard__art, .fmatch, .cmp__card, .mfr li, .checks li, .steps__list li,
.pvar__tile, .gal__thumb, .info__card, .hact__a, .marquee__item a, .marquee__item img, .ph img,
.hs__slide img, .mega__brands a, .mega__sections a, .tree__a, .tree__b, .tree__m, .ex-footer a, .ex-msg, .buy__cheaper, .dd__opt {
  transition-property: transform, box-shadow, background-color, border-color, color, opacity, filter;
  transition-duration: .45s;
  transition-timing-function: var(--ease);
}
.pcard__media { overflow: hidden; isolation: isolate; }
.ph { overflow: hidden; }

@media (hover: hover) and (pointer: fine) {
  /* кнопки: чуть увеличиваются, при нажатии проседают */
  .ex-btn:hover, .cookie__ok:hover, .chat__send:not(:disabled):hover { transform: scale(1.035); }
  .ex-btn:active, .cookie__ok:active, .chat__send:active { transform: scale(.97); transition-duration: .15s; }
  .ex-chip:hover, .cat__next-a:hover, .pager__a:hover, .chat__q:hover, .chat__ch:hover { transform: translateY(-2px); }

  /* карточка товара: превью приближается, карточка приподнимается */
  .pcard:hover { transform: translateY(-4px); }
  .pcard:hover .pcard__img { transform: scale(1.07); }
  .pcard:hover .pcard__art { transform: scale(1.08) translateX(-6px); opacity: .24; }
  .pcard:hover .pcard__media { box-shadow: 0 14px 30px rgba(11, 16, 51, .12); }
  .pcard:hover .pcard__title a { color: var(--brand); }

  /* блоки и плитки */
  .fmatch:hover { transform: translateY(-4px) scale(1.015); }
  .cmp__card:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(11, 16, 51, .12); }
  .mfr li:hover { transform: scale(1.05); background: var(--brand-soft); color: var(--brand); }
  .checks li:hover { transform: translateY(-4px); border-color: var(--brand-tint); box-shadow: 0 12px 28px rgba(11, 16, 51, .08); }
  .steps__list li:hover { border-top-color: var(--brand); }
  .steps__list li:hover .steps__num { color: var(--brand); }
  .pvar__tile:hover { transform: scale(1.04); }
  .gal__thumb:hover { transform: scale(1.06); }
  .info__card:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(11, 16, 51, .08); }
  .buy__cheaper:hover { transform: scale(1.02); }

  /* фото в блоках и слайдер первого экрана */
  .ph:hover img { transform: scale(1.04); }
  .hs:hover .hs__slide.is-active img { transform: scale(1.025); }

  /* логотипы в ленте и ссылки меню */
  .marquee__item a:hover { transform: scale(1.1); }
  .mega__brands a:hover, .mega__sections a:hover { transform: translateX(4px); }
  .tree__a:hover, .tree__b:hover, .tree__m:hover { transform: translateX(3px); }
  .ex-footer a:hover { color: #fff; }
  .ex-msg:hover { transform: scale(1.08); }
  .tag:hover { transform: scale(1.06); }
  .dd__opt.is-active { transform: translateX(3px); }
}

@media (prefers-reduced-motion: reduce) {
  .pcard, .pcard__img, .fmatch, .cmp__card, .mfr li, .checks li, .ex-btn, .ph img, .hs__slide img, .marquee__item a { transform: none !important; transition-duration: .01ms !important; }
}

/* =====================================================================
   Стиль 2: спокойный продуктовый сайт. Крупные заголовки средней жирности,
   светлые цифры, мягкие цветные карточки, предметы на светлом фоне вместо постановочных фото.
   ===================================================================== */
:root {
  --card-blue: #e9effa;
  --card-blue-2: #dbe5f6;
  --card-grey: #f2f2f4;
  --card-dark: #15171c;
  --sec-y: 88px;
  --block-gap: 32px;
}

/* Заголовки: крупнее и легче */
.hero__title { font-size: 56px !important; line-height: 60px !important; font-weight: 600 !important; letter-spacing: -.03em !important; }
.sec__title, .finder__title, .warranty__title, .cat__title, .doc h1 { font-size: 40px !important; line-height: 46px !important; font-weight: 600 !important; letter-spacing: -.025em !important; }
.cat__title, .doc h1 { font-size: 36px !important; line-height: 42px !important; }
.pinfo__title { font-size: 28px; line-height: 34px; font-weight: 600; letter-spacing: -.02em; }
.psec__title, .cat__seo h2, .doc h2, .pabout__head h2 { font-weight: 600; font-size: 22px !important; line-height: 28px !important; }
.sec__lead, .hero__lead, .finder__lead { font-size: 18px !important; line-height: 28px !important; }
.hero__lead { font-size: 19px !important; line-height: 29px !important; }
.sec__title + .sec__lead, .sec__head .sec__lead { margin-top: 12px; max-width: 640px; }

/* Надзаголовок со стрелкой */
.eyebrow { margin-bottom: 14px; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--ink-3); }
.warranty .eyebrow, .finder .eyebrow { color: rgba(255, 255, 255, .55); }

/* Ссылка внизу карточки: стрелка и текст, сверху тонкая линия */
.fcard__link { display: block; width: 100%; margin-top: auto; padding: 18px 0 0; border: 0; border-top: 1px solid rgba(11, 16, 51, .12); background: none; color: var(--ink); font: 600 16px/22px var(--font-sans); text-align: left; text-decoration: none; cursor: pointer; transition: color .3s var(--ease), padding .4s var(--ease); }
.fcard__link:hover { color: var(--brand); padding-left: 4px; }
.fcard--dark .fcard__link { color: #fff; border-top-color: rgba(255, 255, 255, .16); }

/* ---------- Факты ---------- */
.facts__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: var(--block-gap); }
.fcard { display: flex; flex-direction: column; min-height: 380px; padding: 40px; border-radius: 16px; }
.fcard--wide { grid-column: span 2; }
.fcard--half { grid-column: span 2; }
.fcard--blue { background: var(--card-blue-2); }
.fcard--light { background: var(--card-blue); }
.fcard--grey { background: var(--card-grey); }
.fcard--dark { background: var(--card-dark); color: #fff; }
.fcard__num { font-size: 84px; line-height: 1; font-weight: 300; letter-spacing: -.045em; }
.fcard__text { margin: 16px 0 32px; max-width: 520px; font-size: 20px; line-height: 28px; color: var(--ink); }
.fcard--dark .fcard__text { color: rgba(255, 255, 255, .86); }
.fcard--object { display: grid; place-items: center; padding: 24px; }
.fcard--narrow .fcard__num { font-size: 60px; }
.fcard--narrow .fcard__text { font-size: 17px; line-height: 24px; }

/* Предмет: картинка с прозрачным фоном или временная иконка */
.obj { display: block; max-width: 100%; max-height: 240px; margin: 0 auto; object-fit: contain; transition: transform .6s var(--ease); }
.obj--empty { position: relative; display: grid; place-items: center; width: 100%; min-height: 200px; color: var(--brand); }
.obj--empty > .ex-ic { width: 96px; height: 96px; stroke-width: 1; opacity: .35; }
.obj__brief { position: absolute; left: 0; right: 0; bottom: 0; padding: 8px 10px; border-radius: 10px; background: rgba(255, 255, 255, .85); color: var(--ink-2); font-size: 12px; line-height: 16px; text-align: left; }
.obj__brief b { display: block; color: var(--brand); font-weight: 600; }

/* ---------- Сервис: четыре карточки ---------- */
.svc__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: var(--block-gap); }
.svc__card { display: flex; flex-direction: column; min-height: 500px; padding: 32px; border-radius: 16px; background: var(--card-blue); overflow: hidden; }
.svc__card h3 { font-size: 22px; line-height: 28px; font-weight: 600; letter-spacing: -.01em; }
.svc__card p { margin-top: 8px; font-size: 18px; line-height: 26px; color: var(--ink-2); }
.svc__card .fcard__link { margin-top: 20px; padding-top: 0; border-top: 0; font-size: 15px; }
.svc__card .obj { margin-top: auto; padding-top: 24px; }
.svc__card .obj--empty { min-height: 220px; }

/* ---------- Существующие блоки в новых цветах ---------- */
.cmp__card { border-radius: 16px; background: var(--card-grey); padding: 36px; }
.cmp__card--ours { background: var(--brand); }
.cmp__name { font-weight: 600; font-size: 24px; line-height: 30px; }
.mfr li { background: var(--card-grey); border-radius: 10px; font-weight: 500; }
.checks li { border-radius: 12px; }
.pcard__media { background: var(--card-blue); border-radius: 12px; }
.gal__stage--empty { background: var(--card-blue); }

/* Гарантия: тёмная карточка внутри страницы, а не полоса во всю ширину */
.warranty { background: transparent; color: var(--ink); padding: 0; }
.warranty__grid { box-sizing: border-box; width: calc(100% - 48px); max-width: calc(var(--container) - 48px); padding: 48px; border-radius: 20px; background: var(--card-dark); color: #fff; grid-template-columns: minmax(0, 380px) minmax(0, 1fr); }
.warranty__object { display: grid; place-items: center; min-height: 440px; border-radius: 14px; background: rgba(255, 255, 255, .06); }
.warranty__object .obj--empty { color: #fff; }
.warranty__object .obj__brief { background: rgba(255, 255, 255, .9); }
.warranty__title { font-size: 32px !important; line-height: 38px !important; }
.odo__d { border-radius: 10px; }

/* Стенд: предмет на сером фоне */
.bench-sec__object { display: grid; place-items: center; min-height: 460px; padding: 24px; border-radius: 16px; background: var(--card-grey); }

/* Подбор */
.finder__box { border-radius: 20px; background: var(--card-dark); }
.finder__title { font-size: 32px !important; line-height: 38px !important; }

/* Кнопки: чуть меньше скругление, средняя жирность */
.ex-btn { border-radius: 10px; font-weight: 600; }

@media (hover: hover) and (pointer: fine) {
  .fcard, .svc__card { transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
  .fcard:not(.fcard--object):hover, .svc__card:hover { transform: translateY(-4px); }
  .svc__card:hover .obj, .fcard--object:hover .obj { transform: scale(1.06) rotate(-1.5deg); }
}

@media (max-width: 1080px) {
  .facts__grid, .svc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fcard--wide, .fcard--half { grid-column: span 2; }
  .fcard--object, .fcard--narrow { grid-column: span 1; }
  .warranty__grid { grid-template-columns: minmax(0, 1fr); padding: 32px; }
  .warranty__object { min-height: 280px; }
}
@media (max-width: 860px) {
  :root { --sec-y: 56px; --block-gap: 24px; }
  .hero__title { font-size: 38px !important; line-height: 42px !important; }
  .sec__title, .finder__title, .warranty__title, .cat__title, .doc h1 { font-size: 28px !important; line-height: 34px !important; }
  .fcard { min-height: 0; padding: 28px 24px; }
  .fcard__num { font-size: 60px; }
  .fcard__text { font-size: 18px; line-height: 26px; margin: 12px 0 24px; }
}
@media (max-width: 640px) {
  .facts__grid, .svc__grid { grid-template-columns: minmax(0, 1fr); }
  .fcard--wide, .fcard--half, .fcard--object, .fcard--narrow { grid-column: auto; }
  .fcard--object { min-height: 220px; }
  .svc__card { min-height: 0; padding: 26px 22px; }
  .svc__card .obj--empty { min-height: 140px; }
  .warranty__grid { padding: 24px 20px; width: calc(100% - 16px); }
}
