/* Manrope self-hosted — latin + cyrillic */
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:400;
  font-display:swap;
  src: url('/fonts/manrope-cyrillic-400.woff2') format('woff2'), url('/fonts/manrope-latin-400.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:600;
  font-display:swap;
  src: url('/fonts/manrope-cyrillic-600.woff2') format('woff2'), url('/fonts/manrope-latin-600.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:700;
  font-display:swap;
  src: url('/fonts/manrope-cyrillic-700.woff2') format('woff2'), url('/fonts/manrope-latin-700.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}
@font-face{
  font-family:'Manrope';
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src: url('/fonts/manrope-cyrillic-800.woff2') format('woff2'), url('/fonts/manrope-latin-800.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0400-04FF;
}
/* 01-base — Тёплая логистика */
:root{
  --bg:#F6F3ED; --bg-alt:#EFEAE0; --ink:#1E2522; --ink-soft:#5C6560;
  --accent:#B86535; --deep:#2F6451; --sand:#E6D7C4; --line:#E0DAD0;
  --amber:#E8A04A; --danger:#B5342F; --ok:#2F7D4A;
  --max-a:#6D3BEF; --max-b:#9B4DFF;
  --r-sm:10px; --r-md:16px; --r-lg:22px; --r-xl:30px;
  --t-fast:120ms; --t-base:220ms; --t-slow:380ms;
  --ease:cubic-bezier(.2,.7,.2,1); --ease-out:cubic-bezier(.16,1,.3,1);
  --wrap:1240px; --wrap-lg:1440px;
}
*{box-sizing:border-box; min-width:0}
html{scroll-behavior:smooth; scroll-padding-top:84px; scroll-padding-bottom:72px; overflow-x:clip; max-width:100vw}
body{margin:0; font-family:Manrope, Golos Text, Onest, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; font-size:16px; line-height:1.5; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:clip; max-width:100vw}
img{max-width:100%; height:auto; display:block}
.wrap{width:min(calc(100% - 40px), var(--wrap)); margin-inline:auto; max-width:100%; box-sizing:border-box}
img{max-width:100%; height:auto; display:block}
a{color:var(--deep); text-decoration:none}
a:hover{color:var(--accent)}
button{font-family:inherit}
::selection{background:color-mix(in srgb, var(--accent) 35%, #fff)}
:focus-visible{outline:3px solid color-mix(in srgb, var(--deep) 30%, transparent); outline-offset:2px}
.skip{position:absolute; left:16px; top:-48px; z-index:10000; padding:8px 16px; background:var(--ink); color:#fff; border-radius:10px}
.skip:focus{top:16px}
.wrap{width:min(calc(100% - 40px), var(--wrap)); margin-inline:auto}
@media(min-width:1680px){.wrap{width:min(calc(100% - 64px), var(--wrap-lg))}}
h1,h2,h3{font-family:Manrope, system-ui; font-weight:800; line-height:1.12; letter-spacing:-0.02em; margin:0}
h1{font-size:clamp(28px, 4vw, 52px)}
h2{font-size:clamp(24px, 3vw, 36px); line-height:1.18; letter-spacing:-0.015em}
h3{font-size:clamp(19px, 2.2vw, 24px); line-height:1.25}
.kicker{font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--deep); margin:0 0 12px}
.sec-head{max-width:720px; margin:0 auto 32px; text-align:center}
.sec-head__lead{color:var(--ink-soft); font-size:17px; line-height:1.45; margin:12px 0 0}
.section{padding:clamp(56px,8vw,120px) 0}
.section--tight{padding:clamp(40px,6vw,72px) 0}
.section--alt{background:var(--bg-alt)}
.section--dark{background:var(--ink); color:var(--bg)}
.section--dark h2{color:var(--bg)}
.hr{height:1px; background:var(--line); margin:32px 0; border:0}
.dot{width:8px; height:8px; border-radius:50%; background:var(--ok); display:inline-block; vertical-align:middle}
/* 02-layout — шапка минимал + футер премиум — FIX 500 + PREMIUM */
.topbar{height:36px; background:var(--ink); color:rgba(246,243,237,.78); font-size:12.5px; display:flex; align-items:center}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; gap:12px}
.topbar a{color:rgba(246,243,237,.88)}
.topbar a:hover{color:#fff}
.topbar__sep{opacity:.45; margin:0 8px}

/* HEADER MINIMAL — только лого + город + меню — 100% влезает */
.header{
  position:sticky; top:0; z-index:100;
  height:68px;
  background:color-mix(in srgb, var(--bg) 88%, rgba(255,255,255,.96));
  backdrop-filter:blur(14px) saturate(1.15);
  border-bottom:1px solid color-mix(in srgb, var(--line) 85%, transparent);
  overflow:visible;
}
@supports not (backdrop-filter: blur(1px)){
  .header{background:color-mix(in srgb, var(--bg) 96%, white)}
}
.header .wrap{
  height:100%;
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:nowrap;
  min-width:0;
  overflow:visible;
  justify-content:space-between;
}
.logo{
  display:flex; align-items:center; gap:10px;
  font-weight:800; font-size:18px; letter-spacing:-0.03em;
  color:var(--ink); white-space:nowrap; flex-shrink:0;
  max-width:220px;
}
.logo__mark{width:28px; height:28px; background:var(--ink); border-radius:8px; display:grid; place-items:center; color:var(--amber); flex-shrink:0}
.logo__crest{width:28px; height:28px; border-radius:8px; overflow:hidden; background:#fff; border:1px solid var(--line); flex-shrink:0}
.logo__word{overflow:hidden; text-overflow:ellipsis}
.logo__city{display:none !important}

.citybtn{
  display:inline-flex; align-items:center; gap:6px;
  height:36px; padding:0 14px;
  border:1px solid var(--line); border-radius:999px;
  background:#fff; color:var(--ink); font-size:13px; font-weight:600;
  cursor:pointer; flex-shrink:0;
  max-width:200px; min-width:0; overflow:hidden;
}
.citybtn:hover{border-color:var(--deep)}
.citybtn .ico{opacity:.7; flex-shrink:0}
.citybtn__name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:110px; display:inline-block}

/* burger всегда виден — премиум как letoremont */
.burger{
  display:inline-flex; align-items:center; gap:8px;
  height:40px; padding:0 16px 0 12px;
  border-radius:12px; border:1px solid var(--line); background:#fff;
  cursor:pointer; flex-shrink:0; font-weight:700; font-size:14px;
}
.burger:hover{border-color:var(--ink-soft); transform:translateY(-1px)}
.burger__dots{display:flex; gap:4px; justify-content:center; align-items:center}
.burger__dots i{width:4px; height:4px; border-radius:50%; background:var(--ink); display:block}

/* legacy nav/utils скрыты — всё в drawer */
.nav, .utils, .head-phone, .iconbtn, .mega{display:none !important}

/* BUTTONS — по умолчанию nowrap, чтобы таблицы не ломались */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:12px; font-weight:700; cursor:pointer;
  border:1px solid transparent;
  transition:transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease), background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
  text-decoration:none;
  white-space:nowrap;
  line-height:1.25; text-align:center;
  user-select:none;
}
.btn--primary{background:var(--accent); color:#fff; box-shadow:0 10px 24px rgba(184,101,53,.32)}
@supports (background: color-mix(in srgb, red 50%, blue)){.btn--primary{background:linear-gradient(160deg,var(--accent), color-mix(in srgb, var(--accent) 75%, #7a3c14))}}
.btn--primary:hover{transform:translateY(-2px); box-shadow:0 14px 28px rgba(184,101,53,.38)}
.btn--dark{background:var(--ink); color:#fff}
.btn--dark:hover{transform:translateY(-2px)}
.btn--outline{background:#fff; border-color:var(--line); color:var(--ink)}
.btn--outline:hover{border-color:var(--ink-soft); transform:translateY(-1px)}
.btn--ghost{background:transparent; border-color:transparent; color:var(--ink)}
.btn--ghost:hover{background:var(--sand)}
.btn--max{background:linear-gradient(135deg,var(--max-a),var(--max-b)); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 8px 20px rgba(109,59,239,.35)}
.btn--max:hover{transform:translateY(-2px)}
.btn--sm{height:36px; min-height:36px; padding:0 16px; font-size:13px; line-height:1.2; white-space:nowrap; word-break:normal}
.btn--md{height:48px; min-height:48px; padding:0 24px; font-size:15px}
.btn--lg{height:56px; min-height:56px; padding:0 32px; font-size:17px}
.btn--block{width:100%}
.btn__full{display:inline}
.btn__short{display:none}

/* в футере и seo — разрешаем перенос */
.footer__callback .btn, .seo-premium__actions .btn, .seo-trust .btn{
  white-space:normal; overflow-wrap:anywhere; word-break:break-word; line-height:1.25;
}

/* FOOTER — премиум */
.footer{background:var(--ink); color:rgba(246,243,237,.78); padding:56px 0 24px; margin-top:40px; position:relative; overflow:hidden}
.footer::before{content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, rgba(246,243,237,.18), transparent)}
.footer__grid{display:grid; grid-template-columns:1.35fr .85fr .85fr .95fr; gap:28px; align-items:start}
.footer a{color:rgba(246,243,237,.9); transition:color var(--t-fast) var(--ease)}
.footer a:hover{color:#fff}
.footer .kicker{color:rgba(246,243,237,.6); margin-bottom:14px}
.footer__about{font-size:14px; line-height:1.6; margin:14px 0 0; color:rgba(246,243,237,.72); max-width:42ch}
.footer__brand{display:flex; flex-direction:column; gap:14px; min-width:0}
.footer__contacts{
  display:grid; gap:12px; margin-top:18px;
  padding:16px; background:rgba(246,243,237,.06);
  border:1px solid rgba(246,243,237,.10); border-radius:18px;
  backdrop-filter:blur(6px);
  min-width:0; overflow:hidden;
}
.footer__phone{
  font-size:20px; font-weight:800; color:#fff !important;
  font-variant-numeric:tabular-nums; letter-spacing:-0.01em;
  white-space:nowrap;
}
.footer__phone-row{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap}
.footer__callback{margin-top:4px; display:grid; gap:10px}
.footer__callback .btn{
  height:auto; min-height:44px;
  border-radius:12px; font-weight:700;
  padding:10px 14px; font-size:14px;
}
.footer__callback .btn--primary{background:linear-gradient(160deg, var(--accent), color-mix(in srgb, var(--accent) 78%, #7a3c14)); box-shadow:0 8px 20px rgba(184,101,53,.28)}
.footer__callback .btn--max{box-shadow:0 8px 20px rgba(109,59,239,.3)}
.footer__callback .btn--outline{background:rgba(246,243,237,.08); color:#fff; border-color:rgba(246,243,237,.14)}
.footer__callback .btn--outline:hover{background:rgba(246,243,237,.12); border-color:rgba(246,243,237,.22)}
.footer__addr{font-size:12.5px; line-height:1.55; color:rgba(246,243,237,.62); margin-top:4px; min-width:0}
.footer__addr div{overflow-wrap:anywhere; word-break:break-word}
.footer__mail{color:rgba(246,243,237,.9) !important; overflow-wrap:anywhere; word-break:break-all}
.footer__legal{font-size:12px; opacity:.55; line-height:1.5}
.footer__bottom{
  margin-top:36px; padding-top:22px;
  border-top:1px solid rgba(246,243,237,.12);
  display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between;
  font-size:12.5px; align-items:center;
}
.footer__nei{display:flex; flex-wrap:wrap; gap:8px; align-items:center; max-width:62%; min-width:0}
.footer__nei a{padding:5px 12px; background:rgba(246,243,237,.08); border-radius:999px; font-size:12px; border:1px solid rgba(246,243,237,.08); white-space:nowrap}
.footer__nei a:hover{background:rgba(246,243,237,.14); border-color:rgba(246,243,237,.14)}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:16px}
.crumbs{padding:16px 0; text-align:center}
.crumbs ol{list-style:none; margin:0; padding:0; display:inline-flex; flex-wrap:wrap; gap:6px; justify-content:center; align-items:center; font-size:13px; color:var(--ink-soft)}
.crumbs a{color:var(--ink-soft)} .crumbs a:hover{color:var(--deep)}
.crumbs li+li::before{content:'·'; margin:0 6px; opacity:.5}

@media(max-width:640px){
  .footer__callback .btn{font-size:13.5px}
  .btn__full{display:none}
  .btn__short{display:inline}
}
/* 03-home — hero, promo, tasks, quiz, showcase, rating, etc */
.hero{position:relative; overflow:hidden; min-height:560px; display:grid; place-items:center; background:var(--ink)}
.hero__bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.72}
.hero__veil{position:absolute; inset:0; background:linear-gradient(90deg, rgba(30,37,34,.88) 0%, rgba(30,37,34,.55) 45%, rgba(30,37,34,.15) 100%)}
.hero__canvas{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; opacity:.55; mix-blend-mode:screen}
.hero .wrap{position:relative; z-index:2; display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:center; padding:48px 0}
.hero__chip{display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.12); backdrop-filter:blur(8px); color:#fff; border:1px solid rgba(255,255,255,.18); border-radius:999px; padding:6px 12px; font-size:12px; font-weight:700}
.hero__chip img{width:20px; height:20px; border-radius:50%; background:#fff}
.hero__h{color:#fff; margin:16px 0 12px; max-width:640px}
.hero__lead{color:rgba(255,255,255,.88); font-size:18px; line-height:1.45; max-width:560px}
.hero__cta{display:flex; gap:12px; margin-top:20px; flex-wrap:wrap}
.hero__metrics{list-style:none; margin:28px 0 0; padding:0; display:flex; gap:20px; flex-wrap:wrap}
.hero__metrics li{display:flex; flex-direction:column}
.hero__metrics strong{color:#fff; font-size:20px; font-weight:800; font-variant-numeric:tabular-nums}
.hero__metrics span{color:rgba(255,255,255,.7); font-size:12px; text-transform:uppercase; letter-spacing:.08em; font-weight:600}
.stock{background:#fff; border:1px solid var(--line); border-radius:22px; padding:16px; box-shadow:0 8px 24px rgba(30,37,34,.08)}
.stock__upd{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 8px}
.stock__h{font-size:18px; font-weight:800; margin:0 0 12px}
.stock__list{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.stock__li{display:flex; gap:10px; align-items:center; border:1px solid var(--line); border-radius:14px; padding:8px; background:var(--bg)}
.stock__li img{width:56px; height:42px; object-fit:cover; border-radius:8px}
.stock__li b{font-size:13px; display:block}
.stock__li span{font-size:12px; color:var(--ink-soft)}
.stock__note{font-size:11px; color:var(--ink-soft); margin:10px 0 0}
.promos .grid-3{margin-top:16px}
.promo{border:1px solid var(--line); border-radius:18px; background:#fff; padding:18px; position:relative; overflow:hidden; transition:transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease)}
.promo:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(30,37,34,.08)}
.promo .kicker{margin-bottom:6px}
.promo h3{margin-bottom:6px}
.promo p{margin:0 0 10px; color:var(--ink-soft); font-size:14px}
.tasks .task{border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; display:block; transition:transform var(--t-base) var(--ease)}
.tasks .task:hover{transform:translateY(-3px)}
.tasks .task img{width:100%; height:180px; object-fit:cover}
.tasks .task__t{display:block; padding:12px 14px 2px; font-weight:700}
.tasks .task__p{display:block; padding:0 14px 14px; color:var(--accent); font-weight:800; font-size:13px}
.quiz{background:var(--bg-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.quiz__card{max-width:760px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:24px; padding:24px; box-shadow:0 8px 24px rgba(30,37,34,.06)}
.quiz__prog{list-style:none; display:flex; gap:8px; padding:0; margin:0 0 18px}
.quiz__prog li{flex:1; height:4px; background:var(--line); border-radius:999px; overflow:hidden}
.quiz__prog li.is-on{background:var(--accent)}
.quiz__step{display:none}
.quiz__step.is-on{display:block}
.quiz__opts{display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:12px}
.quiz__opt{border:1px solid var(--line); border-radius:14px; padding:14px; cursor:pointer; background:#fff; text-align:left}
.quiz__opt.is-on{border-color:var(--accent); background:color-mix(in srgb, var(--sand) 70%, #fff)}
.showcase .sec-more{text-align:center; margin-top:16px}
.rating{background:#fff; border:1px solid var(--line); border-radius:20px; padding:18px}
.rating__row{display:grid; grid-template-columns:120px 1fr; gap:12px; align-items:center; padding:12px 0; border-bottom:1px dashed var(--line)}
.rating__row:last-child{border:0}
.meters{display:grid; gap:8px}
.meter{height:8px; background:var(--line); border-radius:999px; overflow:hidden; position:relative}
.meter i{display:block; height:100%; width:0; background:var(--accent); border-radius:999px; transition:width 1s var(--ease-out)}
.conds{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
.cond{border:1px solid var(--line); border-radius:16px; background:#fff; padding:16px}
.cond strong{display:block; margin-bottom:4px}
.cond span{font-size:13px; color:var(--ink-soft)}
.quality{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; counter-reset:q}
.quality li{border:1px solid var(--line); border-radius:18px; background:#fff; padding:16px; position:relative; overflow:hidden}
.quality li::before{counter-increment:q; content:counter(q, decimal-leading-zero); position:absolute; right:12px; top:10px; font-size:12px; font-weight:800; letter-spacing:.08em; color:var(--ink-soft); opacity:.6}
.quality img{width:100%; height:160px; object-fit:cover; border-radius:12px; margin-bottom:10px}
.sprice table{width:100%; border-collapse:collapse}
.sprice th{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft); text-align:left; padding:10px}
.sprice td{padding:12px 10px; border-top:1px solid var(--line); font-size:14px}
.home-del{display:grid; grid-template-columns:1fr 1.2fr; gap:20px; align-items:center}
.home-del img{width:100%; height:360px; object-fit:cover; border-radius:20px}
.features{counter-reset:f}
.features ol{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:16px}
.features li{border:1px solid rgba(246,243,237,.14); border-radius:18px; padding:18px; background:rgba(255,255,255,.04)}
.features__n{color:var(--amber); font-weight:800; font-size:12px; letter-spacing:.14em}
.wcard{border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; transition:transform var(--t-base) var(--ease)}
.wcard:hover{transform:translateY(-2px)}
.wcard img{width:100%; height:200px; object-fit:cover}
.wcard__meta{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); margin:0; padding:10px 12px 0}
.wcard h3{font-size:16px; padding:4px 12px}
.wcard p{font-size:13px; color:var(--ink-soft); padding:0 12px 12px; margin:0}
.story{border:1px solid var(--line); border-radius:18px; background:#fff; padding:16px}
.faq{display:grid; gap:10px; max-width:760px; margin:0 auto}
.faq__item{border:1px solid var(--line); border-radius:14px; background:#fff; overflow:hidden}
.faq__q{width:100%; text-align:left; background:#fff; border:0; padding:14px 16px; font-weight:700; font-size:15px; cursor:pointer; display:flex; justify-content:space-between; align-items:center}
.faq__a{display:grid; grid-template-rows:0fr; transition:grid-template-rows var(--t-slow) var(--ease)}
.faq__item.is-open .faq__a{grid-template-rows:1fr}
.faq__a>div{overflow:hidden}
.faq__a p{margin:0; padding:0 16px 14px; color:var(--ink-soft); font-size:14px}
.seo{max-width:760px; margin:0 auto; color:var(--ink-soft); font-size:15px; line-height:1.6}
.seo h2{color:var(--ink); margin:24px 0 12px}
.final{background:var(--bg-alt); border:1px solid var(--line); border-radius:24px; padding:24px; max-width:760px; margin:0 auto}

/* SEO-PREMIUM — new block like letoremont */
.seo-block{background:linear-gradient(180deg, var(--bg) 0%, var(--bg-alt) 100%); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.seo-premium{
  display:grid; grid-template-columns:1.25fr .75fr; gap:32px; align-items:start;
  background:#fff; border:1px solid var(--line); border-radius:24px;
  padding:28px; box-shadow:0 12px 32px rgba(30,37,34,.06);
}
.seo-premium__main{min-width:0}
.seo-premium__kicker{display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--deep); background:color-mix(in srgb, var(--sand) 70%, #fff); border:1px solid var(--line); padding:6px 10px; border-radius:999px; margin-bottom:14px}
.seo-premium__kicker i{width:6px; height:6px; border-radius:50%; background:var(--ok); display:inline-block}
.seo-premium__main h2{font-size:clamp(22px,2.6vw,32px); line-height:1.15; letter-spacing:-0.02em; margin:0 0 16px; color:var(--ink); max-width:28ch}
.seo-premium__text{display:grid; gap:14px; color:var(--ink-soft); font-size:15.5px; line-height:1.68}
.seo-premium__text p{margin:0}
.seo-premium__text b{color:var(--ink); font-weight:700}
.seo-premium__actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:20px}
.seo-premium__side{display:grid; gap:14px; position:sticky; top:88px}
.seo-facts{background:var(--bg); border:1px solid var(--line); border-radius:18px; padding:16px; display:grid; gap:12px}
.seo-fact{display:flex; gap:12px; align-items:flex-start; min-width:0}
.seo-fact__ico{width:36px; height:36px; border-radius:10px; background:#fff; border:1px solid var(--line); display:grid; place-items:center; flex-shrink:0; color:var(--deep)}
.seo-fact__t{font-size:13.5px; font-weight:700; line-height:1.25; color:var(--ink)}
.seo-fact__d{font-size:12.5px; line-height:1.45; color:var(--ink-soft); margin-top:2px}
.seo-trust{background:var(--ink); color:rgba(246,243,237,.84); border-radius:18px; padding:16px; display:grid; gap:10px}
.seo-trust__row{display:flex; gap:10px; align-items:center; font-size:13px; line-height:1.35}
.seo-trust__row b{color:#fff}
.seo-trust__ico{width:28px; height:28px; border-radius:8px; background:rgba(246,243,237,.1); display:grid; place-items:center; flex-shrink:0}
.seo-geo{font-size:12.5px; color:var(--ink-soft); line-height:1.5; padding:0 2px}
.seo-geo b{color:var(--ink)}

@media(max-width:1024px){
  .seo-premium{grid-template-columns:1fr; gap:20px; padding:22px}
  .seo-premium__side{position:static}
}
@media(max-width:640px){
  .seo-premium{padding:18px; border-radius:20px}
  .seo-premium__main h2{font-size:22px}
  .seo-premium__text{font-size:14.5px}
  .seo-facts{padding:14px}
}

@media(max-width:1024px){.hero .wrap{grid-template-columns:1fr} .home-del{grid-template-columns:1fr} .quality{grid-template-columns:1fr 1fr} .conds{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.hero{min-height:520px} .hero__metrics{gap:12px} .quality{grid-template-columns:1fr} .conds{grid-template-columns:1fr} .features ol{grid-template-columns:1fr} .quiz__opts{grid-template-columns:1fr}}
/* 04-pages — каталог, товар, услуги, доставка, цены, etc */
.page-cat .catalog__bar{position:sticky; top:72px; z-index:5; background:color-mix(in srgb, var(--bg) 92%, transparent); backdrop-filter:blur(10px); border:1px solid var(--line); border-radius:16px; padding:10px; display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:16px}
.chip{height:36px; padding:0 14px; border-radius:999px; border:1px solid var(--line); background:#fff; font-size:13px; font-weight:600; cursor:pointer}
.chip.is-on{background:var(--ink); color:#fff; border-color:var(--ink)}
.chip:hover{border-color:var(--ink-soft)}
.catalog__grid{margin-top:8px}
.catalog__empty{padding:24px; text-align:center; color:var(--ink-soft); border:1px dashed var(--line); border-radius:16px; background:#fff}
.pcard{border:1px solid var(--line); border-radius:18px; background:#fff; overflow:hidden; display:flex; flex-direction:column; transition:transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease)}
.pcard:hover{transform:translateY(-3px); box-shadow:0 12px 28px rgba(30,37,34,.08)}
.pcard__media{position:relative}
.pcard__media a{display:block}
.pcard__media img{width:100%; aspect-ratio:4/3; object-fit:cover}
.pcard__badges{position:absolute; left:10px; top:10px; display:flex; gap:6px}
.badge{font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:4px 8px; border-radius:999px; background:#fff; border:1px solid var(--line)}
.badge--hit{background:var(--amber); color:var(--ink); border-color:transparent}
.badge--accent{background:var(--accent); color:#fff; border-color:transparent}
.pcard__fav{position:absolute; right:10px; top:10px; width:36px; height:36px; border-radius:999px; border:1px solid var(--line); background:#fff; display:grid; place-items:center; cursor:pointer}
.pcard__fav.is-on{background:var(--accent); color:#fff; border-color:var(--accent)}
.pcard__body{padding:12px 14px; display:flex; flex-direction:column; gap:8px; flex:1}
.pcard__title{font-size:15px; font-weight:700; line-height:1.25; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:38px}
.pcard__specs{display:flex; gap:10px; flex-wrap:wrap; font-size:12px; color:var(--ink-soft)}
.pcard__price{display:flex; align-items:baseline; gap:8px; margin-top:auto}
.pcard__price b{font-size:18px; font-weight:800; font-variant-numeric:tabular-nums; color:var(--ink)}
.price-old{font-size:12px; color:var(--ink-soft); text-decoration:line-through}
.pcard__buy{display:flex; gap:8px; margin-top:8px}
.pcard__buy .btn{flex:1}
.woodshed{margin-top:32px; border:1px solid var(--line); border-radius:20px; background:#fff; padding:18px}
.woodshed__grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:center}
.woodshed__f{display:grid; gap:10px}
.woodshed__f label{font-size:13px; font-weight:600}
.woodshed__f input{height:48px; border:1.5px solid var(--line); border-radius:12px; padding:0 12px; font-size:15px}
#woodshedSvg{width:100%; height:280px; background:var(--bg-alt); border-radius:16px; border:1px solid var(--line)}
.page-p .p-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:20px}
.gallery{border:1px solid var(--line); border-radius:20px; background:#fff; overflow:hidden; padding:12px}
.gallery__main img{width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:12px}
.gallery__thumbs{display:flex; gap:8px; margin-top:10px}
.gallery__thumbs button{border:1px solid var(--line); border-radius:10px; overflow:hidden; padding:0; cursor:pointer; width:80px; height:60px; background:#fff}
.gallery__thumbs button[aria-current=true]{border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 25%, transparent)}
.buybox{border:1px solid var(--line); border-radius:20px; background:#fff; padding:16px; position:sticky; top:88px}
.buybox__price{display:flex; align-items:baseline; gap:10px; margin:8px 0}
.buybox__price b{font-size:30px; font-weight:800; font-variant-numeric:tabular-nums}
.buybox__qtyrow{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:12px 0}
.qty{display:inline-flex; align-items:center; border:1px solid var(--line); border-radius:12px; overflow:hidden}
.qty button{width:40px; height:40px; border:0; background:#fff; cursor:pointer; font-size:18px}
.qty input{width:64px; height:40px; border:0; border-left:1px solid var(--line); border-right:1px solid var(--line); text-align:center; font-weight:700}
.guarantees{list-style:none; margin:12px 0 0; padding:0; display:grid; gap:8px}
.guarantees li{display:flex; gap:10px; font-size:13px; color:var(--ink-soft); border:1px dashed var(--line); border-radius:12px; padding:10px}
.slots{border:0; margin:12px 0; padding:0}
.slots legend{font-weight:700; margin-bottom:8px}
.tabs{margin-top:24px}
.tabs__list{display:flex; gap:8px; border-bottom:1px solid var(--line); overflow:auto}
.tabs__list button{height:40px; padding:0 14px; border:0; border-bottom:2px solid transparent; background:transparent; font-weight:700; cursor:pointer; white-space:nowrap}
.tabs__list button[aria-selected=true]{border-color:var(--accent); color:var(--accent)}
.tabs__panel{padding:16px 0}
.table-wrap{overflow:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:16px; background:#fff}
.table-wrap table{width:100%; border-collapse:collapse; min-width:560px}
.table-wrap th{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft); text-align:left; padding:12px; white-space:nowrap}
.table-wrap td{padding:12px; border-top:1px solid var(--line); font-size:14px; vertical-align:top}
.table-wrap td .btn{white-space:nowrap; word-break:normal; overflow-wrap:normal}
.price-table .badge{font-size:10px}

/* sprice premium responsive */
.sprice .table-wrap table{min-width:620px}
@media(max-width:640px){
  .table-wrap{border-radius:14px; border:0; background:transparent; overflow:visible}
  .table-wrap table{min-width:0; display:grid; gap:12px; border:0; background:transparent}
  .table-wrap thead{display:none}
  .table-wrap tbody{display:grid; gap:12px}
  .table-wrap tr{
    display:grid; gap:8px;
    background:#fff; border:1px solid var(--line); border-radius:16px;
    padding:14px; box-shadow:0 6px 18px rgba(30,37,34,.06);
  }
  .table-wrap td{
    border:0; padding:0; display:flex; gap:8px; align-items:flex-start; justify-content:space-between;
    font-size:14px; line-height:1.4;
  }
  .table-wrap td::before{
    content:attr(data-label);
    font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase;
    color:var(--ink-soft); flex-shrink:0; min-width:72px;
  }
  .table-wrap td:last-child{justify-content:flex-end}
  .table-wrap td:last-child::before{display:none}
  /* price table specific */
  .price-table tr{grid-template-columns:1fr}
}

.scard{border:1px solid var(--line); border-radius:16px; background:#fff; padding:16px; display:flex; flex-direction:column; gap:8px; transition:transform var(--t-base) var(--ease)}
.scard:hover{transform:translateY(-2px)}
.scard__cat{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--deep)}
.scard h3{font-size:16px}
.scard p{font-size:13px; color:var(--ink-soft); margin:0}
.citygrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px}
.citycell{display:flex; gap:10px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#fff; text-decoration:none; color:inherit}
.citycell:hover{border-color:var(--deep); transform:translateY(-1px)}
.citycell img{width:24px; height:24px; border-radius:50%; object-fit:cover; background:#fff; border:1px solid var(--line)}
.cart-lines{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.cart-line{display:grid; grid-template-columns:80px 1fr 120px 100px 40px; gap:10px; align-items:center; border:1px solid var(--line); border-radius:14px; background:#fff; padding:10px}
.cart-side{border:1px solid var(--line); border-radius:16px; background:#fff; padding:16px; position:sticky; top:88px}
.article{max-width:720px; margin:0 auto}
.article p{margin:0 0 1.1em; line-height:1.6}
.article h2{margin:1.6em 0 .5em; font-size:28px}
.article ul{margin:0 0 1.1em; padding-left:1.2em}
.page-404{text-align:center; padding:48px 0}
.prose{max-width:720px; margin:0 auto; line-height:1.6}
.prose h2{margin:1.5em 0 .5em}
@media(max-width:1024px){.page-p .p-grid{grid-template-columns:1fr} .buybox{position:static} .woodshed__grid{grid-template-columns:1fr} .cart-line{grid-template-columns:64px 1fr 100px 80px 36px}}
@media(max-width:640px){.cart-line{grid-template-columns:56px 1fr; grid-template-areas:"img title" "img qty" "sum del"} .cart-line img{grid-area:img} .cart-line .title{grid-area:title} }
/* 05-responsive — 10 брейкпоинтов — MINIMAL HEADER PREMIUM */
@media(max-width:1920px){.hero__bg{object-position:center}}
@media(max-width:1680px){.wrap{width:min(calc(100% - 48px), var(--wrap-lg))}}
@media(max-width:1440px){
  .mega__grid{grid-template-columns:1fr 1fr 220px}
}
@media(max-width:1360px){
  .citybtn{padding:0 12px; font-size:12.5px; max-width:160px}
  .citybtn__name{max-width:88px}
  .logo{max-width:190px; font-size:17px}
  .header{height:64px}
}
@media(max-width:1280px){
  .header{height:64px}
  .hero .wrap{grid-template-columns:1fr}
  .stock{max-width:520px}
  .header .wrap{gap:8px}
  .citybtn{max-width:168px}
}
@media(max-width:1024px){
  .topbar{display:none}
  .header{height:60px}
  .header .wrap{gap:8px}
  .footer__grid{grid-template-columns:1fr 1fr; gap:24px}
  .grid-3{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .wrap{width:min(calc(100% - 24px), var(--wrap))}
  .hero__cta .btn{flex:1}
  .footer__nei{max-width:100%}
  .home-del{grid-template-columns:1fr}
}
@media(max-width:640px){
  .wrap{width:min(calc(100% - 16px), 100%)}
  .header{height:56px}
  .grid-3{grid-template-columns:1fr}
  .pcard__title{font-size:14px; min-height:36px}
  .btn--lg{height:auto; min-height:48px; font-size:15px; white-space:nowrap}
  .crumbs ol{font-size:12px}
  .logo{max-width:148px; font-size:16px}
  .logo__mark{display:none}
  .logo__crest{display:block !important}
  .citybtn{height:34px; padding:0 10px; font-size:12.5px; max-width:128px}
  .citybtn__name{max-width:62px}
  .burger{height:34px; padding:0 12px 0 10px; font-size:13px}
  body{padding-bottom:72px}
  .footer{padding:32px 0 18px}
  .footer__grid{grid-template-columns:1fr; gap:22px}
  .footer__contacts{padding:14px; border-radius:16px}
  .footer__phone{font-size:18px}
  .footer__bottom{flex-direction:column; align-items:flex-start; gap:12px}
  .footer__nei{max-width:100%}
  .seo-premium{padding:16px; border-radius:18px}
}
@media(max-width:420px){
  .grid-3{grid-template-columns:1fr}
  .hero__metrics{flex-direction:column; gap:8px}
  .promo{padding:14px}
  .wrap{width:calc(100% - 14px)}
  .header .wrap{gap:6px}
  .citybtn{max-width:110px; padding:0 8px}
  .citybtn__name{max-width:54px}
  .logo{max-width:122px; font-size:15px}
  .burger{padding:0 10px; gap:6px}
  .burger span:last-child{display:none} /* hide text Меню on 360px, only icon */
}
@media(max-width:360px){
  .wrap{width:calc(100% - 12px)}
  .chip{padding:0 10px; font-size:12px}
  .burger{width:36px; height:36px; padding:0; justify-content:center}
  .citybtn{max-width:100px}
  .logo{max-width:110px}
}
@media print{
  .header,.topbar,.footer,.stickybar,.drawer,.modal,.toast{display:none !important}
  body{background:#fff; color:#000}
  a{color:#000; text-decoration:underline}
  .pcard,.scard,.stock,.buybox{box-shadow:none; border:1px solid #000}
}
/* 06-extras — скроллбар, шиммеры, кикеры, состояния */
::-webkit-scrollbar{width:8px; height:8px}
::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--ink-soft) 60%, transparent); border-radius:999px}
::-webkit-scrollbar-track{background:transparent}
.kicker{font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--deep)}
.hr{height:1px; background:var(--line); margin:32px 0}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.skeleton{background:linear-gradient(90deg, var(--line) 25%, var(--bg-alt) 37%, var(--line) 63%); background-size:400% 100%; animation:shimmer 1.2s ease-in-out infinite}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.pulse{position:relative}
.pulse::after{content:''; position:absolute; inset:-2px; border-radius:inherit; border:1px solid var(--accent); animation:pulse 1.8s ease-out infinite}
@keyframes pulse{0%{transform:scale(.98); opacity:.8}100%{transform:scale(1.08); opacity:0}}
.reveal{opacity:0; transform:translateY(12px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out)}
.reveal.is-in{opacity:1; transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1; transform:none} .skeleton{animation:none}}
.toast{position:fixed; right:20px; bottom:20px; z-index:200; display:grid; gap:10px; pointer-events:none}
.toast__item{pointer-events:auto; background:var(--ink); color:#fff; border-radius:14px; padding:12px 14px; display:flex; gap:10px; align-items:center; box-shadow:0 18px 48px rgba(30,37,34,.22); max-width:360px; animation:toastIn .28s var(--ease-out)}
.toast__item--ok{border-left:3px solid var(--ok)}
.toast__item--error{border-left:3px solid var(--danger)}
@keyframes toastIn{from{transform:translateY(8px); opacity:0}to{transform:none; opacity:1}}
@media(max-width:640px){.toast{left:12px; right:12px; bottom:72px} .toast__item{max-width:100%}}
.drawer{position:fixed; inset:0; z-index:150; display:block; visibility:hidden; pointer-events:none; opacity:0; transition:opacity .28s var(--ease), visibility .28s var(--ease)}
.drawer.is-on{visibility:visible; pointer-events:auto; opacity:1}
.drawer__overlay{position:absolute; inset:0; background:rgba(30,37,34,.46); backdrop-filter:blur(4px); opacity:0; transition:opacity .28s var(--ease)}
.drawer.is-on .drawer__overlay{opacity:1}
.drawer__panel{position:absolute; right:0; top:0; bottom:0; width:min(440px, 94vw); background:#fff; border-left:1px solid var(--line); box-shadow:-18px 0 48px rgba(30,37,34,.18); display:flex; flex-direction:column; overflow:hidden; transform:translateX(100%); transition:transform .34s var(--ease-out)}
.drawer.is-on .drawer__panel{transform:translateX(0)}
.drawer__head{display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--line); background:color-mix(in srgb, var(--bg) 70%, #fff)}
.drawer__body{overflow:auto; padding:14px 18px; flex:1; overscroll-behavior:contain}
.drawer__foot{padding:14px 18px; border-top:1px solid var(--line); background:#fff}
.citycell{display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:#fff; font-size:14px; font-weight:600; transition:transform var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease)}
.citycell:hover{transform:translateY(-1px); border-color:var(--ink-soft); box-shadow:0 6px 18px rgba(30,37,34,.08)}
.citycell img{width:24px; height:24px; border-radius:6px; object-fit:cover; border:1px solid var(--line); flex-shrink:0}
.drawer-city__item{border-radius:14px}
.drawer-city__item:hover{border-color:var(--accent)}
.modal{position:fixed; inset:0; z-index:160; display:none; place-items:center; padding:16px}
.modal.is-on{display:grid}
.modal__overlay{position:absolute; inset:0; background:rgba(30,37,34,.46)}
.modal__box{position:relative; width:min(520px, 96vw); max-height:90vh; overflow:auto; background:#fff; border:1px solid var(--line); border-radius:22px; box-shadow:0 18px 48px rgba(30,37,34,.22); padding:20px}
.modal__box--wide{width:min(880px, 96vw)}
.stickybar{position:fixed; left:0; right:0; bottom:0; z-index:90; background:rgba(255,255,255,.92); backdrop-filter:blur(12px); border-top:1px solid var(--line); display:none; padding:8px 12px calc(8px + env(safe-area-inset-bottom)); gap:8px}
.stickybar .btn{flex:1}
@media(max-width:640px){.stickybar{display:flex}}
.badge{font-size:11px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; padding:4px 8px; border-radius:999px; background:#fff; border:1px solid var(--line)}
/* 07-components — поля, чекбоксы, кнопка наверх */
.field{display:grid; gap:6px}
.field label{font-size:13px; font-weight:600}
.field input,.field textarea,.field select{height:48px; border:1.5px solid var(--line); border-radius:12px; padding:0 12px; font-size:15px; background:#fff; width:100%}
.field textarea{height:auto; min-height:96px; padding:12px; resize:vertical}
.field input:hover,.field textarea:hover{border-color:var(--ink-soft)}
.field input:focus,.field textarea:focus{border-color:var(--deep); box-shadow:0 0 0 4px color-mix(in srgb, var(--deep) 14%, transparent); outline:0}
.field--error input{border-color:var(--danger)}
.field__err{font-size:13px; color:var(--danger)}
.check{display:flex; gap:8px; align-items:flex-start; font-size:13px}
.check input{width:18px; height:18px; margin-top:2px}
.range{width:100%}
.chip-radio{height:40px; padding:0 14px; border-radius:999px; border:1px solid var(--line); background:#fff; font-weight:600; cursor:pointer}
.chip-radio.is-on{background:var(--ink); color:#fff; border-color:var(--ink)}
.to-top{position:fixed; right:16px; bottom:88px; width:48px; height:48px; border-radius:50%; background:var(--ink); color:#fff; border:0; display:grid; place-items:center; cursor:pointer; box-shadow:0 8px 24px rgba(30,37,34,.18); opacity:0; pointer-events:none; transition:opacity var(--t-base) var(--ease), transform var(--t-base) var(--ease); z-index:80}
.to-top.is-on{opacity:1; pointer-events:auto}
.to-top:hover{transform:translateY(-2px)}
@media(min-width:641px){.to-top{right:24px; bottom:24px}}
.hero__slider{position:absolute; inset:0; z-index:0}
.hero__slide{position:absolute; inset:0; opacity:0; transition:opacity .8s var(--ease); background-size:cover; background-position:center}
.hero__slide.is-on{opacity:1}
.hero__dots{position:absolute; left:50%; bottom:16px; transform:translateX(-50%); display:flex; gap:8px; z-index:3}
.hero__dot{width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.4); border:0; cursor:pointer}
.hero__dot.is-on{background:#fff}
.hero__nav{position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:rgba(0,0,0,.2); color:#fff; display:grid; place-items:center; cursor:pointer; backdrop-filter:blur(6px)}
.hero__nav--prev{left:12px}
.hero__nav--next{right:12px}
.hero__nav:hover{background:rgba(0,0,0,.35)}
/* 08-pages-fine — доводки */
.pcard__specs{white-space:nowrap; gap:10px}
.head-phone__hint{white-space:nowrap}
.crumbs{overflow:hidden; text-overflow:ellipsis}
.table-wrap{position:relative}
.table-wrap::after{content:'→ листайте'; position:absolute; right:8px; top:8px; font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; background:var(--ink); color:#fff; padding:4px 8px; border-radius:999px; opacity:0; pointer-events:none; transition:opacity var(--t-base)}
.table-wrap.is-scrollable::after{opacity:1}
@media(hover:hover){.pcard:hover{transform:translateY(-3px)}}
@media(max-width:360px){.pcard__specs{white-space:normal}}
.cookie{position:fixed; left:12px; right:12px; bottom:12px; z-index:120; background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px 14px; display:flex; gap:12px; align-items:center; box-shadow:0 18px 48px rgba(30,37,34,.12)}
.cookie p{margin:0; font-size:13px; color:var(--ink-soft); flex:1}
.cookie .btn{flex:0 0 auto}
/* 09-themes — производные */
a:hover{color:var(--accent)}
.nav__link.is-on{color:var(--accent)}
.citybtn[aria-expanded=true]{border-color:var(--deep); box-shadow:0 0 0 3px color-mix(in srgb, var(--deep) 14%, transparent)}
.iconbtn:hover{border-color:var(--deep)}
.chip.is-on{background:var(--deep); border-color:var(--deep)}
.btn--primary{--btn-accent:var(--accent)}
.badge--accent{background:var(--accent)}
.meter i{background:var(--accent)}
.pcard__price b{color:var(--ink)}
.hero__metrics strong{color:#fff}
/* 10-utilities */
.mt-0{margin-top:0} .mt-2{margin-top:16px} .mt-4{margin-top:32px} .mt-8{margin-top:64px}
.mb-0{margin-bottom:0} .mb-2{margin-bottom:16px} .mb-4{margin-bottom:32px}
.tac{text-align:center} .tal{text-align:left} .tar{text-align:right}
.hide-mobile{display:block}
.hide-desk{display:none}
@media(max-width:640px){.hide-mobile{display:none !important} .hide-desk{display:block !important}}
.visually-hidden{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.noscroll{overflow:hidden}
/* 11-compare-fav */
.compare{width:100%; min-width:720px; border-collapse:collapse; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden}
.compare th,.compare td{padding:12px; border-top:1px solid var(--line); border-left:1px solid var(--line); text-align:left; font-size:14px}
.compare th:first-child,.compare td:first-child{position:sticky; left:0; background:#fff; z-index:1; border-left:0}
.compare th{background:var(--bg-alt); font-weight:800}
.compare__remove{border:0; background:transparent; color:var(--danger); cursor:pointer; font-weight:700}
.fav-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
@media(max-width:1024px){.fav-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.fav-grid{grid-template-columns:1fr 1fr} .compare{font-size:13px}}
@media(max-width:420px){.fav-grid{grid-template-columns:1fr}}