@charset "utf-8";

/* ============================================================
   Зоомагазин на Зеленоградской — «Шоссейная, 12»
   Полочная типографика: прямые углы, волоски вместо теней,
   единственный цвет — терракота полочного ранта.
   ============================================================ */

@font-face{font-family:"Golos Text";src:url("../fonts/golostext-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Golos Text";src:url("../fonts/golostext-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Golos Text";src:url("../fonts/golostext-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Literata";src:url("../fonts/literata-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Literata";src:url("../fonts/literata-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("../fonts/jetbrainsmono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

/* ---------- токены: светлая тема ---------- */
:root{
  --bg:#F7F5F2;
  --surface:#FFFFFF;
  --surface-2:#EFEBE6;
  --border:#DDD7CF;
  --border-strong:#B9B1A6;
  --text:#1A1714;
  --text-2:#5C544B;
  --text-muted:#6E665C;
  --accent:#B4402A;
  --accent-hover:#93331F;
  --accent-quiet:#F6E4DF;
  --on-accent:#FFFFFF;
  --secondary:#1F5C7A;
  --ok:#2E6B4F;
  --warn:#7A5A10;
  --overlay:rgba(26,23,20,.55);
  --focus:#1F5C7A;
  --tile:#FFFFFF;
  --shadow-drawer:-24px 0 48px -24px rgba(0,0,0,.35);
  --shadow-rail:0 1px 0 var(--border);
  --font-head:"Literata",Georgia,"Times New Roman",serif;
  --font-ui:"Golos Text",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --fs-display:clamp(38px,6vw,68px);
  --fs-h1:clamp(32px,4.4vw,48px);
  --fs-h2:clamp(26px,3vw,34px);
  --fs-h3:22px;
  --fs-h4:18px;
  --fs-lead:clamp(18px,2vw,20px);
  --fs-body:17px;
  --fs-sm:15px;
  --fs-cap:13px;
  --fs-label:13px;
  --fs-num:clamp(20px,2.4vw,26px);
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;
  --s-7:48px;--s-8:64px;--s-9:96px;--s-10:128px;
  --r-0:0;--r-1:2px;--r-2:4px;--r-pill:999px;
  --t-fast:160ms;--t-base:240ms;
  --ease:cubic-bezier(.2,.6,.2,1);
  --rail-w:56px;
  --bar-h:56px;
}
/* ---------- токены: тёмная тема, «зал после закрытия» ---------- */
[data-theme="dark"]{
  --bg:#14120F;
  --surface:#1D1A16;
  --surface-2:#262219;
  --border:#35302A;
  --border-strong:#4E473E;
  --text:#F0EBE4;
  --text-2:#B5ADA2;
  --text-muted:#948B80;
  --accent:#E8785A;
  --accent-hover:#F49478;
  --accent-quiet:#2E1F19;
  --on-accent:#14120F;
  --secondary:#6FB3D6;
  --ok:#63BE95;
  --warn:#D8AE4C;
  --overlay:rgba(0,0,0,.70);
  --focus:#6FB3D6;
  --tile:#FFFFFF;
  --shadow-drawer:-24px 0 48px -24px rgba(0,0,0,.6);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#14120F;
    --surface:#1D1A16;
    --surface-2:#262219;
    --border:#35302A;
    --border-strong:#4E473E;
    --text:#F0EBE4;
    --text-2:#B5ADA2;
    --text-muted:#948B80;
    --accent:#E8785A;
    --accent-hover:#F49478;
    --accent-quiet:#2E1F19;
    --on-accent:#14120F;
    --secondary:#6FB3D6;
    --ok:#63BE95;
    --warn:#D8AE4C;
    --overlay:rgba(0,0,0,.70);
    --focus:#6FB3D6;
    --tile:#FFFFFF;
    --shadow-drawer:-24px 0 48px -24px rgba(0,0,0,.6);
  }
}

/* ---------- база ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.theme-switching *,html.theme-switching *::before,html.theme-switching *::after{transition:none!important}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--font-ui);font-size:var(--fs-body);line-height:1.65;
  font-weight:400;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
@media (max-width:767px){body{font-size:16px}}
img{max-width:100%;height:auto}
h1,h2,h3,h4{margin:0;font-family:var(--font-head);font-weight:600;hyphens:none;text-wrap:balance}
h1{font-size:var(--fs-h1);line-height:1.12;letter-spacing:-.015em;font-weight:700;max-width:22ch}
h2{font-size:var(--fs-h2);line-height:1.2;letter-spacing:-.01em;max-width:22ch}
h3{font-size:var(--fs-h3);line-height:1.3}
h4{font-size:var(--fs-h4);line-height:1.35;font-family:var(--font-ui);font-weight:600}
p{margin:0 0 var(--s-4);max-width:68ch}
ul,ol{margin:0 0 var(--s-4);padding-left:1.25em;max-width:68ch}
li{margin-bottom:var(--s-2)}
a{color:var(--secondary);text-underline-offset:3px}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
::selection{background:var(--accent-quiet);color:var(--text)}
.mono{font-family:var(--font-mono);font-weight:500;font-variant-numeric:tabular-nums}
.tnum{font-variant-numeric:tabular-nums}
.muted{color:var(--text-muted)}
.dim{color:var(--text-2)}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- контейнер и секции ---------- */
.wrap{max-width:1240px;margin:0 auto;padding-inline:16px}
@media (min-width:768px){.wrap{padding-inline:24px}}
@media (min-width:1024px){.wrap{padding-right:72px}}

.sect{padding-block:var(--s-7);border-top:1px solid var(--border)}
@media (min-width:1024px){.sect{padding-block:var(--s-9)}}
.sect--first{border-top:0}
.sect__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4)}
@media (min-width:1024px){.sect__grid{grid-template-columns:104px minmax(0,1fr);gap:var(--s-6)}}
.sect__rail{display:flex;gap:var(--s-3);align-items:baseline}
@media (min-width:1024px){.sect__rail{flex-direction:column;position:sticky;top:104px;align-self:start}}
.sect__num{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;color:var(--accent)}
.sect__tag{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.sect__body>h1,.sect__body>h2{margin-bottom:var(--s-5)}
.sect__body>h1::after,.sect__body>h2::after{content:"";display:block;height:2px;background:var(--accent);margin-top:var(--s-3);width:72px}
.sect__body>h1::after{width:min(100%,520px);height:3px}
.h1--display{font-size:var(--fs-display);line-height:1.05;letter-spacing:-.02em;max-width:16ch}
.lead{font-size:var(--fs-lead);line-height:1.55;color:var(--text-2);max-width:60ch}

/* ---------- шапка ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:120}
.skip:focus{left:8px;top:8px;min-height:48px;display:inline-flex;align-items:center;padding:0 20px;background:var(--accent);color:var(--on-accent);
  font-family:var(--font-mono);font-size:var(--fs-label);letter-spacing:.08em;text-transform:uppercase;
  text-decoration:none;border-radius:var(--r-1)}
.hdr{position:sticky;top:0;z-index:60;background:var(--surface);border-bottom:1px solid var(--border)}
.hdr.is-stuck{border-bottom-color:var(--border-strong);box-shadow:var(--shadow-rail)}
.hdr__in{max-width:1240px;margin:0 auto;padding-inline:16px;height:60px;display:flex;align-items:center;gap:var(--s-4)}
@media (min-width:768px){.hdr__in{padding-inline:24px}}
@media (min-width:1024px){.hdr__in{height:72px;padding-right:72px}.hdr.is-stuck .hdr__in{height:60px}}
.hdr__in{transition:height var(--t-fast) var(--ease)}

.brand{display:flex;align-items:center;gap:10px;min-height:48px;text-decoration:none;color:var(--text);flex:0 0 auto}
.brand svg{display:block;flex:0 0 auto}
.brand__tx{display:flex;flex-direction:column;line-height:1}
.brand__sup{font-family:var(--font-mono);font-weight:500;font-size:10px;letter-spacing:.14em;color:var(--text-muted)}
.brand__nm{font-family:var(--font-head);font-weight:700;font-size:17px;letter-spacing:-.01em}
@media (max-width:479px){.brand__nm{font-size:15px}.brand__sup{display:none}}
@media (min-width:1024px){.brand__nm{font-size:19px}}

.nav{display:none;margin-left:var(--s-5);gap:18px;flex:1 1 auto}
@media (min-width:1024px){.nav{display:flex;flex-wrap:wrap;row-gap:2px}}
.nav a{font-size:var(--fs-sm);color:var(--text-2);text-decoration:none;padding:6px 2px;
  box-shadow:inset 0 -2px 0 transparent;transition:box-shadow var(--t-fast) var(--ease),color var(--t-fast) var(--ease)}
.nav a:hover{color:var(--text);box-shadow:inset 0 -2px 0 var(--border-strong)}
.nav a[aria-current="page"]{color:var(--text);font-weight:500;box-shadow:inset 0 -2px 0 var(--accent)}

.hdr__right{margin-left:auto;display:flex;align-items:center;gap:var(--s-2)}
.hdr__hours{display:none;font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  color:var(--text-muted);letter-spacing:.02em}
@media (min-width:1360px){.hdr__hours{display:block}}

.iconbtn{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;
  background:none;border:0;border-radius:var(--r-1);color:var(--text);cursor:pointer;padding:0}
.iconbtn:hover{background:var(--surface-2)}
.iconbtn:active{transform:translateY(1px)}
.iconbtn svg{display:block}
.menubtn{gap:8px;width:auto;padding:0 12px}
.menubtn .menubtn__tx{display:none;font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase}
@media (min-width:1024px){.menubtn{border:1px solid var(--border)}.menubtn .menubtn__tx{display:inline}}

/* ---------- выезжающая панель «Указатель» ---------- */
.ovl{position:fixed;inset:0;background:var(--overlay);opacity:0;visibility:hidden;
  transition:opacity 200ms var(--ease),visibility 200ms;z-index:90}
.ovl.is-open{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(380px,88vw);z-index:100;
  background:var(--surface);border-left:1px solid var(--border);
  border-top-left-radius:var(--r-2);border-bottom-left-radius:var(--r-2);
  box-shadow:var(--shadow-drawer);transform:translateX(100%);
  transition:transform var(--t-base) var(--ease);
  display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
.drawer[hidden]{display:none}
.drawer.is-open{transform:translateX(0)}
.drawer__hd{position:sticky;top:0;background:var(--surface);display:flex;align-items:center;
  justify-content:space-between;padding:6px 8px 6px 20px;border-bottom:1px solid var(--border)}
.drawer__ttl{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.drawer__nav{list-style:none;margin:0;padding:var(--s-3) 0;max-width:none}
.drawer__nav li{margin:0}
.drawer__nav a{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:10px 20px;
  text-decoration:none;color:var(--text);border-left:3px solid transparent;min-height:48px;align-items:center}
.drawer__nav a:hover{background:var(--surface-2)}
.drawer__nav a[aria-current="page"]{border-left-color:var(--accent);background:var(--surface-2)}
.drawer__nav .n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);color:var(--accent)}
.drawer__nav .t{font-weight:500;font-size:var(--fs-sm);line-height:1.3}
.drawer__nav .d{display:block;font-weight:400;font-size:var(--fs-cap);color:var(--text-muted);line-height:1.35;margin-top:2px}
.drawer__sec{padding:var(--s-4) 20px;border-top:1px solid var(--border)}
.drawer__lbl{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--s-3)}
.seg{display:flex;border:1px solid var(--border-strong);border-radius:var(--r-1);overflow:hidden}
.seg button{flex:1;min-height:44px;background:none;border:0;border-right:1px solid var(--border);
  font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);letter-spacing:.04em;
  color:var(--text-2);cursor:pointer;padding:0 4px}
.seg button:last-child{border-right:0}
.seg button:hover{background:var(--surface-2);color:var(--text)}
.seg button[aria-checked="true"]{background:var(--accent);color:var(--on-accent)}
.drawer__contacts p{margin:0 0 var(--s-2);font-size:var(--fs-sm)}

/* ---------- кнопки ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:0 24px;border-radius:var(--r-1);border:0;cursor:pointer;
  font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;text-decoration:none;
  transition:background-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
.btn svg{flex:0 0 auto}
.btn--primary{background:var(--accent);color:var(--on-accent)}
.btn--primary:hover{background:var(--accent-hover);color:var(--on-accent)}
.btn--primary:active{background:var(--accent-hover);transform:translateY(1px)}
.btn--secondary{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1.5px var(--text)}
.btn--secondary:hover{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent)}
.btn--secondary:active{transform:translateY(1px)}
.btn--ghost{background:none;color:var(--accent);padding:0;min-height:44px;
  text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.btn--ghost:hover{color:var(--accent-hover);text-decoration-thickness:3px}
.btnrow{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-5)}

/* ---------- факт-плашки ---------- */
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--border);
  border:1px solid var(--border);margin:var(--s-6) 0}
@media (min-width:768px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.facts--3{grid-template-columns:repeat(1,minmax(0,1fr))}
@media (min-width:600px){.facts--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.fact{background:var(--surface-2);padding:var(--s-4) var(--s-4) var(--s-5)}
.fact__v{display:block;font-family:var(--font-mono);font-weight:500;font-size:var(--fs-num);
  font-variant-numeric:tabular-nums;line-height:1.1;color:var(--text)}
.fact__k{display:block;margin-top:var(--s-2);font-size:var(--fs-cap);color:var(--text-2);line-height:1.35}

/* ---------- карточки ---------- */
.cards{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4);margin-top:var(--s-5)}
@media (min-width:600px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}}
.card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-1);
  padding:var(--s-5);box-shadow:inset 0 3px 0 transparent;transition:box-shadow var(--t-fast) var(--ease)}
.card:hover,.card:focus-within{box-shadow:inset 0 3px 0 var(--accent)}
.card:focus-within{outline:2px solid var(--focus);outline-offset:2px}
.card__n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;color:var(--accent);display:block;margin-bottom:var(--s-3)}
.card__t{font-size:var(--fs-h3);margin-bottom:var(--s-2)}
.card__t a{color:inherit;text-decoration:none}
.card__t a::after{content:"";position:absolute;inset:0}
.card__t a:focus-visible{outline:0}
.card__d{font-size:var(--fs-sm);color:var(--text-2);margin:0}
.card__ar{position:absolute;right:var(--s-5);bottom:var(--s-5);color:var(--accent);
  font-family:var(--font-mono);transition:transform var(--t-fast) var(--ease)}
.card:hover .card__ar{transform:translateX(4px)}
.card--link{padding-bottom:var(--s-8)}

/* ---------- нумерованные списки-ряды ---------- */
.rows{list-style:none;margin:var(--s-5) 0 0;padding:0;max-width:none}
.rows li{display:grid;grid-template-columns:38px minmax(0,1fr);gap:var(--s-3);
  padding:var(--s-4) 0;border-top:1px solid var(--border);margin:0}
.rows li:last-child{border-bottom:1px solid var(--border)}
.rows .n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);color:var(--accent);padding-top:5px}
.rows .t{font-family:var(--font-head);font-weight:600;font-size:var(--fs-h4)}
.rows .d{display:block;font-family:var(--font-ui);font-weight:400;font-size:var(--fs-sm);
  color:var(--text-2);margin-top:2px}
@media (min-width:900px){.rows--2col{columns:2;column-gap:var(--s-7)}
  .rows--2col li{break-inside:avoid}}

/* ---------- шаги ---------- */
.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--border);
  border:1px solid var(--border);margin-top:var(--s-5)}
@media (min-width:768px){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
.step{background:var(--surface);padding:var(--s-5)}
.step__n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;color:var(--accent);display:block;margin-bottom:var(--s-3)}
.step h3{font-size:var(--fs-h4);font-family:var(--font-ui);font-weight:600;margin-bottom:var(--s-2)}
.step p{font-size:var(--fs-sm);color:var(--text-2);margin:0}

/* ---------- ступени класса корма ---------- */
.scale{display:grid;grid-template-columns:minmax(0,1fr);gap:1px;background:var(--border);
  border:1px solid var(--border);margin-top:var(--s-5)}
@media (min-width:600px){.scale{grid-template-columns:repeat(3,minmax(0,1fr))}}
.scale__i{background:var(--surface-2);padding:var(--s-5) var(--s-4);border-top:3px solid var(--border-strong)}
.scale__i:nth-child(2){border-top-color:var(--accent-hover)}
.scale__i:nth-child(3){border-top-color:var(--accent)}
.scale__i b{display:block;font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text)}
.scale__i span{display:block;font-size:var(--fs-cap);color:var(--text-2);margin-top:var(--s-2)}

/* ---------- фотографии ---------- */
figure{margin:0}
.ph{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-1);
  box-shadow:inset 0 3px 0 transparent;transition:box-shadow var(--t-fast) var(--ease)}
.ph:hover{box-shadow:inset 0 3px 0 var(--accent)}
.ph img{display:block;width:100%;height:auto;background:var(--surface-2)}
.ph figcaption{font-size:var(--fs-cap);line-height:1.45;color:var(--text-2);
  padding:var(--s-3) var(--s-4);border-top:1px solid var(--border)}
.ph__btn{display:block;width:100%;padding:0;margin:0;border:0;background:none;cursor:zoom-in}
.ph__btn:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}

.g-hall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4);margin-top:var(--s-5)}
@media (min-width:1024px){.g-hall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1280px){.g-hall{grid-template-columns:repeat(4,minmax(0,1fr))}}
.g-hall .ph img{max-width:450px;margin-inline:auto}

.g-wide{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4);margin-top:var(--s-5)}
@media (min-width:900px){.g-wide{grid-template-columns:repeat(2,minmax(0,1fr))}}
.g-wide .ph img{max-width:675px;margin-inline:auto}

.g-duo{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4);margin-top:var(--s-5)}
@media (min-width:700px){.g-duo{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* лента-полка на главной */
.shelfstrip{margin-top:var(--s-6);overflow-x:auto;overscroll-behavior-x:contain;
  padding-bottom:var(--s-3);scrollbar-width:thin}
.shelfstrip ul{display:flex;gap:var(--s-4);list-style:none;margin:0;padding:0;max-width:none}
.shelfstrip li{flex:0 0 auto;width:min(78vw,340px);margin:0}
.shelfstrip img{display:block;width:100%;height:230px;object-fit:cover;object-position:center 40%;
  background:var(--surface-2);border:1px solid var(--border)}
.shelfstrip figcaption{font-size:var(--fs-cap);color:var(--text-2);margin-top:var(--s-2);line-height:1.4}

/* два столбца текст+фото */
.split{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-6);align-items:start}
@media (min-width:900px){.split{grid-template-columns:minmax(0,1fr) minmax(0,420px)}}
.split--wide{grid-template-columns:minmax(0,1fr)}
@media (min-width:900px){.split--wide{grid-template-columns:minmax(0,1fr) minmax(0,460px)}}

/* ---------- бренды ---------- */
.brandlist{list-style:none;margin:var(--s-5) 0 0;padding:0;max-width:none;columns:1;column-gap:var(--s-7)}
@media (min-width:600px){.brandlist{columns:2}}
@media (min-width:1024px){.brandlist{columns:3}}
.brandlist li{break-inside:avoid;display:grid;grid-template-columns:34px minmax(0,1fr);gap:var(--s-2);
  padding:10px 0;border-bottom:1px solid var(--border);margin:0}
.brandlist .n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);color:var(--text-muted)}
.brandlist .t{font-family:var(--font-head);font-weight:600;font-size:var(--fs-h4)}
.brandwall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-3);margin-top:var(--s-5);
  list-style:none;padding:0;max-width:none}
@media (min-width:600px){.brandwall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:900px){.brandwall{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:1280px){.brandwall{grid-template-columns:repeat(5,minmax(0,1fr))}}
.brandwall li{margin:0;background:var(--tile);border:1px solid var(--border);border-radius:var(--r-1);
  padding:var(--s-4);display:flex;align-items:center;justify-content:center;min-height:96px}
.brandwall img{display:block;width:100%;max-width:200px;height:auto;mix-blend-mode:normal}

/* ---------- FAQ ---------- */
.faq{margin-top:var(--s-5)}
.faq details{border-bottom:1px solid var(--border)}
.faq details[open]{border-bottom:2px solid var(--accent)}
.faq summary{display:grid;grid-template-columns:38px minmax(0,1fr) 24px;gap:var(--s-3);align-items:center;
  min-height:56px;padding:var(--s-3) 0;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.faq .n{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);color:var(--accent)}
.faq .q{font-family:var(--font-head);font-weight:600;font-size:var(--fs-h4)}
.faq .pl{justify-self:end;color:var(--accent);transition:transform var(--t-fast) var(--ease)}
.faq details[open] .pl{transform:rotate(45deg)}
.faq .a{padding:0 0 var(--s-4) 50px}
.faq .a p:last-child{margin-bottom:0}

/* ---------- блок контактов ---------- */
.contact{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r-1);
  padding:var(--s-5);margin-top:var(--s-5)}
.contact dl{margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4)}
@media (min-width:700px){.contact dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
.contact dt{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--s-2)}
.contact dd{margin:0;font-size:var(--fs-sm);line-height:1.5}
.bigtel{display:inline-flex;align-items:center;min-height:44px;font-family:var(--font-mono);
  font-weight:500;font-size:var(--fs-num);font-variant-numeric:tabular-nums;color:var(--text);
  text-decoration:none;box-shadow:inset 0 -2px 0 var(--accent)}
.bigtel:hover{color:var(--accent)}
.routes{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3);margin-top:var(--s-5);
  list-style:none;padding:0;max-width:none}
@media (min-width:600px){.routes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.routes{grid-template-columns:repeat(4,minmax(0,1fr))}}
.routes li{margin:0}
.routes a{display:flex;align-items:center;gap:10px;min-height:56px;padding:var(--s-3) var(--s-4);
  background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--r-1);
  color:var(--text);text-decoration:none;font-size:var(--fs-sm);font-weight:500}
.routes a:hover{border-color:var(--accent);color:var(--accent)}
.routes .ext{margin-left:auto;color:var(--text-muted);font-size:var(--fs-cap)}
.coords{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3);margin-top:var(--s-5)}
.coords .v{font-family:var(--font-mono);font-weight:500;font-variant-numeric:tabular-nums;font-size:var(--fs-sm)}
.copybtn{min-height:44px;padding:0 16px;border:1px solid var(--border-strong);background:var(--surface);
  color:var(--text);border-radius:var(--r-1);cursor:pointer;
  font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);letter-spacing:.06em;text-transform:uppercase}
.copybtn:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- «куда дальше» ---------- */
.next{background:var(--surface-2);border-top:1px solid var(--border);padding-block:var(--s-7)}
.next h2{font-size:var(--fs-h2);margin-bottom:var(--s-5)}
.next h2::after{content:"";display:block;width:72px;height:2px;background:var(--accent);margin-top:var(--s-3)}
.next .card{background:var(--surface)}

/* ---------- подвал ---------- */
.ftr{background:var(--surface-2);border-top:1px solid var(--border);padding-block:var(--s-7) var(--s-5)}
.ftr__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-6)}
@media (min-width:900px){.ftr__grid{grid-template-columns:1.1fr 1.4fr 1fr}}
.ftr__lbl{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--s-3)}
.ftr__map{list-style:none;margin:0;padding:0;columns:2;column-gap:var(--s-5);max-width:none}
.ftr__map li{margin-bottom:var(--s-2);break-inside:avoid}
.ftr__map a{display:inline-grid;grid-template-columns:28px minmax(0,1fr);gap:6px;
  color:var(--text-2);text-decoration:none;font-size:var(--fs-sm);min-height:28px;align-items:center}
.ftr__map a:hover{color:var(--accent)}
.ftr__map .n{font-family:var(--font-mono);font-weight:500;font-size:11px;color:var(--text-muted)}
.ftr__bot{margin-top:var(--s-6);padding-top:var(--s-4);border-top:1px solid var(--border);
  display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);align-items:center;
  font-size:var(--fs-cap);color:var(--text-muted)}
.ftr__bot a{display:inline-flex;align-items:center;min-height:44px}
.ftr__map a{min-height:44px}
.ftr p{font-size:var(--fs-sm);color:var(--text-2)}

/* ---------- рельс быстрых действий ---------- */
.qr{position:fixed;z-index:55;transition:transform var(--t-base) var(--ease)}
@media (min-width:1024px){
  .qr{right:0;top:50%;transform:translateY(-50%);width:var(--rail-w);
    background:var(--surface);border:1px solid var(--border);border-right:0;
    border-top-left-radius:var(--r-1);border-bottom-left-radius:var(--r-1);
    display:flex;flex-direction:column}
  .qr.is-hidden{transform:translate(100%,-50%)}
}
@media (max-width:1023px){
  .qr{left:0;right:0;bottom:0;height:calc(var(--bar-h) + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
    background:var(--surface);border-top:1px solid var(--border);display:flex}
  .qr.is-hidden{transform:translateY(100%)}
  body{padding-bottom:calc(var(--bar-h) + env(safe-area-inset-bottom))}
}
.qr__b{flex:1 1 auto;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;
  background:none;border:0;color:var(--text);cursor:pointer;text-decoration:none;padding:0;
  font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);letter-spacing:.06em;text-transform:uppercase}
@media (min-width:1024px){.qr__b{flex:0 0 auto;width:var(--rail-w);height:52px;
  border-bottom:1px solid var(--border)}.qr__b:last-child{border-bottom:0}.qr__tx{display:none}}
.qr__b:hover{background:var(--surface-2);color:var(--accent)}
.qr__b:active{transform:translateY(1px)}
.qr__b[hidden]{display:none}
.qr__b + .qr__b{border-left:1px solid var(--border)}
@media (min-width:1024px){.qr__b + .qr__b{border-left:0}}

.pop{position:fixed;z-index:58;background:var(--surface);border:1px solid var(--border-strong);
  border-radius:var(--r-1);box-shadow:var(--shadow-drawer);padding:var(--s-2);min-width:230px}
.pop[hidden]{display:none}
@media (min-width:1024px){.pop{right:calc(var(--rail-w) + 8px);top:50%;transform:translateY(-50%)}}
@media (max-width:1023px){.pop{left:8px;right:8px;bottom:calc(var(--bar-h) + env(safe-area-inset-bottom) + 8px)}}
.pop ul{list-style:none;margin:0;padding:0;max-width:none}
.pop li{margin:0}
.pop a{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 12px;
  color:var(--text);text-decoration:none;font-size:var(--fs-sm);border-radius:var(--r-1)}
.pop a:hover{background:var(--surface-2);color:var(--accent)}

/* ---------- лайтбокс ---------- */
.lb{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;color:var(--text)}
.lb::backdrop{background:var(--overlay)}
.lb__in{position:relative;height:100%;display:flex;align-items:center;justify-content:center;padding:56px 8px}
.lb__fig{margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-2);
  max-width:min(96vw,720px);max-height:100%;overflow:auto}
.lb__fig img{display:block;width:auto;height:auto;max-width:100%;margin-inline:auto}
.lb__fig figcaption{font-size:var(--fs-sm);color:var(--text-2);padding:var(--s-3) var(--s-4);
  border-top:1px solid var(--border)}
.lb__x{position:absolute;top:4px;right:4px;background:var(--surface);border:1px solid var(--border)}
.lb__nav{position:absolute;top:50%;transform:translateY(-50%);background:var(--surface);
  border:1px solid var(--border)}
.lb__nav--p{left:4px}.lb__nav--n{right:4px}
.lb__c{position:absolute;top:10px;left:50%;transform:translateX(-50%);
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-pill);
  padding:5px 14px;font-family:var(--font-mono);font-weight:500;font-size:var(--fs-label);
  font-variant-numeric:tabular-nums;color:var(--text-2)}

/* ---------- появление при скролле ---------- */
.rv{opacity:0;transform:translateY(8px);transition:opacity var(--t-base) var(--ease),transform var(--t-base) var(--ease)}
.rv.is-in{opacity:1;transform:none}

/* ---------- 404 ---------- */
.big404{font-family:var(--font-mono);font-weight:500;font-size:clamp(56px,14vw,140px);
  line-height:1;color:var(--accent-quiet);letter-spacing:-.03em}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv{opacity:1;transform:none}
}

/* ссылки внутри текста — тач-цель по высоте строки не меньше 44 px */
.sect__body p > a[target="_blank"]{display:inline-flex;align-items:center;min-height:44px}