/* Dronparts — витрина */

/* Гарнитуры лежат у нас же: из России сторонний CDN тормозит, а шрифт —
   первое, что видит посетитель. Кириллица и латиница разнесены по подмножествам,
   браузер тянет только нужное. */
/* Гарнитуры лежат у нас же: из России сторонний CDN тормозит, а шрифт —
   первое, что видит посетитель. Кириллица и латиница разнесены по подмножествам,
   браузер тянет только нужное.
   Golos Text — весь текст и интерфейс, кириллица рисовалась родной, а не адаптировалась.
   Roboto Slab — заголовки: брусковая антиква против гротеска даёт контраст по классу,
   а не по толщине. JetBrains Mono — числа и артикулы: табличные цифры. */
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/golos-400-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/golos-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/golos-500-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/golos-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/golos-600-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:600;font-display:swap;
  src:url('/static/fonts/golos-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/golos-700-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Golos Text';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/golos-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/robotoslab-500-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/robotoslab-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/robotoslab-700-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Roboto Slab';font-style:normal;font-weight:700;font-display:swap;
  src:url('/static/fonts/robotoslab-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/jetbrains-mono-400-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/jetbrains-mono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/jetbrains-mono-500-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('/static/fonts/jetbrains-mono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root{
  /* Страница собрана полосами: светлые чередуются с тёмными. Токены заданы для
     светлой полосы, а класс .band-dark переопределяет их внутри тёмной — так одни
     и те же карточки, таблицы и кнопки работают на обоих фонах без дублей правил. */
  --paper:#F2EFE9;          /* светлая полоса: тёплая небелёная бумага */
  --paper-2:#E7E2D8;        /* второй уровень: панель фильтров, шапка таблицы, зебра */
  --card:#FFFFFF;           /* карточка и поле ввода */
  --ink:#0F1317;            /* основной текст: холодный графит, 16,3:1 на бумаге */
  --navy:#1F262B;           /* вторичный интерактивный текст и рамки */
  --steel:#67707A;          /* третий уровень текста и пиктограммы */
  --muted:#4C545B;          /* приглушённый текст: артикулы, единицы, подписи */
  --brass:#BE2434;          /* акцент-заливка: красный, белый текст 6,0:1 */
  --brass-ink:#9E1B2E;      /* акцент под мелкий текст и ссылки, 6,9:1 на бумаге */
  --on-accent:#FFFFFF;
  --rule:#DCD6CB;           /* линия: рамка карточки, границы блоков */
  --rule-soft:#EAE5DC;      /* мягкая линия: разлиновка таблиц */
  --well:#F7F5F0;
  --paper-hi:#FFFFFF;
  --photo-bg:#FFFFFF;
  --photo-dim:1;            /* на светлой полосе снимки не приглушаем */
  --photo-dim-main:1;
  --deep:#0F1317;           /* тёмная поверхность: шапка, подвал, тёмные полосы */
  --on-deep:#F2EFE9;
  --ink-2:#1F262B;
  --ink-3:#0B0E11;
  --steel-2:#8A939B;
  --paper-3:#B7BEC4;
  --alarm:#8A5A00;
  --alarm-2:#6E4700;
  --brass-2:#F2707F;        /* акцент на тёмной полосе, 6,3:1 */
  --stock:#1F6B45;
  --transit:#1D5AA0;
  --order:#5A4B8C;

  --display:'Roboto Slab','PT Serif',Georgia,'Times New Roman',serif;
  --sans:'Golos Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',SFMono-Regular,Menlo,Consolas,monospace;

  /* Шкала с шагом 1.25 от 16 px — размеры больше не подбираются на глаз. */
  --t-3xs:10px;
  --t-2xs:11px;
  --t-xs:12px;
  --t-sm:13px;
  --t-base:16px;
  --t-md:18px;
  --t-lg:20px;
  --t-xl:25px;
  --t-2xl:31px;
  --t-3xl:39px;
  --t-4xl:49px;

  /* Ритм по 8 px: все вертикальные отступы кратны шагу. */
  --s-1:8px;
  --s-2:16px;
  --s-3:24px;
  --s-4:32px;
  --s-5:48px;
  --s-6:64px;
  --s-7:96px;

  --measure:66ch;          /* комфортная длина строки */
  --measure-narrow:56ch;

  --max:1240px;
  --pad:clamp(16px,3.5vw,44px);
}
*{box-sizing:border-box}
html{background:var(--paper);scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--navy);font-family:var(--sans);
  font-size:var(--t-base);line-height:1.6;-webkit-font-smoothing:antialiased;
  font-feature-settings:'kern' 1}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.012em;text-wrap:balance}
h4{font-family:var(--sans);font-weight:600;letter-spacing:-.005em;text-wrap:balance}
h1,h2,h3,h4,p,ul,ol,figure,dl,dd{margin:0;padding:0}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.prose a,.tg-b p a,.ab-text a,.th-text a{color:var(--brass-ink);text-decoration:underline;
  text-decoration-thickness:1px;text-underline-offset:2px}
ul{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
.shell{max-width:var(--max);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.mono{font-family:var(--mono)}
.muted{color:var(--steel)}

.eyebrow{font-family:var(--sans);font-size:var(--t-sm);font-weight:500;letter-spacing:0;text-transform:none;
  color:var(--steel);display:block;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--rule);
  max-width:18ch}
.eyebrow.on-dark{color:var(--brass-2)}

/* ===== тёмная полоса =====
   Переопределяем токены на секции: всё, что внутри, перекрашивается само. */
.band-dark{
  --paper:#14181C; --paper-2:#1D2328; --card:#1D2328; --well:#232B31;
  --ink:#F2EFE9; --navy:#DDE2E6; --muted:#B7BEC4; --steel:#8A939B; --steel-2:#6E777F;
  --rule:#2C343A; --rule-soft:#232A30; --paper-3:#B7BEC4;
  --brass:#D93A4A; --brass-ink:#F2707F; --on-accent:#FFFFFF;
  --deep:#0F1317; --on-deep:#F2EFE9; --ink-2:#F7F5F0; --ink-3:#0B0E11;
  --photo-dim:.86; --photo-dim-main:.94;
  --stock:#5FBF8F; --transit:#7FB3F0; --order:#B9A6F0; --alarm:#E0A340; --alarm-2:#C98E2E;
  background:var(--paper); color:var(--muted);
}
.band-dark .card:hover .card-photo,.band-dark .card:focus-within .card-photo{filter:brightness(1)}
.band{padding:clamp(34px,5vw,64px) 0}
.band+.band{border-top:1px solid var(--rule)}
.band-dark+.band-dark{border-top-color:var(--rule-soft)}

/* ===== кнопки ===== */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);
  font-size:var(--t-base);font-weight:600;letter-spacing:.01em;
  padding:12px 20px;border-radius:2px;background:var(--ink);color:var(--paper);
  border:1px solid var(--ink);cursor:pointer;white-space:nowrap;
  transition:background .18s,color .18s,border-color .18s}
.btn:hover{background:var(--ink-2)}
.btn--sm{padding:8px 14px;font-size:var(--t-sm)}
.btn--lg{padding:16px 24px;font-size:var(--t-base)}
.btn--ghost{background:transparent;color:var(--navy);border-color:var(--rule)}
.btn--ghost:hover{background:var(--navy);color:var(--paper);border-color:var(--navy)}
.btn--brass{background:var(--brass);border-color:var(--brass);color:var(--on-accent);font-weight:600}
.btn--brass:hover{background:var(--brass-ink);border-color:var(--brass-ink)}
.pill{background:var(--brass);color:var(--on-accent);border-radius:2px;padding:1px 7px;
  font-size:var(--t-xs);font-family:var(--mono);margin-left:6px}

/* ===== шапка ===== */
.nav{position:sticky;top:0;z-index:40;background:var(--deep);
  backdrop-filter:saturate(160%) blur(10px);-webkit-backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--rule-soft)}
.nav .row{display:flex;align-items:center;gap:18px;padding-top:11px;padding-bottom:11px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);margin-right:auto}
.brand-name{font-family:var(--display);font-weight:700;font-size:var(--t-md);letter-spacing:-.01em;
  display:block;color:var(--navy)}
.brand-sub{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:0;text-transform:none;
  color:var(--steel);display:block;margin-top:2px}
.nav-links{display:flex;gap:18px}
.nav-links a{font-size:var(--t-sm);color:var(--navy);opacity:.75}
.nav-links a:hover{opacity:1}
.burger{display:none;flex-direction:column;gap:4px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:20px;height:2px;background:var(--navy);display:block}
.mobile-menu[hidden]{display:none}
.mobile-menu{display:flex;flex-direction:column;border-top:1px solid var(--rule-soft);
  padding:8px var(--pad) 14px;gap:2px;background:var(--paper)}
.mobile-menu a{padding:10px 0;border-bottom:1px solid var(--rule-soft)}
@media(max-width:980px){
  .nav-links{display:none}
  .burger{display:flex}
}

/* ===== хлебные крошки ===== */
.crumbs{border-bottom:1px solid var(--rule-soft);font-size:var(--t-sm);color:var(--steel)}
.crumbs .shell{display:flex;gap:8px;flex-wrap:wrap;padding-top:12px;padding-bottom:12px}
.crumbs a:hover{color:var(--navy)}
.crumbs .sep{opacity:.5}
.crumbs .cur{color:var(--navy)}

/* ===== секции ===== */
.block{padding-top:clamp(38px,5vw,64px);padding-bottom:clamp(38px,5vw,64px)}
.narrow{max-width:820px}
.sec-head{margin-bottom:var(--s-3)}
.sec-head h1,.sec-head h2{font-size:clamp(var(--t-xl),3vw,var(--t-2xl));line-height:1.15;font-weight:700;letter-spacing:-.018em;
  font-weight:700;text-wrap:balance}
.sec-head .sub{margin-top:var(--s-1);color:var(--muted);max-width:var(--measure);font-size:var(--t-base)}
.row-between{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;flex-wrap:wrap}
.dark{background:var(--deep);color:var(--on-deep)}
.dark h2,.dark h3{color:var(--paper)}
.on-dark{color:var(--paper)}

/* ===== главная ===== */
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.home-lead .sec-head{margin-bottom:20px;align-items:center}
.home-more{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px;padding-top:26px;
  border-top:1px solid var(--rule)}

.hero{background:var(--deep);color:var(--on-deep);position:relative;overflow:hidden}
/* Вместо световых пятен — деления шкалы: линия и штрихи, как на приборе. */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:14px;pointer-events:none;
  background:repeating-linear-gradient(90deg,var(--brass-2) 0 1px,transparent 1px 28px);opacity:.45}
.hero .shell{position:relative;z-index:1;padding-top:clamp(44px,6vw,80px);padding-bottom:clamp(34px,4vw,54px)}
.hero h1{font-size:clamp(29px,4.4vw,50px);line-height:1.07;letter-spacing:-.022em;font-weight:700;
  max-width:20ch;margin-bottom:18px;text-wrap:balance}
.hero h1 .br{color:var(--brass-2)}
.hero .lead{font-size:clamp(15.5px,1.4vw,18px);line-height:1.55;color:var(--paper-3);max-width:58ch;margin-bottom:26px}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px}
.hero .btn--ghost{color:var(--on-deep);border-color:var(--rule)}
.hero .btn--ghost:hover{background:var(--on-deep);color:var(--deep)}
.hero-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,3vw,32px);
  margin-top:clamp(30px,4vw,48px);padding-top:20px;border-top:1px solid var(--rule)}
.hero-meta .k{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:0;text-transform:none;
  color:var(--steel-2);display:block;margin-bottom:6px}
.hero-meta .v{font-size:clamp(17px,2vw,24px);font-weight:600;letter-spacing:-.01em;display:block;line-height:1.15}
.hero-meta .v small{font-family:var(--mono);font-size:var(--t-2xs);color:var(--brass-2);display:block;
  margin-top:4px;font-weight:500;letter-spacing:.06em}
@media(max-width:700px){.hero-meta{grid-template-columns:repeat(2,1fr);gap:20px}}

.cat-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.cat-tile{background:var(--paper);padding:24px 22px;display:flex;flex-direction:column;gap:8px;
  transition:background .18s}
.cat-tile:hover{background:var(--card)}
.ct-name{font-weight:600;font-size:var(--t-md)}
.ct-desc{color:var(--muted);font-size:var(--t-sm);line-height:1.5;flex:1}
.ct-go{font-size:var(--t-sm);color:var(--brass-ink);font-weight:500}

.brand-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule)}
.brand-card{background:var(--paper);padding:22px 20px;display:flex;flex-direction:column;gap:6px}
.brand-card:hover{background:var(--card)}
.bn{font-weight:600;font-size:var(--t-md)}
.bc{font-size:var(--t-sm);color:var(--steel)}
/* Страховка на семь строк: даже если текст когда-нибудь снова отрастёт,
   карточка не разъедет сетку. */
.bp{color:var(--muted);font-size:var(--t-sm);line-height:1.55;margin-top:6px;flex:1;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow:hidden}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);
  border:1px solid var(--rule);margin:26px 0}
.steps li{background:var(--deep);padding:22px 20px}
.steps .n{font-family:var(--sans);font-size:var(--t-xs);color:var(--brass-2);display:block;margin-bottom:10px}
.steps h3{font-size:var(--t-base);font-weight:600;margin-bottom:7px;color:var(--paper)}
.steps p{font-size:var(--t-sm);line-height:1.55;color:var(--paper-3)}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}

/* ===== фильтры ===== */
.search{display:flex;align-items:center;gap:10px;border:1px solid var(--rule);background:var(--card);
  padding:0 12px;border-radius:2px;margin-bottom:14px;max-width:640px}
.search svg{flex:0 0 auto;opacity:.5}
.search input[type=search]{flex:1;border:0;background:transparent;padding:11px 0;outline:none;min-width:0}
.search:focus-within{border-color:var(--navy)}
.filter-rows{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.frow{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.flabel{font-family:var(--sans);font-size:var(--t-xs);letter-spacing:0;text-transform:none;
  color:var(--steel);min-width:78px}
.chip{font-family:var(--mono);font-size:var(--t-sm);letter-spacing:.01em;
  padding:8px 12px;border:1px solid var(--rule);border-radius:2px;color:var(--navy)}
.chip:hover{border-color:var(--navy)}
.chip.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.chip .cnt{opacity:.55;margin-left:6px}
.frow--sub{padding-left:0}
.frow--sub .chip{background:var(--card)}
.frow--sub .chip.on{background:var(--navy);border-color:var(--navy);color:var(--paper)}
.result-line{font-size:var(--t-sm);color:var(--steel);margin-bottom:16px}

/* Подписи набираем текстовой гарнитурой в строку, без прописных и разрядки:
   моноширинный капс вразрядку — слишком узнаваемый приём, он остаётся только
   там, где действительно нужны табличные цифры: артикулы, характеристики, коды. */
.label,.eyebrow,.flabel,.foot h4,.field span,.pi-price-k,.pi-brand,.card-brand,.status,.brand-sub{
  font-family:var(--sans);font-size:var(--t-xs);letter-spacing:0;text-transform:none;font-weight:500}

/* ===== карточки товаров ===== */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:16px}
.card{position:relative;background:var(--card);border:1px solid var(--rule);border-radius:2px;display:flex;
  flex-direction:column;transition:border-color .18s,transform .18s}
.card:hover{border-color:var(--navy);transform:translateY(-2px)}
/* Превью собраны на белом поле, и на тёмной теме плитка светит как лампа.
   Гасим её приглушением: в сетке снимок притушен, под курсором и с клавиатуры
   возвращается к полной яркости — так подсветка работает ещё и указателем. */
.card-photo{display:block;aspect-ratio:4/3;background:var(--photo-bg);
  border-bottom:1px solid var(--rule);
  display:flex;align-items:center;justify-content:center;overflow:hidden;padding:12px;
  filter:brightness(var(--photo-dim));transition:filter .16s}
.card:hover .card-photo,.card:focus-within .card-photo{filter:brightness(1)}
.card-photo img{max-height:100%;width:auto;object-fit:contain}
.no-photo{font-family:var(--mono);font-size:var(--t-xs);color:var(--steel);text-align:center;padding:12px}
.card-body{padding:var(--s-2) 18px 18px;display:flex;flex-direction:column;flex:1;gap:2px}
.card-body>.card-use{margin-top:var(--s-1)}
.card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.card-brand{font-family:var(--sans);font-size:var(--t-xs);color:var(--steel)}
.card-model{font-family:var(--mono);font-size:var(--t-sm);color:var(--ink);
  display:flex;align-items:baseline;gap:var(--s-1);flex-wrap:wrap}
.card-doc{font-family:var(--mono);font-size:var(--t-xs);color:var(--steel)}
.card-title{font-family:var(--sans);font-size:var(--t-md);line-height:1.32;font-weight:600;letter-spacing:-.005em}
/* Кликается вся плитка: подъём на 2 px обещает это, а ссылками были только фото и заголовок. */
.card-title a::after{content:"";position:absolute;inset:0}
.card-title a{text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px}
.card:hover .card-title a{text-decoration-color:var(--navy)}
.card-use{color:var(--steel);font-size:var(--t-sm);line-height:1.5;flex:1}
.card-foot{position:relative;z-index:1;display:flex;align-items:center;gap:var(--s-1);flex-wrap:wrap;
  margin-top:10px;padding-top:12px;border-top:1px solid var(--rule-soft)}
.add-drop{width:32px;height:32px;border:1px solid var(--rule);border-radius:2px;background:transparent;
  cursor:pointer;color:var(--steel);font-size:var(--t-md);line-height:1}
.add-drop:hover{border-color:var(--order);color:var(--ink)}
.price{font-size:var(--t-sm);
  color:var(--steel)}
.status{font-size:var(--t-xs);font-weight:500;
  padding:3px 7px;border:1px solid currentColor;border-radius:2px;white-space:nowrap;flex:0 0 auto}
/* Складская позиция в каталоге ровно одна из 818 — редкость стоит заливки,
   а не той же рамки, что у 817 «под заказ». */
.s-stock{color:var(--paper-hi);background:var(--stock);border-color:var(--stock)}
.s-transit{color:var(--transit)}
.s-order{color:var(--order)}
.qty{display:inline-flex;align-items:center;border:1px solid var(--rule);border-radius:2px;overflow:hidden}
.qty button{width:28px;height:32px;border:0;background:transparent;cursor:pointer;font-size:var(--t-base)}
.qty button:hover{background:var(--paper-2)}
.qty input{width:42px;height:32px;border:0;border-left:1px solid var(--rule);border-right:1px solid var(--rule);
  text-align:center;font-family:var(--mono);font-size:var(--t-sm);background:transparent;-moz-appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
/* На пальце цель меньше 44 px промахивается, а промах здесь стирает собранное. */
@media(pointer:coarse){
  .qty button{min-width:44px;height:44px}
  .qty input{height:44px}
  .add-drop,.rl-del{width:44px;height:44px}
}
.add.in{background:var(--stock);border-color:var(--stock);color:var(--paper-hi)}
.empty{padding:44px 20px;text-align:center;color:var(--steel);border:1px dashed var(--rule)}
.empty a{border-bottom:1px solid var(--rule)}

.pager{display:flex;gap:6px;flex-wrap:wrap;margin-top:26px}
.pg{border:1px solid var(--rule);padding:8px 13px;font-family:var(--mono);font-size:var(--t-sm);border-radius:2px}
.pg:hover{border-color:var(--navy)}
.pg.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.pg-gap{padding:8px 4px;color:var(--steel)}

/* ===== карточка товара ===== */
.product-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,52px);align-items:start}
@media(max-width:860px){.product-grid{grid-template-columns:1fr}}
.gallery{position:sticky;top:88px}
@media(max-width:860px){.gallery{position:static}}
.gal-main{background:var(--photo-bg);border:1px solid var(--rule);aspect-ratio:1;display:flex;
  filter:brightness(var(--photo-dim-main));
  align-items:center;justify-content:center;padding:22px}
.gal-main img{max-height:100%;width:auto;object-fit:contain}
.no-photo-big{font-family:var(--mono);color:var(--steel)}
.gal-thumbs{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.gal-thumb{width:64px;height:64px;border:1px solid var(--rule);background:var(--photo-bg);padding:4px;
  cursor:pointer;filter:brightness(var(--photo-dim))}
.gal-thumb:hover,.gal-thumb.on{filter:brightness(1)}
.gal-thumb.on{border-color:var(--navy)}
.gal-thumb img{width:100%;height:100%;object-fit:contain}
.pi-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}
.pi-brand{font-family:var(--sans);font-size:var(--t-sm);color:var(--steel)}
.pi-brand:hover{color:var(--navy)}
.pi-model{font-family:var(--mono);font-size:var(--t-sm);color:var(--steel);margin-bottom:6px}
.product h1{font-size:clamp(23px,2.8vw,32px);line-height:1.18;letter-spacing:-.018em;font-weight:700;margin-bottom:12px}
.pi-summary{color:var(--muted);font-size:var(--t-md);line-height:1.65;margin-bottom:var(--s-3);max-width:var(--measure-narrow)}
.pi-buy{border:1px solid var(--rule);background:var(--card);padding:var(--s-3);margin-bottom:var(--s-3)}
.pi-price{display:flex;align-items:baseline;gap:var(--s-2);padding-bottom:var(--s-2);
  border-bottom:1px solid var(--rule-soft);margin-bottom:var(--s-2)}
.pi-price-k{font-family:var(--sans);font-size:var(--t-xs);color:var(--steel)}
.pi-price .price{font-family:var(--display);font-size:var(--t-lg);font-weight:700;color:var(--ink);
  margin-left:auto;letter-spacing:-.01em;text-transform:none}
.pi-facts{display:grid;gap:0;margin-bottom:var(--s-3)}
.pi-facts>div{display:grid;grid-template-columns:minmax(0,42%) 1fr;gap:var(--s-2);
  align-items:baseline;padding:7px 0}
.pi-facts dt{font-size:var(--t-sm);color:var(--steel);white-space:nowrap}
.pi-facts dd{margin:0;font-family:var(--mono);font-size:var(--t-sm);color:var(--navy);
  font-variant-numeric:tabular-nums}
.pi-actions{display:flex;gap:var(--s-1);align-items:center;flex-wrap:wrap}
.pi-note{font-size:var(--t-sm);color:var(--steel);margin-top:var(--s-2);line-height:1.55}

/* линия доверия под панелью запроса */
.pi-trust{display:grid;gap:var(--s-2);margin:0 0 var(--s-4);padding:0;list-style:none}
.pi-trust li{display:flex;gap:12px;align-items:flex-start;color:var(--muted);font-size:var(--t-sm);line-height:1.55}
.pi-trust svg{flex:none;margin-top:2px;color:var(--steel)}
.pi-trust b{display:block;font-weight:600;color:var(--navy);margin-bottom:2px;font-size:var(--t-sm)}

.pi-h{font-family:var(--sans);font-size:var(--t-md);font-weight:600;margin:var(--s-4) 0 var(--s-2)}

/* характеристики: две колонки на широком экране, числа моноширинные */
.specs{margin:0 0 var(--s-2);padding:0}
@media(min-width:900px){.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  column-gap:var(--s-5)}}
.spec{display:grid;grid-template-columns:minmax(0,42%) 1fr;gap:12px;align-items:baseline;padding:9px 0;
  border-bottom:1px solid var(--rule-soft);break-inside:avoid}
.spec dt{color:var(--steel);font-size:var(--t-sm);min-width:0}
.spec dd{margin:0;font-family:var(--mono);font-size:var(--t-sm);color:var(--navy);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}

.pi-text p{margin-bottom:var(--s-2);color:var(--muted);max-width:var(--measure);line-height:1.75}
.pi-source{margin-top:20px;font-size:var(--t-sm);color:var(--steel)}
.pi-source a{border-bottom:1px solid var(--rule)}
.related{margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid var(--rule)}

/* ===== запросный лист ===== */
.rfq-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
@media(max-width:900px){.rfq-grid{grid-template-columns:1fr}}
.rfq-table{border:1px solid var(--rule);margin-bottom:16px}
.rfq-line{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;
  padding:14px 16px;border-bottom:1px solid var(--rule-soft)}
.rfq-line:last-child{border-bottom:0}
.rl-model{font-family:var(--mono);font-size:var(--t-xs);color:var(--steel);display:block}
.rl-title{font-size:var(--t-base);font-weight:550;line-height:1.35}
.rfq-empty{padding:36px 20px;text-align:center;color:var(--steel)}
.rl-del{border:0;background:none;color:var(--steel);cursor:pointer;font-size:var(--t-md);padding:4px 8px}
.rl-del:hover{color:var(--alarm)}
.rfq-form{min-width:0;border:1px solid var(--rule);background:var(--card);padding:22px}
.rfq-form h2{font-size:var(--t-md);font-weight:600;margin-bottom:16px}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px;min-width:0}
.field span{font-size:var(--t-xs);color:var(--muted)}
/* Ширину задаём явно: у select и input[type=file] своя внутренняя ширина,
   и в колонке grid они распирали форму за пределы панели. */
.field input,.field select,.field textarea{width:100%;min-width:0;max-width:100%;
  border:1px solid var(--rule);background:var(--paper);padding:11px 13px;
  border-radius:2px;font-family:inherit;font-size:var(--t-base);color:inherit}
.field select{appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--steel) 50%),
                   linear-gradient(135deg,var(--steel) 50%,transparent 50%);
  background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;
  background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:34px}
.field input[type=file]{padding:9px 12px;font-size:var(--t-sm)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.two{grid-template-columns:1fr}}
.form-msg{display:none;font-size:var(--t-sm);padding:11px 13px;border-radius:2px;margin-bottom:12px}
.form-msg.err{display:block;background:rgba(240,121,107,.12);border:1px solid var(--alarm);color:var(--alarm)}
.form-note{font-size:var(--t-sm);color:var(--steel);margin-top:12px;line-height:1.5}
.form-note a{border-bottom:1px solid var(--rule)}
.thanks{text-align:center;padding:40px 0}
.thanks h1{font-size:clamp(24px,3vw,34px);margin-bottom:14px;font-weight:700}
.thanks p{color:var(--muted);max-width:56ch;margin:0 auto 24px}
.thanks .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* ===== текстовые страницы ===== */
.text-blocks{display:flex;flex-direction:column;gap:26px}
.tb h2{font-size:var(--t-md);font-weight:600;margin-bottom:10px;padding-bottom:9px;border-bottom:1px solid var(--rule)}
.tb p{color:var(--muted)}
.tb ul{display:flex;flex-direction:column;gap:9px}
.tb li{color:var(--muted);padding-left:17px;position:relative}
.tb li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:1px;background:var(--brass)}

/* ===== нижняя панель запроса ===== */
.rfq-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--deep);color:var(--on-deep);
  border-top:1px solid var(--brass-2)}
.rfq-row{display:flex;align-items:center;gap:14px;padding-top:11px;padding-bottom:11px;flex-wrap:nowrap}
.rfq-sum{font-size:var(--t-sm);white-space:nowrap}
.rfq-sum b{color:var(--brass-2);font-weight:600}
.rfq-list{font-family:var(--mono);font-size:var(--t-xs);color:var(--paper-3);flex:1;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;min-width:0}
.rfq-acts{display:flex;gap:8px;margin-left:auto;flex:0 0 auto}
.rfq-bar .btn--ghost{color:var(--on-deep);border-color:var(--rule)}
.rfq-bar .btn--ghost:hover{background:var(--on-deep);color:var(--deep)}
body.has-rfq{padding-bottom:70px}
@media(max-width:640px){.rfq-list{display:none}}

/* ===== подвал ===== */
.foot{background:var(--deep);color:var(--paper-3);border-top:0;
  padding:var(--s-6) 0 var(--s-3);margin-top:auto}
.foot a{color:var(--paper-3)}
.foot a:hover{color:var(--on-deep)}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:clamp(20px,3vw,40px)}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-grid{grid-template-columns:1fr}}
/* Подвал стоит на самой тёмной поверхности, поэтому знак берёт цвет текста
   этой поверхности, а не поля полосы — иначе он сливается с фоном. */
.foot-brand{display:flex;align-items:center;gap:12px;color:var(--on-deep);margin-bottom:var(--s-2);
  font-family:var(--display);font-weight:700;font-size:var(--t-lg);letter-spacing:.02em}
.foot-brand svg{color:var(--on-deep)}
.foot-note{font-size:var(--t-sm);color:var(--steel);line-height:1.65;margin-bottom:var(--s-1);max-width:46ch}
/* Заголовки колонок в подвале: цвет там ничего не сообщает, поэтому берём
   цвет основного текста и отличаем только начертанием. */
.foot h4{font-family:var(--sans);font-size:var(--t-sm);font-weight:600;color:var(--on-deep);
  margin-bottom:var(--s-2)}
.foot ul{display:flex;flex-direction:column;gap:var(--s-1);font-size:var(--t-sm)}
.foot-bottom{margin-top:var(--s-5);padding-top:var(--s-3);border-top:1px solid var(--rule);
  font-size:var(--t-xs);color:var(--steel);display:flex;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* документация на карточке товара */
.docs{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:8px}
.docs a{display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:11px 14px;border:1px solid var(--rule);border-radius:2px;
  color:var(--ink);text-decoration:none;font-size:var(--t-sm)}
.docs a:hover{border-color:var(--navy);background:var(--paper-2)}
.docs-meta{color:var(--muted);font-size:var(--t-xs);letter-spacing:.04em;white-space:nowrap}

/* подборки */
.sel-hero{max-width:78ch;margin:0 0 34px}
.sel-hero h1{font-size:clamp(var(--t-2xl),4vw,var(--t-4xl));line-height:1.12;margin:var(--s-1) 0 var(--s-2);font-weight:700}
.sel-hero p{color:var(--muted);font-size:var(--t-md);line-height:1.7;margin:0;max-width:var(--measure)}

.sel-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.sel-card{display:flex;flex-direction:column;border:1px solid var(--rule);background:var(--paper);
  color:var(--ink);text-decoration:none;transition:border-color .15s,transform .15s}
.sel-card:hover{border-color:var(--brass)}
.sel-card:hover .sel-go{color:var(--brass)}
.sel-card--big{grid-column:span 2}
@media (max-width:820px){.sel-card--big{grid-column:span 1}}

.sel-collage{display:grid;gap:1px;background:var(--rule);height:190px;overflow:hidden}
.sel-collage--1{grid-template-columns:1fr}
.sel-collage--2{grid-template-columns:1fr 1fr}
.sel-collage--3{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.sel-collage--3 .sel-cell:first-child{grid-row:span 2}
.sel-collage--0{background:var(--paper-2)}
.sel-card--big .sel-collage{height:230px}
.sel-cell{display:flex;align-items:center;justify-content:center;background:var(--paper-2);overflow:hidden}
.sel-cell img{max-width:86%;max-height:86%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply}

.sel-card-body{display:flex;flex-direction:column;gap:8px;padding:20px 22px 22px;flex:1}
.sel-kicker{font-size:var(--t-sm);color:var(--steel)}
.sel-title{font-family:var(--display);font-size:var(--t-lg);line-height:1.3;font-weight:500;letter-spacing:-.01em}
.sel-card--big .sel-title{font-size:var(--t-xl)}
.sel-lead{color:var(--muted);font-size:var(--t-sm);line-height:1.7;flex:1}
.sel-brands{font-size:var(--t-xs);color:var(--muted);letter-spacing:.03em;
  padding-top:10px;border-top:1px solid var(--rule)}
.sel-go{font-size:var(--t-sm);letter-spacing:.04em;color:var(--ink);transition:color .15s}

/* шапка страницы подборки */
.sel-top{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:38px;
  align-items:center;margin:0 0 34px}
.sel-top h1{font-size:clamp(var(--t-xl),3.4vw,var(--t-3xl));line-height:1.15;margin:var(--s-1) 0 var(--s-2);font-weight:700}
.sel-top-lead{color:var(--muted);font-size:var(--t-md);line-height:1.7;margin:0 0 var(--s-3);max-width:var(--measure-narrow)}
.sel-facts{display:flex;gap:22px;flex-wrap:wrap;font-size:var(--t-sm);color:var(--muted);
  padding-top:16px;border-top:1px solid var(--rule)}
.sel-facts b{color:var(--ink);font-size:var(--t-base);margin-right:4px}
.sel-top-photos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sel-top-photos a{display:flex;align-items:center;justify-content:center;height:132px;
  background:var(--paper-2);border:1px solid var(--rule)}
.sel-top-photos img{max-width:82%;max-height:82%;width:auto;object-fit:contain;mix-blend-mode:multiply}
@media (max-width:820px){.sel-top{grid-template-columns:1fr;gap:24px}.sel-top-photos{display:none}}

.sel-intro{max-width:var(--measure);margin:0 0 var(--s-5)}
.sel-intro p{color:var(--navy);font-size:var(--t-base);line-height:1.8;margin:0 0 var(--s-2)}
.sel-intro-first{font-size:var(--t-md);line-height:1.75;color:var(--ink)}

.cmp-head{margin:0 0 16px}
.cmp-head h2{font-size:var(--t-lg);margin:0 0 6px}
.cmp-head p{margin:0;color:var(--muted);font-size:var(--t-sm)}
.cmp-wrap{margin:0 0 42px}
.table-wrap{overflow-x:auto;border:1px solid var(--rule)}
.cmp{border-collapse:collapse;width:100%;font-size:var(--t-sm);min-width:560px}
.cmp th,.cmp td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--rule);vertical-align:top}
.cmp thead th{background:var(--paper-2);font-size:var(--t-sm);letter-spacing:.01em;
  color:var(--muted);position:sticky;top:0}
.cmp tbody tr:nth-child(even){background:var(--paper-2)}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp-model a{color:var(--ink);font-weight:600;text-decoration:none}
.cmp-model a:hover{color:var(--navy)}
.cmp-brand{display:block;font-size:var(--t-2xs);color:var(--muted);letter-spacing:.05em;margin-top:3px}

.sel-items{display:grid;gap:12px;margin:0 0 44px}
.sel-item{display:grid;grid-template-columns:34px 200px 1fr;gap:20px;align-items:start;
  border:1px solid var(--rule);background:var(--paper);padding:18px 20px}
.sel-num{font-family:var(--mono);font-size:var(--t-xs);color:var(--steel);
  padding-top:4px;letter-spacing:.06em}
.sel-photo{display:flex;align-items:center;justify-content:center;height:160px;background:var(--paper-2)}
.sel-photo img{max-height:88%;max-width:88%;width:auto;object-fit:contain;mix-blend-mode:multiply}
.sel-body h3{font-size:var(--t-base);margin:6px 0 8px;line-height:1.4}
.sel-body h3 a{color:var(--ink);text-decoration:none}
.sel-body h3 a:hover{color:var(--navy)}
.sel-note{margin:0 0 var(--s-2);color:var(--muted);font-size:var(--t-sm);line-height:1.7;max-width:var(--measure)}
.sel-tags{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.sel-tag{font-size:var(--t-xs);color:var(--ink);background:var(--paper-2);border:1px solid var(--rule);
  padding:4px 9px;letter-spacing:.01em}
.sel-tag em{font-style:normal;color:var(--muted);text-transform:lowercase;margin-right:5px}
.sel-act{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.sel-model{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:var(--t-xs);color:var(--muted)}
.sel-more{font-size:var(--t-sm);color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.sel-more:hover{color:var(--navy);border-color:var(--navy)}
@media (max-width:820px){
  .sel-item{grid-template-columns:1fr;gap:14px}
  .sel-num{display:none}
  .sel-photo{height:210px}
}

.sel-cta{color:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;
  padding:28px 30px;border:1px solid var(--rule);background:var(--paper-2);margin:0 0 44px}
.sel-cta h2{font-size:var(--t-lg);margin:0 0 8px}
.sel-cta p{margin:0;color:var(--muted);font-size:var(--t-sm);line-height:1.7;max-width:var(--measure-narrow)}

.sel-others-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sel-others-list a{display:flex;flex-direction:column;gap:8px;padding:18px 20px;
  border:1px solid var(--rule);text-decoration:none;color:var(--ink);background:var(--paper)}
.sel-others-list a:hover{border-color:var(--brass)}
.sel-others-list .sel-title{font-size:var(--t-base)}

/* подсказки поиска */
.search{position:relative}
.suggest{position:absolute;top:100%;left:0;right:0;z-index:40;background:var(--paper);
  border:1px solid var(--rule);border-top:0;max-height:340px;overflow-y:auto}
.sug{display:block;padding:9px 14px;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--rule)}
.sug:last-child{border-bottom:0}
.sug:hover,.sug.on{background:var(--paper-2)}
.sug-t{display:block;font-size:var(--t-sm);line-height:1.4}
.sug-m{display:block;font-size:var(--t-2xs);color:var(--muted);letter-spacing:.04em;margin-top:2px}

/* пустая выдача */
.empty{padding:var(--s-4) 0 var(--s-1);max-width:var(--measure)}
.empty h2{font-size:var(--t-lg);margin:0 0 10px}
.empty p{color:var(--muted);font-size:var(--t-sm);line-height:1.7;margin:0 0 var(--s-3);max-width:var(--measure)}
.empty .cta{display:flex;gap:10px;flex-wrap:wrap}

/* о компании */
.ab-hero{max-width:var(--measure);margin:0 0 var(--s-5)}
.ab-hero h1{font-size:clamp(var(--t-2xl),4vw,var(--t-4xl));line-height:1.12;font-weight:700;margin:var(--s-1) 0 var(--s-3)}
.ab-hero p{color:var(--muted);font-size:var(--t-md);line-height:1.75;margin:0}
/* Опись вместо ряда крупных чисел: строка «что — сколько», как в спецификации. */
.ab-facts{margin:0 0 var(--s-6);max-width:var(--measure);border-top:1px solid var(--rule)}
.ab-fact{display:flex;align-items:baseline;gap:var(--s-2);padding:11px 0;
  border-bottom:1px solid var(--rule-soft)}
.ab-fact dt{flex:1;color:var(--muted);font-size:var(--t-base)}
.ab-fact dd{margin:0;font-family:var(--mono);font-size:var(--t-md);color:var(--ink);
  font-variant-numeric:tabular-nums}
.ab-stat b{display:block;font-family:var(--display);font-size:var(--t-2xl);font-weight:700;
  color:var(--ink);line-height:1;margin-bottom:6px;font-variant-numeric:tabular-nums}
.ab-stat span{font-size:var(--t-sm);color:var(--muted);line-height:1.4;display:block}
.ab-block{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--s-5);
  padding:var(--s-5) 0;border-top:1px solid var(--rule-soft)}
.ab-block h2{font-size:var(--t-lg);font-weight:700;margin:0}
.ab-text{max-width:var(--measure)}
.ab-text p{color:var(--muted);font-size:var(--t-base);line-height:1.8;margin:0 0 var(--s-2)}
.ab-text p:last-child{margin-bottom:0}
@media(max-width:820px){.ab-block{grid-template-columns:1fr;gap:var(--s-2)}}

/* раздел тепловизоров */
.th-hero{max-width:var(--measure);margin:0 0 var(--s-4)}
.th-hero h1{font-size:clamp(var(--t-2xl),4vw,var(--t-4xl));line-height:1.12;font-weight:700;margin:var(--s-1) 0 var(--s-3)}
.th-hero p{color:var(--muted);font-size:var(--t-md);line-height:1.75;margin:0}
.th-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);margin:0 0 var(--s-6)}
.th-fact{background:var(--paper);padding:var(--s-3)}
.th-fact b{display:block;font-family:var(--display);font-size:var(--t-lg);font-weight:700;
  color:var(--ink);margin-bottom:6px;letter-spacing:-.01em}
.th-fact span{font-size:var(--t-sm);color:var(--muted);line-height:1.5}
.th-sim{margin:0 0 var(--s-6)}
.th-frame{border:1px solid var(--rule);background:var(--ink-3);overflow:hidden}
.th-frame iframe{display:block;width:100%;height:1000px;border:0;transition:height .2s}
.th-note{margin:var(--s-2) 0 0;font-size:var(--t-sm);color:var(--steel);max-width:var(--measure)}
.th-text{max-width:var(--measure);margin:0 0 var(--s-6)}
.th-text h2{font-size:var(--t-lg);font-weight:700;margin:0 0 var(--s-2)}
.th-text p{color:var(--muted);font-size:var(--t-base);line-height:1.8;margin:0 0 var(--s-2)}

/* ===== правки по ведомости ===== */

/* Постоянный факт про цену — один раз в строке результата, а не на каждой плитке. */
.result-note{color:var(--steel);font-size:var(--t-sm);margin-left:var(--s-1)}

/* Пагинация говорит, где вы, и даёт выход в конце раздела. */
.pager-where{font-family:var(--mono);font-size:var(--t-xs);color:var(--steel);
  margin:var(--s-4) 0 var(--s-1);font-variant-numeric:tabular-nums}
.pager-exit{margin:var(--s-2) 0 0;font-size:var(--t-sm);color:var(--muted);max-width:var(--measure)}
.pager-exit a{text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px}

/* Карточка называет собственную границу и связи. */
.pi-price-why{display:block;margin-top:6px;font-size:var(--t-xs);color:var(--steel);
  max-width:46ch;line-height:1.5}
.pi-price-why a,.pi-facts-more{text-decoration:underline;text-decoration-color:var(--rule);
  text-underline-offset:2px}
.pi-facts-more{display:block;font-family:var(--sans);font-size:var(--t-xs);color:var(--steel);margin-top:2px}
.pi-gaps{margin:var(--s-1) 0 0;font-size:var(--t-sm);color:var(--steel);line-height:1.5}
.pi-in{margin:var(--s-1) 0 0;font-size:var(--t-sm)}
.pi-in a{text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px}

/* Своя позиция в списке запроса и текстовые действия панели. */
.rfq-own{display:flex;gap:var(--s-1);align-items:center;flex-wrap:wrap;
  padding:12px 0 0;margin-top:12px;border-top:1px dashed var(--rule)}
.rfq-own input[type=text]{flex:1 1 260px;min-width:0;padding:9px 12px;border:1px solid var(--rule);
  border-radius:2px;font:inherit;background:var(--card)}
.rfq-own input[type=number]{width:74px;padding:9px 10px;border:1px solid var(--rule);border-radius:2px;
  font-family:var(--mono);text-align:center;background:var(--card)}
.linkish{background:none;border:0;padding:0 0 0 var(--s-1);cursor:pointer;color:inherit;
  font:inherit;font-size:var(--t-xs);opacity:.75;text-decoration:underline}
.linkish:hover{opacity:1}

/* Сводная таблица подборки: числа столбиком сравнивают по правому краю. */
.cmp td+td{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.cmp thead th+th{text-align:right}

/* Цифры в колонках должны выстраиваться по разряду, а лигатуры моношрифта
   ломают «≤», «<» и «>» — их 183 только со знаком «≤». */
.mono,.card-model,.spec dd,.pi-facts dd,.ab-stat b,.cmp td{
  font-variant-numeric:tabular-nums;font-variant-ligatures:none}

/* По каким параметрам различают позиции раздела — подсказка перед выдачей. */
.compare-by{margin-top:var(--s-1);font-family:var(--mono);font-size:var(--t-xs);
  color:var(--steel);letter-spacing:.02em}
/* Порядок поставки над формой: четыре тёмные плашки на бумажной странице
   читались как реклама — оставляем только нумерацию и волосяные разделители. */
.flow{display:flex;flex-wrap:wrap;list-style:none;margin:0 0 var(--s-4);padding:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.flow li{display:flex;align-items:baseline;gap:var(--s-1);padding:14px var(--s-3) 14px 0;
  margin-right:var(--s-3);font-size:var(--t-sm);color:var(--muted);
  border-right:1px solid var(--rule-soft)}
.flow li:last-child{border-right:0;margin-right:0;padding-right:0}
.flow .n{font-family:var(--sans);font-size:var(--t-xs);font-weight:600;color:var(--brass-ink);
  display:block;margin-bottom:3px}
.flow li{flex-direction:column;align-items:flex-start;gap:0}
@media(max-width:760px){
  .flow li{border-right:0;padding:8px 0;margin-right:0;flex:1 1 100%}
}
.rfq-task{margin:var(--s-2) 0;padding-top:var(--s-2);border-top:1px solid var(--rule-soft)}
.rfq-task summary{cursor:pointer;font-size:var(--t-sm);color:var(--navy)}
.rfq-task textarea{width:100%;margin-top:var(--s-1);padding:10px 12px;border:1px solid var(--rule);
  border-radius:2px;font:inherit;background:var(--card)}

/* ===== справочник на странице тепловизоров ===== */
.tg{margin:0 0 var(--s-6);border-top:1px solid var(--rule);padding-top:var(--s-5)}
.tg-head{max-width:var(--measure);margin:0 0 var(--s-4)}
.tg-head h2{font-size:clamp(var(--t-xl),3vw,var(--t-2xl));font-weight:700;line-height:1.2;
  margin:0 0 var(--s-2);letter-spacing:-.01em}
.tg-head p{color:var(--muted);font-size:var(--t-md);line-height:1.7;margin:0}

.tg-toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));
  gap:1px;background:var(--rule);border:1px solid var(--rule);margin:0 0 var(--s-6)}
.tg-toc-p{background:var(--paper);padding:var(--s-3)}
.tg-toc-h{display:flex;gap:8px;font-family:var(--sans);font-weight:600;font-size:var(--t-sm);
  color:var(--ink);text-decoration:none;line-height:1.35;margin-bottom:var(--s-2)}
.tg-toc-h:hover{color:var(--navy);text-decoration:underline;text-underline-offset:3px}
.tg-toc-h i{font-family:var(--mono);font-style:normal;font-size:var(--t-2xs);color:var(--brass);
  padding-top:2px}
.tg-toc ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.tg-toc li a{font-size:var(--t-xs);color:var(--muted);text-decoration:none;line-height:1.4;
  display:block;border-left:1px solid var(--rule);padding-left:10px}
.tg-toc li a:hover{color:var(--ink);border-left-color:var(--brass)}

.tg-part{margin:0 0 var(--s-6);scroll-margin-top:var(--s-3)}
.tg-part-h{max-width:var(--measure);margin:0 0 var(--s-4);padding-top:var(--s-3);
  border-top:2px solid var(--ink)}
.tg-part-h i{font-family:var(--sans);font-style:normal;font-size:var(--t-sm);font-weight:500;
  color:var(--steel);display:block;margin-bottom:8px}
.tg-part-h h3{font-size:var(--t-xl);font-weight:700;line-height:1.25;margin:0 0 var(--s-1);
  letter-spacing:-.01em}
.tg-part-h p{color:var(--steel);font-size:var(--t-sm);line-height:1.6;margin:0}

.tg-b{margin:0 0 var(--s-4);scroll-margin-top:var(--s-3)}
.tg-b h4{font-size:var(--t-md);font-weight:700;line-height:1.35;margin:0 0 var(--s-2);
  max-width:var(--measure)}
.tg-b p{max-width:var(--measure);color:var(--muted);font-size:var(--t-base);line-height:1.8;
  margin:0 0 var(--s-2)}
.tg-link{font-family:var(--mono);font-size:var(--t-xs);color:var(--rule);text-decoration:none;
  vertical-align:2px}
.tg-b:hover .tg-link{color:var(--brass)}
.tg-link:hover{color:var(--ink)}

.tg-tw{overflow-x:auto;border:1px solid var(--rule);margin:var(--s-2) 0 var(--s-3);
  background:var(--card)}
.tg-t{border-collapse:collapse;width:100%;min-width:520px;font-size:var(--t-sm)}
.tg-t th{text-align:left;font-size:var(--t-xs);color:var(--muted);font-weight:600;padding:10px 12px;
  border-bottom:1px solid var(--rule);vertical-align:bottom;white-space:nowrap}
.tg-t td{padding:9px 12px;border-bottom:1px solid var(--rule-soft);color:var(--muted);
  line-height:1.5;vertical-align:top}
.tg-t td:first-child{color:var(--ink);font-weight:600;white-space:nowrap}
.tg-t td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tg-t tbody tr:last-child td{border-bottom:0}
.tg-t tbody tr:hover td{background:var(--well)}
@media(max-width:640px){
  .tg-toc-p{padding:var(--s-2)}
  .tg-t td:first-child{white-space:normal;min-width:140px}
}
.th-jump{margin:var(--s-2) 0 0}
.th-jump a{font-size:var(--t-sm);color:var(--navy);text-decoration:none;
  border-bottom:1px solid var(--brass);padding-bottom:2px}
.th-jump a:hover{color:var(--ink)}
.tg-up{margin:0}
.tg-up a{font-size:var(--t-sm);color:var(--steel);text-decoration:none}
.tg-up a:hover{color:var(--ink)}

/* ===== первый экран главной ===== */
.home-hero h1{font-size:clamp(var(--t-2xl),4.2vw,var(--t-4xl));line-height:1.1;font-weight:700;
  letter-spacing:-.02em;max-width:20ch;margin:0 0 var(--s-2);color:var(--ink)}
.home-lede{max-width:var(--measure);font-size:var(--t-md);line-height:1.7;margin:0 0 var(--s-3)}
.home-cta{display:flex;gap:var(--s-1);flex-wrap:wrap;margin-bottom:var(--s-5)}
.trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;
  background:var(--rule);border:1px solid var(--rule);margin:0}
.trust-i{background:var(--paper);padding:var(--s-3)}
.trust-i dt{font-weight:600;color:var(--ink);font-size:var(--t-base);margin-bottom:6px;line-height:1.35}
.trust-i dd{margin:0;font-size:var(--t-sm);line-height:1.6;color:var(--muted)}

/* ===== плитки задач ===== */
.tasks{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.task{display:flex;flex-direction:column;gap:5px;padding:var(--s-3);background:var(--card);
  border:1px solid var(--rule);border-radius:2px;text-decoration:none;
  transition:border-color .14s,transform .14s}
.task:hover{border-color:var(--brass);transform:translateY(-2px)}
.task-n{font-family:var(--mono);font-size:var(--t-xs);color:var(--brass-ink)}
.task-t{font-family:var(--sans);font-weight:600;font-size:var(--t-md);color:var(--ink);line-height:1.3}
.task-s{font-size:var(--t-sm);color:var(--muted);line-height:1.5;
  display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ===== сравнение ===== */
.card-cmp{padding:0 18px 14px}
.cmp-btn{appearance:none;font:inherit;font-size:var(--t-xs);cursor:pointer;background:transparent;
  border:1px solid var(--rule);border-radius:2px;padding:5px 10px;color:var(--muted)}
.cmp-btn:hover{border-color:var(--brass);color:var(--ink)}
.cmp-btn[aria-pressed="true"]{border-color:var(--brass);color:var(--brass-ink);font-weight:600}
/* Две нижние полосы не должны налезать друг на друга: сравнение встаёт над запросом. */
.cmp-bar{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--paper);
  border-top:1px solid var(--brass)}
body.has-rfq .cmp-bar{bottom:58px}
body.has-cmp-bar.has-rfq{padding-bottom:122px}
.cmp-bar-row{display:flex;align-items:center;gap:var(--s-2);padding:11px var(--pad);flex-wrap:nowrap}
.cmp-bar-n{font-weight:600;color:var(--ink);font-size:var(--t-sm);white-space:nowrap}
.cmp-bar-list{font-family:var(--mono);font-size:var(--t-xs);color:var(--muted);flex:1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.has-cmp-bar{padding-bottom:64px}
.cmp-full th,.cmp-full td{vertical-align:top}
.cmp-full thead th{background:var(--paper-2);min-width:190px}
.cmp-corner{min-width:200px;color:var(--muted);font-weight:500}
.cmp-photo{display:flex;align-items:center;justify-content:center;height:110px;background:var(--photo-bg);
  border:1px solid var(--rule);margin-bottom:9px;padding:8px;filter:brightness(var(--photo-dim))}
.cmp-photo img{max-height:100%;width:auto;object-fit:contain}
.cmp-name{display:block;font-weight:600;color:var(--ink);line-height:1.3;margin-bottom:3px}
.cmp-full .cmp-brand{display:block;font-size:var(--t-xs);color:var(--steel);font-weight:400;margin-bottom:7px}
.cmp-drop{appearance:none;font:inherit;font-size:var(--t-xs);cursor:pointer;background:transparent;
  border:0;padding:0;color:var(--steel);text-decoration:underline}
.cmp-drop:hover{color:var(--alarm)}
.cmp-full tbody th{font-weight:400;color:var(--muted);font-size:var(--t-sm)}
.cmp-full tr.diff th{color:var(--ink);font-weight:600;border-left:2px solid var(--brass);padding-left:14px}
.cmp-none{color:var(--steel-2)}