:root{
  /* тёмная «ночная» палитра — дизайн-система FORA, см. fora-vehicle/CLAUDE.md */
  --bg:#241C3B;          /* базовый тёмный индиго */
  --bg-deep:#171226;     /* футер */
  --sect-green:#1E3A2E;  /* тёмно-зелёная секция */
  --sect-indigo:#2B2153; /* секция каталога/направлений */
  --sect-plum:#3B1F3E;   /* секция «под заказ» / статичные страницы */
  --sky:#9BDCF2; --grass:#8ED75B; --sun:#FFD94A; --candy:#FF8FB5; --berry:#B06BD4;
  --ink:#2E2440;         /* тёмный текст на светлых карточках */
  --cream:#FFF3D6;       /* светлый текст на тёмном фоне */
  --white:#FFFFFF;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Nunito',Arial,sans-serif;color:var(--cream);background:var(--bg);line-height:1.6;font-weight:600}
h1,h2,h3,h4,.logo,.btn{font-family:'Nunito',Arial,sans-serif;font-weight:900}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
a{color:inherit;text-decoration:none}

/* header */
.site-header{background:var(--bg);padding:18px 0;position:sticky;top:0;z-index:10}
/* шапке нужно больше ширины, чем контенту: логотип + меню + поиск + телефон
   с кнопкой в 1120px не помещаются и разъезжаются на две строки */
.site-header .wrap{max-width:1240px}
.site-header__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.logo{
  display:inline-flex;flex-direction:row;align-items:center;gap:9px;
  font-size:24px;line-height:1;color:var(--ink);background:var(--sun);border:3px solid var(--ink);
  border-radius:999px;padding:12px 26px;box-shadow:4px 4px 0 rgba(0,0,0,.45);white-space:nowrap;
}
.logo:hover{color:var(--ink)}
.logo-main{display:block;line-height:1;font-size:.8em;position:relative;top:2px}
.logo-sub{
  display:block;padding-left:9px;border-left:2px solid rgba(46,36,64,.35);
  font-family:'Nunito',Arial,sans-serif;font-weight:700;font-size:10px;line-height:1.25;
  letter-spacing:.01em;text-transform:uppercase;opacity:.7;white-space:nowrap;text-align:left;
}
.nav{display:flex;gap:2px;flex-wrap:wrap}
.nav a{padding:8px 11px;border-radius:999px;border:3px solid transparent;font-weight:700;color:var(--cream)}
.nav a:hover{background:var(--white);color:var(--ink);border-color:var(--ink);box-shadow:3px 3px 0 rgba(0,0,0,.45);text-decoration:none}

/* видно только скринридеру: подписи к полям поиска, где визуально хватает
   плейсхолдера, но поле без label — это поле без имени для озвучки */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* поиск по каталогу в шапке */
.site-search{display:flex;align-items:center;gap:0;flex:1 1 180px;max-width:235px;min-width:160px}
.site-search input{
  flex:1;min-width:0;height:44px;padding:0 14px;font-family:'Nunito',Arial,sans-serif;font-weight:700;font-size:15px;
  color:var(--ink);background:var(--white);border:3px solid var(--ink);border-right:none;
  border-radius:999px 0 0 999px;box-shadow:3px 3px 0 rgba(0,0,0,.45);
}
.site-search input::placeholder{color:rgba(46,36,64,.55);font-weight:600}
.site-search input:focus{outline:3px solid var(--sky);outline-offset:2px}
.site-search button{
  height:44px;width:50px;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--sun);color:var(--ink);border:3px solid var(--ink);border-radius:0 999px 999px 0;
  box-shadow:3px 3px 0 rgba(0,0,0,.45);cursor:pointer;
}
.site-search button svg{width:20px;height:20px}
.site-search button:hover{background:var(--sky)}

/* margin-left:auto — чтобы на средних экранах, где блок переносится на вторую
   строку шапки, он всё равно стоял справа, а не болтался у логотипа */
.header-actions{display:flex;align-items:center;gap:12px;margin-left:auto}
.header-phone{font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:15px;color:var(--sun);white-space:nowrap}
.header-phone:hover{color:var(--sun);text-decoration:underline}

.btn{display:inline-block;background:var(--sun);color:var(--ink);border:3px solid var(--ink);border-radius:999px;padding:12px 28px;font-size:17px;box-shadow:4px 4px 0 rgba(0,0,0,.45);transition:transform .1s, box-shadow .1s;cursor:pointer}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 rgba(0,0,0,.45);color:var(--ink);text-decoration:none}
.btn.pink{background:var(--candy)}
.btn.green{background:var(--grass)}
.btn.secondary{background:var(--white)}
.btn.small{padding:8px 18px;font-size:15px}

/* hero */
.hero{padding:66px 0 0;position:relative;overflow:hidden;background:var(--bg)}
.hero::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(255,255,255,.10) 1.6px, transparent 1.6px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 75% 30%, #000 0%, transparent 72%);
  mask-image:radial-gradient(ellipse 70% 60% at 75% 30%, #000 0%, transparent 72%);
  pointer-events:none;
}
.hero .wrap{position:relative;z-index:1}
.hero h1{font-size:clamp(36px,5.5vw,64px);line-height:1.06;max-width:860px;color:var(--white)}
.hero h1 .hl{background:var(--sun);color:var(--ink);border-radius:14px;padding:0 12px;border:3px solid var(--ink);display:inline-block;transform:rotate(-1.5deg)}
.hero p{font-size:19px;max-width:660px;margin:22px 0 30px}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}
.chip{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:999px;padding:6px 16px;font-size:14px;font-weight:700;box-shadow:3px 3px 0 rgba(0,0,0,.45)}
.cta{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
/* телефон на первом экране: до подвала за ним доходят не все, а половина
   B2B-обращений начинается со звонка */
.hero-call{font-size:16px;margin-bottom:58px}
.hero-call a{color:var(--sun);font-family:'Nunito',Arial,sans-serif;font-weight:900}
.hero-call a:hover{text-decoration:underline}
.hero-call .hero-call__anchor{color:var(--cream);font-weight:700;text-decoration:underline}
.hero-call__sep{opacity:.45;margin:0 8px}
.sun-badge{position:absolute;right:4%;top:26px;width:110px;height:110px;border-radius:50%;background:var(--sun);border:3px solid var(--ink);box-shadow:0 0 0 10px rgba(255,217,74,.12), 0 0 0 22px rgba(255,217,74,.06);display:flex;align-items:center;justify-content:center;animation:float 4s ease-in-out infinite}
.sun-badge svg{width:46px;height:46px}
.hills{display:block;width:100%;margin-bottom:-2px;position:relative;z-index:1}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@media (prefers-reduced-motion: reduce){.sun-badge{animation:none}}

/* sections */
.section{padding:76px 0}
.grass-bg{background:var(--sect-green)}
.cream-bg{background:var(--sect-indigo)}
.candy-bg{background:var(--sect-plum)}
.section h2{font-size:clamp(30px,4.2vw,50px);margin-bottom:8px;color:var(--white)}
.sub{font-size:17px;max-width:660px;margin-bottom:40px}

/* stack «от платы до автопарка» */
.stack{display:grid;gap:16px;max-width:760px}
.layer{display:flex;align-items:center;gap:18px;background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:20px;padding:18px 22px;box-shadow:5px 5px 0 rgba(0,0,0,.45)}
.layer .lvl{min-width:54px;height:54px;border-radius:16px;border:3px solid var(--ink);display:flex;align-items:center;justify-content:center;font-family:'Nunito',Arial,sans-serif;font-size:22px;font-weight:900}
.layer:nth-child(1) .lvl{background:var(--sun)}
.layer:nth-child(2) .lvl{background:var(--sky)}
.layer:nth-child(3) .lvl{background:var(--candy)}
.layer:nth-child(4) .lvl{background:var(--berry);color:#fff}
.layer h4{font-size:20px}
.layer p{font-size:14px}
.layer.shift-1{margin-left:0}
.layer.shift-2{margin-left:6%}
.layer.shift-3{margin-left:12%}
.layer.shift-4{margin-left:18%}

.layer-arrow{width:26px;height:26px;color:var(--cream);opacity:.55;transform:rotate(45deg)}
.layer-arrow svg{width:100%;height:100%}
.layer-arrow.shift-arrow-1{margin-left:3%}
.layer-arrow.shift-arrow-2{margin-left:9%}
.layer-arrow.shift-arrow-3{margin-left:15%}
@media(max-width:900px){.layer-arrow{display:none}}

/* направления (карточки на главной) */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:26px}
.cat-block{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:26px;padding:28px 26px;box-shadow:6px 6px 0 rgba(0,0,0,.45);display:flex;flex-direction:column}
.cat-block .cat-head{display:inline-flex;align-items:center;gap:12px;border:3px solid var(--ink);border-radius:18px;padding:8px 20px 8px 16px;box-shadow:4px 4px 0 rgba(0,0,0,.45);margin-bottom:16px}
.cat-head.sky{background:var(--sky)} .cat-head.sun{background:var(--sun)}
.cat-head.candy{background:var(--candy)} .cat-head.berry{background:var(--berry)}
.cat-head.berry h3,.cat-head.berry .cat-icon{color:#fff}
.cat-block .cat-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.cat-head.berry .cat-icon{color:#fff}
.cat-block .cat-icon svg{width:100%;height:100%}
.cat-block h3{font-size:22px;color:var(--ink);margin:0}
.cat-block p{font-size:15px;flex:1}
.cat-block .more{margin-top:14px;font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:15px;color:var(--berry)}
.cat-block .more::after{content:" →"}
@media(max-width:760px){.cat-grid{grid-template-columns:1fr}}

/* мини-характеристики в карточке направления */
.mini-specs{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.mini-specs .spec{background:var(--cream);border:2px solid var(--ink);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}

/* custom section / инфо-карточки на статичных страницах */
.bubble{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:28px;padding:32px;box-shadow:7px 7px 0 rgba(0,0,0,.45);max-width:860px;position:relative}
.bubble h1,.bubble h2{color:var(--ink)}
/* Без этого h2 внутри карточки наследует размер заголовка секции (до 50px) и
   получается крупнее, чем h1 страницы над ним. */
.bubble h2{font-size:26px;margin-bottom:14px}
.bubble p{font-size:17px;margin-bottom:12px}
.bubble-custom{padding-top:44px}
.bubble-icon{
  position:absolute;top:-26px;left:32px;width:56px;height:56px;border-radius:16px;
  background:var(--berry);color:#fff;border:3px solid var(--ink);
  display:flex;align-items:center;justify-content:center;box-shadow:4px 4px 0 rgba(0,0,0,.45);
  transform:rotate(-6deg);
}
.bubble-icon svg{width:28px;height:28px}
.bubble-custom .btn{margin-top:8px}
.list{list-style:none;margin-top:8px}
.list li{padding:7px 0;font-size:16px}
.list li::before{content:"★";color:var(--berry);margin-right:10px}

/* каталог: сетка товаров */
.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:34px}
.filters a{padding:8px 18px;border-radius:999px;border:3px solid var(--ink);color:var(--cream);font-weight:700;font-size:14px;background:transparent}
.filters a:hover{background:var(--white);color:var(--ink)}
.filters a.active{background:var(--sun);color:var(--ink);box-shadow:3px 3px 0 rgba(0,0,0,.45)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}
.card{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:24px;padding:24px 22px;box-shadow:6px 6px 0 rgba(0,0,0,.45);transition:transform .12s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-6px) rotate(-.5deg)}
.card img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fafafa;border:2px solid var(--ink);border-radius:14px;margin-bottom:14px}
.card .icon{width:50px;height:50px;border-radius:15px;border:3px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:23px;margin-bottom:14px}
.icon.sky{background:var(--sky)} .icon.sun{background:var(--sun)}
.icon.candy{background:var(--candy)} .icon.berry{background:var(--berry);color:#fff}
.card h4,.card h3{font-size:20px;margin-bottom:6px}
.card p{font-size:14px;flex:1}
.card .more{margin-top:14px;font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:15px;color:var(--berry)}
.card .more::after{content:" →"}
.empty-state{color:var(--cream);opacity:.75;padding:40px 0;text-align:center;font-size:16px}

/* блок «Что ещё ставим на машину»: по дорожке на товарную группу
   (см. templates/views/home.php) */
.track{padding-top:34px;margin-top:34px;border-top:2px dashed rgba(255,243,214,.22)}
/* первая дорожка идёт сразу за подзаголовком секции — линия и отступ там лишние */
.track:first-of-type{padding-top:0;margin-top:0;border-top:none}
.track-head{display:flex;gap:30px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap}
.track-head__text{flex:1 1 460px}
.track-head h3{font-size:28px;color:var(--white);margin-bottom:8px}
.track-head p{font-size:16px;max-width:660px}
.track-fact{
  flex:0 0 auto;display:flex;align-items:center;gap:14px;background:var(--sun);color:var(--ink);
  border:3px solid var(--ink);border-radius:22px;padding:16px 24px;box-shadow:5px 5px 0 rgba(0,0,0,.45);
  transform:rotate(-1.2deg);
}
.track-fact__num{font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:42px;line-height:1}
.track-fact__cap{font-size:14px;font-weight:800;line-height:1.3}
/* свойства вместо бренда — там, где имя производителя покупателю ничего не говорит */
.track-chips{margin:16px 0 0}
/* не grid, а flex с потолком по ширине: в дорожке может оказаться и один
   раздел (пока остальные не наполнили), а растянутая на всю ширину карточка
   выглядит как ошибка вёрстки */
.track-grid{display:flex;flex-wrap:wrap;gap:24px;margin-top:24px}
.track-grid .card{flex:1 1 240px;max-width:360px}
.track-foot{display:flex;gap:16px 22px;align-items:center;flex-wrap:wrap;margin-top:22px}
.track-chips-links{margin-bottom:0}
.track-chips-links .chip-count{opacity:.6;font-size:13px;margin-left:2px}
@media(max-width:700px){
  /* в одну колонку плашка со счётчиком встаёт под текстом — убираем двойной
     отступ, который на широком экране разделял колонки */
  .track-head{gap:14px}
  .track-fact{transform:none;padding:12px 18px}
  .track-fact__num{font-size:34px}
}

/* страница поиска */
.search-page-form{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 26px;max-width:640px}
.search-page-form input{
  flex:1 1 260px;min-width:0;height:52px;padding:0 18px;border:3px solid var(--ink);border-radius:999px;
  font-family:'Nunito',Arial,sans-serif;font-size:16px;font-weight:700;color:var(--ink);background:var(--white);
  box-shadow:4px 4px 0 rgba(0,0,0,.45);
}
.search-page-form input:focus{outline:3px solid var(--sky);outline-offset:2px}
.search-page-form .btn{height:52px;line-height:26px}
.card-cat{flex:none;font-weight:700;opacity:.6;font-size:13px;margin-top:6px}

/* плитка разделов каталога */
.cat-card .cat-count{flex:1;font-weight:700;opacity:.65;font-size:14px}
.cat-ph{width:100%;aspect-ratio:4/3;background:var(--sky);border:2px solid var(--ink);border-radius:14px;margin-bottom:14px;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.cat-ph svg{width:56px;height:56px;opacity:.5}

/* хлебные крошки */
.crumbs{font-size:14px;margin:26px 0 6px;color:var(--cream);opacity:.8}
.crumbs a{text-decoration:underline}

/* карточка товара */
.product{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;padding:30px 0 70px}
.p-head .icon-big{width:86px;height:86px;border-radius:24px;border:3px solid var(--ink);display:flex;align-items:center;justify-content:center;font-size:42px;background:var(--sun);color:var(--ink);box-shadow:5px 5px 0 rgba(0,0,0,.45);margin-bottom:20px}
.p-head h1{font-size:clamp(32px,4.5vw,52px);line-height:1.05;margin-bottom:14px;color:var(--white)}
.p-head .desc{font-size:17px;margin-bottom:26px}
.specs{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:24px;box-shadow:6px 6px 0 rgba(0,0,0,.45);overflow:hidden;margin-bottom:26px}
.specs .head{background:var(--sun);border-bottom:3px solid var(--ink);padding:14px 22px;font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:18px}
.specs table{width:100%;border-collapse:collapse}
.specs td{padding:12px 22px;font-size:15px;border-bottom:2px dashed #e4dcc3;vertical-align:top}
.specs tr:last-child td{border-bottom:none}
.specs td:first-child{font-weight:800;width:42%}

/* галерея фото товара */
.gallery-main{background:var(--white);border:3px solid var(--ink);border-radius:24px;box-shadow:6px 6px 0 rgba(0,0,0,.45);padding:16px;margin-bottom:12px}
.gallery-main img{width:100%;aspect-ratio:4/3;object-fit:contain}
.gallery-thumbs{display:flex;gap:8px;flex-wrap:wrap}
.gallery-thumbs img{width:70px;height:70px;object-fit:contain;background:var(--white);border:2px solid var(--ink);border-radius:10px;cursor:pointer}

/* rich-текст из админки (описания товаров, статичные страницы) */
.prose{font-size:16px}
.prose h1,.prose h2,.prose h3,.prose h4{margin-top:1.2em;margin-bottom:.5em}
.prose p{margin:1em 0}
.prose ul,.prose ol{padding-left:1.4em;margin:1em 0}
.prose blockquote{border-left:4px solid var(--berry);padding-left:16px;margin:1em 0;opacity:.9}
.prose a{text-decoration:underline}
/* внутри белых карточек (.bubble, .specs) текст тёмный — переопределяем ink-цвет */
.bubble .prose,.card .prose{color:var(--ink)}
.bubble .prose a,.card .prose a{color:var(--berry)}

/* описание раздела каталога — белая карточка над перечнем позиций;
   секция тёмная, поэтому цвета переопределяем целиком, включая .section h2 */
.cat-intro{background:var(--white);color:var(--ink);border:3px solid var(--ink);border-radius:28px;
    padding:32px 34px;box-shadow:7px 7px 0 rgba(0,0,0,.45);margin:26px 0 44px}
.cat-intro h2{font-size:26px;color:var(--ink);margin-bottom:.5em}
.cat-intro h3{font-size:20px}
.cat-intro a{color:var(--berry)}
.cat-intro>:first-child{margin-top:0}
.cat-intro>:last-child{margin-bottom:0}
@media(max-width:600px){.cat-intro{padding:24px 20px;border-radius:22px;margin:20px 0 32px}}

/* footer */
footer{background:var(--bg-deep);color:var(--cream);padding:50px 0 38px}
.foot{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:22px}
.foot .contact{line-height:1.9;font-size:15px}
.foot .contact a{color:var(--sun);font-weight:800}
.foot-links{
  display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:30px;
  padding-top:24px;border-top:2px solid rgba(255,243,214,.15);font-size:14px;
}
.foot-links a{opacity:.75}
.foot-links a:hover{opacity:1;text-decoration:underline}
.copy{margin-top:22px;font-size:13px;opacity:.7}

@media(max-width:900px){
  .nav{display:none}
  .sun-badge{display:none}
  .product{grid-template-columns:1fr}
  .layer.shift-2,.layer.shift-3,.layer.shift-4{margin-left:0}
  /* меню спрятано, поиск остаётся единственным способом добраться до позиции
     напрямую — отдаём ему всю ширину второй строкой шапки */
  .site-search{order:3;flex-basis:100%;max-width:none}
}

/* на узких телефонах полный лого-лок-ап ("ФОРА" + подпись) не помещается
   в одну строку рядом с кнопкой в шапке — на этой ширине оставляем только
   компактный бейдж "ФОРА" */
@media(max-width:480px){
  .logo-sub{display:none}
}

/* На телефоне логотип, телефон и кнопка в одну строку не помещаются, а шапка
   sticky — три ряда съели бы четверть экрана. Кнопку убираем: звонок с
   телефона — действие прямее, а «Обсудить» есть в hero и в меню подвала.
   Ссылка на запрос — исключение: она появляется, только когда в запросе уже
   есть позиции, и другого пути к ним из шапки нет. */
@media(max-width:560px){
  .header-actions .btn:not(.cart-link){display:none}
}

/* страница направления (/fleet.php): хлебные крошки в hero'е идут первыми,
   отступ сверху уже даёт сам .hero */
.page-hero .crumbs{margin-top:0}

/* схема архитектуры на /fleet.php: SVG не сжимается ниже читаемой ширины —
   на узких экранах вместо этого прокручивается внутри своего контейнера,
   чтобы не растягивать по горизонтали всю страницу */
.scheme{overflow-x:auto;margin-bottom:44px;padding-bottom:6px}
.scheme svg{display:block;width:100%;min-width:660px;height:auto}
.scheme-steps{max-width:820px}
.cat-note{margin-bottom:34px}
.cat-note p{margin-bottom:16px}

/* пары «Раньше / Стало» в карточках выгод на /fleet.php */
.was,.now{font-size:15px;margin-top:12px}
.was{opacity:.72}
.was span,.now span{
  display:inline-block;font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:12px;
  text-transform:uppercase;letter-spacing:.04em;border:2px solid var(--ink);border-radius:999px;
  padding:0 10px;margin-right:8px;background:#EDE7F5;
}
.now span{background:var(--grass)}

/* подзаголовок над лентой чипов («Сухой остаток») */
.strip-title{color:var(--cream);font-size:20px;margin:42px 0 14px}

/* форма обратной связи */
.contact-form{max-width:520px}
.hp-field{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.form-row{margin-bottom:16px}
.form-row label{display:block;font-weight:700;margin-bottom:6px;font-size:14px}
.form-row input,.form-row textarea{
  width:100%;padding:10px 14px;border:3px solid var(--ink);border-radius:14px;
  font-family:'Nunito',Arial,sans-serif;font-size:15px;font-weight:600;color:var(--ink);background:var(--white);
}
.form-row textarea{resize:vertical}
.form-errors{background:#fdecea;border:3px solid var(--ink);border-radius:16px;padding:14px 20px;margin-bottom:18px}
.form-errors ul{margin:0;padding-left:18px}
.form-errors li{font-size:14px;color:#7a1f14}
.form-success{background:var(--grass);border:3px solid var(--ink);border-radius:16px;padding:14px 20px;font-weight:700}
.form-consent{display:flex;gap:10px;align-items:flex-start;margin:4px 0 20px;max-width:520px}
.form-consent input{margin-top:3px;width:18px;height:18px;flex:none;accent-color:var(--berry)}
.form-consent label{font-size:13px;line-height:1.5;font-weight:600}
.form-consent a{color:var(--berry);text-decoration:underline}

/* реквизиты на «Контактах» */
.requisites{width:100%;border-collapse:collapse;margin-top:6px}
.requisites td{padding:10px 0;font-size:15px;border-bottom:2px dashed #e4dcc3;vertical-align:top}
.requisites td:first-child{font-weight:800;width:42%;padding-right:18px}
.requisites tr:last-child td{border-bottom:none}

/* коммерческий блок на карточке товара */
.commercial{background:var(--cream);color:var(--ink);border:3px solid var(--ink);border-radius:18px;padding:16px 20px;margin:22px 0}
.commercial .price-note{font-weight:900;font-size:18px;margin-bottom:4px}
.commercial p{font-size:14px;margin:0}
.commercial a{color:var(--berry);text-decoration:underline}

/* фильтры раздела по характеристикам (src/catalog_filters.php) */
.facets{border:3px solid rgba(255,243,214,.26);border-radius:24px;padding:22px 26px;margin:0 0 34px;background:rgba(0,0,0,.14)}
.facets-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:12px}
.facets-head h3{font-size:19px;color:var(--cream)}
.facets-reset{font-size:14px;font-weight:800;color:var(--sun);text-decoration:underline}
.facet{display:flex;gap:16px;align-items:baseline;flex-wrap:wrap;padding:11px 0;border-top:2px dashed rgba(255,243,214,.16)}
.facet:first-of-type{border-top:none;padding-top:2px}
.facet-name{flex:0 0 210px;font-weight:800;font-size:14px;opacity:.78}
.facet-values{display:flex;gap:8px;flex-wrap:wrap;flex:1 1 320px}
.facet-values a{
  display:inline-flex;align-items:center;gap:7px;padding:5px 14px;border-radius:999px;
  border:2px solid rgba(255,243,214,.42);font-size:14px;font-weight:700;color:var(--cream);
}
.facet-values a:hover{background:var(--white);color:var(--ink);border-color:var(--ink)}
.facet-values a.active{background:var(--sun);color:var(--ink);border-color:var(--ink);box-shadow:3px 3px 0 rgba(0,0,0,.45)}
.facet-count{font-size:12px;font-weight:700;opacity:.55}
.facets-total{margin-top:14px;font-size:14px;opacity:.8}
.empty-state a{color:var(--sun);text-decoration:underline}
@media(max-width:700px){
  .facets{padding:18px 18px}
  .facet{display:block}
  .facet-name{margin-bottom:8px}
}

/* поле количества рядом с кнопкой «В запрос» (каталог и карточка товара) */
.qty-input{
  width:62px;flex:none;padding:7px 6px;border:3px solid var(--ink);border-radius:999px;text-align:center;
  font-family:'Nunito',Arial,sans-serif;font-size:15px;font-weight:800;color:var(--ink);background:var(--white);
}
.qty-input:focus{outline:3px solid var(--sky);outline-offset:2px}

/* карточка каталога: ссылка на товар + форма «В запрос» рядом с ней */
.card-link{display:flex;flex-direction:column;flex:1;color:var(--ink)}
.card-add{display:flex;gap:8px;align-items:center;margin-top:16px}
.card-add .btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding-left:14px;padding-right:16px}
a.card-add.in-cart{
  display:flex;align-items:center;justify-content:center;gap:8px;padding:7px 16px;border-radius:999px;
  border:3px dashed var(--ink);font-size:14px;font-weight:800;color:var(--ink);
}
a.card-add.in-cart:hover{background:var(--grass)}

/* кнопка «в запрос» на карточке товара: вверху (top) и в блоке действий (cta) */
/* «Цена по запросу» рядом с кнопкой «В запрос» (templates/views/product.php):
   на карточке это первый экран, подробности — в .commercial ниже. */
.price-ask{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin:4px 0 0}
.price-ask-value{font-family:'Nunito',Arial,sans-serif;font-weight:900;font-size:22px;color:var(--sun)}
.price-ask-note{font-size:14px;opacity:.85}
.add-to-cart{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.add-to-cart .btn{display:inline-flex;align-items:center;gap:8px}
.add-to-cart.top{margin:18px 0 4px}
a.add-to-cart.in-cart{
  border:3px dashed var(--ink);border-radius:999px;padding:8px 18px;font-weight:800;font-size:15px;
  color:var(--ink);background:var(--white);
}
.grass-bg a.add-to-cart.in-cart{background:transparent;color:var(--cream);border-color:rgba(255,243,214,.5)}
.grass-bg a.add-to-cart.in-cart:hover{background:var(--grass);color:var(--ink);border-color:var(--ink)}
.p-head .add-to-cart.top .btn{box-shadow:4px 4px 0 rgba(0,0,0,.45)}
.cart-icon{width:19px;height:19px;flex:none}

/* строка-уведомление под шапкой («позиция в запросе») */
.site-notice{background:var(--grass);color:var(--ink);border-bottom:3px solid var(--ink);font-weight:800;font-size:15px}
.site-notice .wrap{padding-top:11px;padding-bottom:11px}

/* тележка со счётчиком в шапке */
.cart-link{display:inline-flex;align-items:center;padding:8px 14px}
.cart-link .cart-icon{width:21px;height:21px}
.cart-badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;
  margin-left:7px;padding:0 6px;border-radius:999px;background:var(--ink);color:var(--cream);
  font-size:13px;font-weight:800;line-height:1;
}

/* страница запроса на расчёт (/cart.php) */
.cart-table{width:100%;border-collapse:collapse;margin:20px 0 4px}
.cart-table th{
  text-align:left;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;
  opacity:.55;padding-bottom:8px;border-bottom:2px solid var(--ink);
}
.cart-table td{padding:13px 0;border-bottom:2px dashed #e4dcc3;vertical-align:top}
.cart-name{font-weight:800;color:var(--ink);text-decoration:underline}
.cart-meta{display:block;font-size:13px;opacity:.6;margin-top:3px}
.cart-qty{width:120px}
.cart-qty input{
  width:88px;padding:8px 10px;border:3px solid var(--ink);border-radius:12px;text-align:center;
  font-family:'Nunito',Arial,sans-serif;font-size:15px;font-weight:700;color:var(--ink);background:var(--white);
}
.cart-actions{width:100px;text-align:right}
.cart-tools{display:flex;gap:20px;align-items:center;flex-wrap:wrap;margin-top:20px}
.link-btn{
  background:none;border:none;padding:0;cursor:pointer;text-decoration:underline;
  font-family:'Nunito',Arial,sans-serif;font-size:14px;font-weight:700;color:var(--berry);
}
.link-btn:hover{color:var(--ink)}
/* на телефоне колонки количества и «Убрать» отдают ширину названию позиции —
   иначе оно рвётся на пять строк */
@media(max-width:600px){
  .cart-table th{font-size:11px}
  .cart-name{font-size:15px}
  .cart-qty{width:82px}
  .cart-qty input{width:64px;padding:7px 4px;font-size:14px}
  .cart-actions{width:68px}
  .cart-actions .link-btn{font-size:13px}
}

/* Плавное появление секций при скролле. Прячем только внутри .reveal-js —
   этот класс вешает на <html> инлайновый скрипт в <head> (templates/layout.php),
   он же потом показывает секции. Без скрипта (JS выключен, старый браузер,
   рендер робота) класса нет и секции видны сразу: контент не должен зависеть
   от того, доехала ли анимация. */
@media (prefers-reduced-motion: no-preference){
  .reveal-js .reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease, transform .6s ease}
  .reveal-js .reveal.in-view{opacity:1;transform:none}
}
.stock{margin:6px 0 0;font-size:15px}
.stock b{font-weight:800}
