/* Минский Агросервис. Палитра снята с их css скриптом _tools/palitra.py,
   своих цветов нет.

   #0070c0 синий, самый частый у них (8 вхождений): основной
   #2668be синий (6): вторичный, тёмные подложки
   #295bb2 синий темнее (3): мелкий текст и кольцо фокуса, где нужен контраст
   #573d0a тёмно-коричневый (3): заголовки и тёмные полосы
   #ffff00 жёлтый (2): акцент, он же цвет их техники
   #4d73c3 синий светлее (2): наведение

   Подмены оттенков, всё внутри их же цветов:
   --ink  #2b2415 это их #573d0a, затемнённый до контраста 15:1 для основного
          текста: на самом #573d0a длинные абзацы читаются тяжелее;
   --mute #6b6250 это тот же коричневый, осветлённый, контраст к белому 6:1;
   --line #dfd9cc и --tint #f5f2ea это он же, разбавленный до фона;
   --sky  #e8f1f9 это их #0070c0, разбавленный до подложки.
   Чистый жёлтый на белом нечитаем, поэтому он только заливка, текст на нём --ink.

   Композиция своя: первый экран устроен как рабочая страница каталога деталей.
   Слева кто мы и телефоны, справа сразу подбор запчасти, под ними лента их
   снимков во всю ширину. Радиус 14. */

:root {
  --blue: #0070c0;
  --blue2: #2668be;
  --blue3: #295bb2;
  --hover: #4d73c3;
  --brown: #573d0a;
  --yellow: #ffff00;

  --ink: #2b2415;
  --mute: #6b6250;
  --line: #dfd9cc;
  /* рамка полей и чипов: #dfd9cc давал 1.4 при норме 3 для органов управления */
  --line2: #9a8f78;
  --tint: #f5f2ea;
  --sky: #e8f1f9;
  --paper: #fff;

  --r: 14px;
  --r-sm: 8px;
  --focus: var(--blue3);
  --wrap: 1200px;
  --gap: 24px;
}

html { font-size: 100%; }

body {
  background: var(--paper);
  color: var(--ink);
  font-family: 'Mulish', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 17px;
  line-height: 1.62;
  font-variant-numeric: tabular-nums;
}

h1, h2, h3, .brand__txt b, .mcard__name, .calc__out b {
  font-family: 'Arsenal', Georgia, serif;
  font-weight: 700;
  line-height: 1.16;
  color: var(--brown);
  letter-spacing: -.005em;
}

h1 { font-size: clamp(26px, 2.8vw, 38px); }
h2 { font-size: clamp(22px, 2.2vw, 30px); }
h3 { font-size: 19px; }

a { color: var(--blue); }
a:hover { color: var(--hover); }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }

.eyebrow {
  display: inline-block; font-size: 13px; font-weight: 800; letter-spacing: .09em;
  text-transform: uppercase; color: var(--blue3); margin-bottom: 10px;
}

.note {
  font-size: 15px; color: var(--mute); border-left: 3px solid var(--yellow);
  padding: 2px 0 2px 12px; margin-top: 14px;
}
.note--wide { margin: 0 0 20px; background: var(--tint); border-radius: var(--r-sm);
  padding: 14px 16px; border-left: 4px solid var(--yellow); }

.ticks { list-style: none; display: grid; gap: 8px; margin: 14px 0 0; }
.ticks li { position: relative; padding-left: 26px; }
.ticks li::before {
  content: ''; position: absolute; left: 0; top: .55em; width: 14px; height: 8px;
  border-left: 3px solid var(--blue); border-bottom: 3px solid var(--blue);
  transform: rotate(-45deg);
}

/* --------------------------------------------------------------- кнопки */

.btn {
  display: inline-flex; align-items: center; gap: 9px; padding: 13px 22px;
  border-radius: var(--r-sm); background: var(--blue); color: #fff;
  font-weight: 800; font-size: 16px; border: 2px solid var(--blue);
  transition: background .18s, border-color .18s, color .18s;
}
.btn:hover { background: var(--hover); border-color: var(--hover); color: #fff; }
.btn--line { background: transparent; color: var(--blue3); border-color: var(--line); }
.btn--line:hover { background: var(--sky); border-color: var(--blue); color: var(--blue3); }
.btn--ghost { background: transparent; color: var(--blue3); border-color: transparent;
  padding: 10px 14px; text-decoration: underline; }
.btn--ghost:hover { background: var(--sky); color: var(--blue3); }
.btn--block { width: 100%; justify-content: center; }

/* ---------------------------------------------------------------- шапка */

.head { position: sticky; top: 0; z-index: 60; background: var(--paper);
  box-shadow: 0 1px 0 var(--line); }
.head__bar { background: var(--brown); color: #efe6cf; font-size: 13.5px;
  --focus: var(--yellow); }
.head__bar-in { display: flex; justify-content: space-between; gap: 16px;
  padding: 7px 20px; align-items: center; }
.head__bar-in > span:first-child { overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
.head__bar-r { display: flex; align-items: center; gap: 18px; white-space: nowrap;
  min-width: 0; }
.head__bar a { color: var(--yellow); }
.head__bar a:hover { color: #fff; }

/* переключатель языков: три кнопки как у них в шапке, Бел Рус Eng */
.lang { display: inline-flex; gap: 2px; margin-left: 4px; }
.lang__i { display: inline-block; padding: 2px 9px; border-radius: 999px;
  font-weight: 700; font-size: 12.5px; line-height: 1.5; }
.head__bar .lang__i { color: var(--yellow); border: 1px solid rgba(255, 255, 0, .45); }
.head__bar .lang__i:hover { background: var(--yellow); color: var(--ink); }
.head__bar .lang__i.is-on { background: var(--yellow); color: var(--ink);
  border-color: var(--yellow); }
.lang--drawer { display: flex; gap: 6px; margin: 14px 0 4px; }
.lang--drawer .lang__i { padding: 7px 14px; font-size: 14px; border: 2px solid var(--line2);
  color: var(--ink); }
.lang--drawer .lang__i.is-on { background: var(--blue); border-color: var(--blue);
  color: #fff; }

.head__in { display: flex; align-items: center; justify-content: space-between;
  gap: 18px; padding-top: 12px; padding-bottom: 12px; }

.brand { display: inline-flex; align-items: center; gap: 13px; }
/* знак у них всего 100x93, крупнее родного размера не растягиваем */
.brand__sign { width: 74px; height: 69px; object-fit: contain; flex: none; }
.brand__txt { display: block; }
.brand__txt b { display: block; font-size: 22px; color: var(--brown); line-height: 1.1; }
.brand__txt i { display: block; font-style: normal; font-size: 12.5px; color: var(--mute);
  letter-spacing: .02em; }

.head__side { display: flex; align-items: center; gap: 14px; }
.head__tel { display: block; text-align: right; }
.head__tel b { display: block; font-size: 18px; font-weight: 800; color: var(--blue3); }
.head__tel span { display: block; font-size: 12.5px; color: var(--mute); }

.burger { display: none; width: 46px; height: 42px; border-radius: var(--r-sm);
  border: 2px solid var(--line); padding: 10px 11px; }
.burger span { display: block; height: 2px; background: var(--brown); border-radius: 2px; }
.burger span + span { margin-top: 5px; }

.nav { background: var(--blue); }
.nav__in { display: flex; flex-wrap: wrap; gap: 2px; }
.nav a { display: block; padding: 11px 15px; color: #fff; font-weight: 600; font-size: 15.5px; }
.nav a:hover { background: var(--blue2); color: #fff; }
.nav a.is-active { background: var(--yellow); color: var(--ink); }
.nav { --focus: #fff; }

/* шторка */
.drawer { width: min(340px, 86vw); background: var(--paper); }
.scrim { background: rgba(43, 36, 21, .5); }
.drawer__in { padding: 18px 20px 28px; }
.drawer__x { display: grid; place-items: center; width: 42px; height: 42px;
  margin-left: auto; border-radius: 50%; background: var(--tint); color: var(--brown); }
.drawer nav { display: grid; margin-top: 8px; }
.drawer nav a { padding: 12px 4px; border-bottom: 1px solid var(--line);
  font-weight: 700; color: var(--ink); }
.drawer nav a.is-active { color: var(--blue3); }
.drawer__c { display: grid; gap: 10px; margin-top: 18px; }
.drawer__c a b { display: block; font-size: 17px; font-weight: 800; color: var(--blue3); }
.drawer__c a span { display: block; font-size: 13px; color: var(--mute); }
.drawer__mail { font-weight: 700; }

/* ---------------------------------------------------------- первый экран */

.hero { position: relative; background: var(--tint); }
.hero::before {
  content: ''; position: absolute; inset: 0 0 auto; height: 70%;
  /* не миниатюра: подложка растягивается на всю ширину первого экрана */
  background: url(../img/dscn50351.jpg) center/cover no-repeat;
  opacity: .1;
}
.hero__in { position: relative; display: grid; gap: 34px;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: start; padding-top: 48px; padding-bottom: 36px; }

.hero__txt h1 { font-size: clamp(30px, 3.6vw, 48px); margin-bottom: 14px;
  position: relative; padding-bottom: 16px; }
.hero__txt h1::after { content: ''; position: absolute; left: 0; bottom: 0;
  width: 190px; max-width: 70%; height: 6px; background: var(--yellow); }
/* под текстом лежит их снимок на 10%: берём коричневый на тон темнее --mute,
   иначе на тёмном месте снимка абзац падает до 4.3 */
.hero__txt p { color: #564f40; max-width: 54ch; }
.hero__act { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.hero__tel { display: flex; flex-wrap: wrap; gap: 26px; margin-top: 24px; }
.hero__tel b { display: block; font-size: 19px; font-weight: 800; color: var(--blue3); }
.hero__tel span { display: block; font-size: 13px; color: #564f40; }

.hero__find { background: var(--paper); border-radius: var(--r);
  border: 1px solid var(--line); border-top: 6px solid var(--blue);
  padding: 22px; box-shadow: 0 12px 30px rgba(43, 36, 21, .09); }
.hero__find h2 { font-size: 22px; margin-bottom: 14px; }
.find label { display: block; font-size: 13.5px; font-weight: 700; color: var(--mute);
  margin-bottom: 6px; }
.find__row { display: flex; gap: 8px; }
.find__row input { flex: 1 1 auto; min-width: 0; padding: 12px 14px;
  border: 2px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.find__row input:focus { border-color: var(--blue); }
.find__row .btn { padding: 12px 16px; }
.find__hint { font-size: 13px; color: var(--mute); margin-top: 8px; }
.find__sub { font-size: 13px; font-weight: 800; letter-spacing: .07em;
  text-transform: uppercase; color: var(--blue3); margin: 18px 0 10px; }
.find__chips { display: flex; flex-wrap: wrap; gap: 7px; }
.find__all { margin-top: 14px; font-weight: 700; }

.hero__strip { position: relative; display: grid; gap: 2px;
  grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--brown); }
.hero__shot { display: block; width: 100%; height: 170px; overflow: hidden;
  border: 0; padding: 0; }
.hero__shot img { width: 100%; height: 100%; object-fit: cover; }
.hero__shot:hover img { transform: scale(1.03); }
.hero__shot img { transition: transform .5s; }

/* чипы */
.chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px;
  border-radius: 999px; border: 2px solid var(--line); background: var(--paper);
  font-size: 14px; font-weight: 700; color: var(--ink); }
.chip i { font-style: normal; font-size: 12px; font-weight: 800; color: var(--blue3);
  background: var(--sky); border-radius: 999px; padding: 1px 7px; }
.chip:hover { border-color: var(--blue); color: var(--ink); }
.chip.is-on { background: var(--blue); border-color: var(--blue); color: #fff; }
.chip.is-on i { background: rgba(0, 0, 0, .2); color: #fff; }
.chip--link { color: var(--ink); }

/* -------------------------------------------------------------- лента */

.band { background: var(--blue); color: #fff; --focus: var(--yellow); }
.band__in { display: grid; gap: 22px; padding: 30px 20px;
  grid-template-columns: repeat(4, minmax(0, 1fr)); }
.band__i span { display: grid; place-items: center; width: 42px; height: 42px;
  border-radius: var(--r-sm); background: var(--yellow); color: var(--ink);
  margin-bottom: 10px; }
.band__i b { display: block; font-size: 17px; margin-bottom: 4px; }
.band__i p { font-size: 14.5px; color: #f2f8fd; line-height: 1.5; }

.ticker { overflow: hidden; background: var(--yellow); color: var(--ink);
  padding: 9px 0; font-size: 14px; font-weight: 700; }
.ticker__in { display: flex; gap: 0; width: max-content; animation: run 70s linear infinite; }
.ticker__in span { white-space: nowrap; padding-right: 0; }
.ticker:hover .ticker__in { animation-play-state: paused; }
@keyframes run { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .ticker__in { animation: none; } }

/* ------------------------------------------------------------- секции */

.sec { padding: 60px 0; }
.sec--tint { background: var(--tint); }
.sec--narrow .wrap { max-width: 820px; }
.sec__h { margin-bottom: 26px; max-width: 70ch; }
.sec__h p { color: var(--mute); margin-top: 8px; }
.sec__more { margin-top: 26px; }

/* шапка внутренней страницы */
.phead { background: var(--tint); padding: 24px 0 30px;
  border-bottom: 1px solid var(--line); }
.phead h1 { margin-top: 2px; }
.phead__lead { color: var(--mute); margin-top: 10px; max-width: 72ch; }
.crumbs { display: flex; flex-wrap: wrap; gap: 7px; font-size: 13.5px;
  color: var(--mute); margin-bottom: 12px; }
.crumbs a { color: var(--blue3); }
.crumbs i { font-style: normal; color: var(--mute); }

/* текст */
.rg > * + * { margin-top: 14px; }
.rg h2 { margin-top: 28px; font-size: 24px; }
.rg h3 { margin-top: 22px; }
.rg ul { list-style: none; display: grid; gap: 7px; }
.rg ul li { position: relative; padding-left: 20px; }
.rg ul li::before { content: ''; position: absolute; left: 0; top: .66em;
  width: 8px; height: 8px; border-radius: 2px; background: var(--yellow);
  outline: 1px solid var(--brown); }

.two { display: grid; gap: 30px; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  align-items: start; }
.two--good { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.side { background: var(--tint); border-radius: var(--r); padding: 20px;
  border: 1px solid var(--line); }
.side h2 { margin-bottom: 12px; font-size: 19px; }
.side__tel { display: block; margin-bottom: 12px; }
.side__tel b { display: block; font-size: 18px; font-weight: 800; color: var(--blue3); }
.side__tel span { display: block; font-size: 13px; color: var(--mute); }
.side__list { list-style: none; display: grid; gap: 9px; }
.side__list a { font-weight: 700; }

/* таблицы */
.tablewrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r);
  background: var(--paper); }
.tbl { width: 100%; font-size: 15.5px; }
.tbl th, .tbl td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--line);
  vertical-align: top; }
.tbl thead th { background: var(--blue); color: #fff; font-weight: 800; font-size: 14px;
  border-bottom: 0; }
.tbl tbody th { font-weight: 700; color: var(--brown); width: 34%; background: var(--tint); }
.tbl tbody tr:last-child td, .tbl tbody tr:last-child th { border-bottom: 0; }
.tbl .num { text-align: right; white-space: nowrap; font-weight: 700; }
.tbl__grp { background: var(--brown) !important; color: var(--yellow) !important;
  font-weight: 800; width: auto !important; }
.tbl--price td:nth-child(2) { color: var(--mute); white-space: nowrap; }
.tbl--price td:nth-child(3) { color: var(--mute); white-space: nowrap; }

/* ---------------------------------------------------------- машины */

.mach { display: grid; gap: var(--gap);
  grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr));
  grid-template-rows: auto; }
.mcard { display: grid; grid-template-rows: subgrid; grid-row: span 5;
  grid-template-columns: minmax(0, 1fr); gap: 0;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; color: var(--ink);
  transition: border-color .2s, box-shadow .2s, transform .2s; }
.mcard:hover { border-color: var(--blue); box-shadow: 0 10px 26px rgba(43, 36, 21, .1);
  transform: translateY(-3px); color: var(--ink); }
.mcard__in { display: contents; }
.mcard__ph { display: block; height: 190px; background: var(--tint); }
.mcard__ph img { width: 100%; height: 100%; object-fit: contain; padding: 10px; }
.mcard__ph--none { display: grid; place-content: center; justify-items: center; gap: 8px;
  color: var(--mute); }
.mcard__ph--none i { font-style: normal; font-size: 13px; }
.mcard__kind { display: block; padding: 14px 16px 0; font-size: 12.5px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: var(--blue3); }
.mcard__name { display: block; padding: 6px 16px 0; font-size: 24px; }
.mcard__spec { display: grid; gap: 4px; padding: 10px 16px 0; font-size: 14px; }
.mcard__spec span { display: flex; justify-content: space-between; gap: 10px;
  border-bottom: 1px dashed var(--line); padding-bottom: 4px; }
.mcard__spec i { font-style: normal; color: var(--mute); }
.mcard__spec b { font-weight: 700; text-align: right; }
.mcard__go { display: inline-flex; align-items: center; gap: 7px; padding: 14px 16px 16px;
  font-weight: 800; color: var(--blue3); font-size: 15px; }
.mach--big .mcard__ph { height: 230px; }

/* карточка машины */
.mhero { display: grid; gap: 30px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start; }
/* без снимка вторая колонка оставляла полэкрана пустоты */
.mhero--nopic { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
.mhero__ph { display: block; width: 100%; background: var(--tint); border-radius: var(--r);
  border: 1px solid var(--line); overflow: hidden; padding: 0; }
.mhero__ph img { width: 100%; height: auto; }
.mhero__txt .btn { margin-top: 22px; }

/* --------------------------------------------------------- каталог */

.cat__bar { position: sticky; top: calc(var(--head-h, 64px) + 8px); z-index: 40;
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 12px; box-shadow: 0 6px 18px rgba(43, 36, 21, .07); }
.cat__find { position: relative; flex: 1 1 320px; min-width: 0; display: flex;
  align-items: center; }
.cat__find svg { position: absolute; left: 13px; color: var(--mute); pointer-events: none; }
.cat__find input { width: 100%; padding: 12px 14px 12px 42px; border: 2px solid var(--line);
  border-radius: var(--r-sm); background: var(--paper); }
.cat__find input:focus { border-color: var(--blue); }
.cat__count { font-size: 15px; color: var(--mute); white-space: nowrap; }
.cat__count b { color: var(--brown); font-weight: 800; }
.cat__chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 22px; }
.cat__empty { background: var(--tint); border-radius: var(--r); padding: 22px;
  text-align: center; color: var(--mute); }

.cat__grid { display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
  grid-template-rows: auto; }
.gcard { display: grid; grid-template-rows: subgrid; grid-row: span 5;
  grid-template-columns: minmax(0, 1fr); gap: 0; color: var(--ink);
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 16px; transition: border-color .2s, box-shadow .2s; }
.gcard:hover { border-color: var(--blue); color: var(--ink);
  box-shadow: 0 8px 22px rgba(43, 36, 21, .09); }
.gcard__in { display: contents; }
.gcard__grp { display: block; font-size: 11.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--blue3); }
.gcard__name { display: block; font-weight: 800; font-size: 16px; line-height: 1.35;
  margin: 7px 0 10px; }
.gcard__art, .gcard__fit { display: block; font-size: 13.5px; padding: 6px 0;
  border-top: 1px dashed var(--line); }
.gcard__art i, .gcard__fit i { display: block; font-style: normal; color: var(--mute);
  font-size: 12px; }
.gcard__art b { font-weight: 800; color: var(--brown); word-break: break-word; }
.gcard__fit b { font-weight: 600; }
.gcard__price { display: block; margin-top: 10px; align-self: end; font-weight: 800;
  font-size: 14px; color: var(--ink); background: var(--yellow); border-radius: var(--r-sm);
  padding: 6px 10px; justify-self: start; }

/* ------------------------------------------------------------ о компании */

.about { padding: 60px 0; background: var(--sky); }
.about__in { display: grid; gap: 34px;
  grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); align-items: start; }
.about__txt p { margin-top: 12px; color: #3c3a33; }
.about__facts { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 24px 0; }
.about__facts b { display: block; font-family: 'Arsenal', Georgia, serif; font-size: 32px;
  color: var(--blue3); line-height: 1.1; }
.about__facts span { display: block; font-size: 13.5px; color: var(--mute); margin-top: 4px; }
.about__gal { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.about__ph { display: block; border: 0; padding: 0; overflow: hidden;
  border-radius: var(--r); height: 160px; background: var(--tint); }
.about__ph img { width: 100%; height: 100%; object-fit: cover; }
.about__ph:first-child { grid-column: 1 / -1; height: 230px; }

/* ---------------------------------------------------------------- новости */

.news { display: grid; gap: var(--gap);
  grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
  grid-template-rows: auto; }
.ncard { display: grid; grid-template-rows: subgrid; grid-row: span 4;
  grid-template-columns: minmax(0, 1fr); gap: 0; color: var(--ink);
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; transition: border-color .2s, box-shadow .2s; }
.ncard:hover { border-color: var(--blue); color: var(--ink);
  box-shadow: 0 10px 26px rgba(43, 36, 21, .09); }
.ncard__in { display: contents; }
.ncard__ph { display: block; height: 170px; background: var(--tint); }
.ncard__ph img { width: 100%; height: 100%; object-fit: cover; }
.ncard__ph--none { height: 8px; background: var(--yellow); }
.ncard__d { display: block; padding: 14px 16px 0; font-size: 12.5px; font-weight: 800;
  letter-spacing: .05em; text-transform: uppercase; color: var(--blue3); }
.ncard__t { display: block; padding: 7px 16px 0; font-weight: 800; font-size: 17px;
  line-height: 1.35; }
.ncard__x { display: block; padding: 8px 16px 18px; font-size: 14.5px; color: var(--mute); }

.nnav { display: flex; justify-content: space-between; gap: 14px; margin-top: 28px;
  border-top: 1px solid var(--line); padding-top: 18px; font-weight: 700; }
.nnav a { display: inline-flex; align-items: center; gap: 7px; }
.nnav a:first-child svg { transform: rotate(180deg); }

/* ---------------------------------------------------------- ремонт, услуги */

.rlist { display: grid; gap: var(--gap);
  grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr));
  grid-template-rows: auto; }
.rcard { display: grid; grid-template-rows: subgrid; grid-row: span 4;
  grid-template-columns: minmax(0, 1fr); gap: 0; color: var(--ink);
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; transition: border-color .2s, box-shadow .2s; }
.rcard:hover { border-color: var(--blue); color: var(--ink);
  box-shadow: 0 10px 26px rgba(43, 36, 21, .09); }
.rcard__in { display: contents; }
.rcard__ph { display: block; height: 160px; background: var(--tint); }
.rcard__ph img { width: 100%; height: 100%; object-fit: cover; }
.rcard__ph--none { height: 8px; background: var(--blue); }
.rcard__t { display: block; padding: 16px 18px 0; font-family: 'Arsenal', Georgia, serif;
  font-size: 21px; font-weight: 700; color: var(--brown); line-height: 1.2; }
.rcard__x { display: block; padding: 8px 18px 0; font-size: 14.5px; color: var(--mute); }
.rcard__go { display: inline-flex; align-items: center; gap: 7px; padding: 14px 18px 18px;
  font-weight: 800; color: var(--blue3); font-size: 15px; }
.rlist--two { grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); }

.rpic { border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
.rpic__i { display: block; width: 100%; border: 0; padding: 0; background: var(--tint); }
.rpic__i img { width: 100%; height: auto; }

.ugrid { display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(min(280px, 100%), 1fr)); }
.ucard { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 20px; border-top: 5px solid var(--yellow); }
.ucard span { display: grid; place-items: center; width: 42px; height: 42px;
  border-radius: var(--r-sm); background: var(--sky); color: var(--blue3);
  margin-bottom: 12px; }
.ucard p { font-weight: 600; }

/* ------------------------------------------------------------- калькулятор */

.calc { background: var(--tint); border: 1px solid var(--line); border-radius: var(--r);
  padding: 24px; border-left: 6px solid var(--blue); }
.calc h2 { font-size: 22px; margin-bottom: 8px; }
.calc__note { font-size: 13.5px; color: var(--mute); }
.calc__row { display: grid; gap: 14px; margin: 18px 0;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr); }
.calc__row label { display: block; font-size: 13.5px; font-weight: 700; color: var(--mute);
  margin-bottom: 6px; }
.calc__row input, .calc__row select { width: 100%; padding: 12px 13px;
  border: 2px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.calc__row input:focus, .calc__row select:focus { border-color: var(--blue); }
.calc__out { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px;
  background: var(--paper); border-radius: var(--r-sm); padding: 14px 18px;
  border: 2px solid var(--blue); margin-bottom: 12px; }
.calc__out span { font-size: 14px; color: var(--mute); }
.calc__out b { font-size: 32px; color: var(--blue3); }
.calc__out i { font-style: normal; font-weight: 700; color: var(--mute); }
.calc__out b.is-hit { animation: hit .5s ease; }
@keyframes hit { 0% { background: var(--yellow); } 100% { background: transparent; } }

/* -------------------------------------------------------- галереи, дипломы */

.gal { display: grid; gap: 12px;
  grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); }
.gal--wide { grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr)); }
.gal__i { display: block; border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; background: var(--tint); padding: 0; height: 180px; }
.gal__i img { width: 100%; height: 100%; object-fit: cover; }
.gal__i:focus-visible { outline-offset: -3px; }

.certs { display: grid; gap: 18px;
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
  grid-template-rows: auto; }
.cert { display: grid; grid-template-rows: subgrid; grid-row: span 2; gap: 10px;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 14px; }
.cert__i { display: block; border: 0; padding: 0; height: 240px; background: var(--tint);
  border-radius: var(--r-sm); overflow: hidden; }
.cert__i img { width: 100%; height: 100%; object-fit: contain; }
.cert__i:focus-visible { outline-offset: -3px; }
.cert figcaption { font-size: 14px; color: var(--mute); }

.dls { display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(min(230px, 100%), 1fr));
  grid-template-rows: auto; }
.dl { display: grid; grid-template-rows: subgrid; grid-row: span 3; gap: 0;
  background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 14px; }
.dl__in { display: contents; }
.dl__ph { display: block; border: 0; padding: 0; height: 190px; background: var(--tint);
  border-radius: var(--r-sm); overflow: hidden; }
.dl__ph img { width: 100%; height: 100%; object-fit: contain; }
.dl__ph--none { display: grid; place-items: center; color: var(--blue3); }
.dl__in b { display: block; margin-top: 12px; font-weight: 800; }
.dl__in span { display: block; font-size: 13.5px; color: var(--mute); margin-top: 4px; }

/* ---------------------------------------------------------------- контакты */

.kblock h2 { font-size: 21px; margin-top: 24px; }
.kblock h2:first-child { margin-top: 0; }
.kph { list-style: none; display: grid; gap: 12px; margin-top: 12px; }
.kph b { display: block; font-size: 20px; font-weight: 800; color: var(--blue3); }
.kph span { display: block; font-size: 13.5px; color: var(--mute); }
.kmail { font-size: 19px; font-weight: 800; }
.kreq { list-style: none; display: grid; gap: 12px; margin-top: 12px; }
.kreq i { display: block; font-style: normal; font-size: 12.5px; color: var(--mute);
  text-transform: uppercase; letter-spacing: .05em; }
.kreq b { font-weight: 700; }

/* ------------------------------------------------------- что изменилось */

.chgs { display: grid; gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.chg { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
  padding: 20px; border-left: 5px solid var(--blue); }
.chg b { display: block; font-family: 'Arsenal', Georgia, serif; font-size: 20px;
  color: var(--brown); margin-bottom: 8px; }
.chg p { font-size: 15.5px; color: var(--mute); }

/* ------------------------------------------------------------------ заявка */

.ask { background: var(--brown); color: #f1e9d8; padding: 56px 0; --focus: var(--yellow); }
.ask__in { display: grid; gap: 34px;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; }
.ask h2 { color: #fff; }
.ask__side > p { margin-top: 10px; color: rgba(241, 233, 216, .82); }
.ask__ph { list-style: none; display: grid; gap: 12px; margin: 22px 0 16px; }
.ask__ph a b { display: block; font-size: 20px; font-weight: 800; color: var(--yellow); }
.ask__ph a span { display: block; font-size: 13px; color: rgba(241, 233, 216, .72); }
.ask__mail { color: var(--yellow); font-weight: 800; }
.ask__adr { margin-top: 12px; font-size: 14px; color: rgba(241, 233, 216, .72); }

.form { background: var(--paper); border-radius: var(--r); padding: 24px; color: var(--ink); }
.form label { display: block; font-size: 13.5px; font-weight: 700; color: var(--mute);
  margin: 14px 0 6px; }
.form__row { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form__row label { margin-top: 0; }
.form input, .form select { width: 100%; min-width: 0; padding: 12px 14px;
  border: 2px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.form input:focus, .form select:focus { border-color: var(--blue); }
.form input.is-bad { border-color: #b3261e; }
.form__ok-check { display: grid; grid-template-columns: auto 1fr; gap: 8px 10px;
  align-items: start; margin: 18px 0 14px; font-size: 14px; }
.form__ok-check input { width: 20px; height: 20px; padding: 0; margin-top: 2px; }
.form__ok-check label { margin: 0; font-weight: 600; color: var(--ink); }
.form .form__ok-check a { grid-column: 2; color: var(--blue3); font-weight: 700;
  text-decoration: underline; }
.form__err { color: #b3261e; font-size: 14px; margin-bottom: 10px; font-weight: 700; }
.form__note { font-size: 13px; color: var(--mute); margin-top: 12px; }
.form__ok { margin-top: 12px; background: var(--sky); border-radius: var(--r-sm);
  padding: 12px 14px; font-weight: 700; color: var(--blue3); }

/* ------------------------------------------------------------------ подвал */

.foot { background: var(--blue3); color: #eaf1fc; padding: 48px 0 24px;
  --focus: var(--yellow); }
.foot a { color: #eaf1fc; }
.foot a:hover { color: var(--yellow); }
.foot__grid { display: grid; gap: 30px;
  grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(0, 1fr)) minmax(0, 1fr); }
.foot__sign { display: inline-block; background: #fff; border-radius: var(--r-sm);
  padding: 6px 9px; }
.foot__sign img { width: 64px; height: 60px; object-fit: contain; }
.foot__full { margin-top: 14px; font-weight: 700; }
.foot__req { margin-top: 8px; font-size: 13px; color: #cfdcf2;
  line-height: 1.5; }
.foot__col h2 { color: #fff; font-size: 16px; margin-bottom: 12px; }
.foot__col ul { list-style: none; display: grid; gap: 8px; font-size: 14.5px; }
.foot__contacts a { display: block; margin-bottom: 10px; }
.foot__contacts a b { display: block; font-size: 17px; font-weight: 800; color: var(--yellow); }
.foot__contacts a span { display: block; font-size: 12.5px; color: #cfdcf2; }
.foot__mail { font-weight: 800; }
.foot__contacts p { font-size: 13.5px; color: #cfdcf2; margin-top: 8px; }
.foot__bot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px;
  margin-top: 34px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .2);
  font-size: 13px; color: #cfdcf2; }

.demo, .totop { position: fixed; z-index: 55; display: grid; place-items: center;
  width: 48px; height: 48px; border-radius: 50%; box-shadow: 0 6px 18px rgba(43, 36, 21, .22); }
.demo { left: 18px; bottom: 18px; background: var(--yellow); color: var(--ink);
  font-weight: 800; font-size: 22px; font-family: 'Arsenal', Georgia, serif; }
.totop { right: 18px; bottom: 18px; background: var(--blue); color: #fff;
  opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.totop.is-on { opacity: 1; visibility: visible; }

/* ------------------------------------------------------------ экран загрузки */

.pre { display: grid; place-items: center; background: var(--tint); }
.pre__in { display: grid; justify-items: center; gap: 16px; }
.pre__field { position: relative; width: 210px; height: 62px; }
.pre__soil { position: absolute; left: 0; right: 0; bottom: 0; height: 10px;
  border-radius: 3px;
  background: repeating-linear-gradient(90deg, var(--brown) 0 4px, transparent 4px 9px); }
.pre__done { position: absolute; right: 0; bottom: 0; height: 10px; border-radius: 3px;
  background: var(--brown); width: 100%; animation: soil 1.6s linear infinite; }
.pre__tool { position: absolute; bottom: 10px; left: 0; display: flex; gap: 6px;
  align-items: flex-end; height: 34px; padding: 6px 7px 0;
  background: var(--blue); border-radius: 4px 4px 0 0; animation: tool 1.6s linear infinite; }
.pre__tool i { display: block; width: 5px; height: 20px; background: var(--yellow);
  border-radius: 0 0 3px 3px; }
.pre__t { font-family: 'Arsenal', Georgia, serif; font-weight: 700; font-size: 19px;
  color: var(--brown); letter-spacing: .02em; }
@keyframes tool { from { left: -4px; } to { left: 168px; } }
@keyframes soil { from { width: 100%; } to { width: 0; } }
@media (prefers-reduced-motion: reduce) {
  .pre__tool, .pre__done { animation: none; }
}

/* ------------------------------------------------------------------ печать */

@media print {
  .head, .ask, .demo, .totop, .hero__strip, .ticker, .band, .cat__bar,
  .cat__chips, .btn { display: none !important; }
  body { font-size: 12pt; }
  .sec { padding: 12px 0; }
  .tablewrap { overflow: visible; }
  /* браузер фон не печатает: белый текст на синей шапке таблицы исчезал */
  .tbl thead th, .tbl__grp { background: #fff !important; color: #000 !important;
    border-bottom: 2px solid #000; }
  /* на листе прайс-листа должно остаться, чьи это цены */
  .foot { display: block !important; background: #fff !important; padding: 10px 0 0; }
  .foot, .foot *, .foot a, .foot h2, .foot__req, .foot__bot,
  .foot__contacts a b, .foot__contacts a span { color: #000 !important; }
  .foot__grid { grid-template-columns: 1fr 1fr !important; }
  .foot__col ul, .foot__sign { display: none !important; }
}

/* ------------------------------------------------------------------ ширины */

@media (max-width: 1100px) {
  .foot__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .head__bar-in > span:first-child { display: none; }
  .head__bar-in { justify-content: flex-end; }
}

/* в полосе над шапкой три языка плюс почта и режим не помещаются:
   режим убираем раньше, почту следом, переключатель остаётся всегда */
@media (max-width: 760px) {
  .head__bar-r > span:not(.lang) { display: none; }
}
@media (max-width: 620px) {
  .head__bar-r > a { display: none; }
}

@media (max-width: 1000px) {
  .hero__in { grid-template-columns: minmax(0, 1fr); }
  .band__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about__in, .ask__in, .two, .two--good, .mhero { grid-template-columns: minmax(0, 1fr); }
  .nav__in { overflow-x: auto; flex-wrap: nowrap; }
  .nav a { white-space: nowrap; }
}

@media (max-width: 860px) {
  .nav { display: none; }
  .burger { display: block; }
  .head__tel { display: none; }
  .hero__strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calc__row { grid-template-columns: minmax(0, 1fr); }
  .foot__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sec { padding: 44px 0; }
  .about, .ask { padding: 44px 0; }
}

@media (max-width: 760px) {
  /* липкая панель на телефоне занимает весь экран и не оставляет карточек */
  .cat__bar { position: static; box-shadow: none; }
}

@media (max-width: 620px) {
  body { font-size: 16px; }
  .head__bar-r { font-size: 12px; gap: 10px; }
  .brand__sign { width: 52px; height: 48px; }
  .brand__txt b { font-size: 18px; }
  .brand__txt i { display: none; }
  .hero__in { padding-top: 30px; }
  .hero__strip { grid-template-columns: minmax(0, 1fr); }
  .hero__shot { height: 190px; }
  .hero__shot:nth-child(n+3) { display: none; }
  .form__row { grid-template-columns: minmax(0, 1fr); }
  .about__facts { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .about__ph:first-child { height: 180px; }
  .foot__grid { grid-template-columns: minmax(0, 1fr); }
  .foot__bot { flex-direction: column; gap: 6px; }
  .mcard__ph, .mach--big .mcard__ph { height: 170px; }
  .gal__i { height: 150px; }
  .cert__i { height: 200px; }
  .nnav { flex-direction: column; gap: 10px; }
}


@media (max-width: 760px) {
  /* одиннадцать чипов в столбик занимали 572 px и уводили карточки за экран */
  .cat__chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px; }
  .cat__chips .chip { flex: none; }
}


/* ------------------------------------------- доступность органов управления */

/* Кольцо фокуса рисует core.css цветом --focus. На цветных и белых
   элементах умолчание --blue3 не видно, поэтому задаём цвет на самом
   элементе, а не селектором потомка: сжатие css съедает пробел перед «:». */
.form { --focus: var(--blue3); }
.btn, .chip.is-on, .totop { --focus: #fff; }
.btn--line, .btn--ghost { --focus: var(--blue3); }
.nav a.is-active, .demo { --focus: var(--ink); }
.hero__strip, .zoom { --focus: #fff; }

/* Рамка полей и чипов заметнее фона карточки */
.form input, .form select, .cat__find input, .find__row input,
.calc__row input, .calc__row select, .chip { border-color: var(--line2); }
.form__ok-check input { width: 24px; height: 24px; }

/* Цели нажатия не меньше 24 px */
.foot__col a, .crumbs a, .side__list a { display: inline-block; min-height: 24px;
  padding: 2px 0; }

/* Наведение на тач-экране залипает после нажатия */
@media (hover: none), (pointer: coarse) {
  .mcard:hover { transform: none; box-shadow: none; }
  .gcard:hover, .ncard:hover, .rcard:hover, .mcard:hover,
  .chip:hover { border-color: var(--line); box-shadow: none; }
  .chip:hover { border-color: var(--line2); }
  .hero__shot:hover img { transform: none; }
}

/* вид цифр ставим в конце: сокращённая запись font выше сбрасывает это свойство */
.tbl, .calc__out b, .about__facts b, .hero__tel b, .kph b, .chip i {
  font-variant-numeric: tabular-nums lining-nums;
}

/* =====================================================================
   Правки заказчика 22.10.2026: современный вид, подложка на всех
   страницах, три варианта шапки и первого экрана, язык выпадашкой.
   Цвета те же, снятые с их css. Тёмно-синий --navy это их #0070c0,
   затемнённый до фона под белый текст (контраст 11:1).
   ===================================================================== */

:root {
  --navy: #0b3a66;
  --navy2: #072a4b;
  --ease: cubic-bezier(.22, .68, .3, 1);
  --r: 16px;
  --glass: rgba(255, 255, 255, .78);
  --shadow: 0 18px 40px -22px rgba(11, 58, 102, .45);
}

body { background: #fbfaf6; }

/* ------------------------------------------------ подложка всего сайта */

.bgart { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.bgart svg { position: absolute; will-change: transform; }
.bgart__a { top: -90px; right: -110px; opacity: .13;
  animation: artSpin 70s linear infinite, artFloatA 19s ease-in-out infinite alternate; }
.bgart__b { top: 38%; left: -30px; opacity: .1;
  animation: artFloatB 23s ease-in-out infinite alternate, artTilt 14s ease-in-out infinite alternate; }
.bgart__c { bottom: 6%; right: 4%; opacity: .1;
  animation: artFloatC 27s ease-in-out infinite alternate, artTilt 11s ease-in-out infinite alternate-reverse; }
.bgart__d { bottom: -40px; left: 18%; opacity: .09;
  animation: artRoll 30s ease-in-out infinite alternate; }
@keyframes artSpin { to { rotate: 360deg; } }
@keyframes artTilt { from { rotate: -10deg; } to { rotate: 12deg; } }
@keyframes artFloatA { from { translate: 0 -40px; } to { translate: -30px 46px; } }
@keyframes artFloatB { from { translate: -20px 30px; } to { translate: 40px -40px; } }
@keyframes artFloatC { from { translate: 20px 30px; } to { translate: -40px -30px; } }
@keyframes artRoll { from { translate: -60px 0; } to { translate: 160px 0; } }
@media (max-width: 700px) {
  .bgart__b, .bgart__d { display: none; }
  .bgart__a { width: 240px; height: 240px; }
  .bgart__c { width: 150px; height: 200px; }
}

/* блоки пропускают подложку, сплошной фон только у тёмных */
.sec--tint { background: rgba(245, 242, 234, .72); }
.about { background: rgba(232, 241, 249, .8); }

/* ---------------------------------------------------------------- кнопки */

.btn { border-radius: 12px; transition: background .2s, border-color .2s, color .2s,
  transform .2s var(--ease), box-shadow .2s; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px -12px rgba(0, 112, 192, .8); }
.btn:active { transform: none; }
.btn--line { background: rgba(255, 255, 255, .7); }
.btn--sun { background: var(--yellow); border-color: var(--yellow); color: var(--ink); --focus: #fff; }
.btn--sun:hover { background: #fff; border-color: #fff; color: var(--ink);
  box-shadow: 0 12px 26px -12px rgba(255, 255, 0, .9); }
.btn--glass { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .55);
  color: #fff; backdrop-filter: blur(6px); --focus: #fff; }
.btn--glass:hover { background: #fff; color: var(--ink); border-color: #fff; }
.eyebrow--light { color: var(--yellow); }

/* ================================================================ шапка */

.head { position: sticky; top: 0; z-index: 60; background: transparent; box-shadow: none;
  transition: transform .3s var(--ease); }
.head__bar { font-size: 13px; transition: margin .3s var(--ease), opacity .3s; }
.head__bar-in { padding-top: 6px; padding-bottom: 6px; }
.head__bar-in svg { display: inline-block; vertical-align: -2px; margin-right: 5px; }
.head__bar-r { gap: 22px; }
.head__main { background: rgba(255, 255, 255, .92); backdrop-filter: saturate(1.4) blur(12px);
  box-shadow: 0 1px 0 var(--line); transition: background .3s, box-shadow .3s, padding .3s; }
.head__in { padding-top: 10px; padding-bottom: 10px; gap: 22px; transition: padding .3s var(--ease); }

/* меню в одну строку с подчёркиванием, которое выезжает от центра */
.nav { background: none; display: flex; flex: 1 1 auto; justify-content: center; gap: 2px;
  --focus: var(--blue3); }
.nav a { position: relative; padding: 10px 11px; color: var(--ink); font-weight: 700;
  font-size: 15px; white-space: nowrap; border-radius: 10px; }
.nav a::after { content: ''; position: absolute; left: 12px; right: 12px; bottom: 4px; height: 3px;
  border-radius: 3px; background: var(--yellow); transform: scaleX(0);
  transition: transform .3s var(--ease); }
.nav a:hover { background: var(--sky); color: var(--blue3); }
.nav a:hover::after, .nav a.is-active::after { transform: scaleX(1); }
.nav a.is-active { background: none; color: var(--blue3); }

.head__side { gap: 12px; flex: none; }
.head__tel { display: flex; align-items: center; gap: 9px; text-align: left; }
.head__tel-i { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%;
  background: var(--sky); color: var(--blue3); flex: none; transition: transform .3s var(--ease); }
.head__tel:hover .head__tel-i { transform: rotate(-14deg) scale(1.08); animation: ring .6s ease 2; }
@keyframes ring { 25% { rotate: -12deg; } 75% { rotate: 12deg; } }
.head__tel-t b { display: block; font-size: 16px; font-weight: 800; color: var(--ink); line-height: 1.2; }
.head__tel-t i { display: block; font-style: normal; font-size: 12px; color: var(--mute); }
.head__cta { padding: 10px 16px; font-size: 15px; }
.head .burger { border-radius: 12px; }

/* логотип: знак въезжает при загрузке, кольцо-шестерня вращается при наведении */
.brand { gap: 12px; flex: none; }
.brand__mark { position: relative; display: grid; place-items: center; width: 64px; height: 64px;
  flex: none; }
.brand__ring { position: absolute; inset: -4px; width: calc(100% + 8px); height: calc(100% + 8px);
  max-width: none; color: var(--blue); opacity: 0; transform: scale(.7) rotate(-90deg);
  transition: opacity .4s, transform .9s var(--ease); }
.brand__sign { width: 60px; height: 56px; position: relative;
  animation: logoIn 1s var(--ease) .1s both; transition: transform .5s var(--ease); }
@keyframes logoIn { from { opacity: 0; transform: scale(.6) rotate(-25deg); } }
.brand:hover .brand__ring, .brand:focus-visible .brand__ring { opacity: .9;
  transform: scale(1) rotate(0); animation: ringSpin 6s linear .9s infinite; }
.brand:hover .brand__sign { transform: scale(1.06) rotate(-6deg); }
@keyframes ringSpin { to { transform: rotate(360deg); } }
.brand::after { content: ''; position: absolute; }
.brand__txt b { font-size: 20px; transition: color .3s; }
.brand:hover .brand__txt b { color: var(--blue3); }
.brand__txt i { font-size: 12px; }
.brand { position: relative; }
.brand__mark::before { content: ''; position: absolute; inset: 8px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 0, .55), transparent 70%);
  opacity: 0; transform: scale(.4); transition: opacity .4s, transform .6s var(--ease); }
.brand:hover .brand__mark::before { opacity: 1; transform: scale(1.25); }

/* язык выпадашкой */
.lang { position: relative; display: block; margin: 0; }
.lang__btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 11px;
  border-radius: 999px; border: 2px solid var(--line2); background: #fff; color: var(--ink);
  font-weight: 800; font-size: 14px; transition: border-color .2s, background .2s; }
.lang__btn:hover { border-color: var(--blue); }
.lang__car { transition: transform .25s var(--ease); }
.lang.is-open .lang__car { transform: rotate(180deg); }
.lang__list { position: absolute; right: 0; top: calc(100% + 8px); z-index: 70; min-width: 190px;
  list-style: none; padding: 6px; background: #fff; border: 1px solid var(--line);
  border-radius: 14px; box-shadow: var(--shadow); animation: ddIn .22s var(--ease); }
@keyframes ddIn { from { opacity: 0; transform: translateY(-6px); } }
.lang__i { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border-radius: 10px;
  color: var(--ink); font-size: 14.5px; font-weight: 600; border: 0 !important; }
.lang__i b { display: inline-grid; place-items: center; min-width: 34px; padding: 2px 6px;
  border-radius: 7px; background: var(--sky); color: var(--blue3); font-size: 12px; }
.lang__i:hover { background: var(--sky); color: var(--blue3); }
.lang__i.is-on { background: var(--blue); color: #fff; }
.lang__i.is-on b { background: var(--yellow); color: var(--ink); }
.lang--drawer { margin: 14px 0 4px; }
.lang--drawer .lang__list { left: 0; right: auto; }
.lang--drawer .lang__i { padding: 9px 11px; }

/* --- вариант 1: светлая, над ней коричневая полоса с адресом */
/* полоса уезжает за край сама: шапка липнет со сдвигом на её высоту */
@media (min-width: 621px) {
  html[data-hv="3"] .head, html[data-hv="1"] .head { top: -33px; }
}
html[data-hv="3"] .head.is-stuck .head__main { box-shadow: 0 10px 30px -18px rgba(43, 36, 21, .45); }
html[data-hv="3"] .head.is-stuck .head__in { padding-top: 6px; padding-bottom: 6px; }
html[data-hv="3"] .head.is-stuck .brand__mark { width: 52px; height: 52px; }
html[data-hv="3"] .head.is-stuck .brand__sign { width: 50px; height: 46px; }

/* --- вариант 2: плавающая капсула со стеклом поверх первого экрана */
html[data-hv="2"] .head { position: fixed; left: 0; right: 0; top: 0; padding: 12px 0 0; }
html[data-hv="2"] .head__bar { display: none; }
html[data-hv="2"] .head__main { background: transparent; box-shadow: none; backdrop-filter: none; }
html[data-hv="2"] .head__in { max-width: calc(var(--wrap) + 40px); background: var(--glass);
  backdrop-filter: saturate(1.5) blur(16px); border: 1px solid rgba(255, 255, 255, .7);
  border-radius: 22px; padding: 8px 12px 8px 14px;
  box-shadow: 0 16px 40px -22px rgba(7, 42, 75, .6); }
html[data-hv="2"] .wrap.head__in { width: calc(100% - 24px); }
html[data-hv="2"] .head.is-stuck { padding-top: 8px; }
html[data-hv="2"] .head.is-stuck .head__in { background: rgba(255, 255, 255, .95); }
html[data-hv="2"] .brand__mark { width: 52px; height: 52px; }
html[data-hv="2"] .brand__sign { width: 50px; height: 46px; }
html[data-hv="2"] .nav a { font-size: 14.5px; padding: 9px 10px; }
html[data-hv="2"] .head__tel-t i { display: none; }
html[data-hv="2"] main > :first-child { padding-top: calc(var(--head-h, 90px) + 24px); }
html[data-hv="2"] main > .vhero:first-child, html[data-hv="2"] main > .hero-v:first-child,
html[data-hv="2"] main > .hero-v1:first-child { padding-top: 0; }
html[data-hv="2"] .hero-v1 .hero__in { padding-top: calc(var(--head-h, 90px) + 36px); }
html[data-hv="2"] .vhero__in { padding-top: calc(var(--head-h, 90px) + 40px); }

/* --- вариант 3: тёмная фирменная, жёлтые акценты, меню с подсветкой */
html[data-hv="1"] .head__bar { background: var(--navy2); color: #cfe0f4; }
html[data-hv="1"] .head__bar a { color: #fff; }
html[data-hv="1"] .head__main { background: linear-gradient(100deg, var(--navy) 0%, #0d4a80 60%, var(--blue) 140%);
  backdrop-filter: none; box-shadow: 0 1px 0 rgba(255, 255, 255, .08); --focus: var(--yellow); }
html[data-hv="1"] .brand__mark { background: #fff; border-radius: 16px; width: 62px; height: 62px; }
html[data-hv="1"] .brand__sign { width: 52px; height: 48px; }
html[data-hv="1"] .brand__ring { color: var(--yellow); }
html[data-hv="1"] .brand__txt b { color: #fff; }
html[data-hv="1"] .brand:hover .brand__txt b { color: var(--yellow); }
html[data-hv="1"] .brand__txt i { color: #b9cde6; }
html[data-hv="1"] .nav { --focus: var(--yellow); }
html[data-hv="1"] .nav a { color: #eaf2fc; }
html[data-hv="1"] .nav a:hover { background: rgba(255, 255, 255, .1); color: #fff; }
html[data-hv="1"] .nav a.is-active { color: var(--yellow); }
html[data-hv="1"] .head__tel-i { background: var(--yellow); color: var(--ink); }
html[data-hv="1"] .head__tel-t b { color: #fff; }
html[data-hv="1"] .head__tel-t i { color: #b9cde6; }
html[data-hv="1"] .head__cta { background: var(--yellow); border-color: var(--yellow); color: var(--ink);
  --focus: #fff; }
html[data-hv="1"] .head__cta:hover { background: #fff; border-color: #fff; }
html[data-hv="1"] .head .lang__btn { background: rgba(255, 255, 255, .08); color: #fff;
  border-color: rgba(255, 255, 255, .35); --focus: var(--yellow); }
html[data-hv="1"] .head .burger { border-color: rgba(255, 255, 255, .4); --focus: var(--yellow); }
html[data-hv="1"] .head .burger span { background: #fff; }
html[data-hv="1"] .head.is-stuck .head__in { padding-top: 6px; padding-bottom: 6px; }

/* ====================================================== шапка страницы */

.phead { position: relative; overflow: hidden; isolation: isolate; background: var(--navy2);
  padding: 46px 0 50px; border-bottom: 0; color: #fff; }
.phead__bg { position: absolute; inset: 0; z-index: -1; }
.phead__bg img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.1);
  transform: scale(1.08); animation: pheadZoom 18s ease-out forwards; }
@keyframes pheadZoom { to { transform: scale(1); } }
.phead__bg::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(7, 42, 75, .94) 0%, rgba(7, 42, 75, .78) 50%,
    rgba(7, 42, 75, .45) 100%),
    linear-gradient(0deg, rgba(7, 42, 75, .5), transparent 60%); }
.phead__in { position: relative; --focus: var(--yellow); }
.phead h1 { color: #fff; max-width: 26ch; animation: heroUp .7s var(--ease) both; }
.phead .eyebrow { color: var(--yellow); }
.phead__lead { color: #dbe7f5; animation: heroUp .7s var(--ease) .1s both; }
.phead .crumbs { color: #b9cde6; }
.phead .crumbs a { color: #fff; }
.phead .crumbs a:hover { color: var(--yellow); }
.phead .crumbs i { color: #8fb0d6; }
.phead::after { content: ''; position: absolute; left: 0; bottom: 0; width: 220px; height: 5px;
  background: var(--yellow); }
@keyframes heroUp { from { opacity: 0; transform: translateY(16px); } }
html[data-hv="2"] .phead { padding-top: calc(var(--head-h, 90px) + 34px); }

/* ============================================== первый экран: варианты */

html[data-sv="1"] .hero-v2, html[data-sv="1"] .hero-v3,
html[data-sv="2"] .hero-v1, html[data-sv="2"] .hero-v3,
html[data-sv="3"] .hero-v1, html[data-sv="3"] .hero-v2 { display: none; }
html:not([data-sv]) .hero-v2, html:not([data-sv]) .hero-v3 { display: none; }

.hero-v1 { background: rgba(245, 242, 234, .86); }
.hero__find { border-radius: 20px; box-shadow: var(--shadow); }
.hero__txt h1 { animation: heroUp .8s var(--ease) both; }
.hero__txt p, .hero__act, .hero__tel { animation: heroUp .8s var(--ease) .12s both; }
.hero__find { animation: heroUp .8s var(--ease) .2s both; }

.vhero { position: relative; isolation: isolate; color: #fff; overflow: hidden;
  min-height: min(100svh, 860px); display: grid; align-items: center; background: var(--navy2); }
.vhero__bg { position: absolute; inset: 0; z-index: -1; }
.vhero__bg img, .vhero__bg video { position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; }
.vhero__bg video { opacity: 0; transition: opacity 1s; }
.vhero__bg video.is-on { opacity: .95; }
.vhero__bg::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(7, 42, 75, .86) 0%, rgba(7, 42, 75, .55) 46%,
    rgba(7, 42, 75, .12) 100%),
    linear-gradient(180deg, rgba(7, 42, 75, .4) 0%, transparent 30%, rgba(7, 42, 75, .45) 100%); }
.vhero__in { display: grid; gap: 40px; align-items: center; padding-top: 70px; padding-bottom: 70px;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); --focus: var(--yellow); }
.vhero__h { font-size: clamp(32px, 3.8vw, 50px); color: #fff; line-height: 1.1;
  animation: heroUp .9s var(--ease) both; }
.vhero__h em { font-style: normal; color: var(--yellow); }
.vhero__txt p { margin-top: 16px; max-width: 56ch; color: #e1ecf8;
  animation: heroUp .9s var(--ease) .12s both; }
.vhero .hero__act { animation: heroUp .9s var(--ease) .2s both; }
.vhero__marks { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 24px;
  font-size: 15px; font-weight: 700; color: #fff; animation: heroUp .9s var(--ease) .28s both; }
.vhero__marks li { display: inline-flex; align-items: center; gap: 7px; }
.vhero__marks svg { color: var(--yellow); }
.vhero__card { background: rgba(255, 255, 255, .88); color: var(--ink); backdrop-filter: blur(18px) saturate(1.4);
  border: 1px solid rgba(255, 255, 255, .7); border-radius: 22px; padding: 24px;
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); animation: cardIn 1s var(--ease) .25s both;
  --focus: var(--blue3); }
@keyframes cardIn { from { opacity: 0; transform: translateX(30px) scale(.97); } }
.vhero__card h2 { font-size: 24px; }
.vhero__card > p { font-size: 14.5px; color: var(--mute); margin-top: 6px; }
.vhero__card .form { background: none; padding: 0; margin-top: 12px; box-shadow: none;
  border-radius: 0; }
.vhero__card--dark { background: rgba(7, 42, 75, .72); color: #fff; border-color: rgba(255, 255, 255, .2);
  --focus: var(--yellow); }
.vhero__card--dark h2 { color: #fff; }
.vhero__card--dark .form { color: #fff; }
.vhero__card--dark .form label, .vhero__card--dark .form__ok-check label { color: #dbe7f5; }
.vhero__card--dark .form .form__ok-check a { color: var(--yellow); }
.vhero__card--dark .form__note { color: #b9cde6; }
.vhero__card--dark .form input, .vhero__card--dark .form select { background: rgba(255, 255, 255, .95);
  color: var(--ink); }
.form--short .form__note { font-size: 12px; }

.vfind { position: relative; display: flex; align-items: center; gap: 8px; margin-top: 26px;
  background: #fff; border-radius: 18px; padding: 7px 7px 7px 16px; max-width: 620px;
  box-shadow: 0 20px 50px -24px rgba(0, 0, 0, .7); animation: heroUp .9s var(--ease) .15s both;
  --focus: var(--blue3); }
.vfind svg { color: var(--mute); flex: none; }
.vfind input { flex: 1 1 auto; min-width: 0; border: 0; padding: 12px 4px; font-size: 16px;
  background: none; color: var(--ink); }
.vfind input:focus { outline: none; }
.vfind:focus-within { box-shadow: 0 0 0 3px var(--yellow), 0 20px 50px -24px rgba(0, 0, 0, .7); }
.vfind .btn { --focus: var(--blue3); }
.vfind__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px;
  animation: heroUp .9s var(--ease) .22s both; }
.vfind__chips a { padding: 6px 13px; border-radius: 999px; font-size: 13.5px; font-weight: 700;
  color: #fff; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .35);
  transition: background .2s, color .2s; }
.vfind__chips a:hover { background: var(--yellow); color: var(--ink); }
.vhero--three { align-items: stretch; grid-template-rows: 1fr auto; }
.vhero--three .vhero__in { align-self: center; }
.vstat { position: relative; background: rgba(7, 42, 75, .55); backdrop-filter: blur(10px);
  border-top: 1px solid rgba(255, 255, 255, .14); }
.vstat__in { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
  padding-top: 18px; padding-bottom: 18px; }
.vstat__i b { display: block; font-family: 'Arsenal', Georgia, serif; font-size: 34px;
  color: var(--yellow); line-height: 1; }
.vstat__i span { font-size: 14px; color: #dbe7f5; }

/* ============================================= главная: пять категорий */

.sec__h--more { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px;
  max-width: none; }
.sec__h--more > div { max-width: 70ch; }
.sec__link { display: inline-flex; align-items: center; gap: 8px; flex: none; padding: 9px 14px;
  border-radius: 12px; font-weight: 800; color: var(--blue3); background: rgba(255, 255, 255, .75);
  border: 2px solid var(--line); transition: border-color .2s, background .2s, gap .25s var(--ease); }
.sec__link:hover { border-color: var(--blue); background: var(--sky); gap: 12px; }

.hcats { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 210px; }
.hcat { position: relative; display: block; overflow: hidden; border-radius: 20px; color: #fff;
  isolation: isolate; background: var(--navy); box-shadow: var(--shadow); --focus: var(--yellow); }
.hcat--main { grid-row: span 2; grid-column: span 2; }
.hcat__ph { position: absolute; inset: 0; z-index: -1; }
.hcat__ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.hcat::after { content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(0deg, rgba(7, 42, 75, .92) 0%, rgba(7, 42, 75, .35) 55%, transparent 100%);
  transition: opacity .4s; }
.hcat:hover .hcat__ph img { transform: scale(1.08); }
.hcat__in { position: absolute; inset: auto 0 0 0; display: grid; gap: 2px; padding: 18px 20px; }
.hcat__k { font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--yellow); }
.hcat b { font-family: 'Arsenal', Georgia, serif; font-size: 23px; line-height: 1.15; }
.hcat--main b { font-size: 32px; }
.hcat__in > span:not(.hcat__k) { font-size: 14px; color: #dbe7f5; }
.hcat__go { position: absolute; right: 16px; bottom: 16px; display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 50%; background: var(--yellow); color: var(--ink);
  transform: translateX(-6px); opacity: .9; transition: transform .35s var(--ease), opacity .3s; }
.hcat:hover .hcat__go { transform: none; opacity: 1; }
.hcat:hover { color: #fff; }

/* ========================================== преимущества: живые иконки */

.band { background: linear-gradient(100deg, var(--navy) 0%, var(--blue) 100%); position: relative;
  overflow: hidden; }
.band::before { content: ''; position: absolute; inset: 0; opacity: .12;
  background: repeating-linear-gradient(115deg, #fff 0 2px, transparent 2px 26px); }
.band__in { position: relative; gap: 16px; padding-top: 34px; padding-bottom: 34px; }
.band__i { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px; padding: 20px; transition: transform .35s var(--ease), background .3s; }
.band__i:hover { transform: translateY(-6px); background: rgba(255, 255, 255, .14); }
.band__ico { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px;
  background: var(--yellow); color: var(--ink); margin-bottom: 14px;
  box-shadow: 0 10px 24px -10px rgba(255, 255, 0, .8); }
.band__i b { font-size: 18px; }
.band__i--gear .band__ico svg { animation: icoSpin 8s linear infinite; }
.band__i--wrench .band__ico svg { transform-origin: 70% 30%; animation: icoSwing 2.6s ease-in-out infinite; }
.band__i--box .band__ico svg { animation: icoHop 2.2s ease-in-out infinite; }
.band__i--truck .band__ico svg { animation: icoDrive 2.4s ease-in-out infinite; }
.band__i:hover .band__ico { animation: icoPop .5s var(--ease); }
@keyframes icoSpin { to { transform: rotate(360deg); } }
@keyframes icoSwing { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-22deg); } }
@keyframes icoHop { 0%, 60%, 100% { transform: translateY(0); } 30% { transform: translateY(-5px); } }
@keyframes icoDrive { 0%, 100% { transform: translateX(-3px); } 50% { transform: translateX(4px); } }
@keyframes icoPop { 50% { transform: scale(1.15) rotate(-6deg); } }

/* ======================================================= техника на главной */

.mach--home { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mcard { border-radius: 20px; background: rgba(255, 255, 255, .92); }
.mcard__ph { height: 240px; overflow: hidden; background: linear-gradient(160deg, #fff, var(--tint)); }
.mcard__ph img { object-fit: contain; padding: 8px; transition: transform .6s var(--ease); }
.mcard:hover .mcard__ph img { transform: scale(1.06); }
.mach--home .mcard--big { grid-column: span 2; grid-row: span 5; }
.mach--home .mcard__ph { height: 100%; min-height: 240px; }
.mach--home .mcard--big .mcard__ph { min-height: 380px; }
.mach--big .mcard__ph { height: 280px; }
.mcard__go { transition: gap .25s var(--ease); }
.mcard:hover .mcard__go { gap: 12px; }

/* ================================================ запчасти на главной */

.parts { position: relative; isolation: isolate; overflow: hidden; padding: 64px 0;
  background: var(--navy2); }
.parts__bg { position: absolute; inset: 0; z-index: -2; }
.parts__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .28; filter: grayscale(.3); }
.parts__bg::after { content: ''; position: absolute; inset: 0;
  background: linear-gradient(120deg, rgba(7, 42, 75, .95), rgba(7, 42, 75, .78)); }
.parts__art { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.parts__art svg { position: absolute; width: 220px; opacity: .2; }
.parts__art svg:nth-child(1) { top: 20px; right: 6%; animation: artSpin 40s linear infinite; }
.parts__art svg:nth-child(2) { bottom: 30px; left: 3%; animation: artFloatB 14s ease-in-out infinite alternate; }
.parts__art svg:nth-child(3) { bottom: -10px; right: 30%; width: 300px;
  animation: artRoll 18s ease-in-out infinite alternate; }
.parts__art .pa-l { stroke: #fff; }
.parts__art .pa-f, .parts__art .pa-d { fill: var(--yellow); }
.parts .sec__h h2 { color: #fff; }
.parts .sec__h p { color: #cfe0f4; }
.parts .sec__link { background: rgba(255, 255, 255, .1); color: #fff; border-color: rgba(255, 255, 255, .35);
  --focus: var(--yellow); }
.parts .sec__link:hover { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }

/* =========================================================== запчасти */

.pa-l { fill: none; stroke: var(--blue); stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; }
.pa-thick { stroke-width: 7; }
.pa-t { stroke: var(--brown); stroke-width: 3; stroke-linecap: round; }
.pa-f { fill: var(--yellow); stroke: var(--brown); stroke-width: 2; }
.pa-d { fill: var(--brown); }
.pa-spin { transform-origin: 60px 40px; transform-box: view-box; }

.gcard { grid-row: span 6; border-radius: 18px; padding: 14px 16px 16px;
  background: rgba(255, 255, 255, .95); transition: border-color .2s, box-shadow .25s, transform .25s var(--ease); }
.gcard:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.gcard__ph { display: grid; place-items: center; height: 116px; margin: -2px -4px 12px;
  border-radius: 12px; background: linear-gradient(150deg, var(--sky), #fff 70%); overflow: hidden; }
.gcard__ph svg { width: 120px; height: 80px; transition: transform .6s var(--ease); }
.gcard:hover .gcard__ph svg { transform: scale(1.12) rotate(-4deg); }
.gcard:hover .pa-spin { animation: icoSpin 3s linear infinite; }
.gcard__price { display: inline-flex; align-items: center; gap: 6px; border-radius: 10px; }
.gcard__price svg { transition: transform .25s var(--ease); }
.gcard:hover .gcard__price svg { transform: translateX(4px); }

.sec--cat { padding-top: 34px; }
.cat--side { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 26px; align-items: start; }
.fl { position: sticky; top: calc(var(--head-h, 80px) + 12px); display: grid; gap: 14px;
  max-height: calc(100vh - var(--head-h, 80px) - 24px); overflow-y: auto; padding-right: 4px; }
.fl__box { background: rgba(255, 255, 255, .92); border: 1px solid var(--line); border-radius: 18px;
  padding: 14px; }
.fl__h { font-family: 'Mulish', sans-serif; font-size: 12.5px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: var(--blue3); margin: 0 0 8px 6px; }
.fl__list { display: grid; gap: 2px; }
.fl__list--scroll { max-height: 280px; overflow-y: auto; }
.fl__i { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%;
  padding: 8px 10px; border-radius: 10px; text-align: left; font-size: 14.5px; font-weight: 600;
  color: var(--ink); transition: background .2s, color .2s; }
.fl__i i { font-style: normal; font-size: 12px; font-weight: 800; color: var(--blue3);
  background: var(--sky); border-radius: 999px; padding: 1px 8px; flex: none; }
.fl__i:hover { background: var(--sky); }
.fl__i.is-on { background: var(--blue); color: #fff; --focus: var(--ink); }
.fl__i.is-on i { background: var(--yellow); color: var(--ink); }
.fl__help { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 4px 10px; align-items: start;
  padding: 14px; border-radius: 18px; background: var(--navy); color: #fff; --focus: var(--yellow); }
.fl__help svg { grid-row: span 2; width: 54px; height: 36px; }
.fl__help .pa-l { stroke: var(--yellow); }
.fl__help .pa-t { stroke: #fff; }
.fl__help span { font-size: 13.5px; color: #cfe0f4; }
.fl__help a { color: var(--yellow); font-weight: 800; }
.fl__close { display: none; }
.cat__main { min-width: 0; }
.cat__bar { border-radius: 18px; background: rgba(255, 255, 255, .95); }
.cat__sort { padding: 11px 12px; border: 2px solid var(--line2); border-radius: 12px; background: #fff;
  font-weight: 600; }
.cat__view { display: inline-flex; border: 2px solid var(--line2); border-radius: 12px; overflow: hidden; }
.cat__view button { display: grid; place-items: center; width: 42px; height: 40px; color: var(--mute); }
.cat__view button.is-on { background: var(--blue); color: #fff; --focus: var(--ink); }
.cat__fbtn { display: none; }
.cat__state { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 14px 2px 16px; min-height: 40px; }
.cat__grid { gap: 16px; }
.cat__grid > [data-card] { animation: cardUp .4s var(--ease) both; }
@keyframes cardUp { from { opacity: 0; transform: translateY(10px); } }
.cat__grid.is-list { grid-template-columns: minmax(0, 1fr); gap: 10px; }
.cat__grid.is-list .gcard { grid-row: auto; display: grid; grid-template-rows: none;
  grid-template-columns: 90px minmax(0, 1.4fr) minmax(0, .8fr) minmax(0, 1fr) auto; gap: 14px;
  align-items: center; padding: 10px 14px; }
.cat__grid.is-list .gcard__in { display: contents; }
.cat__grid.is-list .gcard__ph { height: 64px; margin: 0; }
.cat__grid.is-list .gcard__ph svg { width: 80px; height: 54px; }
.cat__grid.is-list .gcard__grp { display: none; }
.cat__grid.is-list .gcard__name { margin: 0; }
.cat__grid.is-list .gcard__art, .cat__grid.is-list .gcard__fit { border: 0; padding: 0; }
.cat__grid.is-list .gcard__price { margin: 0; }

/* карточка запчасти и машины */
.pcard { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 32px; align-items: start; }
.pgal__main { display: grid; place-items: center; height: 340px; border-radius: 22px;
  background: linear-gradient(150deg, var(--sky), #fff 75%); border: 1px solid var(--line); }
.pgal__main svg { width: 72%; height: auto; max-height: 260px; }
.pgal__main .pa-spin { animation: icoSpin 16s linear infinite; }
.pgal__thumbs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.pgal__t { display: grid; place-items: center; height: 84px; border-radius: 14px; background: var(--tint);
  border: 1px solid var(--line); opacity: .6; }
.pgal__t svg { width: 80px; height: 54px; }
.pgal__note { margin-top: 8px; font-size: 13px; color: var(--mute); }
.pcard__info { display: grid; gap: 16px; padding: 24px; border-radius: 22px; background: rgba(255, 255, 255, .95);
  border: 1px solid var(--line); box-shadow: var(--shadow); }
.pcard__grp { font-size: 12.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
  color: var(--blue3); }
.pcard__kv { display: grid; gap: 0; margin: 0; }
.pcard__kv > div { display: flex; justify-content: space-between; gap: 14px; padding: 11px 0;
  border-bottom: 1px dashed var(--line); }
.pcard__kv dt { color: var(--mute); font-size: 14.5px; }
.pcard__kv dd { margin: 0; font-weight: 800; text-align: right; }
.pcard__act { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }

.tabs__bar { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px; border-radius: 16px;
  background: rgba(255, 255, 255, .9); border: 1px solid var(--line); margin-bottom: 18px; }
.tabs__b { padding: 10px 16px; border-radius: 11px; font-weight: 800; font-size: 15px; color: var(--mute);
  transition: background .2s, color .2s; }
.tabs__b:hover { background: var(--sky); color: var(--blue3); }
.tabs__b.is-on { background: var(--blue); color: #fff; --focus: var(--ink);
  box-shadow: 0 8px 18px -10px rgba(0, 112, 192, .9); }
.tabs__p { animation: paneIn .35s var(--ease); background: rgba(255, 255, 255, .92); border-radius: 20px;
  border: 1px solid var(--line); padding: 24px; }
@keyframes paneIn { from { opacity: 0; transform: translateY(8px); } }
.stub { display: flex; align-items: center; gap: 16px; padding: 20px; border-radius: 16px;
  border: 2px dashed var(--line2); background: var(--tint); color: var(--mute); }
.stub__i { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px; flex: none;
  background: #fff; color: var(--blue3); }
.stub--video .stub__i { background: var(--blue); color: #fff; }
.stub--video .stub__i svg { transform: scale(.8); }
.docs { display: grid; gap: 14px; }
.doc { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 16px; align-items: center;
  padding: 14px; border-radius: 16px; border: 1px solid var(--line); background: #fff; }
.doc__ph { display: grid; place-items: center; height: 150px; border-radius: 10px; overflow: hidden;
  background: var(--tint); border: 0; padding: 0; color: var(--blue3); }
.doc__ph img { width: 100%; height: 100%; object-fit: cover; }
.doc b { display: block; font-size: 18px; }
.doc span { display: block; font-size: 14px; color: var(--mute); margin-top: 4px; }
.doc__btn { display: inline-flex !important; margin-top: 12px !important; color: var(--blue3) !important;
  pointer-events: none; }

.mgal__main { display: block; width: 100%; height: 400px; padding: 0; border: 1px solid var(--line);
  border-radius: 22px; overflow: hidden; background: linear-gradient(160deg, #fff, var(--tint)); }
.mgal__main img { width: 100%; height: 100%; object-fit: contain; }
.mgal__main.is-swap img { animation: paneIn .4s var(--ease); }
.mgal__thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px;
  margin-top: 10px; }
.mgal__t { height: 64px; padding: 0; border-radius: 10px; overflow: hidden; border: 2px solid transparent;
  opacity: .7; transition: opacity .2s, border-color .2s; }
.mgal__t img { width: 100%; height: 100%; object-fit: cover; }
.mgal__t:hover { opacity: 1; }
.mgal__t.is-on { border-color: var(--blue); opacity: 1; }
.mgal__t:focus-visible { outline-offset: -3px; }
.mhero { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.mhero__txt { padding: 24px; border-radius: 22px; background: rgba(255, 255, 255, .95);
  border: 1px solid var(--line); box-shadow: var(--shadow); }
.mhero__h { font-size: clamp(26px, 2.6vw, 34px); margin: 6px 0 8px; }
.mhero__txt .btn { margin-top: 0; }

.pnav { position: sticky; top: var(--head-h, 80px); z-index: 30; background: rgba(255, 255, 255, .9);
  backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.pnav__in { display: flex; gap: 6px; overflow-x: auto; padding-top: 10px; padding-bottom: 10px; }
.pnav a { flex: none; padding: 8px 14px; border-radius: 999px; font-weight: 800; font-size: 14.5px;
  border: 2px solid var(--line2); color: var(--ink); background: #fff; }
.pnav a:hover { border-color: var(--blue); color: var(--blue3); }
.sec--mcat { padding: 40px 0 10px; scroll-margin-top: 140px; }
.sec--mcat:last-of-type { padding-bottom: 60px; }
html[data-hv="2"] .pnav { top: calc(var(--head-h, 80px) + 4px); }

.sec--tight { padding: 34px 0; }

/* =============================================================== новости */

.ncard { grid-row: span 4; border-radius: 18px; background: rgba(255, 255, 255, .95);
  transition: border-color .2s, box-shadow .25s, transform .25s var(--ease); }
.ncard:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.ncard__ph { height: 180px; overflow: hidden; }
.ncard__ph img { transition: transform .6s var(--ease); }
.ncard:hover .ncard__ph img { transform: scale(1.06); }
.ncard__ph--logo { display: grid; place-items: center;
  background: radial-gradient(circle at 50% 45%, #fff 0, var(--sky) 70%); }
.ncard__ph--logo img { width: 92px; height: auto; object-fit: contain; }
.ncard__t { padding-bottom: 6px; }
.ncard__go { display: grid; place-items: center; width: 36px; height: 36px; margin: 4px 16px 16px;
  border-radius: 50%; background: var(--sky); color: var(--blue3);
  transition: background .2s, transform .3s var(--ease); }
.ncard:hover .ncard__go { background: var(--yellow); color: var(--ink); transform: translateX(4px); }

/* ================================================================ ремонт */

.rcard { grid-row: span 3; border-radius: 18px; background: rgba(255, 255, 255, .95);
  transition: border-color .2s, box-shadow .25s, transform .25s var(--ease); }
.rcard:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.rcard__ph { height: 190px; overflow: hidden; }
.rcard__ph img { transition: transform .6s var(--ease); }
.rcard:hover .rcard__ph img { transform: scale(1.06); }
.rcard__ph--none { height: 190px; background: linear-gradient(140deg, var(--navy), var(--blue)); }
.rcard__go { transition: gap .25s var(--ease); }
.rcard:hover .rcard__go { gap: 12px; }

.two--repair { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.slider { position: relative; }
.slider__track { list-style: none; display: flex; overflow-x: auto; scroll-snap-type: x mandatory;
  border-radius: 22px; scrollbar-width: none; border: 1px solid var(--line); background: var(--tint); }
.slider__track::-webkit-scrollbar { display: none; }
.slider__i { flex: 0 0 100%; scroll-snap-align: start; }
.slider__ph { display: block; width: 100%; height: 400px; border: 0; padding: 0; }
.slider__ph img { width: 100%; height: 100%; object-fit: cover; }
.slider__ph:focus-visible { outline-offset: -3px; }
.slider__nav { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px;
  font-weight: 800; color: var(--mute); }
.slider__nav button { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  background: #fff; border: 2px solid var(--line2); color: var(--blue3); transition: background .2s, color .2s; }
.slider__nav button:first-child svg { transform: rotate(180deg); }
.slider__nav button:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.seo { padding: 26px; border-radius: 20px; background: rgba(255, 255, 255, .9); border: 1px solid var(--line); }
.seo h2 { margin-top: 0; }

/* ================================================================ услуги */

.ugrid { gap: 18px; }
.ucard { position: relative; display: grid; gap: 14px; align-content: start; border-top: 0;
  border-radius: 20px; padding: 24px; background: rgba(255, 255, 255, .95); overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s; }
.ucard::before { content: ''; position: absolute; left: 0; top: 0; height: 4px; width: 100%;
  background: linear-gradient(90deg, var(--blue), var(--yellow)); transform: scaleX(.25);
  transform-origin: left; transition: transform .5s var(--ease); }
.ucard:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.ucard:hover::before { transform: scaleX(1); }
.ucard__i { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 20px;
  background: linear-gradient(140deg, var(--sky), #fff); border: 1px solid #cfe0f4; margin: 0; }
.ucard__i svg { width: 46px; height: 46px; overflow: visible; }
.si-l { fill: none; stroke: var(--blue3); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.si-fx { fill: none; stroke: #d9b800; stroke-width: 2.8; stroke-linecap: round; }
circle.si-fx { fill: var(--yellow); stroke: var(--brown); stroke-width: 1.5; }
.ucard p { font-weight: 700; font-size: 16.5px; line-height: 1.4; }
.ucard__i .si-spark { stroke-dasharray: 3 4; animation: spark .8s linear infinite; }
@keyframes spark { to { stroke-dashoffset: -14; } }
.ucard:hover .si-bend { animation: bend 1.2s ease-in-out infinite alternate; transform-origin: 20px 34px; }
@keyframes bend { to { transform: rotate(-8deg); } }
.si-glow { animation: glow 1.4s ease-in-out infinite; transform-origin: 34px 16px; }
@keyframes glow { 50% { transform: scale(1.35); opacity: .6; } }
.si-rise { stroke: #e05a00; stroke-dasharray: 18; stroke-dashoffset: 18; animation: rise 2.4s ease-in-out infinite; }
@keyframes rise { 50% { stroke-dashoffset: 0; } }
.si-flame { stroke: #e05a00; transform-origin: 12px 30px; animation: flame 1.1s ease-in-out infinite alternate; }
@keyframes flame { to { transform: scaleY(1.15) skewX(-4deg); } }
.si-drive { animation: icoDrive 2.2s ease-in-out infinite; }
.si-road { stroke-dasharray: 6 5; animation: spark 1s linear infinite; }
.si-grow { transform-origin: 50% 100%; transform-box: fill-box; animation: grow 2.6s ease-in-out infinite; }
@keyframes grow { 50% { transform: scaleY(1.12); } }
.si-spin { transform-origin: 24px 24px; animation: icoSpin 9s linear infinite; }
.ucard:hover .si-spin { animation-duration: 2s; }

.ucall { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 28px;
  border-radius: 22px; background: linear-gradient(110deg, var(--navy), var(--blue)); color: #fff;
  --focus: #fff; }
.ucall h2 { color: #fff; }
.ucall p { margin-top: 8px; color: #dbe7f5; max-width: 62ch; }
.ucall__btn { flex: none; gap: 12px; padding: 14px 20px; }
.ucall__btn span { display: grid; text-align: left; }
.ucall__btn b { font-size: 19px; }
.ucall__btn i { font-style: normal; font-size: 12.5px; font-weight: 700; }
.ucall__btn svg { animation: ring 1.6s ease 1s infinite; }

/* ============================================================== вакансии */

.vacs { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr)); }
.vac { position: relative; display: grid; gap: 10px; align-content: start; padding: 22px; border-radius: 20px;
  background: rgba(255, 255, 255, .95); border: 1px solid var(--line); overflow: hidden;
  transition: transform .3s var(--ease), box-shadow .3s, border-color .3s; }
.vac:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: var(--blue); }
.vac__n { font-family: 'Arsenal', Georgia, serif; font-size: 40px; line-height: 1; color: var(--sky);
  -webkit-text-stroke: 1.5px var(--blue); }
.vac h3 { font-size: 19px; color: var(--brown); }
.vac p { font-size: 14.5px; color: var(--mute); }
.vac dl { margin: 0; }
.vac dl div { display: flex; justify-content: space-between; padding: 9px 12px; border-radius: 10px;
  background: var(--tint); }
.vac dt { color: var(--mute); font-size: 14px; }
.vac dd { margin: 0; font-weight: 800; }
.vac { grid-template-rows: auto auto 1fr auto auto; }
.vac .btn { justify-self: start; }
.form .form__ok-check a, .foot__mail, .foot__bot a, .fdev__a { display: inline-flex; min-height: 24px; align-items: center; }


.steps { list-style: none; display: grid; gap: 12px; margin-top: 6px; }
.steps li { display: flex; gap: 14px; align-items: center; padding: 14px 16px; border-radius: 16px;
  background: rgba(255, 255, 255, .95); border: 1px solid var(--line); }
.steps b { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; flex: none;
  background: var(--yellow); color: var(--ink); }
.hr { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 0 12px; align-items: center;
  margin-top: 16px; padding: 14px 16px; border-radius: 16px; background: var(--navy); color: #fff;
  --focus: var(--yellow); }
.hr > span { grid-row: span 2; display: grid; place-items: center; width: 44px; height: 44px;
  border-radius: 50%; background: var(--yellow); color: var(--ink); }
.hr b { font-size: 19px; }
.hr i { font-style: normal; font-size: 13px; color: #cfe0f4; }
.hr:hover { color: var(--yellow); }

/* ======================================================== о предприятии */

.aintro__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.aintro__txt h2 { margin-bottom: 6px; }
.amos { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 120px; }
.amos__i { display: block; padding: 0; border: 0; border-radius: 16px; overflow: hidden; }
.amos__i:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.amos__i:nth-child(4) { grid-row: span 2; }
.amos__i img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease); }
.amos__i:hover img { transform: scale(1.07); }
.amos__i:focus-visible { outline-offset: -3px; }
.afacts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 36px; }
.afact { padding: 20px; border-radius: 18px; background: rgba(255, 255, 255, .95); border: 1px solid var(--line);
  border-bottom: 4px solid var(--yellow); }
.afact b { display: block; font-family: 'Arsenal', Georgia, serif; font-size: 40px; line-height: 1;
  color: var(--blue3); font-variant-numeric: tabular-nums lining-nums; }
.afact span { display: block; margin-top: 6px; font-size: 14px; color: var(--mute); }
.adirs { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.adir { padding: 22px; border-radius: 20px; background: rgba(255, 255, 255, .95); border: 1px solid var(--line);
  transition: transform .3s var(--ease), box-shadow .3s; }
.adir:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.adir b { display: block; font-size: 18px; color: var(--brown); margin-bottom: 6px; }
.adir p { font-size: 14.5px; color: var(--mute); }
.adir--gear .band__ico svg { animation: icoSpin 8s linear infinite; }
.adir--wrench .band__ico svg { transform-origin: 70% 30%; animation: icoSwing 2.6s ease-in-out infinite; }
.adir--leaf .band__ico svg { transform-origin: 20% 80%; animation: icoSwing 3.2s ease-in-out infinite; }
.adir--truck .band__ico svg { animation: icoDrive 2.4s ease-in-out infinite; }

/* хроника: линия растёт вместе с прокруткой, точки загораются */
.tl { position: relative; list-style: none; display: grid; gap: 18px; padding-left: 0; --tl: 0; }
.tl::before, .tl::after { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 4px;
  margin-left: -2px; border-radius: 4px; }
.tl::before { background: var(--line); }
.tl::after { background: linear-gradient(var(--blue), var(--yellow)); transform-origin: top;
  transform: scaleY(var(--tl)); }
.tl__i { position: relative; width: calc(50% - 34px); padding: 18px 20px; border-radius: 18px;
  background: rgba(255, 255, 255, .96); border: 1px solid var(--line); box-shadow: 0 10px 26px -20px rgba(11, 58, 102, .5); }
.tl__i:nth-child(odd) { justify-self: start; }
.tl__i:nth-child(even) { justify-self: end; }
.tl__i[data-reveal] { transform: translateX(-24px); }
.tl__i:nth-child(even)[data-reveal] { transform: translateX(24px); }
.tl__i[data-reveal].is-in { transform: none; }
.tl__i::before { content: ''; position: absolute; top: 24px; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; border: 4px solid var(--blue); z-index: 1; transition: background .4s, box-shadow .4s; }
.tl__i:nth-child(odd)::before { right: -44px; }
.tl__i:nth-child(even)::before { left: -44px; }
.tl__i.is-in::before { background: var(--yellow); box-shadow: 0 0 0 6px rgba(0, 112, 192, .15); }
.tl__y { display: inline-block; font-family: 'Arsenal', Georgia, serif; font-size: 28px; font-weight: 700;
  color: var(--blue3); line-height: 1; margin-bottom: 6px; }
.tl__i p { font-size: 15px; color: #3c3a33; }
.amotto { padding: 54px 0; background: linear-gradient(110deg, var(--navy), var(--blue)); text-align: center; }
.amotto p { font-family: 'Arsenal', Georgia, serif; font-size: clamp(24px, 3vw, 38px); color: #fff; }
.amotto p::before, .amotto p::after { content: '«'; color: var(--yellow); }
.amotto p::after { content: '»'; }
.rg--cols { columns: 2 340px; column-gap: 34px; }
.rg--cols p { break-inside: avoid; margin: 0 0 14px; }
.acert { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.acert__i { display: block; height: 220px; padding: 6px; border: 1px solid var(--line); border-radius: 14px;
  background: #fff; overflow: hidden; transition: transform .3s var(--ease); }
.acert__i img { width: 100%; height: 100%; object-fit: contain; }
.acert__i:hover { transform: translateY(-6px) rotate(-1deg); }

/* ============================================================== контакты */

.kcards { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kcard { display: grid; gap: 4px; align-content: start; padding: 20px; border-radius: 20px;
  background: rgba(255, 255, 255, .95); border: 1px solid var(--line); }
.kcard__i { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px;
  background: var(--blue); color: #fff; margin-bottom: 8px; }
.kcard i { font-style: normal; font-size: 12.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--mute); }
.kcard a, .kcard b { font-weight: 800; font-size: 17px; word-break: break-word; }
.deps { list-style: none; display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.deps li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px;
  border-radius: 14px; background: rgba(255, 255, 255, .95); border: 1px solid var(--line); }
.deps span { color: var(--mute); font-size: 14.5px; }
.deps a { font-weight: 800; white-space: nowrap; }
.two--map { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.kmap, .foot__map { border-radius: 20px; overflow: hidden; border: 1px solid var(--line); background: var(--tint); }
.kmap iframe { display: block; width: 100%; height: 440px; border: 0; }
.kreq { display: grid; gap: 0; margin: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 30px; }
.kreq > div { padding: 12px 0; border-bottom: 1px dashed var(--line2); }
.kreq dt { font-size: 12.5px; color: var(--mute); text-transform: uppercase; letter-spacing: .05em; }
.kreq dd { margin: 2px 0 0; font-weight: 700; }

/* =============================================================== заявка */

.ask { background: linear-gradient(115deg, var(--navy2) 0%, var(--navy) 55%, #0d4a80 100%); position: relative;
  overflow: hidden; color: #e5eef9; }
.ask::before { content: ''; position: absolute; right: -120px; top: -120px; width: 420px; height: 420px;
  border-radius: 50%; border: 50px solid rgba(255, 255, 0, .07); }
.ask__in { position: relative; }
.ask .eyebrow { color: var(--yellow); }
.ask__side > p { color: #cfe0f4; }
.ask__ph a { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 0 12px; align-items: center; }
.ask__ph a span { grid-row: span 2; display: grid; place-items: center; width: 36px; height: 36px;
  border-radius: 50%; background: rgba(255, 255, 255, .1); color: var(--yellow); }
.ask__ph a i { font-style: normal; font-size: 13px; color: #b9cde6; }
.ask__ph a b { font-size: 19px; }
.ask__mail { display: inline-flex; align-items: center; gap: 8px; }
.form { border-radius: 22px; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); }
.form input, .form select { border-radius: 12px; transition: border-color .2s, box-shadow .2s; }
.form input:focus, .form select:focus { box-shadow: 0 0 0 4px rgba(0, 112, 192, .15); }

/* ================================================================ подвал */

.foot { background: var(--navy2); padding: 54px 0 26px; color: #dbe7f5; position: relative; overflow: hidden; }
.foot::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 5px;
  background: linear-gradient(90deg, var(--yellow), var(--blue)); }
.foot a { color: #e5eef9; }
.foot__top { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1.3fr); gap: 30px;
  padding-bottom: 34px; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.foot__sign { display: inline-block; background: #fff; border-radius: 16px; padding: 8px 12px;
  transition: transform .4s var(--ease); }
.foot__sign:hover { transform: rotate(-4deg) scale(1.04); }
.foot__sign img { width: 72px; height: 67px; object-fit: contain; }
.foot__full { margin-top: 14px; font-weight: 800; font-size: 17px; color: #fff; }
.foot__tag { margin-top: 4px; font-size: 14px; color: #b9cde6; }
.foot__cta { margin-top: 18px; background: var(--yellow); border-color: var(--yellow); color: var(--ink);
  --focus: #fff; }
.foot .foot__cta { color: var(--ink); }
.foot .foot__cta:hover { background: #fff; border-color: #fff; color: var(--ink); }
.foot__contacts h2, .foot__col h2 { color: #fff; font-size: 16px; margin-bottom: 14px; }
.foot__ph { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 14px; }
.foot__ph a b { display: block; font-size: 16px; font-weight: 800; color: var(--yellow); }
.foot__ph a span { display: block; font-size: 12.5px; color: #b9cde6; line-height: 1.35; }
.foot__contacts > a, .foot__contacts > p { display: flex; gap: 8px; align-items: flex-start;
  font-size: 14px; margin-top: 8px; color: #cfe0f4; }
.foot__contacts svg { flex: none; margin-top: 3px; color: var(--yellow); }
.foot__map { border-color: rgba(255, 255, 255, .15); background: #0d3459; }
.foot__map iframe { display: block; width: 100%; height: 260px; border: 0; filter: saturate(.85); }
.foot__grid { display: grid; gap: 24px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 30px 0; }
.foot__col ul { list-style: none; display: grid; gap: 6px; font-size: 14.5px; }
.foot__col a { position: relative; }
.foot__col a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: var(--yellow); transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease); }
.foot__col a:hover { color: var(--yellow); }
.foot__col a:hover::after { transform: scaleX(1); transform-origin: left; }
.foot__req { display: flex; flex-wrap: wrap; gap: 6px 22px; padding: 16px 0; font-size: 13px; color: #9fb7d6;
  border-top: 1px solid rgba(255, 255, 255, .12); }
.foot__bot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; margin-top: 0; padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; color: #9fb7d6; }
.foot__note { flex: 1 1 auto; }
.fdev { white-space: nowrap; }
.fdev__a { display: inline-flex; align-items: center; gap: 5px; color: rgba(255, 255, 255, .85) !important;
  transition: color .25s; }
.fdev__a:hover { color: var(--yellow) !important; }
.fdev__n { font-weight: 800; letter-spacing: .05em; border-bottom: 1px solid currentColor; padding-bottom: 1px; }
.fdev__ok { color: #3ecf8e; flex: none; }
.fdev__ok path { stroke-dasharray: 20; stroke-dashoffset: 20; animation: okDraw .7s var(--ease) .5s forwards; }
.fdev__a:hover .fdev__ok path { animation: okDraw .45s var(--ease) forwards; }
@keyframes okDraw { to { stroke-dashoffset: 0; } }

/* переключатель вариантов для заказчика */
.vpick { position: fixed; left: 76px; bottom: 18px; z-index: 56; display: grid; gap: 4px; padding: 7px 10px;
  border-radius: 16px; background: rgba(255, 255, 255, .95); border: 1px solid var(--line);
  box-shadow: var(--shadow); font-size: 12.5px; }
.vpick__row { display: flex; align-items: center; gap: 5px; }
.vpick__row i { font-style: normal; font-weight: 800; color: var(--mute); min-width: 92px; }
.vpick button { width: 28px; height: 28px; border-radius: 8px; font-weight: 800; border: 2px solid var(--line2);
  color: var(--ink); background: #fff; }
.vpick button.is-on { background: var(--blue); border-color: var(--blue); color: #fff; --focus: var(--ink); }

/* ================================================================ ширины */

.head__in { max-width: 1480px; }
html[data-hv="2"] .head__in { max-width: 1480px; }
@media (max-width: 1640px) {
  .head__tel .head__tel-t { display: none; }
  .brand__txt i { display: none; }
}
@media (max-width: 1440px) {
  .head__cta { display: none; }
}
@media (max-width: 1320px) {
  .nav a { padding: 9px 7px; font-size: 14px; }
  .brand__txt b { font-size: 18px; }
  .head__in { gap: 14px; }
}
@media (max-width: 1200px) {
  .head .lang__btn span { display: none; }
}
@media (max-width: 1200px) {
  .nav { display: none; }
  .head .burger { display: block; }
  .head__cta { display: inline-flex; }
  .head__tel .head__tel-t { display: block; }
  .brand__txt i { display: block; }
}
@media (max-width: 1100px) {
  .hcats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hcat--main { grid-column: span 2; grid-row: span 1; }
  .mach--home { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mach--home .mcard--big { grid-column: span 2; }
  .foot__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .foot__map { grid-column: 1 / -1; }
  .adirs, .kcards, .afacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .acert { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
  .vhero__in, .pcard, .mhero, .two--repair, .two--map, .aintro__in { grid-template-columns: minmax(0, 1fr); }
  .vhero { min-height: 0; }
  .cat--side { grid-template-columns: minmax(0, 1fr); }
  .fl { position: fixed; inset: 0 auto 0 0; z-index: 90; width: min(360px, 88vw); max-height: none;
    padding: 16px; background: #fbfaf6; transform: translateX(-102%); visibility: hidden;
    transition: transform .3s var(--ease), visibility .3s; box-shadow: 20px 0 50px -20px rgba(0, 0, 0, .4); }
  .cat--side.is-fl .fl { transform: none; visibility: visible; }
  .fl__close { display: inline-flex; justify-content: center; }
  .cat__fbtn { display: inline-flex; }
  .tl::before, .tl::after { left: 14px; }
  .tl__i { width: auto; margin-left: 40px; justify-self: stretch !important; }
  .tl__i::before { left: -35px !important; right: auto !important; }
  .tl__i[data-reveal], .tl__i:nth-child(even)[data-reveal] { transform: translateY(12px); }
}
@media (max-width: 860px) {
  .head__cta { display: none; }
  .head__tel .head__tel-t { display: none; }
  .head__tel { display: flex; }
  .ucall { flex-direction: column; align-items: flex-start; }
  .vstat__in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kreq { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .cat__bar { position: static; }
  .cat__grid.is-list .gcard { grid-template-columns: 64px minmax(0, 1fr); }
  .cat__grid.is-list .gcard__fit, .cat__grid.is-list .gcard__price { display: none; }
  .vpick { left: 74px; bottom: 16px; }
  .vpick__row i { min-width: 0; font-size: 11px; }
}
@media (max-width: 1260px) {
  html[data-hv="2"] .nav { display: none; }
  html[data-hv="2"] .head .burger { display: block; }
}
@media (max-width: 620px) {
  .head__bar { display: none; }
  .brand__txt i { display: none; }
  .brand__txt b { font-size: 16px; }
  .brand__mark { width: 50px; height: 50px; }
  .brand__sign { width: 48px; height: 44px; }
  .head .lang__btn span { display: none; }
  .head__in { gap: 10px; }
  .head__side { gap: 8px; }
  .hcats { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 190px; }
  .hcat--main { grid-column: auto; }
  .mach--home { grid-template-columns: minmax(0, 1fr); }
  .mach--home .mcard--big { grid-column: auto; }
  .sec__h--more { flex-direction: column; align-items: flex-start; }
  .foot__top, .foot__grid { grid-template-columns: minmax(0, 1fr); }
  .foot__ph { grid-template-columns: minmax(0, 1fr); }
  .adirs, .kcards, .afacts { grid-template-columns: minmax(0, 1fr); }
  .acert { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mgal__main, .slider__ph { height: 280px; }
  .pgal__main { height: 240px; }
  .phead { padding: 30px 0 34px; }
  .vfind .btn { padding: 12px 14px; }
  .vfind svg { display: none; }
  .doc { grid-template-columns: minmax(0, 1fr); }
  .vpick { left: 12px; right: auto; bottom: 74px; }
  .amos { grid-auto-rows: 90px; }
  .tabs__b { padding: 9px 12px; font-size: 14px; }
}

@media (max-width: 620px) {
  .band__in { grid-template-columns: minmax(0, 1fr); }
  .cat__grid:not(.is-list) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .cat__grid:not(.is-list) .gcard { padding: 10px; border-radius: 14px; }
  .cat__grid:not(.is-list) .gcard__ph { height: 70px; margin: 0 0 8px; }
  .cat__grid:not(.is-list) .gcard__ph svg { width: 80px; height: 54px; }
  .cat__grid:not(.is-list) .gcard__grp { font-size: 10px; }
  .cat__grid:not(.is-list) .gcard__name { font-size: 14px; margin: 4px 0 6px; }
  .cat__grid:not(.is-list) .gcard__fit { display: none; }
  .cat__grid:not(.is-list) .gcard__art { font-size: 12.5px; }
  .cat__grid:not(.is-list) .gcard__price { font-size: 12px; padding: 5px 8px; }
  .cat__grid:not(.is-list) .gcard { grid-row: span 6; }
}
@media (max-width: 420px) {
  .brand__txt b { font-size: 14.5px; max-width: 9ch; }
  .head .lang__btn { padding: 7px 8px; }
  .head__tel-i { width: 34px; height: 34px; }
}

/* тач-экран: наведение не залипает */
@media (hover: none), (pointer: coarse) {
  .btn:hover, .hcat:hover .hcat__go, .acert__i:hover, .amos__i:hover img, .foot__sign:hover { transform: none; }
  .hcat:hover .hcat__ph img, .mcard:hover .mcard__ph img, .ncard:hover .ncard__ph img,
  .rcard:hover .rcard__ph img { transform: none; }
  .gcard:hover, .ncard:hover, .rcard:hover, .ucard:hover, .vac:hover, .adir:hover,
  .band__i:hover { transform: none; box-shadow: none; }
}

@media print {
  .bgart, .vpick, .vhero__bg, .parts__bg, .parts__art, .phead__bg, .hcat__ph,
  .hero-v2, .hero-v3 { display: none !important; }
  .phead, .phead *, .vhero, .vhero *, .parts, .parts *, .hcat, .hcat *, .vstat, .vstat *,
  .amotto, .amotto *, .ucall, .ucall *, .hr, .hr *, .fl__help, .fl__help *, .band, .band *,
  .ask, .ask * { background: #fff !important; color: #000 !important; text-shadow: none !important; }
  .head { position: static !important; }
}

/* вид цифр в самом конце: сокращённая запись font выше сбрасывает это свойство */
.vstat__i b, .afact b, .tl__y, .head__tel-t b, .foot__ph b, .ask__ph b {
  font-variant-numeric: tabular-nums lining-nums;
}

/* =====================================================================
   Вторые правки заказчика 22.10.2026
   ===================================================================== */

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* шапка: на широком экране без кнопки заявки, зато с телефоном.
   Кнопка возвращается вместе с бургером */
@media (min-width: 1201px) {
  .head__cta { display: none !important; }
  .brand__txt i { display: none; }
  .head__tel .head__tel-t { display: block; }
}
@media (min-width: 1201px) and (max-width: 1500px) {
  .head__tel .head__tel-t { display: none; }
}
html[data-hv="2"] .head__tel-t i { display: none; }

/* логотип: колоски покачиваются сами, кольцо еле заметно ходит */
.brand__sign { transform-origin: 50% 85%;
  animation: logoIn 1s var(--ease) .1s both, logoSway 5.5s ease-in-out 1.4s infinite; }
@keyframes logoSway { 0%, 100% { rotate: 0deg; } 30% { rotate: -3.5deg; } 65% { rotate: 3deg; } }
.brand__ring { opacity: .22; transform: none; animation: ringSpin 24s linear infinite; }
.brand:hover .brand__sign { animation-play-state: paused; }

/* первый экран: вариант с подбором стал вторым */
.hero--find { background: rgba(245, 242, 234, .86); }
.hero__txt .hero__h { font-size: clamp(30px, 3.6vw, 48px); margin-bottom: 14px; position: relative;
  padding-bottom: 16px; animation: heroUp .8s var(--ease) both; }
.hero__txt .hero__h::after { content: ''; position: absolute; left: 0; bottom: 0; width: 190px;
  max-width: 70%; height: 6px; background: var(--yellow); }
html[data-hv="2"] .hero--find .hero__in { padding-top: calc(var(--head-h, 90px) + 36px); }
.vhero__card h2 { margin-bottom: 4px; }

/* техника: простая ровная сетка, отметка группы на снимке */
.mach--home, .mach--all { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mach--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.mach--home .mcard__ph, .mach--all .mcard__ph { height: 230px; min-height: 0; }
.mcard { position: relative; }
.mcard__badge { position: absolute; left: 12px; top: 12px; z-index: 1; padding: 5px 11px;
  border-radius: 999px; font-size: 12.5px; font-weight: 800; color: var(--ink);
  background: var(--yellow); box-shadow: 0 6px 14px -8px rgba(0, 0, 0, .5); }
.mcard { scroll-margin-top: calc(var(--head-h, 90px) + 20px); }

/* о предприятии на главной: снимки ровно по высоте текста */
.about__in { align-items: stretch; }
.about__gal { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 1.5fr 1fr 1fr;
  min-height: 420px; }
.about__ph, .about__ph:first-child { height: auto; min-height: 110px; }
.about__ph:first-child { grid-column: 1 / -1; }
.about__txt { display: flex; flex-direction: column; }
.about__txt .btn { align-self: flex-start; margin-top: auto; }
.about__txt p:last-of-type { margin-bottom: 22px; }

/* новости: «Подробнее» вместо одинокой стрелки, листание страниц */
.ncard__go { display: inline-flex; align-items: center; gap: 7px; width: auto; height: auto;
  margin: 4px 16px 18px; padding: 0; border-radius: 0; background: none; color: var(--blue3);
  font-weight: 800; font-size: 15px; transition: gap .25s var(--ease); }
.ncard:hover .ncard__go { background: none; color: var(--blue3); gap: 12px; transform: none; }
.pg { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 30px; }
.pg__i { display: grid; place-items: center; min-width: 44px; height: 44px; padding: 0 12px;
  border-radius: 12px; border: 2px solid var(--line2); background: #fff; font-weight: 800; color: var(--ink); }
.pg__i:hover { border-color: var(--blue); color: var(--blue3); }
.pg__i.is-on { background: var(--blue); border-color: var(--blue); color: #fff; }
.pg__i--prev svg { transform: rotate(180deg); }

/* снимки слайдером */
.gsl { min-width: 0; }
.gsl__stage { position: relative; }
.gsl__main { display: block; width: 100%; height: 420px; padding: 0; border: 1px solid var(--line);
  border-radius: 22px; overflow: hidden; background: linear-gradient(160deg, #fff, var(--tint)); }
.gsl__main img { width: 100%; height: 100%; object-fit: contain; }
.gsl__main.is-swap img { animation: gslIn .45s var(--ease); }
@keyframes gslIn { from { opacity: 0; transform: scale(.985); } }
.gsl__main:focus-visible { outline-offset: -4px; }
.gsl__go { position: absolute; top: 50%; right: 12px; display: grid; place-items: center; width: 46px;
  height: 46px; margin-top: -23px; border-radius: 50%; background: rgba(255, 255, 255, .92);
  color: var(--blue3); box-shadow: 0 8px 20px -10px rgba(0, 0, 0, .5); transition: background .2s, color .2s; }
.gsl__go--prev { right: auto; left: 12px; }
.gsl__go--prev svg { transform: rotate(180deg); }
.gsl__go:hover { background: var(--blue); color: #fff; }
.gsl__n { position: absolute; left: 14px; bottom: 12px; padding: 4px 10px; border-radius: 999px;
  font-size: 13px; font-weight: 800; color: #fff; background: rgba(7, 42, 75, .65); }
.gsl__strip { display: grid; grid-template-columns: 40px minmax(0, 1fr) 40px; gap: 8px; align-items: center;
  margin-top: 10px; }
.gsl__thumbs { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
.gsl__thumbs::-webkit-scrollbar { display: none; }
.gsl__t { flex: 0 0 92px; height: 66px; padding: 0; border-radius: 10px; overflow: hidden;
  border: 2px solid transparent; opacity: .65; scroll-snap-align: start; transition: opacity .2s, border-color .2s; }
.gsl__t img { width: 100%; height: 100%; object-fit: cover; }
.gsl__t:hover { opacity: 1; }
.gsl__t.is-on { border-color: var(--blue); opacity: 1; }
.gsl__t:focus-visible { outline-offset: -3px; }
.gsl__sc { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  border: 2px solid var(--line2); background: #fff; color: var(--blue3); }
.gsl__sc--prev svg { transform: rotate(180deg); }
.gsl__sc:hover { background: var(--blue); border-color: var(--blue); color: #fff; }

/* просмотр с листанием */
.lbx__go { position: absolute; top: 50%; right: 18px; display: grid; place-items: center; width: 52px;
  height: 52px; margin-top: -26px; border-radius: 50%; background: rgba(255, 255, 255, .16); color: #fff; }
.lbx__go--prev { right: auto; left: 18px; }
.lbx__go--prev svg { transform: rotate(180deg); }
.lbx__go:hover { background: rgba(255, 255, 255, .3); }
.lbx img { animation: gslIn .35s var(--ease); }

/* кнопки карточки рядом */
.pcard__act--two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pcard__act--two .btn { justify-content: center; padding: 12px 14px; font-size: 15px; white-space: nowrap; }

/* вкладки: панель появляется плавно */
.tabs__p:not([hidden]) { animation: paneIn .4s var(--ease); }

/* текст для поиска во всю ширину блока */
.seo { max-width: none; }
.sec--narrow .seo { max-width: 820px; }
.rg--wide { max-width: none; }

/* каталог: колонка фильтра без своей прокрутки */
@media (min-width: 1001px) {
  .fl { position: static; max-height: none; overflow: visible; padding-right: 0; }
}
.fl__more { display: grid; gap: 2px; }
.fl__toggle { min-height: 36px; margin: 2px 0 0 10px; font-weight: 800; font-size: 14px; color: var(--blue3);
  text-decoration: underline; text-underline-offset: 3px; }
a.fl__i { color: var(--ink); }
a.fl__i.is-on { color: #fff; }

/* лента карточек со стрелками */
.hs { position: relative; }
.hs__track { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 10px;
  scrollbar-width: none; }
.hs__track::-webkit-scrollbar { display: none; }
.hs__i { flex: 0 0 calc((100% - 48px) / 4); scroll-snap-align: start; display: grid; }
.hs__i .gcard { grid-row: auto; display: grid; grid-template-rows: auto; }
.hs__i .gcard__in { display: contents; }
.hs__nav { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.hs__nav button { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
  border: 2px solid var(--line2); background: #fff; color: var(--blue3); }
.hs__nav button:first-child svg { transform: rotate(180deg); }
.hs__nav button:hover { background: var(--blue); border-color: var(--blue); color: #fff; }

/* карточка ремонта: снимки слева и липнут, пока справа читается текст */
.rpage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.rpage__gal { position: sticky; top: calc(var(--head-h, 90px) + 16px); }
.rpage--nopic { grid-template-columns: minmax(0, 1fr); }

/* услуги: последний ряд по центру */
.ugrid--c { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px; }
.ugrid--c .ucard { flex: 0 1 calc((100% - 36px) / 3); }

/* о предприятии: больше снимков рядом с текстом, текст одной колонкой */
.aintro__in { align-items: stretch; }
.amos { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: minmax(120px, 1fr); }
.gal--about { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gal--about .gal__i { height: 200px; }
.acert { margin-bottom: 4px; }

/* вакансии: по три в ряд, подробности раскрываются */
.vacs { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.vac { grid-template-rows: none; gap: 12px; }
.vac__i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px;
  background: var(--sky); color: var(--blue3); }
.vac h3 { font-size: 19px; min-height: 2.5em; }
.vac__pay { justify-self: start; padding: 5px 12px; border-radius: 999px; background: var(--yellow);
  font-size: 13.5px; font-weight: 800; color: var(--ink); }
.vac__more { border-top: 1px dashed var(--line); padding-top: 10px; }
.vac__more summary { cursor: pointer; min-height: 36px; font-weight: 800; font-size: 14.5px; color: var(--blue3);
  list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.vac__more summary::-webkit-details-marker { display: none; }
.vac__more summary::after { content: '+'; display: grid; place-items: center; width: 26px; height: 26px;
  border-radius: 50%; background: var(--sky); font-size: 18px; transition: transform .3s var(--ease); }
.vac__more[open] summary::after { transform: rotate(45deg); }
.vac__more p { margin-top: 10px; font-size: 14.5px; color: var(--mute); animation: paneIn .35s var(--ease); }
.vac__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.vac__on { display: inline-flex; align-items: center; gap: 5px; font-size: 13.5px; font-weight: 700; color: #1c7c3d; }
.vac__btn { padding: 10px 14px; font-size: 14.5px; }
.vac__n { display: none; }
.two--vac { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.vac__form, .kform { background: #fff; border-radius: 22px; padding: 24px; border: 1px solid var(--line);
  box-shadow: var(--shadow); }
.vac__form h2, .kform h2 { font-size: 24px; }
.vac__form .form, .kform .form { box-shadow: none; padding: 0; margin-top: 6px; }

/* контакты как у Цветмета */
.cgrid { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cc { display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: 18px;
  background: #fff; border: 1px solid var(--line); }
.cc__i { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 50%;
  background: var(--sky); color: var(--blue3); }
.cc i { display: block; font-style: normal; font-size: 12px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--mute); margin-bottom: 4px; }
.cc a, .cc b { font-weight: 800; font-size: 16px; word-break: break-word; }
.tbl--deps thead th { background: var(--navy); }
.tbl--deps td b { font-weight: 700; color: var(--ink); }
.tbl--deps td a { font-weight: 800; white-space: nowrap; }
.tbl--req tbody th { width: 30%; }
.lead { font-size: 18px; font-weight: 700; color: var(--ink); }
.muted { margin-top: 6px; font-size: 14px; color: var(--mute); }
.kmap { margin-top: 14px; }
.kmap iframe { height: 380px; }

@media (max-width: 1100px) {
  .mach--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vacs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hs__i { flex-basis: calc((100% - 32px) / 3); }
  .gal--about { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1000px) {
  .rpage, .two--vac { grid-template-columns: minmax(0, 1fr); }
  .rpage__gal { position: static; }
  .mach--home, .mach--all { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about__gal { min-height: 360px; }
  .ugrid--c .ucard { flex-basis: calc((100% - 18px) / 2); }
}
@media (max-width: 760px) {
  .hs__i { flex-basis: 78%; }
  .gal--about { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .mach--home, .mach--all, .mach--four, .vacs, .cgrid { grid-template-columns: minmax(0, 1fr); }
  .gsl__main { height: 280px; }
  .gsl__t { flex-basis: 74px; height: 54px; }
  .pcard__act--two { grid-template-columns: minmax(0, 1fr); }
  /* услуги на телефоне лентой */
  .ugrid--c { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scroll-snap-type: x mandatory;
    padding-bottom: 10px; margin: 0 -20px; padding-left: 20px; padding-right: 20px; scrollbar-width: none; }
  .ugrid--c .ucard { flex: 0 0 80%; scroll-snap-align: center; }
  .about__gal { min-height: 300px; }
  .gal--about .gal__i { height: 150px; }
}
@media (hover: none), (pointer: coarse) {
  .gsl__t:hover { opacity: .65; }
}
@media print {
  .gsl__go, .gsl__strip, .hs__nav, .lbx { display: none !important; }
}

/* главная: пять машин, последний ряд по центру */
.mach--home { display: flex; flex-wrap: wrap; justify-content: center; }
.mach--home .mcard { flex: 0 1 calc((100% - 2 * var(--gap)) / 3); grid-row: auto; display: flex;
  flex-direction: column; }
.mach--home .mcard__in { display: flex; flex-direction: column; flex: 1; }
.mach--home .mcard__go { margin-top: auto; }
/* снимки «О предприятии» не задают высоту, их задаёт текст */
.about__ph { position: relative; }
.about__ph img { position: absolute; inset: 0; }
.about__gal { min-height: 0; }
@media (max-width: 1000px) {
  .mach--home .mcard { flex-basis: calc((100% - var(--gap)) / 2); }
  .about__gal { min-height: 340px; }
}
@media (max-width: 620px) {
  .mach--home .mcard { flex-basis: 100%; }
}

/* компактный подвал: одна строка из четырёх колонок */
.foot--slim { padding: 40px 0 20px; }
.foot__row { display: grid; gap: 28px; align-items: start;
  grid-template-columns: minmax(0, .9fr) minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1.1fr);
  padding-bottom: 26px; }
.foot--slim .foot__sign img { width: 58px; height: 54px; }
.foot--slim .foot__full { font-size: 16px; margin-top: 12px; }
.foot__unp { margin-top: 6px; font-size: 13px; color: #9fb7d6; }
.foot__nav { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 16px;
  font-size: 14.5px; }
.foot--slim .foot__tel { display: block; margin-bottom: 8px; }
.foot--slim .foot__tel b { display: block; font-size: 16px; font-weight: 800; color: var(--yellow); }
.foot--slim .foot__tel span { display: block; font-size: 12.5px; color: #b9cde6; }
.foot--slim .foot__map iframe { height: 190px; }
.foot--slim .foot__bot { border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 14px; }
@media (max-width: 1100px) {
  .foot__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .foot__row { grid-template-columns: minmax(0, 1fr); gap: 22px; }
}
@media (max-width: 620px) {
  .foot--slim .foot__map { display: none; }
  .foot--slim .foot__bot { gap: 8px 16px; }
}

/* новости по три в ряд: на странице девять, ряды ровные */
.news { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 860px) { .news { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .news { grid-template-columns: minmax(0, 1fr); } }
.hs__nav button:disabled { opacity: .35; cursor: default; background: #fff; color: var(--blue3);
  border-color: var(--line2); }

/* =================== третьи правки 22.10.2026 =================== */
/* значок телефона: старое правило .head__tel span ломало сетку круга */
.head__tel .head__tel-i { display: grid; place-items: center; }
/* логотип: покачивание заметное, кольцо видно постоянно */
@keyframes logoSway { 0%, 100% { rotate: 0deg; translate: 0 0; } 25% { rotate: -7deg; translate: 0 -1px; }
  60% { rotate: 6deg; translate: 0 1px; } }
.brand__sign { animation: logoIn 1s var(--ease) .1s both, logoSway 3.6s ease-in-out 1.2s infinite; }
.brand__ring { opacity: .45; }
/* согласие: ссылка в той же строке */
.form__ok-check label a { color: var(--blue3); font-weight: 700; text-decoration: underline; }
.vhero__card--dark .form__ok-check label a { color: var(--yellow); }
/* по девять карточек, остальное по кнопке */
[data-cut] > .is-cut { display: none !important; }
.cut { display: flex; justify-content: center; margin-top: 22px; }
/* «Не нашли деталь»: телефон одной строкой */
.fl__help a { white-space: nowrap; }
/* вакансии по две, раскрытие стрелкой */
.vacs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vac h3 { min-height: 0; }
.vac__more summary::after { content: ''; width: 28px; height: 28px; font-size: 0;
  background: var(--sky) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23295bb2' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center no-repeat; }
.vac__more[open] summary::after { transform: rotate(180deg); }
@media (max-width: 760px) { .vacs { grid-template-columns: minmax(0, 1fr); } }
/* контакты: почта помещается, кнопки копирования рядом */
.cgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr) minmax(0, 1fr); }
.cline { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.cc .cline a { word-break: normal; white-space: nowrap; font-size: 15.5px; }
.copy { display: inline-grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 8px;
  border: 1px solid var(--line2); color: var(--blue3); background: #fff; transition: background .2s, color .2s; }
.copy:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.copy.is-done { background: #1c7c3d; border-color: #1c7c3d; color: #fff; }
.sec__more--row { display: flex; flex-wrap: wrap; gap: 10px; }
.sec__more--row .btn:last-of-type svg { transform: rotate(180deg); }
@media (max-width: 1100px) { .cgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .cgrid { grid-template-columns: minmax(0, 1fr); } }
/* подвал: колонки на одной линии, низ как у Цветмета */
.foot__row { align-items: stretch; }
.foot__row > * { min-width: 0; }
.foot__row h2, .foot--slim .foot__sign { margin-top: 0; }
.foot--slim .foot__col h2, .foot--slim .foot__contacts h2 { min-height: 22px; line-height: 22px; margin-bottom: 14px; }
.foot--slim .foot__sign { padding: 6px 10px; }
.foot--slim .foot__map { display: flex; }
.foot--slim .foot__map iframe { height: 100%; min-height: 200px; }
.foot--slim .foot__bot { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px 24px; }
.foot__legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 20px; }
.foot--slim .fdev { justify-self: end; }
@media (max-width: 900px) {
  .foot--slim .foot__bot { grid-template-columns: minmax(0, 1fr); justify-items: start; }
  .foot__legal { justify-content: flex-start; }
  .foot--slim .fdev { justify-self: start; }
}
.foot--slim .foot__bot > span:first-child { white-space: nowrap; }
.foot__nav { grid-template-columns: repeat(2, max-content); column-gap: 26px; }
.foot__nav a { white-space: nowrap; }
@media (max-width: 420px) { .cc .cline a { white-space: normal; word-break: break-all; } }
/* логотип: без покачивания, по знаку пробегает блик, плашка еле дышит */
.brand__sign { animation: logoIn 1s var(--ease) .1s both; rotate: 0deg; }
.brand__mark { overflow: hidden; border-radius: 16px; animation: markBreath 4.5s ease-in-out 1.2s infinite; }
.brand__mark::after { content: ''; position: absolute; inset: -20%; z-index: 2; pointer-events: none;
  background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, .85) 50%, transparent 65%);
  transform: translateX(-120%); animation: markGlint 4.5s ease-in-out 1.6s infinite; }
@keyframes markGlint { 0%, 55% { transform: translateX(-120%); } 80%, 100% { transform: translateX(120%); } }
@keyframes markBreath { 0%, 100% { scale: 1; } 50% { scale: 1.04; } }
.brand__ring { display: none; }
/* название в тёмной шапке жёлтым, как знак */
html[data-hv="1"] .brand__txt b, html[data-hv="1"] .brand:hover .brand__txt b { color: var(--yellow); }
.foot__full { color: var(--yellow); }
/* название в две строки: Минский / Агросервис */
.brand__txt b { line-height: 1.05; letter-spacing: .01em; }
/* на тёмном фоне знак без белой плашки: он сам ярко-жёлтый */
html[data-hv="1"] .brand__mark { background: transparent; }
html[data-hv="1"] .brand__sign { width: 60px; height: 56px; }
html[data-hv="1"] .brand__mark::after {
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 160, .55) 50%, transparent 62%); }
.foot--slim .foot__sign { background: transparent; padding: 0; }
.foot--slim .foot__sign img { width: 72px; height: 67px; }
.cgrid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr); }
@media (max-width: 1100px) { .cgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .cgrid { grid-template-columns: minmax(0, 1fr); } }
/* контакты: карта до низа формы, плашка предприятия поверх карты */
.two--map { align-items: stretch; }
.kmapcol { display: flex; flex-direction: column; }
.kmap { position: relative; flex: 1; display: flex; min-height: 380px; }
.kmap iframe { flex: 1; height: auto; min-height: 380px; }
.mpin { position: absolute; left: 14px; top: 14px; z-index: 2; max-width: min(320px, calc(100% - 28px));
  padding: 14px 16px; border-radius: 16px; background: #fff; box-shadow: var(--shadow);
  border-left: 4px solid var(--yellow); display: grid; gap: 4px; }
.mpin b { font-size: 16px; color: var(--ink); }
.mpin > span { font-size: 13.5px; color: var(--mute); }
.mpin__act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 6px; }
.btn--sm { padding: 8px 13px; font-size: 14px; }
.mpin__link { font-size: 13.5px; font-weight: 700; color: var(--blue3); text-decoration: underline; }
@media (max-width: 1000px) { .kmap, .kmap iframe { min-height: 340px; } }
/* шапка закреплена целиком, вместе с полосой адреса */
@media (min-width: 621px) {
  html[data-hv="3"] .head, html[data-hv="1"] .head { top: 0; }
}
.head.is-stuck .head__bar { margin-top: 0; opacity: 1; }
/* отправка без согласия: кнопка приглушена, рядом подсказка */
.form button[type="submit"].is-off { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.form__hint { margin: 10px 0 0; text-align: center; font-size: 13px; color: var(--mute); }
.vhero__card--dark .form__hint { color: #cfe0f4; }
/* листание новостей: закруглённые кнопки */
.nnav { border-top: 1px solid var(--line); padding-top: 22px; margin-top: 30px; }
.nnav a { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border-radius: 999px;
  border: 2px solid var(--line2); background: #fff; color: var(--blue3); font-weight: 800; font-size: 15px;
  transition: background .2s, border-color .2s, color .2s, gap .25s var(--ease); }
.nnav a:hover { background: var(--blue); border-color: var(--blue); color: #fff; gap: 12px; }
.sec--narrow .rg + .gal { margin-top: 22px; }
/* подробности вакансии: требования и условия списками */
.vac__det { margin-top: 10px; display: grid; gap: 6px; animation: paneIn .35s var(--ease); }
.vac__det b { font-size: 14px; color: var(--ink); margin-top: 4px; }
.vac__det ul { list-style: none; display: grid; gap: 5px; margin: 0; }
.vac__det li { position: relative; padding-left: 18px; font-size: 14.5px; color: var(--mute); }
.vac__det li::before { content: ''; position: absolute; left: 0; top: .6em; width: 7px; height: 7px;
  border-radius: 2px; background: var(--yellow); outline: 1px solid var(--brown); }
.vac__ex { margin-top: 6px; font-size: 12.5px; color: var(--mute); font-style: italic; }
/* экран загрузки: тёмный фон, жёлтый знак в кольце-шестерне, борозда заполняется */
.pre { background: radial-gradient(circle at 50% 42%, #0d4a80 0%, var(--navy2) 70%); }
.pre__in { display: grid; justify-items: center; gap: 18px; }
.pre__logo { position: relative; display: grid; place-items: center; width: 132px; height: 132px; overflow: hidden;
  border-radius: 50%; }
.pre__logo img { width: 92px; height: auto; animation: preIn .7s var(--ease) both; }
.pre__ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: preSpin 3s linear infinite; }
.pre__logo::after { content: ''; position: absolute; inset: -10%;
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 180, .6) 50%, transparent 62%);
  transform: translateX(-130%); animation: preGlint 1.6s ease-in-out .4s infinite; }
.pre__bar { position: relative; width: 190px; height: 8px; border-radius: 99px; overflow: hidden;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .18) 0 6px, transparent 6px 11px); }
.pre__bar i { position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 99px;
  background: linear-gradient(90deg, var(--yellow), #ffe066); animation: preFill 1.4s var(--ease) forwards; }
.pre__t { font-family: 'Arsenal', Georgia, serif; font-weight: 700; font-size: 20px; line-height: 1.1;
  color: var(--yellow); text-align: center; letter-spacing: .02em; animation: preIn .7s var(--ease) .15s both; }
.pre__field, .pre__soil, .pre__done, .pre__tool { display: none; }
@keyframes preSpin { to { transform: rotate(360deg); } }
@keyframes preGlint { 0% { transform: translateX(-130%); } 70%, 100% { transform: translateX(130%); } }
@keyframes preFill { to { width: 100%; } }
@keyframes preIn { from { opacity: 0; transform: scale(.85); } }
/* снимки машин на всю ширину карточки, обрезка по центру */
.mcard__ph { background: var(--tint); }
.mcard__ph img { object-fit: cover; padding: 0; width: 100%; height: 100%; }
.mcard:hover .mcard__ph img { transform: scale(1.05); }

/* списки: круглая галочка в мягком кружке вместо квадратиков */
.rg ul li, .vac__det li, .ticks li { position: relative; padding-left: 30px; }
.rg ul li::before, .vac__det li::before, .ticks li::before {
  content: ''; position: absolute; left: 0; top: .22em; width: 20px; height: 20px; border-radius: 50%;
  outline: 0; transform: none; border: 0;
  background: var(--sky) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%230070c0' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }
.rg ul, .vac__det ul { gap: 9px; }
.vac__det li { font-size: 14.5px; line-height: 1.45; }
.vac__det li::before { top: .12em; width: 18px; height: 18px; background-size: 11px; }
/* галочки списков: фирменный жёлтый круг, тёмная галочка */
.rg ul li::before, .vac__det li::before, .ticks li::before {
  background: var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%232b2415' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat;
  box-shadow: 0 0 0 1px rgba(87, 61, 10, .25); }
.vac__det li::before { background-size: 11px; }
/* колонка разделов каталога прилипает, пока листаются карточки */
@media (min-width: 1001px) {
  .cat--side { align-items: start; }
  .fl { position: sticky; top: calc(var(--head-h, 110px) + 16px); max-height: calc(100vh - var(--head-h, 110px) - 32px);
    overflow-y: auto; scrollbar-width: thin; padding-right: 0; align-self: start; }
}
/* без счётчика «показано N из M»: строка нужна только для кнопки сброса */
.cat__state { min-height: 0; margin: 0 0 12px; }
.cat__state:not(:has(.btn:not([hidden]))) { display: none; }
.vstat__in { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
.afacts { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
/* стрелки слайдера только под снимком */
.gsl__go { display: none; }
.gsl__sc { width: 44px; height: 44px; }
.gsl__strip { grid-template-columns: 44px minmax(0, 1fr) 44px; }

/* подписи в одну строку, длинные обрезаются многоточием */
.btn, .chip, .nav a, .foot__nav a, .foot__tel, .foot__tel b, .foot__tel span, .head__tel-t b, .head__tel-t i,
.cc i, .cc a, .cc b, .vac__pay, .vac__more summary, .ncard__go, .mcard__go, .rcard__go, .gcard__price,
.fl__i span, .mcard__kind, .gcard__grp, .ncard__d, .foot__legal a, .foot__mail, .sec__link, .tabs__b,
.pcard__grp, .deps span { white-space: nowrap; }
.fl__i span, .mcard__kind, .gcard__grp, .cc i { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.fl__i { min-width: 0; }
.mcard__kind, .gcard__grp { display: block; }
@media (max-width: 620px) { .foot__legal a { white-space: normal; } .btn { white-space: normal; } }
/* подвал всегда у нижнего края окна, даже на коротких страницах */
body { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
body > main { flex: 1 0 auto; }
body > .foot { flex: none; margin-top: 0; }

/* ===================== правки 23.10.2026 ===================== */
/* шапка без верхней полосы: телефон и почта друг под другом */
.head__contact { display: grid; gap: 4px; }
.head__contact .head__tel, .head__contact .head__mail { display: flex; align-items: center; gap: 9px; }
.head__mail .head__tel-i { width: 28px; height: 28px; }
.head__mail .head__tel-t b { font-size: 14px; font-weight: 700; color: var(--ink); line-height: 1.2; }
html[data-hv="1"] .head__mail .head__tel-t b { color: #fff; }
html[data-hv="3"] .head__mail .head__tel-t b { color: var(--ink); }
.head__mail:hover .head__tel-t b { color: var(--blue); }
html[data-hv="1"] .head__mail:hover .head__tel-t b { color: var(--yellow); }
/* ниже 1501 px почта скрыта (она в меню и подвале), у телефона остаётся значок */
@media (max-width: 1500px) { .head__mail { display: none; } }
.foot__adr { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; font-size: 14px; color: #cfe0f4; }
.foot__adr svg { flex: none; margin-top: 3px; color: var(--yellow); }

/* пустой раздел каталога */
.cat__main--empty .cat__bar, .cat__main--empty .cat__state, .cat__main--empty .cat__grid { display: none; }
.cat__main--empty .cat__empty { display: block; margin-top: 0; padding: 28px; background: #fff;
  border: 1px solid var(--line); border-radius: 18px; text-align: left; font-size: 16px; }

/* карточка ремонта: перечень в карточке справа и одна панель с текстом */
.rcheck { list-style: none; display: grid; gap: 9px; margin: 14px 0 0; }
.rcheck li { position: relative; padding-left: 30px; font-weight: 700; }
.rcheck li::before { content: ''; position: absolute; left: 0; top: .1em; width: 20px; height: 20px; border-radius: 50%;
  background: var(--yellow) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%232b2415' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat;
  box-shadow: 0 0 0 1px rgba(87, 61, 10, .25); }
.tabs__p--solo { max-width: none; }

/* файлы для скачивания в новости */
.dlinks { display: grid; gap: 10px; margin-top: 22px; }
.dlink { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-radius: 16px; background: #fff;
  border: 1px solid var(--line); color: var(--ink); transition: border-color .2s, box-shadow .25s; }
.dlink:hover { border-color: var(--blue); box-shadow: var(--shadow); }
.dlink > svg { flex: none; width: 44px; height: 44px; padding: 10px; border-radius: 12px; background: var(--sky);
  color: var(--blue3); }
.dlink b { display: block; font-size: 16px; }
.dlink i { display: block; font-style: normal; font-size: 13px; color: var(--mute); }
.ncard__d { min-height: 1.4em; }

/* контакты: карта и три маршрута */
.mapgrid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 24px; align-items: stretch;
  margin-top: 16px; }
.mapgrid .kmap { min-height: 420px; margin-top: 0; }
.rtes { display: grid; gap: 14px; align-content: start; }
.rte { padding: 18px 20px; border-radius: 18px; background: #fff; border: 1px solid var(--line); }
.rte b { display: block; font-size: 17px; margin-bottom: 4px; }
.rte p { font-size: 14.5px; color: var(--mute); }
.rte a { display: inline-flex; align-items: center; gap: 7px; margin-top: 10px; font-weight: 800; color: var(--blue3);
  white-space: nowrap; transition: gap .25s var(--ease); }
.rte a:hover { gap: 12px; }
@media (max-width: 1000px) { .mapgrid { grid-template-columns: minmax(0, 1fr); } .mapgrid .kmap { min-height: 340px; } }
@media (max-width: 1500px) { .head__contact .head__mail { display: none; } }
.cat--side { grid-template-columns: 300px minmax(0, 1fr); }
@media (max-width: 1000px) { .cat--side { grid-template-columns: minmax(0, 1fr); } }
/* телефон и почта в шапке: без подписи «Приёмная», компактно */
.head__contact { gap: 2px; }
.head__contact .head__tel-i, .head__mail .head__tel-i { width: 24px; height: 24px; }
.head__contact .head__tel-i svg { width: 14px; height: 14px; }
.head__tel-t i { display: none !important; }
.head__tel-t b { font-size: 14.5px; line-height: 1.2; }
.head__mail .head__tel-t b { font-size: 13.5px; }
/* телефон и почта в шапке одного размера */
.head__tel-t b, .head__mail .head__tel-t b { font-size: 13.5px; font-weight: 700; }

/* ===== правки: деталь как машина ===== */
/* фото детали в плитке: вписано по центру, на белом */
.gcard__ph img { width: 100%; height: 100%; object-fit: contain; padding: 6px; background: #fff;
  border-radius: 10px; }
.gcard__ph:has(img) { background: #fff; border: 1px solid var(--line); }
/* подпись над названием не вылезает из блока: одна строка, лишнее многоточием */
.pcard__grp { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 12px; letter-spacing: .04em; }
.pcard__title { font-size: clamp(22px, 2vw, 28px); line-height: 1.15; margin: 4px 0 6px; overflow-wrap: anywhere; }
.pcard__info, .mhero__txt { min-width: 0; }
/* заголовок страницы детали в одну строку */
.phead--one h1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
  font-size: clamp(22px, 2.4vw, 32px); }
/* миниатюры: ровно по шесть в ряд, без обрезанной последней, листание страницами */
.gsl__thumbs { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 5 * 8px) / 6); gap: 8px;
  overflow-x: auto; scroll-snap-type: x mandatory; }
.gsl__t { flex: none; width: auto; height: 66px; scroll-snap-align: start; }
@media (max-width: 620px) { .gsl__thumbs { grid-auto-columns: calc((100% - 3 * 8px) / 4); } }
/* фото детали в слайдере на фоне белое, по центру */
.gsl__main { display: grid; place-items: center; }
.gsl__main img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
/* картинка детали: вписана в рамку целиком, по центру (рамка с абсолютной картинкой, без сетки) */
.gcard__ph:has(img) { display: block; position: relative; overflow: hidden; }
.gcard__ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 6px; }
.gsl__main { display: block; }
.gsl__main img { width: 100%; height: 100%; object-fit: contain; }
/* карточка детали: фото чуть меньше, рамка по центру */
.pcard .gsl__main { height: 320px; }
.pcard .gsl__main img { padding: 10px; }
@media (max-width: 620px) { .pcard .gsl__main { height: 260px; } }

/* ===== список «Выберите машину»: крупно и понятно, для всех возрастов ===== */
.fl__h { font-size: 15px; letter-spacing: .04em; margin-bottom: 6px; }
.fl__type { margin: 16px 6px 4px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 13px;
  font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); }
.fl__box .fl__type:first-of-type { border-top: 0; padding-top: 0; margin-top: 8px; }
.fl__list .fl__i, nav.fl__box .fl__i { font-size: 16.5px; min-height: 46px; padding: 10px 12px; line-height: 1.25; }
.fl__i--all { font-weight: 800; }
.fl__i i { font-size: 13.5px; padding: 2px 9px; }
.fl__i span { white-space: normal; overflow: visible; text-overflow: clip; }
.fl__i.is-on { box-shadow: 0 6px 16px -10px rgba(0, 112, 192, .8); }

/* живая карта: метка нажимается, карточка предприятия */
.lmap{position:relative;z-index:0;isolation:isolate;width:100%;height:100%;min-height:380px;background:#e8eef4;border-radius:inherit}
.kmap{min-height:420px}
.kmap .lmap{min-height:420px}
.foot__map .lmap{min-height:200px}
.lpin{background:none;border:0;cursor:pointer}
.lpin svg{display:block;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35));transition:transform .15s}
.lpin:hover svg{transform:scale(1.08)}
.lpin i{position:absolute;left:50%;bottom:0;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:rgba(255,255,0,.55);animation:lpulse 2s ease-out infinite;pointer-events:none}
@keyframes lpulse{0%{transform:scale(.4);opacity:.9}100%{transform:scale(3);opacity:0}}
@media (prefers-reduced-motion:reduce){.lpin i{animation:none}}
.lhint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:500;background:#0b3a66;color:#fff;font-size:15px;line-height:1.2;padding:9px 16px;border-radius:999px;box-shadow:0 4px 12px rgba(0,0,0,.3);pointer-events:none;white-space:nowrap}
.lhint[hidden]{display:none}
.lmap .leaflet-popup-content-wrapper{border-radius:14px;padding:4px}
.lmap .leaflet-popup-content{margin:12px 14px;font-size:15px;line-height:1.35}
.lpop__t{display:block;font-size:17px;color:#0b3a66;margin-bottom:4px}
.lpop__a{display:block;color:#333;margin-bottom:10px}
.lpop__b{display:block;text-align:center;background:#0b3a66;color:#fff!important;padding:10px 12px;border-radius:999px;text-decoration:none;font-weight:600}
.lpop__l{display:block;text-align:center;margin-top:8px;color:#0b3a66!important;text-decoration:underline}
.lpop--s .leaflet-popup-content{margin:10px 12px;font-size:14px}
.lpop--s .lpop__t{font-size:15px;margin-bottom:8px}
.lpop--s .lpop__b{padding:8px 10px;font-size:14px}
.foot__map .leaflet-control-attribution{font-size:10px}

/* правки 23.10 (вечер): шапка тоньше, телефон крупнее с «Приёмная», карточки контактов без вылезаний */
.head__in { padding-top: 5px; padding-bottom: 5px; }
.head__tel-t i { display: block !important; font-size: 11.5px; line-height: 1.1; }
.head__tel-t b, .head__mail .head__tel-t b { font-size: 16.5px; }
.head__contact .head__tel-i { width: 28px; height: 28px; }
.head__contact .head__tel-i svg { width: 15px; height: 15px; }
.cc > div { min-width: 0; flex: 1 1 auto; }
.cc a, .cc b { font-size: 15.5px; overflow-wrap: anywhere; }
.cc .copy { margin-left: 6px; vertical-align: middle; }
@media (min-width: 1101px) { .cgrid { grid-template-columns: 1fr 1fr 1fr 1.5fr; } }
@media (min-width: 1380px) { .head__tel .head__tel-t { display: block !important; } .head__in { gap: 16px; } .nav a { padding: 9px 8px; } }
.sec--tight { padding-bottom: 0; }
.sec--tight + .sec { padding-top: 32px; }
.head__tel-t b, .head__mail .head__tel-t b { font-size: 13.5px; }
.head__tel-t i { font-size: 11px; }
.ncard { position: relative; }
@media (min-width: 1380px) {
  .head__in, html[data-hv="2"] .head__in { max-width: 1240px; gap: 14px; }
  .nav { margin-left: 0; margin-right: 0; }
}

/* плашка cookie */
.ccbar { position: fixed; left: 16px; right: 16px; z-index: 80; bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  opacity: 0; transform: translateY(20px); transition: opacity .4s ease, transform .4s ease; }
.ccbar[hidden] { display: none; }
.ccbar.is-on { opacity: 1; transform: none; }
.is-locked .ccbar { display: none; }
.ccbar__in { display: flex; align-items: center; gap: 20px; max-width: 800px; margin: 0 auto; padding: 16px 22px;
  border-radius: 18px; background: #0b2e52; color: rgba(255, 255, 255, .85); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6); }
.ccbar__in p { font-size: 14.5px; margin: 0; flex: 1 1 auto; }
.ccbar__in b { color: #fff; }
.ccbar__in a { color: var(--yellow); border-bottom: 1px solid currentColor; }
.ccbar__act { display: flex; gap: 10px; flex: none; }
.ccbar__act .btn { padding: 10px 18px; font-size: 14.5px; }
@media (max-width: 760px) {
  .ccbar { left: 10px; right: 10px; bottom: 10px; }
  .ccbar__in { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
  .ccbar__act .btn { flex: 1; justify-content: center; }
}

/* полоса прокрутки под цвет сайта */
html { scrollbar-color: #1d6fb8 #0b2e52; scrollbar-width: auto; }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: #0b2e52; }
::-webkit-scrollbar-thumb { background: #1d6fb8; border-radius: 8px; border: 2px solid #0b2e52; }
::-webkit-scrollbar-thumb:hover { background: #2b86d6; }
.foot__unp { overflow-wrap: anywhere; }