/* Запасные шрифты подогнаны по ширине к основным: пока Onest и Roboto
   Condensed грузятся, текст набран системным шрифтом того же размера,
   поэтому при подмене строки не «прыгают». */
@font-face{font-family:"Onest Fallback";src:local("Arial"),local("Helvetica");
size-adjust:97%;ascent-override:100%;descent-override:25%;line-gap-override:0%}
@font-face{font-family:"Cond Fallback";src:local("Arial Narrow"),local("Arial");
size-adjust:82%;ascent-override:105%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:"Mono Fallback";src:local("Consolas"),local("Menlo"),
local("DejaVu Sans Mono");size-adjust:96%}

*,*::before,*::after{box-sizing:border-box}
:root{
--paper:#EEEEEA;
--sheet:#FFFFFF;
--sheet2:#F6F6F3;
--ink:#14161A;
--ink2:#565B62;
--ink3:#868C93;
--line:#D5D6D1;
--line2:#B4B6B0;
--steel:#1B1E22;
--steel2:#2A2E34;
--mark:#F2C200;
--mark2:#D9AE00;
--deep:#8A6100;
--ok:#1B6A43;
--fs:15.5px}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
font:var(--fs)/1.55 "Onest","Onest Fallback","Segoe UI",Arial,sans-serif}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--deep)}
h1,h2,h3,h4,.cond{font-family:"Roboto Condensed","Cond Fallback","Arial Narrow",Arial,sans-serif}
.mono,.mn{font-family:"JetBrains Mono",Consolas,monospace}
.wrap{max-width:1300px;margin:0 auto;padding:0 18px}

/* ── шапка ───────────────────────────────────────────── */
.util{background:var(--steel);color:#A9AFB6;font-size:12.5px}
.util .wrap{display:flex;justify-content:space-between;gap:18px;
flex-wrap:wrap;padding:6px 18px}
.util a{color:#E7EAEC}
.util b{color:var(--mark);font-weight:500}
header{background:var(--steel2);color:#fff;padding:12px 0}
.hd{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.brand img{height:62px;width:auto}
.brand .slog{font-size:11.5px;line-height:1.35;color:#9CA3AA;
padding-left:14px;border-left:1px solid #454C54}
@media(max-width:1099px){.brand .slog{display:none}}
.hsearch{flex:1 1 280px;display:flex;min-width:210px}
.hsearch input{flex:1;min-width:0;padding:11px 14px;border:0;font-size:14.5px;
font-family:inherit;background:#fff;color:var(--ink)}
.hsearch button{border:0;background:var(--mark);color:var(--steel);
font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;font-size:15px;
text-transform:uppercase;letter-spacing:.06em;padding:0 20px;cursor:pointer}
.hsearch button:hover{background:var(--mark2)}
.hph{margin-left:auto;text-align:right;line-height:1.35}
.hph .n{display:block;font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;
font-size:21px;color:#fff;white-space:nowrap;line-height:1.15}
.hph .n a{color:#fff}
.hph .s{display:block;font-size:11.5px;color:#9CA3AA;margin-top:1px}
#nowbox2{display:none}
.hph .lk{display:flex;gap:5px;justify-content:flex-end;margin-top:5px}
.hph .lk a{font-size:11.5px;padding:3px 9px;border:1px solid #4A5158;color:#D6DBDF}
.hph .lk a:hover{border-color:var(--mark);color:var(--mark)}

@media(max-width:699px){
  .util{display:none}                    /* адрес и часы есть в подвале */
  header{padding:11px 0}
  .hd{gap:12px}
  .brand img{height:44px}
  .hsearch{order:3;flex-basis:100%}
  .hsearch input{padding:10px 12px;font-size:16px}   /* 16px — iOS не зумит */
  .hsearch button{padding:0 15px;font-size:14px}
  .hph{text-align:right}
  .hph .n{font-size:17px}
  .hph .s{display:none}
  #nowbox2{display:inline-flex;font-size:12px;margin-top:2px}
  .hph .lk{margin-top:3px}
}

/* ── «сейчас открыто» ────────────────────────────────── */
.now{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.now b{font-weight:500}
.now .dot{width:7px;height:7px;border-radius:50%;background:#8B9299;
flex:0 0 auto}
.now.open .dot{background:#42C07A;box-shadow:0 0 0 3px rgba(66,192,122,.22)}
.now.open b{color:#7FE0AC}
.now.shut b{color:#E8B4A2}

/* ── полоса «почему сюда» ────────────────────────────── */
.trust{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);
grid-template-columns:1fr;margin:0 0 26px;list-style:none;padding:0}
@media(min-width:620px){.trust{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.trust{grid-template-columns:repeat(4,1fr)}}
.trust li{background:var(--sheet);padding:14px 16px}
.trust b{display:block;font-family:"Roboto Condensed","Cond Fallback",sans-serif;
font-size:15.5px;margin-bottom:3px}
.trust span{font-size:13.5px;color:var(--ink2);line-height:1.45}

/* ── карта и маршруты ───────────────────────────────── */
.mapbox{border:1px solid var(--line);background:var(--sheet);margin:0 0 18px}
.mapbox iframe{display:block;width:100%;height:340px;border:0}
.maploader{display:flex;flex-direction:column;align-items:center;justify-content:center;
gap:9px;width:100%;height:220px;border:0;cursor:pointer;background:var(--steel);
color:#fff;font-family:inherit;padding:16px}
.maploader:hover{background:#242930}
.maploader b{font-family:"Roboto Condensed","Cond Fallback",sans-serif;
font-size:17px;text-transform:uppercase;letter-spacing:.05em;color:var(--mark)}
.maploader .ad{font-size:13.5px;color:#A9AFB6}
.maploader .pin{width:26px;height:26px;border-radius:50% 50% 50% 0;
transform:rotate(-45deg);background:var(--mark);position:relative}
.maploader .pin::after{content:"";position:absolute;inset:8px;border-radius:50%;
background:var(--steel)}
@media(max-width:699px){.mapbox iframe{height:260px}.maploader{height:170px}}
.ways{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.ways a{display:inline-flex;align-items:center;gap:7px;
font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;
font-size:14px;text-transform:uppercase;letter-spacing:.04em;
border:1px solid var(--line2);padding:9px 15px;background:var(--sheet)}
.ways a:hover{border-color:var(--steel);background:var(--steel);color:#fff;
text-decoration:none}
.ways a.y{border-color:var(--mark2)}
.ways a.y:hover{background:var(--mark);border-color:var(--mark);color:var(--steel)}

/* ── тёплая подсказка в карточке ─────────────────────── */
.hint{background:var(--mark);color:var(--steel);padding:12px 15px;
font-size:14px;line-height:1.45;margin:14px 0 0}
.hint b{font-weight:600}

/* ── каркас ──────────────────────────────────────────── */
.shell{display:grid;gap:26px;grid-template-columns:minmax(0,1fr);
padding:22px 0 60px}
@media(min-width:1000px){.shell{grid-template-columns:250px minmax(0,1fr)}}
aside{font-size:14px}
aside .box{background:var(--sheet);border:1px solid var(--line);position:sticky;top:14px}
aside .cap{font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;
text-transform:uppercase;letter-spacing:.07em;font-size:12.5px;
background:var(--steel);color:#fff;padding:9px 13px}
aside .cap i{color:var(--mark);font-style:normal}
aside ul{list-style:none;margin:0;padding:0}
aside .sec{border-top:1px solid var(--line)}
aside .sec:first-child{border-top:0}
aside .sec > a{display:block;padding:10px 13px 6px;
font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;font-size:15px;
line-height:1.2}
aside .sec.on > a{color:var(--deep)}
aside .sub{padding:0 13px 10px}
aside .sub li{display:flex;justify-content:space-between;gap:8px;
padding:3px 0;line-height:1.3}
aside .sub a{font-size:13.2px;color:var(--ink2)}
aside .sub a:hover{color:var(--deep)}
aside .sub li.on a{color:var(--ink);font-weight:600;
box-shadow:inset 0 -6px 0 var(--mark)}
aside .sub .n{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:11px;
color:var(--ink3);flex:0 0 auto}
.navtgl{position:absolute;opacity:0;width:0;height:0}
aside .cap{cursor:pointer;display:flex;justify-content:space-between;
align-items:center;gap:10px;user-select:none}
aside .cap i{transition:transform .15s}
.navtgl:checked ~ .cap i{transform:rotate(180deg)}
.navtgl:not(:checked) ~ .tree{display:none}
.navtgl:focus-visible ~ .cap{outline:2px solid var(--mark);outline-offset:-2px}
@media(min-width:1000px){
  aside .cap{cursor:default}
  aside .cap i{display:none}
  .navtgl:not(:checked) ~ .tree,
  .navtgl:checked ~ .tree{display:block}
}

/* ── типографика ─────────────────────────────────────── */
.crumbs{font-size:12.5px;color:var(--ink3);margin:0 0 12px}
.crumbs a{color:var(--ink2);text-decoration:underline;text-decoration-color:var(--line2)}
.crumbs i{font-style:normal;margin:0 7px;color:var(--line2)}
h1{font-weight:700;font-size:clamp(23px,3.1vw,33px);line-height:1.14;
margin:0 0 10px;letter-spacing:-.005em;text-wrap:balance}
h2{font-weight:700;font-size:20px;margin:32px 0 12px;
text-transform:uppercase;letter-spacing:.03em}
h2:first-child{margin-top:0}
h3{font-weight:700;font-size:16.5px;margin:20px 0 7px}
h4{font-weight:700;font-size:14.5px;margin:15px 0 5px;
font-family:"Roboto Condensed","Cond Fallback",sans-serif;text-transform:uppercase;
letter-spacing:.04em;color:var(--ink2)}
.sum{color:var(--ink2);margin:0 0 18px;max-width:74ch}
.sum b{color:var(--ink);font-weight:600}
.rule{height:3px;background:var(--steel);margin:0 0 18px}
.rule i{display:block;width:64px;height:3px;background:var(--mark)}

/* ── строки товаров ──────────────────────────────────── */
ul.list{list-style:none;margin:0;padding:0;background:var(--sheet);
border:1px solid var(--line)}
ul.list > li{display:grid;gap:14px;align-items:center;padding:12px 14px;
grid-template-columns:64px minmax(0,1fr);border-top:1px solid var(--line)}
ul.list > li:first-child{border-top:0}
ul.list > li:hover{background:var(--sheet2)}
@media(min-width:700px){
ul.list > li{grid-template-columns:72px minmax(0,1fr) 190px}}
.th{width:64px;height:64px;background:#fff;border:1px solid var(--line);
display:flex;align-items:center;justify-content:center;padding:4px}
@media(min-width:700px){.th{width:72px;height:72px}}
.th img{max-height:100%;object-fit:contain}
.th span{font-size:9px;color:var(--line2);text-align:center;line-height:1.2}
.d .br{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:10.5px;
letter-spacing:.08em;text-transform:uppercase;color:var(--ink3)}
.d .nm{display:block;font-size:15px;line-height:1.35;margin:1px 0 3px;
font-weight:500}
.d .nm:hover{color:var(--deep)}
.d .sp{font-size:12.5px;color:var(--ink2);line-height:1.4}
.pz{display:flex;align-items:center;gap:12px;
grid-column:1/-1;border-top:1px dashed var(--line);padding-top:9px}
@media(min-width:700px){.pz{grid-column:auto;border:0;padding:0;
flex-direction:column;align-items:flex-end;gap:5px;text-align:right}}
.r{font-style:normal;font-weight:500;font-size:.6em;margin-left:.16em;
  vertical-align:.08em;opacity:.55;letter-spacing:0}
.buy .big .r{font-size:.46em;font-weight:500;margin-left:.14em;
  vertical-align:.2em;opacity:.5}
.pz .p{font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;font-size:21px;
white-space:nowrap;box-shadow:inset 0 -8px 0 var(--mark)}
.pz .av{font-size:11.5px;color:var(--ok);font-family:"JetBrains Mono","Mono Fallback",monospace}
.pz .go{font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;font-size:12.5px;
text-transform:uppercase;letter-spacing:.06em;border:1px solid var(--line2);
padding:5px 12px;color:var(--ink2)}
.pz .go:hover{border-color:var(--steel);background:var(--steel);color:#fff}

/* ── разделы на главной ──────────────────────────────── */
.tiles{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:1px;
background:var(--line);border:1px solid var(--line);
grid-template-columns:1fr}
@media(min-width:640px){.tiles{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.tiles{grid-template-columns:repeat(3,1fr)}}
.tiles > li{background:var(--sheet);padding:17px 19px 19px}
.tiles .hh{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tiles .hh a{font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;
font-size:18px;line-height:1.15}
.tiles .hh .c{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:11px;
color:var(--ink3);flex:0 0 auto}
.tiles .bar{height:3px;background:var(--mark);margin:9px 0 11px;width:52px}
.tiles ul{list-style:none;margin:0;padding:0;font-size:13.4px}
.tiles ul li{padding:2px 0;line-height:1.4}
.tiles ul a{color:var(--ink2)}
.tiles ul a:hover{color:var(--deep)}

/* ── фильтры и пагинация ─────────────────────────────── */
.tools{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 14px}
.tools select{font:inherit;font-size:13.5px;padding:7px 11px;
border:1px solid var(--line2);background:var(--sheet)}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px;padding:0}
.chips a{display:block;border:1px solid var(--line2);background:var(--sheet);
padding:5px 12px;font-size:13px}
.chips a:hover{border-color:var(--steel);background:var(--steel);color:#fff}
.chips .n{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:10.5px;color:var(--ink3)}
.chips a:hover .n{color:var(--mark)}
.pg{display:flex;gap:5px;flex-wrap:wrap;list-style:none;margin:18px 0 0;padding:0}
.pg a,.pg strong{display:block;padding:7px 13px;border:1px solid var(--line2);
background:var(--sheet);font-size:14px;font-family:"JetBrains Mono","Mono Fallback",monospace}
.pg strong{background:var(--steel);border-color:var(--steel);color:var(--mark)}

/* ── карточка товара ─────────────────────────────────── */
.pgrid{display:grid;gap:22px;grid-template-columns:minmax(0,1fr)}
@media(max-width:899px){
  /* на телефоне цена и кнопки — сразу под заголовком, а не в конце */
  .pgrid > div:last-child{order:-1}
  .shot{min-height:0;padding:12px}
  .shot img{max-height:58vh}
  .buy{position:static}
}
@media(min-width:900px){.pgrid{grid-template-columns:minmax(0,1fr) 320px}}
.sheet{background:var(--sheet);border:1px solid var(--line);padding:20px 22px;
min-width:0}
.shot{background:#fff;border:1px solid var(--line);padding:18px;
display:flex;align-items:center;justify-content:center;min-height:230px;
margin:0 0 18px;min-width:0}
.shot img{max-width:100%;height:auto;min-width:0}
table.spec{width:100%;border-collapse:collapse;font-size:14.2px;
table-layout:fixed}
table.spec td{padding:7px 0;border-bottom:1px solid var(--line);
vertical-align:top}
table.spec tr:last-child td{border-bottom:0}
table.spec td.k{color:var(--ink2);width:52%;padding-right:14px}
table.spec td.v{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:13px;
text-align:right;word-break:break-word}
.body{font-size:15px;line-height:1.62}
.body ul{padding-left:19px;margin:7px 0}
.body p{margin:0 0 10px}

.buy{background:var(--sheet);border:1px solid var(--line);
border-top:4px solid var(--mark);padding:18px 20px;position:sticky;top:14px}
.buy .big{font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-weight:700;
font-size:36px;line-height:1;letter-spacing:-.01em}
.buy .av{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:11.5px;color:var(--ok);
margin:7px 0 15px;display:block}
.b{display:block;text-align:center;font-family:"Roboto Condensed","Cond Fallback",sans-serif;
font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:15px;
padding:12px 14px;margin:0 0 7px;border:1px solid var(--steel);cursor:pointer;
width:100%;background:var(--steel);color:#fff;line-height:1.25}
.b:hover{background:#000;color:var(--mark)}
.b.y{background:var(--mark);border-color:var(--mark);color:var(--steel)}
.b.y:hover{background:var(--mark2);color:var(--steel)}
.b.o{background:transparent;color:var(--ink);border-color:var(--line2)}
.b.o:hover{background:var(--steel);color:#fff;border-color:var(--steel)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.two .b{margin:0}
.tel{font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:11.5px;color:var(--ink2);
text-align:center;margin:10px 0 0;line-height:1.5}
form.ord{margin:14px 0 0;display:grid;gap:7px}
form.ord input,form.ord textarea{font:inherit;font-size:14px;padding:9px 11px;
border:1px solid var(--line2);background:#fff;width:100%}
.hp{position:absolute;left:-9999px}
.facts{margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--line);
font-size:13px;color:var(--ink2);line-height:1.85}
.facts b{color:var(--ink);font-family:"JetBrains Mono","Mono Fallback",monospace;font-size:12px}

/* ── текстовый блок ──────────────────────────────────── */
.note{background:var(--sheet);border:1px solid var(--line);
border-left:4px solid var(--mark);padding:18px 22px;margin:26px 0 0;
font-size:14.5px;color:var(--ink2);line-height:1.72}
.note h2{margin:0 0 8px;font-size:16px}
.note p{max-width:80ch;margin:0}

/* ── подвал ──────────────────────────────────────────── */
footer{background:var(--steel);color:#9EA5AC;font-size:13.5px;padding:34px 0 24px}
footer a{color:#DDE2E6}
footer a:hover{color:var(--mark)}
.fg{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
footer h4{color:#fff;font-family:"Roboto Condensed","Cond Fallback",sans-serif;font-size:14px;
text-transform:uppercase;letter-spacing:.07em;margin:0 0 10px;color:var(--mark)}
footer ul{list-style:none;margin:0;padding:0;line-height:2}
.fb{border-top:1px solid #383D44;margin-top:26px;padding-top:15px;
font-size:12px;color:#727981;max-width:86ch}

.sbox{background:var(--sheet);border:1px solid var(--line);padding:20px}
#sres{list-style:none;padding:0;margin:14px 0 0}
#sres li{padding:9px 0;border-bottom:1px solid var(--line);font-size:14.5px}
.dim{color:var(--ink3);font-size:13px}
:focus-visible{outline:2px solid var(--deep);outline-offset:2px}

/* На телефоне пальцу нужны зоны от 44px и текст не мельче 12px —
   это отдельно проверяют и Google, и Яндекс. */
@media(max-width:699px){
  .hsearch input{padding:13px 12px}
  .hsearch button{padding:0 18px}
  .hph .lk a{padding:7px 12px;font-size:12.5px}
  .chips a{padding:10px 14px;font-size:14px}
  .ways a{padding:13px 18px}
  .pg a,.pg strong{padding:11px 16px}
  aside .sub li{padding:7px 0}
  aside .sub a{font-size:14px}
  aside .sec > a{padding:13px 13px 8px}
  aside .cap{padding:14px 13px}
  footer ul{line-height:2.4}
  .d .br{font-size:12px}
  .d .sp{font-size:13px}
  .pz .av,.hph .s,.tel{font-size:12px}
  .tools select{padding:11px 12px;font-size:14px}
  .crumbs{font-size:13px;line-height:2}
  .b{padding:14px}
  .pz .go{padding:11px 16px;font-size:13px}
  .d .nm{padding:2px 0}
  .now{font-size:12px}
  .tiles ul{font-size:14px}
  .tiles ul li{padding:0}
  .tiles ul a{display:block;padding:12px 0;line-height:1.5}
  .tiles .hh a{display:inline-block;padding:10px 0}
  .trust li{padding:16px}
}