/* ==========================================================================
   «Стрежень» — стили. Главные цвета и шрифты — в :root ниже.
   ========================================================================== */
:root{
  --paper:#EEF0EF; --white:#FFFFFF; --line:#D8DCDB; --line-2:#E6E9E8;
  --ink:#1C2226; --ink-2:#56626A; --ink-3:#6E7A83;
  --steel:#46606F; --blue:#1F6FB2; --blue-d:#175A93; --blue-l:#E3EEF8; --sky:#7FB3E0;
  --ok:#2E7D4F; --ok-l:#E2F1E7; --wait:#8A6A12; --wait-l:#F6EED4; --err:#B3261E;
  --sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cond:"IBM Plex Sans Condensed", "IBM Plex Sans", "Arial Narrow", sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --r:6px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lock{overflow:hidden}
body{background:var(--paper);color:var(--ink);font:400 15px/1.5 var(--sans);overflow-x:hidden;min-width:320px}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{border:0;background:none;cursor:pointer}
fieldset{border:0;min-width:0}
legend{padding:0}
:focus-visible{outline:2.5px solid var(--blue);outline-offset:2px;border-radius:3px}
[hidden]{display:none!important}
.wrap{width:min(1344px, 100% - 64px);margin-inline:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-80px;min-height:44px;display:flex;align-items:center;z-index:100;background:var(--ink);color:#fff;padding:10px 16px;border-radius:var(--r)}
.skip:focus{top:12px}

/* ---------- верхняя полоса ---------- */
.util{background:var(--ink);color:#B7C1C7;font-size:13px}
.util-in{display:flex;align-items:center;gap:28px;height:36px}
.util-in>span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.util-in svg{color:var(--sky);flex:none}
.util-r{margin-left:auto;gap:24px!important;color:#fff;font-family:var(--mono);font-size:12.5px}
.util-r a:hover{color:var(--sky)}

/* ---------- шапка ---------- */
.head{background:var(--white);border-bottom:1px solid var(--line);position:relative;z-index:20}
.head-in{display:flex;align-items:center;gap:18px;height:78px}
.logo{display:flex;align-items:center;gap:12px;margin-right:12px;flex:none}
.logo svg{flex:none}
.logo span{display:flex;flex-direction:column;line-height:1}
.logo b{font:700 25px/1 var(--cond);text-transform:uppercase;letter-spacing:.04em}
.logo small{font-size:11.5px;color:var(--ink-3);margin-top:5px;letter-spacing:.02em}
.cat-btn{display:flex;align-items:center;gap:10px;height:46px;padding:0 20px;background:var(--ink);color:#fff;border-radius:var(--r);font-weight:600;font-size:15px;flex:none}
.cat-btn[aria-expanded="true"]{background:var(--blue)}
.search{flex:1;display:flex;align-items:center;gap:10px;height:46px;padding:0 6px 0 16px;border:1.5px solid var(--ink);border-radius:var(--r);min-width:0;background:var(--white)}
.search:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-l)}
.search svg{flex:none;color:var(--ink)}
.search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;font-size:14.5px}
.search input::placeholder{color:var(--ink-3)}
.search input::-webkit-search-cancel-button{display:none}
.search-x{display:grid;place-items:center;width:36px;height:36px;border-radius:var(--r);color:var(--ink-2)}
.search-x:hover{background:var(--paper)}
.head-act{display:flex;align-items:center;gap:14px;margin-left:4px}
.ha{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:56px;height:52px;font-size:12px;color:var(--ink-2);position:relative;border-radius:var(--r)}
.ha:hover{background:var(--paper)}
.ha svg{color:var(--ink)}
.cnt{position:absolute;top:0;left:calc(50% + 4px);min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:var(--blue);color:#fff;font:600 11px/18px var(--mono);font-style:normal;text-align:center}
.burger{display:none}
.cats{display:flex;justify-content:space-between;gap:16px;height:46px;align-items:stretch;position:relative}
.cats-c,.cats-l{display:flex;gap:4px}
.cats a{display:flex;align-items:center;padding:0 14px;font-size:14px;font-weight:500;color:var(--ink-2);border-bottom:2.5px solid transparent;white-space:nowrap}
.cats a:hover{color:var(--ink)}
.cats a.on{color:var(--ink);border-bottom-color:var(--blue)}
.cats-l a{color:var(--ink-3);font-weight:400}

/* выпадающее меню «Каталог» */
.cat-menu{position:absolute;left:0;right:0;top:100%;background:var(--white);border-bottom:1px solid var(--line);box-shadow:0 18px 40px rgba(28,34,38,.14)}
.cat-menu-in{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:20px 0 24px}
.cm-tile,.cm-all{display:flex;align-items:center;gap:14px;padding:10px;border:1px solid var(--line);border-radius:8px;min-height:116px}
.cm-tile:hover,.cm-all:hover{border-color:var(--blue);background:var(--blue-l)}
.cm-tile img{width:96px;height:96px;object-fit:cover;border-radius:5px;background:#E6E6E6;flex:none}
.cm-tile b,.cm-all b{display:block;font:600 17px/1.2 var(--cond)}
.cm-tile small,.cm-all small{display:block;color:var(--ink-2);font-size:13px;margin-top:6px}
.cm-all{justify-content:flex-start;padding-left:20px;background:var(--paper)}
.cm-all svg{flex:none}
.cm-tile>svg{flex:none;margin-left:auto;color:var(--ink-3)}
.cm-tile:hover>svg{color:var(--blue)}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--r);font-weight:600;font-size:14.5px;white-space:nowrap;border:1.5px solid transparent;transition:background-color .15s,border-color .15s,color .15s}
.btn svg{flex:none}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2C363C}
.btn-blue{background:var(--blue);color:#fff}
.btn-blue:hover{background:var(--blue-d)}
.btn-line{border-color:var(--ink);background:var(--white)}
.btn-line:hover{background:var(--paper)}
.btn-wide{width:100%}
.ic-btn{display:inline-grid;place-items:center;width:42px;height:42px;border:1.5px solid var(--line);border-radius:var(--r);color:var(--ink-2);background:var(--white);flex:none}
.ic-btn:hover{border-color:var(--ink);color:var(--ink)}
.ic-btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}

/* ---------- заголовок раздела ---------- */
.page-head{padding:22px 0 20px}
.crumbs{font-size:13px;color:var(--ink-3);display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}
.crumbs a{color:var(--ink-2)}
.crumbs a:hover{color:var(--blue)}
.ph-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px}
.ph-row>div:first-child{flex:1 1 380px;min-width:0}
h1{font:600 38px/1.08 var(--cond);letter-spacing:-.005em}
.ph-sub{margin-top:8px;color:var(--ink-2);font-size:15px}
.ph-sub b{color:var(--ok);font-weight:600}
.ph-act{display:flex;gap:10px;flex:none}

/* ---------- каталог: колонка фильтров ---------- */
.catalog{display:grid;grid-template-columns:272px minmax(0,1fr);gap:24px;align-items:start;padding-bottom:64px}
.filters{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:18px 18px 20px}
.f-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px;gap:8px}
.f-title{font:600 18px/1 var(--cond);text-transform:uppercase;letter-spacing:.04em}
.f-reset{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--blue);height:32px;padding:0 4px;border-radius:4px}
.f-reset:hover{text-decoration:underline}
.f-close{display:none}
.fg{padding:14px 0;border-bottom:1px solid var(--line-2)}
.fg:last-child{border-bottom:0}
.fl{font-size:13px;font-weight:600;margin-bottom:10px;float:left;width:100%}
.fl+*{clear:both}
.ck,.tg,.chip,.seg label{position:relative;cursor:pointer}
.ck input,.tg input,.chip input,.seg input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.ck{display:flex;align-items:center;gap:10px;font-size:14px;padding:5px 0;color:var(--ink)}
.ck i{width:18px;height:18px;border:1.5px solid #9AA4AA;border-radius:4px;flex:none;background:var(--white)}
.ck input:checked+i{background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.5 9.5l3 3 6-7' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/100%;border-color:var(--blue)}
.ck input:focus-visible+i,.tg input:focus-visible+i{outline:2.5px solid var(--blue);outline-offset:2px}
.ck em,.tg em{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:12.5px;color:var(--ink-3)}
.ck.zero,.tg.zero,.chip.zero{opacity:.45}
.rng{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rng label{display:flex;align-items:center;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:5px;background:var(--white)}
.rng label:focus-within{border-color:var(--blue)}
.rng span{color:var(--ink-3);font-size:12px;margin-right:6px}
.rng input{width:100%;min-width:0;border:0;outline:0;background:none;font-family:var(--mono);font-size:14px;-moz-appearance:textfield;appearance:textfield}
.rng input::-webkit-inner-spin-button,.rng input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.slider{position:relative;height:28px;margin:6px 8px 0}
.slider::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-2px;background:var(--line);border-radius:2px}
.slider i{position:absolute;top:50%;height:4px;margin-top:-2px;background:var(--blue);border-radius:2px}
.slider input{position:absolute;left:-9px;width:calc(100% + 18px);top:0;height:100%;margin:0;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}
.slider input::-webkit-slider-runnable-track{background:none;border:0;height:100%}
.slider input::-moz-range-track{background:none;border:0}
.slider input::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:20px;height:20px;border-radius:50%;background:#fff;border:2px solid var(--blue);cursor:grab;margin-top:calc((28px - 20px) / 2)}
.slider input::-moz-range-thumb{pointer-events:auto;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--blue);cursor:grab}
.slider input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--blue-l)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip span{min-width:44px;height:34px;display:grid;place-items:center;padding:0 10px;border:1px solid var(--line);border-radius:5px;font-family:var(--mono);font-size:13.5px;background:var(--white)}
.chip input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.chip input:focus-visible+span{outline:2.5px solid var(--blue);outline-offset:2px}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--line);border-radius:var(--r);padding:3px;gap:3px}
.seg span{height:32px;display:grid;place-items:center;padding:0 8px;font-size:13px;border-radius:4px;font-family:var(--mono);white-space:nowrap}
.seg input:checked+span{background:var(--ink);color:#fff}
.seg input:focus-visible+span{outline:2.5px solid var(--blue)}
.tg{display:flex;align-items:center;gap:10px;font-size:14px}
.tg i{width:36px;height:20px;border-radius:10px;background:var(--line);position:relative;flex:none;transition:background-color .15s}
.tg i::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
.tg input:checked+i{background:var(--blue)}
.tg input:checked+i::after{transform:translateX(16px)}
.f-foot{margin-top:16px}

/* ---------- каталог: панель над списком ---------- */
.list{min-width:0}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;min-height:36px}
.f-open{display:none}
.f-open i{font-style:normal;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--blue);font:600 12px/22px var(--mono)}
.active{display:flex;gap:8px;flex-wrap:wrap;min-width:0}
.pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 10px 0 12px;background:var(--white);border:1px solid var(--line);border-radius:5px;font-size:13px;white-space:nowrap}
.pill svg{color:var(--ink-3)}
.pill:hover{border-color:var(--ink)}
.pill-all{color:var(--blue);border-style:dashed;gap:6px;padding-left:10px}
.pill-all svg{color:var(--blue)}
.sort{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink-2);white-space:nowrap;flex:none}
.sel{position:relative;display:inline-flex;align-items:center}
.sel select{appearance:none;-webkit-appearance:none;border:1px solid var(--line);background:var(--white);border-radius:5px;height:36px;padding:0 30px 0 10px;font-weight:600;font-size:13.5px;color:var(--ink);cursor:pointer}
.sel svg{position:absolute;right:9px;pointer-events:none;color:var(--ink-2)}
.view{display:flex;gap:2px;margin-left:6px;border:1px solid var(--line);border-radius:5px;padding:3px;background:var(--white)}
.view button{width:30px;height:28px;display:grid;place-items:center;border-radius:3px;color:var(--ink-3)}
.view button[aria-pressed="true"]{background:var(--ink);color:#fff}

/* ---------- карточки: плитка ---------- */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:14px 16px 16px;display:flex;flex-direction:column;transition:border-color .15s, box-shadow .15s}
.card:hover{border-color:#B9C1C5;box-shadow:0 6px 20px rgba(28,34,38,.07)}
.pic{position:relative;display:block;aspect-ratio:1/0.9;margin:-2px -4px 12px;background:#E6E6E6;border-radius:5px;overflow:hidden}
.pic img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.card:hover .pic img{transform:scale(1.03)}
.stock{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 10px;border-radius:4px;background:var(--ok-l);color:var(--ok);font-size:12.5px;font-weight:600;white-space:nowrap}
.stock::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.stock i{font-style:normal;font-weight:500}
.stock.wait{background:var(--wait-l);color:var(--wait)}
.pic .stock{position:absolute;left:10px;top:10px}
.c-stock{display:none}
.c-main{display:flex;flex-direction:column;flex:1}
.type{font-size:12.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.card h3{font:500 21px/1.2 var(--mono);letter-spacing:-.02em;margin:3px 0 12px}
.card h3 a{display:block}
.card h3 a:hover{color:var(--blue)}
.spec{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line-2);margin-top:auto}
.spec div{display:flex;align-items:baseline;gap:8px;padding:7px 0;border-bottom:1px solid var(--line-2);min-width:0}
.spec div:nth-child(2n){padding-left:12px;border-left:1px solid var(--line-2)}
.spec dt{font:500 13px/1 var(--mono);color:var(--ink-3);min-width:18px}
.spec dd{font:500 14px/1.2 var(--mono);white-space:nowrap}
.buy{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.buy-b{display:flex;gap:6px;flex:none;margin-left:auto}
.price{font:600 21px/1.1 var(--cond);letter-spacing:.005em;white-space:nowrap}
.price small{display:block;font:400 12px var(--sans);color:var(--ink-3);margin-top:3px}
.price.req{font-size:17px}
.card .btn{min-height:42px;height:42px;padding:0 12px;font-size:14px;gap:6px}
.btn.add.on{background:var(--ok-l);color:var(--ok);border-color:#BBDCC7}
.btn.add.on:hover{background:#D3EADB}

/* ---------- карточки: список ---------- */
.grid.is-list{grid-template-columns:minmax(0,1fr);gap:10px}
.is-list .card{display:grid;grid-template-columns:150px minmax(0,1fr) auto;column-gap:22px;align-items:center;padding:12px 18px 12px 12px}
.is-list .pic{margin:0;aspect-ratio:1/1;width:150px}
.is-list .pic .stock{display:none}
.is-list .c-stock{display:block;margin:-4px 0 10px}
.is-list .card h3{margin:2px 0 8px}
.is-list .spec{grid-template-columns:repeat(4,minmax(0,1fr));border-top:0;margin-top:0}
.is-list .spec div{border-bottom:0;padding:4px 12px 4px 0}
.is-list .spec div:nth-child(2n){padding-left:0;border-left:0}
.is-list .spec div+div{padding-left:12px;border-left:1px solid var(--line-2)}
.is-list .buy{flex-direction:column;align-items:flex-end;margin:0;gap:12px;text-align:right}

.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:48px 24px;background:var(--white);border:1px dashed #B9C1C5;border-radius:8px;color:var(--ink-2)}
.empty svg{color:var(--ink-3)}
.empty b{display:block;color:var(--ink);font:600 22px/1.2 var(--cond);margin-bottom:6px}
.empty-b{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.more{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px}
.shown{color:var(--ink-3);font-size:13.5px;font-family:var(--mono)}

/* ---------- тёмный блок: доставка и документы ---------- */
.kicker{font:600 13px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--blue);margin-bottom:12px}
h2{font:600 32px/1.12 var(--cond)}
.muted{color:var(--ink-2);margin-top:10px}
.band{background:var(--ink);color:#fff;padding:72px 0}
.band-in{display:grid;grid-template-columns:1fr 1fr;gap:72px}
.band .kicker{color:var(--sky)}
.band .muted{color:#A9B5BC}
.days{list-style:none;margin-top:26px;border-top:1px solid #34404A}
.days li{display:grid;grid-template-columns:minmax(0,200px) 1fr 92px;align-items:center;gap:16px;padding:11px 0;border-bottom:1px solid #34404A;font-size:14.5px}
.days i{height:8px;border-radius:1px;background:repeating-linear-gradient(90deg,var(--sky) 0 6px,transparent 6px 8px);width:calc(var(--d) / 14 * 100%);min-width:8px}
.days b{font:500 14px var(--mono);text-align:right;color:#DCE6EC}
.docs ul{list-style:none;margin-top:26px;border-top:1px solid #34404A}
.docs li{border-bottom:1px solid #34404A}
.doc{display:flex;align-items:center;gap:16px;padding:13px 4px 13px 0;min-height:56px}
.doc:hover .doc-t b{color:var(--sky)}
.doc-t{flex:1;min-width:0}
.doc-t b{display:block;font-weight:500;font-size:15px}
.doc-t small{color:#A9B5BC;font-size:13px}
.doc svg{color:var(--sky);flex:none}
.ft{flex:none;width:52px;height:30px;display:grid;place-items:center;border:1px solid #4A5864;border-radius:4px;font:500 12px var(--mono);color:#F08A7B}
.ft-dwg{color:var(--sky)}.ft-xlsx,.ft-xls{color:#6FC28F}

/* ---------- подбор с инженером, формы ---------- */
.pick{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;padding:72px 0}
.pick-pts{list-style:none;margin-top:24px;display:flex;flex-direction:column;gap:10px}
.pick-pts li{display:flex;gap:12px;align-items:center;font-size:15.5px}
.pick-pts li::before{content:"";width:20px;height:2px;background:var(--blue);flex:none}
.pick-c{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.pick-f{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:14px;align-self:start}
.fld{display:flex;flex-direction:column;gap:6px;min-width:0}
.fld>span{font-size:13px;color:var(--ink-2)}
.fld>span i{color:var(--err);font-style:normal}
.fld input,.fld textarea{font-size:15px;color:var(--ink);border:1px solid var(--line);border-radius:5px;padding:11px 12px;background:#FAFBFA;resize:vertical;min-width:0;width:100%;min-height:44px}
.fld input:focus,.fld textarea:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-l);background:#fff}
[aria-invalid="true"]{border-color:var(--err)!important}
.err{color:var(--err);font-size:13px;margin-top:-2px}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.consent{position:relative;display:flex;align-items:flex-start;gap:10px;font-size:13px;color:var(--ink-2);cursor:pointer;line-height:1.45}
.consent input{position:absolute;opacity:0;width:1px;height:1px}
.consent i{width:20px;height:20px;border:1.5px solid #9AA4AA;border-radius:4px;flex:none;background:#fff;margin-top:-1px}
.consent input:checked+i{background:var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M4.5 9.5l3 3 6-7' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E") center/100%;border-color:var(--blue)}
.consent input:focus-visible+i{outline:2.5px solid var(--blue);outline-offset:2px}
.consent input[aria-invalid="true"]+i{border-color:var(--err)}
.consent a{color:var(--blue);text-decoration:underline}
.f-bot{display:flex;align-items:center;gap:16px;font-size:13.5px;color:var(--ink-2)}
.f-bot a{color:var(--blue);text-decoration:underline}
.sent{border:1px solid #BBDCC7;background:#F3FAF5;border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--ink-2)}
.s-h{display:flex;align-items:center;gap:8px;color:var(--ok)}
.s-h b{font:600 18px/1.2 var(--cond);color:var(--ink)}
.s-btns{display:flex;flex-wrap:wrap;gap:8px}
.s-btns .btn{padding:0 14px}

/* ---------- подвал ---------- */
.foot{background:var(--white);border-top:1px solid var(--line);padding:40px 0 48px}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;font-size:14px}
.foot-in>div{display:flex;flex-direction:column;gap:8px}
.foot-in>div>div{display:flex;flex-direction:column;gap:8px}
.f-logo{font:700 22px/1 var(--cond);text-transform:uppercase;letter-spacing:.04em}
.foot p{color:var(--ink-2)}
.fh{font:600 13px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink)!important;margin-bottom:4px}
.foot a{color:var(--ink-2)}
.foot a:hover{color:var(--blue)}
.foot-co a{text-decoration:underline;font-size:13px}

/* ---------- шторки (меню, запрос, сравнение) ---------- */
.overlay{position:fixed;inset:0;background:rgba(18,23,26,.48);z-index:60;opacity:0;transition:opacity .25s}
.overlay.open{opacity:1}
.sheet{position:fixed;z-index:70;background:var(--white);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(18,23,26,.25)}
.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 22px;border-bottom:1px solid var(--line);flex:none}
.sheet-head b{font:600 21px/1.2 var(--cond)}
.sheet-x{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r);color:var(--ink)}
.sheet-x:hover{background:var(--paper)}
.sheet-body{overflow-y:auto;overscroll-behavior:contain;padding:18px 22px 28px;flex:1}
.drawer,.menu{top:0;right:0;bottom:0;width:min(460px,100%);transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.drawer.open,.menu.open{transform:none}
.modal{left:50%;top:50%;width:min(1000px,calc(100% - 48px));max-height:calc(100% - 64px);border-radius:10px;transform:translate(-50%,-46%);opacity:0;transition:transform .25s,opacity .25s}
.modal.open{transform:translate(-50%,-50%);opacity:1}

/* меню */
.m-h{font:600 13px/1 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);margin:18px 0 6px}
.m-h:first-child{margin-top:0}
.m-cats a,.m-links a{display:flex;align-items:center;justify-content:space-between;min-height:48px;border-bottom:1px solid var(--line-2);font-size:16px;font-weight:500}
.m-cats a.on{color:var(--blue)}
.m-cats em{font-style:normal;font-family:var(--mono);font-size:14px;color:var(--ink-3)}
.m-contacts{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.m-contacts .btn{padding:0 10px;font-size:14px}
.m-contacts .btn:first-child,.m-contacts .btn:last-child{grid-column:1/-1}
.m-note{margin-top:14px;font-size:14px;color:var(--ink-2)}

/* корзина запроса */
.r-list{list-style:none;border-top:1px solid var(--line-2)}
.r-item{display:grid;grid-template-columns:64px minmax(0,1fr);gap:4px 12px;padding:12px 0;border-bottom:1px solid var(--line-2)}
.r-item img{width:64px;height:64px;object-fit:cover;border-radius:5px;background:#E6E6E6;grid-row:1/3}
.r-i{display:flex;flex-direction:column;gap:2px;min-width:0}
.r-name{font:500 16px/1.25 var(--mono);letter-spacing:-.02em}
.r-name:hover{color:var(--blue)}
.r-meta{font-size:13px;color:var(--ink-3)}
.r-price{font-size:14px;color:var(--ink-2)}
.r-price b{color:var(--ink)}
.r-c{display:flex;align-items:center;justify-content:space-between;gap:8px;grid-column:2}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:var(--r);background:var(--white)}
.qty button{width:40px;height:40px;display:grid;place-items:center;color:var(--ink-2)}
.qty button:hover{color:var(--ink);background:var(--paper)}
.qty input{width:48px;height:40px;border:0;border-inline:1px solid var(--line);text-align:center;font-family:var(--mono);font-size:15px;-moz-appearance:textfield;appearance:textfield;background:none}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.r-total{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 12px;padding:14px 0 6px}
.r-total span{color:var(--ink-2);font-size:14px}
.r-total b{font:600 24px/1.1 var(--cond)}
.r-total small{flex-basis:100%;color:var(--ink-3);font-size:13px}
.r-form{display:flex;flex-direction:column;gap:12px;margin-top:14px;padding-top:16px;border-top:1px solid var(--line)}
.r-h{font:600 18px/1.2 var(--cond)}
.r-answer{font-size:13px;color:var(--ink-3);text-align:center;margin-top:-4px}
.r-clear{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;color:var(--ink-3);font-size:14px;align-self:center;padding:0 12px}
.r-clear:hover{color:var(--err)}
.r-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:36px 8px;color:var(--ink-2)}
.r-empty svg{color:var(--ink-3)}
.r-empty b{display:block;color:var(--ink);font:600 21px/1.2 var(--cond);margin-bottom:6px}

/* сравнение */
.cmp-note{font-size:13.5px;color:var(--ink-3);margin-bottom:12px}
.cmp-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:8px}
.cmp{border-collapse:collapse;width:100%;min-width:calc(190px + var(--n, 2) * 150px);font-size:14px}
.cmp th,.cmp td{padding:10px 12px;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:top}
.cmp tbody th{font-weight:500;color:var(--ink-2);width:190px;background:#FAFBFA}
.cmp td{font-family:var(--mono);font-size:13.5px}
.cmp tr.diff td{background:#FBF6E6}
.cmp thead th{vertical-align:bottom}
.cmp-p{position:relative;display:flex;flex-direction:column;gap:8px;min-width:130px}
.cmp-p a{display:flex;flex-direction:column;gap:8px;font:500 15px/1.2 var(--mono)}
.cmp-p img{width:96px;height:96px;object-fit:cover;border-radius:5px;background:#E6E6E6}
.cmp-p .ic-btn{position:absolute;top:0;right:0;width:36px;height:36px}
.cmp tfoot td{border-bottom:0}
.cmp tfoot .btn{min-height:40px;padding:0 12px;font-size:13.5px}

/* всплывающая подсказка */
.toast{position:fixed;left:50%;bottom:24px;z-index:80;display:flex;align-items:center;gap:16px;max-width:calc(100% - 32px);padding:10px 10px 10px 18px;background:var(--ink);color:#fff;border-radius:8px;box-shadow:0 12px 32px rgba(18,23,26,.3);transform:translate(-50%,140%);opacity:0;transition:transform .25s,opacity .25s;pointer-events:none;font-size:14px}
.toast.show{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.toast p{min-height:24px;display:flex;align-items:center}
.toast .btn{min-height:40px;padding:0 14px;font-size:14px}
.toast .btn-line{background:transparent;color:#fff;border-color:#5B6870}

/* ---------- карточка товара ---------- */
.p-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:start;padding-bottom:56px}
.p-pic{position:relative;background:#E6E6E6;border-radius:8px;overflow:hidden;border:1px solid var(--line)}
.p-pic img{width:100%;aspect-ratio:1/1;object-fit:cover}
.p-pic .stock{position:absolute;left:14px;top:14px;height:30px;font-size:14px}
.p-info{display:flex;flex-direction:column;gap:16px}
.p-info .type{font-size:13px}
.p-info h1{font:500 40px/1.1 var(--mono);letter-spacing:-.03em;margin-top:-8px}
.p-art{font-family:var(--mono);font-size:13.5px;color:var(--ink-3)}
.p-key{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:8px;background:var(--white)}
.p-key div{padding:12px 16px;border-bottom:1px solid var(--line-2)}
.p-key div:nth-child(2n){border-left:1px solid var(--line-2)}
.p-key div:nth-last-child(-n+2){border-bottom:0}
.p-key dt{font-size:13px;color:var(--ink-3)}
.p-key dd{font:500 20px/1.3 var(--mono);letter-spacing:-.02em}
.p-buy{background:var(--white);border:1px solid var(--line);border-radius:8px;padding:18px;display:flex;flex-direction:column;gap:14px}
.p-buy .price{font-size:30px}
.p-buy .price.req{font-size:24px}
.p-buy .price small{font-size:13px}
.p-avail{font-size:14px;color:var(--ink-2)}
.p-avail .ok{color:var(--ok)}.p-avail .wait{color:var(--wait)}
.p-act{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.p-act .qty button{width:44px;height:44px}
.p-act .qty input{height:44px}
#pBuy{display:flex;gap:10px;flex-wrap:wrap;flex:1}
#pBuy .btn{flex:1 1 auto}
.p-plus{list-style:none;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:var(--ink-2);border-top:1px solid var(--line-2);padding-top:12px}
.p-plus li{display:flex;align-items:center;gap:8px}
.p-plus li::before{content:"";width:14px;height:2px;background:var(--blue)}
.p-eng{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--blue);min-height:44px}
.p-eng:hover{text-decoration:underline}
.p-sec{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;padding-bottom:64px}
.p-sec h2{font-size:26px;margin-bottom:16px}
.p-text{font-size:16px;color:var(--ink-2);max-width:62ch;margin-bottom:28px}
.spec-t{width:100%;border-collapse:collapse;background:var(--white);border:1px solid var(--line);border-radius:8px;overflow:hidden;font-size:14.5px}
.spec-t th,.spec-t td{padding:11px 16px;border-bottom:1px solid var(--line-2);text-align:left}
.spec-t th{font-weight:400;color:var(--ink-2);width:55%}
.spec-t td{font-family:var(--mono);font-size:14px}
.spec-t tr:last-child th,.spec-t tr:last-child td{border-bottom:0}
.p-docs{list-style:none;background:var(--ink);color:#fff;border-radius:8px;padding:6px 18px}
.p-docs li{border-bottom:1px solid #34404A}
.p-docs li:last-child{border-bottom:0}
.p-ship{margin-top:20px;font-size:14.5px;color:var(--ink-2)}
.p-ship b{color:var(--ink)}
.sim-wrap{padding-bottom:64px}
.sim-wrap h2{font-size:26px;margin-bottom:16px}
.sims{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sim{display:flex;flex-direction:column;gap:4px;background:var(--white);border:1px solid var(--line);border-radius:8px;padding:12px 14px 16px}
.sim:hover{border-color:var(--blue)}
.sim img{aspect-ratio:1/0.85;object-fit:cover;border-radius:5px;background:#E6E6E6;margin-bottom:8px;width:100%}
.sim b{font:500 18px/1.2 var(--mono);letter-spacing:-.02em}
.sim-s{font-family:var(--mono);font-size:13px;color:var(--ink-2)}
.sim-p{display:flex;align-items:center;justify-content:space-between;gap:8px;font:600 18px/1.2 var(--cond);margin-top:6px}
.sim-p svg{color:var(--blue)}
.nf{padding:64px 0 96px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.nf p{max-width:52ch;color:var(--ink-2)}

/* ==========================================================================
   Адаптив
   ========================================================================== */
@media (max-width: 1279px){
  .wrap{width:calc(100% - 48px)}
  .catalog{grid-template-columns:252px minmax(0,1fr);gap:20px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cat-menu-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .util-hours{display:none!important}
  .head-in{gap:14px}
  .cats-l a{padding:0 10px}
  .sims{grid-template-columns:repeat(2,minmax(0,1fr))}
  .is-list .card{grid-template-columns:120px minmax(0,1fr) auto;column-gap:18px}
  .is-list .pic{width:120px}
}

/* планшет и узкий ноутбук: фильтры — шторкой, меню — «бургер» */
@media (max-width: 1023px){
  .util-addr{display:none!important}
  .cat-btn{display:none}
  .head-act{gap:4px}
  .ha{min-width:52px}
  .burger{display:flex}
  .cats{overflow-x:auto;scrollbar-width:none;justify-content:flex-start}
  .cats::-webkit-scrollbar{display:none}
  .cats-l{display:none}
  .cats a{min-height:44px}
  .cat-menu{display:none!important}
  .catalog{grid-template-columns:minmax(0,1fr)}
  .filters{position:fixed;top:0;left:0;bottom:0;z-index:70;width:min(400px,100%);border-radius:0;border:0;padding:0;display:none;flex-direction:column;transform:translateX(-100%);transition:transform .28s cubic-bezier(.2,.7,.2,1);box-shadow:0 20px 60px rgba(18,23,26,.25)}
  .filters.vis{display:flex}
  .filters.open{transform:none}
  .f-head{padding:12px 12px 12px 22px;border-bottom:1px solid var(--line);margin:0}
  .f-title{font-size:21px;margin-right:auto}
  .f-reset{height:44px;padding:0 10px;font-size:14px}
  .f-close{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r)}
  .f-groups{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 22px}
  .f-foot{margin:0;padding:12px 22px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--white)}
  .f-open{display:inline-flex;flex:none}
  .toolbar{flex-wrap:wrap}
  .active{order:3;flex-basis:100%}
  .active:empty{display:none}
  .sort{margin-left:auto}
  .grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
  .band-in{gap:48px}
  .pick{gap:40px}
  .p-main,.p-sec{gap:32px}
}

@media (max-width: 860px){
  .band-in{grid-template-columns:1fr}
  .pick{grid-template-columns:1fr;gap:28px;padding:56px 0}
  .foot-in{grid-template-columns:1fr 1fr}
  .p-main,.p-sec{grid-template-columns:1fr}
  .modal{width:calc(100% - 32px)}
}

/* телефон */
@media (max-width: 760px){
  .wrap{width:calc(100% - 32px)}
  body{font-size:15px}
  .util{display:none}
  .head-in{height:auto;gap:8px 10px;flex-wrap:wrap;padding-top:8px}
  .logo{margin-right:auto;gap:10px}
  .logo b{font-size:21px}
  .logo small{display:none}
  .logo svg{width:34px;height:34px}
  .head-act{gap:2px;margin-left:0}
  .ha{width:44px;min-width:44px;height:44px}
  .ha span{display:none}
  .cnt{top:1px;left:auto;right:0}
  .search{order:5;flex:1 1 100%;height:50px;margin-bottom:10px}
  .logo{min-height:44px}
  .search input{font-size:16px}
  .search-x{width:44px;height:44px}
  .cats a{padding:0 12px;font-size:14px}
  .page-head{padding:12px 0 14px}
  .crumbs{font-size:14px;gap:2px 8px;margin-bottom:4px}
  .crumbs a{min-height:44px;display:inline-flex;align-items:center}
  h1{font-size:28px}
  .ph-sub{font-size:14px}
  .ph-row{flex-direction:column;align-items:stretch;gap:14px}
  .ph-row>div:first-child{flex:none}
  .ph-act{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .ph-act .btn{font-size:14px;padding:0 8px;gap:6px;white-space:normal;text-align:center;line-height:1.2}
  .toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px 8px;margin-bottom:12px}
  .sort{display:contents}
  .sel{grid-column:2;grid-row:1}
  .sel select{width:100%}
  .view{grid-column:3;grid-row:1}
  .active{grid-column:1/-1;grid-row:2}
  .f-open{height:44px;padding:0 14px}
  .sort>label{display:none}
  .sel select{height:44px;font-size:14px}
  .view{margin-left:0;padding:0;gap:0;overflow:hidden}
  .view button{width:44px;height:44px;border-radius:0}
  .active{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px}
  .active::-webkit-scrollbar{display:none}
  .pill{height:44px;font-size:14px;flex:none}
  .grid{grid-template-columns:minmax(0,1fr);gap:10px}
  .type{font-size:14px;letter-spacing:.02em;text-transform:none}
  .stock{font-size:14px;height:28px}
  .spec dt{font-size:14px}
  .spec dd{font-size:14px}
  .price small{font-size:14px}
  .card .btn{min-height:44px;height:44px;font-size:14px}
  .ic-btn{width:44px;height:44px}
  .card h3 a{padding:11px 0;margin:-11px 0;min-height:44px;display:flex;align-items:center}
  /* список на телефоне — компактная карточка */
  .is-list .card{grid-template-columns:96px minmax(0,1fr);column-gap:14px;align-items:start;padding:12px}
  .is-list .c-main{display:contents}
  .is-list .pic{width:96px;height:96px;grid-column:1;grid-row:1/4}
  .is-list .type{grid-column:2;grid-row:1;min-width:0;line-height:1.3}
  .is-list .card h3{grid-column:2;grid-row:2;font-size:18px;margin:0 0 4px;min-width:0}
  .is-list .c-stock{grid-column:2;grid-row:3;margin:0}
  .is-list .spec{grid-column:1/-1;grid-row:4;grid-template-columns:1fr 1fr;margin-top:12px;border-top:1px solid var(--line-2)}
  .is-list .spec div{padding:6px 0;border-bottom:1px solid var(--line-2)}
  .is-list .spec div+div{padding-left:0;border-left:0}
  .is-list .spec div:nth-child(2n){padding-left:10px;border-left:1px solid var(--line-2)}
  .is-list .buy{grid-column:1/-1;grid-row:5;flex-direction:row;align-items:center;margin-top:12px;text-align:left}
  .more{flex-direction:column;gap:10px;align-items:stretch}
  .shown{text-align:center;font-size:14px}
  .band{padding:48px 0}
  .band-in{gap:44px}
  h2{font-size:26px}
  .kicker{font-size:14px}
  .muted{font-size:15px}
  .days li{grid-template-columns:1fr auto;gap:6px 12px}
  .days i{grid-column:1/-1;grid-row:2}
  .doc-t small{font-size:14px}
  .ft{font-size:14px;width:58px}
  .pick{padding:48px 0}
  .pick-pts li{font-size:15px}
  .pick-c .btn{flex:1 1 auto}
  .pick-f{padding:18px}
  .fld>span{font-size:14px}
  .fld input,.fld textarea{font-size:16px}
  .f2{grid-template-columns:1fr}
  .consent{font-size:14px;min-height:44px}
  .f-bot{flex-direction:column;align-items:stretch;font-size:14px}
  .f-bot .btn{width:100%}
  .err{font-size:14px}
  .foot{padding:32px 0 40px}
  .foot-in{grid-template-columns:1fr;gap:20px;font-size:15px}
  .foot-in>div,.foot-in>div>div{gap:0}
  .foot a{min-height:44px;display:flex;align-items:center}
  .foot p{font-size:14px}
  .fh{font-size:14px;margin:4px 0}
  .foot-co a{font-size:14px}
  .ck,.tg{min-height:44px;font-size:15px}
  .ck em,.tg em{font-size:14px}
  .fl{font-size:15px}
  .rng label{height:44px}
  .rng span{font-size:14px}
  .rng input{font-size:16px}
  .slider{height:44px}
  .slider input::-webkit-slider-thumb{width:26px;height:26px;margin-top:calc((44px - 26px) / 2)}
  .slider input::-moz-range-thumb{width:22px;height:22px}
  .chip span{height:44px;min-width:52px;font-size:14px}
  .seg span{height:42px;font-size:14px}
  .seg label{display:block}
  .sheet-body{padding:14px 16px 28px}
  .sheet-head{padding:10px 8px 10px 16px}
  .drawer,.menu{width:100%}
  .modal{inset:auto 0 0 0;width:100%;max-height:92%;border-radius:12px 12px 0 0;transform:translateY(100%);opacity:1;left:0;top:auto}
  .modal.open{transform:none}
  .r-meta,.cmp-note,.r-total small,.r-answer{font-size:14px}
  .r-name{font-size:16px}
  .qty button{width:44px;height:44px}
  .qty input{height:44px;font-size:16px}
  .cmp{font-size:14px}
  .cmp td{font-size:14px}
  .cmp{min-width:calc(96px + var(--n, 2) * 112px);table-layout:fixed}
  .cmp th,.cmp td{overflow-wrap:anywhere}
  .cmp thead th:first-child,.cmp tbody th{width:96px;padding:10px 8px}
  .cmp td{padding:10px 8px}
  .cmp-p{min-width:0}
  .cmp-p a{font-size:14px}
  .cmp-p img{width:64px;height:64px}
  .cmp-p .ic-btn{position:static;order:-1;align-self:flex-start}
  .cmp-p .ic-btn{width:44px;height:44px}
  .toast{left:16px;right:16px;bottom:16px;transform:translateY(140%);max-width:none;flex-wrap:wrap;gap:10px}
  .toast.show{transform:none}
  .toast .btn{min-height:44px;flex:1 1 auto}
  .p-info h1{font-size:30px}
  .p-info .type{font-size:14px}
  .p-key dd{font-size:18px}
  .p-key dt{font-size:14px}
  .p-art,.p-avail{font-size:14px}
  .p-buy .price small{font-size:14px}
  .sim-s{font-size:14px}
  .sims{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 6px;scrollbar-width:none}
  .sims::-webkit-scrollbar{display:none}
  .sim{flex:0 0 min(72%,260px);scroll-snap-align:start}
  .sim{padding:10px 10px 14px}
  .sim b{font-size:15px}
  .spec-t{font-size:14px}
  .spec-t th,.spec-t td{padding:10px 12px}
  .m-contacts .btn{min-height:48px}
}
@media (max-width: 400px){
  .ph-act{grid-template-columns:1fr}
  .p-key div{padding:10px 12px}
  .p-key dd{font-size:16px}
  .toolbar{grid-template-columns:minmax(0,1fr) auto}
  .f-open{grid-column:1;grid-row:1;justify-self:start}
  .view{grid-column:2;grid-row:1}
  .sel{grid-column:1/-1;grid-row:2}
  .active{grid-row:3}
  .m-contacts{grid-template-columns:1fr}
  .s-btns .btn{flex:1 1 calc(50% - 4px)}
}
@media (max-width: 359px){
  .head-in{column-gap:6px}
  .head-act{gap:0}
  .logo svg{width:30px;height:30px}
  .logo b{font-size:18px;letter-spacing:.02em}
  .logo{gap:8px}
  .is-list .card{grid-template-columns:80px minmax(0,1fr)}
  .is-list .pic{width:80px;height:80px}
  .buy{flex-wrap:wrap}
  .is-list .buy{flex-wrap:wrap}
  .buy-b{flex:1 1 100%}
  .buy-b .btn{flex:1}
}
@media (min-width: 1600px){
  body{font-size:16px}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .card:hover .pic img{transform:none}
}
