/* ============================================================
   Новая главная раздела-страны (src/home.mjs, 22.10.2026) — по образцу
   zeely.ai: липкая шапка с мега-меню, первый экран с формой и лентой
   объявлений, тур по продукту бенто-блоками, большой подвал.
   Шрифт и зелёный — как в приложении Amity (apps/mobile/src/theme/tokens.ts).
   Остальные страницы сайта живут на site.css и landing.css.
   ============================================================ */

@font-face{font-family:'DM Sans';src:url('/assets/fonts/DMSans-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/DMSans-500.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/DMSans-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/assets/fonts/DMSans-800.ttf') format('truetype');font-weight:800 900;font-style:normal;font-display:swap}

:root{
  --bg:#FFFFFF; --bg-alt:#F7F7F5; --card:#FFFFFF; --fill:#F2F2F0;
  --ink:#111111; --mid:#55555A; --soft:#6E6E73; --line:#E6E6E3;
  --accent:#0E9F6E; --accent-ink:#0B7B55; --mint-soft:#DFF5E8; --tint:#F2FBF6; --tint-line:#BEEBD3;
  --cta:#111111; --cta-ink:#FFFFFF; --cta-hover:#2A2A2C;
  --band:#111111; --band-2:#1F1F20; --band-line:#353537; --band-ink:#FFFFFF; --band-mid:#C8C8CC; --band-hl:#8FE3B8;
  --bezel:#1A1A1A;
  --shadow:0 1px 2px rgba(17,17,17,.04), 0 10px 28px rgba(17,17,17,.07);
  /* DM Sans без кириллицы: у русского раздела весь текст — системным шрифтом, без смешения в одном слове. */
  --font:'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --r:22px; --r-sm:14px; --pill:60px;
}
html[lang="ru"]{--font:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#121312; --bg-alt:#181A18; --card:#1E201E; --fill:#262826;
    --ink:#F2F2EF; --mid:#BDBDB8; --soft:#A2A29D; --line:#2F312E;
    --accent:#3DD39A; --accent-ink:#7EE2B6; --mint-soft:#1C3A2D; --tint:#172520; --tint-line:#2C4A3C;
    --cta:#F2F2EF; --cta-ink:#111111; --cta-hover:#FFFFFF;
    --band:#1E201E; --band-2:#272927; --band-line:#3A3C3A; --band-ink:#F2F2EF; --band-mid:#BDBDB8; --band-hl:#8FE3B8;
    --bezel:#3A3C3A;
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 10px 28px rgba(0,0,0,.35);
    color-scheme:dark;
  }
}

*,*::before,*::after{box-sizing:border-box}
/* hidden сильнее любого display ниже: иначе панель с display:grid остаётся видна (вкладки, 22.10.2026) */
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%; scroll-padding-top:84px}
@media (prefers-reduced-motion: no-preference){html{scroll-behavior:smooth}}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--font); font-size:16px; line-height:1.55; -webkit-font-smoothing:antialiased}
a{color:inherit}
a:hover{color:var(--accent-ink)}
:focus-visible{outline:3px solid var(--accent); outline-offset:3px; border-radius:6px}
img{max-width:100%; display:block}
h1,h2,h3,p{margin:0}
h1,h2{text-wrap:balance; letter-spacing:-0.03em; font-weight:800}
ul,ol{margin:0}
figure{margin:0}

.wrap{max-width:1180px; margin:0 auto; padding-left:max(16px, env(safe-area-inset-left, 0px)); padding-right:max(16px, env(safe-area-inset-right, 0px))}
.band{padding-block:84px}
.band.alt{background:var(--bg-alt); border-block:1px solid var(--line)}
@media (max-width:640px){.band{padding-block:56px}}

.eyebrow{font-size:12px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--accent-ink); margin-bottom:12px}
.h2{font-size:clamp(28px, 4vw, 44px); line-height:1.08}
.lead{margin-top:14px; font-size:clamp(17px, 1.6vw, 19px); color:var(--mid); max-width:62ch}
.center{text-align:center}
.center .lead{margin-inline:auto}
.small{font-size:13px; color:var(--soft); margin-top:8px}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:0 24px; border-radius:var(--pill); background:var(--cta); color:var(--cta-ink); font-weight:700; font-size:16px; text-decoration:none; border:0; cursor:pointer; font-family:inherit; transition:background .15s}
.btn:hover{background:var(--cta-hover); color:var(--cta-ink)}
.btn.ghost{background:transparent; color:var(--ink); border:1.5px solid var(--ink)}
.btn.ghost:hover{background:var(--fill); color:var(--ink)}
.btn.sm{min-height:44px; padding:0 18px; font-size:15px}
.btn.inv{background:var(--band-ink); color:var(--band)}
.btn.inv:hover{background:var(--band-mid); color:var(--band)}
.more{font-weight:700; text-decoration:none; color:var(--ink)}
.more:hover{text-decoration:underline; color:var(--ink)}
.actions{display:flex; flex-wrap:wrap; align-items:center; gap:12px 22px; margin-top:28px}

.card{background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:24px}
.card h3{font-size:18px; font-weight:800; letter-spacing:-0.01em; margin-bottom:6px}
.card p{color:var(--mid); font-size:15px}

/* ---------- шапка ---------- */
.hdr{position:sticky; top:0; z-index:50; background:var(--bg); border-bottom:1px solid var(--line)}
.hdr-in{display:flex; align-items:center; gap:24px; min-height:68px}
.logo{font-size:26px; font-weight:800; letter-spacing:-0.04em; text-decoration:none; color:var(--ink); flex:none}
.logo span{color:var(--accent)}
.nav{display:flex; align-items:center; gap:4px}
.nav-btn,.nav a{font:inherit; font-size:15px; font-weight:600; color:var(--mid); background:transparent; border:0; border-radius:10px; padding:10px 12px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:4px; min-height:44px}
.nav-btn:hover,.nav a:hover,.nav-btn[aria-expanded="true"]{color:var(--ink); background:var(--fill)}
.chev{width:14px; height:14px; transition:transform .15s}
[aria-expanded="true"] > .chev{transform:rotate(180deg)}
.hdr-right{margin-left:auto; display:flex; align-items:center; gap:8px}
.country{font:inherit; font-size:14px; font-weight:700; color:var(--mid); background:transparent; border:1px solid var(--line); border-radius:var(--pill); padding:0 12px; min-height:40px; cursor:pointer; display:inline-flex; align-items:center; gap:4px}
.login{font-weight:700; text-decoration:none; color:var(--ink); padding:10px 8px; min-height:44px; display:inline-flex; align-items:center}
.burger{display:none; width:44px; height:44px; border-radius:12px; border:1px solid var(--line); background:transparent; color:var(--ink); cursor:pointer; align-items:center; justify-content:center}
.short{display:none}
@media (max-width:1020px){
  .nav,.hdr-right .country{display:none}
  .burger{display:inline-flex}
  .hdr-in{gap:12px}
}
@media (max-width:480px){
  .long{display:none} .short{display:inline}
  .hdr-right .btn{padding:0 14px}
  .logo{font-size:23px}
}

.mm{position:absolute; left:0; right:0; top:100%; background:var(--card); border-bottom:1px solid var(--line); box-shadow:var(--shadow); max-height:calc(100vh - 90px); overflow-y:auto}
.mm-in{display:grid; gap:24px; padding-block:26px 30px}
.mm-1{grid-template-columns:minmax(0,1fr)}
.mm-2{grid-template-columns:repeat(2, minmax(0,1fr))}
.mm-3{grid-template-columns:repeat(3, minmax(0,1fr))}
.mm-prof{grid-template-columns:repeat(7, minmax(0,1fr)); gap:18px}
.mm-h{margin:0 0 10px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-ink)}
.mm ul{list-style:none; padding:0; display:flex; flex-direction:column; gap:8px; font-size:15px}
.mm a{text-decoration:none}
.mm a:hover{text-decoration:underline}
.mm-item b{display:block; font-weight:700}
.mm-item span{display:block; font-size:13px; color:var(--soft)}
.mm-foot{grid-column:1/-1; border-top:1px solid var(--line); padding-top:14px; font-weight:700}
.mm-country ul{flex-direction:row; flex-wrap:wrap; gap:10px}
.mm-country a{display:block; border:1px solid var(--line); border-radius:var(--r-sm); padding:12px 16px}
.mm-country a[aria-current="page"]{border-color:var(--ink); font-weight:700}

@media (min-width:1021px){.drawer{display:none}}
.drawer{position:absolute; left:0; right:0; top:100%; background:var(--card); border-bottom:1px solid var(--line); box-shadow:var(--shadow); max-height:calc(100vh - 80px); overflow-y:auto}
.drawer .wrap{padding-block:12px 24px; display:flex; flex-direction:column}
.drawer details{border-bottom:1px solid var(--line)}
.drawer summary{list-style:none; cursor:pointer; font-weight:800; font-size:17px; padding:16px 0; display:flex; justify-content:space-between; align-items:center; gap:12px}
.drawer summary::-webkit-details-marker{display:none}
.drawer details[open] summary .chev{transform:rotate(180deg)}
.drawer ul{list-style:none; padding:0 0 14px; display:flex; flex-direction:column; gap:12px; font-size:16px}
.drawer a{text-decoration:none}
.drawer .plain{font-weight:800; font-size:17px; padding:16px 0; border-bottom:1px solid var(--line); text-decoration:none}
.drawer-cta{display:flex; flex-direction:column; gap:10px; margin-top:18px}

/* ---------- первый экран ---------- */
.hero{padding-block:56px 72px}
.hero-top{max-width:880px; margin:0 auto; text-align:center}
.proof{display:inline-flex; align-items:center; gap:8px; font-size:14px; font-weight:700; text-decoration:none; color:var(--ink); background:var(--mint-soft); border-radius:var(--pill); padding:8px 16px}
.proof:hover{color:var(--ink); background:var(--tint-line)}
.hero h1{margin-top:22px; font-size:clamp(36px, 6vw, 70px); line-height:1.02}
.hero-top .lead{margin:18px auto 0; max-width:700px}
.form{margin:28px auto 0; max-width:780px; display:flex; flex-wrap:wrap; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:24px; padding:8px; box-shadow:var(--shadow); text-align:left}
.field{flex:1 1 190px; display:flex; flex-direction:column; padding:6px 12px; border-radius:16px; min-width:0}
.field:focus-within{background:var(--fill); box-shadow:0 0 0 2px var(--accent)}
.field label{font-size:12px; font-weight:700; color:var(--soft)}
.field input{border:0; outline:0; background:transparent; font:inherit; font-size:17px; color:var(--ink); padding:2px 0; min-width:0}
.field input::placeholder{color:var(--soft)}
.form .btn{flex:1 1 230px; min-height:56px; border-radius:18px}
.under{margin-top:12px; font-size:14px; color:var(--mid)}
.terms{margin-top:6px; font-size:13px; color:var(--soft)}
.client{margin-top:14px; font-size:15px; color:var(--mid)}
.client a{font-weight:700; color:var(--ink)}

.rail-wrap{position:relative; margin-top:44px}
.rail{display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:12px; scrollbar-width:thin}
.rail > *{scroll-snap-align:start; flex:none}
.rail-nav{display:flex; justify-content:flex-end; gap:8px; margin-bottom:12px}
.rail-nav button{width:44px; height:44px; border-radius:50%; border:1px solid var(--line); background:var(--card); color:var(--ink); cursor:pointer; display:inline-flex; align-items:center; justify-content:center}
.rail-nav button:hover{background:var(--fill)}
.ad{width:212px; background:var(--card); border:1px solid var(--line); border-radius:18px; overflow:hidden; text-decoration:none; color:var(--ink); transition:transform .2s, box-shadow .2s}
.ad:hover{transform:translateY(-3px); box-shadow:var(--shadow); color:var(--ink)}
@media (prefers-reduced-motion: reduce){.ad,.ad:hover{transition:none; transform:none}}
.ad img{width:100%; aspect-ratio:4/5; object-fit:cover; background:var(--fill)}
.ad-body{display:block; padding:12px 14px 14px}
.ad-who{display:block; font-size:13px; color:var(--soft)}
.ad-num{display:block; font-weight:800; margin-top:2px; font-variant-numeric:tabular-nums}
.ad-go{display:block; font-size:13px; font-weight:700; color:var(--accent-ink); margin-top:6px}
.rail-cap{text-align:center}

/* ---------- полоса доверия ---------- */
.trust{padding-block:36px; background:var(--bg-alt); border-block:1px solid var(--line); text-align:center}
.platforms{font-size:15px; font-weight:700; color:var(--mid); letter-spacing:.02em}
.chips{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:18px}
.chip{font-size:14px; font-weight:600; text-decoration:none; background:var(--card); border:1px solid var(--line); border-radius:var(--pill); padding:9px 15px; color:var(--ink)}
a.chip:hover{border-color:var(--ink); color:var(--ink)}
.facts{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 28px; margin-top:20px; font-weight:800}
.facts span{display:inline-flex; align-items:center; gap:8px}
.facts svg{color:var(--accent); flex:none}
.cities{margin-top:12px; font-size:14px; color:var(--mid)}

/* ---------- от объявления до записи ---------- */
.step{width:248px; background:var(--card); border:1px solid var(--line); border-radius:var(--r); padding:16px; text-decoration:none; color:var(--ink)}
.step:hover{border-color:var(--ink); color:var(--ink)}
.step .n{display:inline-flex; width:28px; height:28px; border-radius:50%; background:var(--mint-soft); color:var(--accent-ink); font-weight:800; font-size:14px; align-items:center; justify-content:center}
.step img{width:100%; height:236px; object-fit:cover; object-position:top; border-radius:var(--r-sm); margin:12px 0; background:var(--fill)}
.step b{display:block; font-weight:700; line-height:1.35}
.split{display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:16px; margin-top:28px}
.split .us{background:var(--tint); border-color:var(--tint-line)}
.split ul{padding-left:20px; display:flex; flex-direction:column; gap:8px}

/* ---------- цена ---------- */
.price-band{padding-block:0 84px}
.price{background:var(--band); color:var(--band-ink); border-radius:28px; padding:clamp(24px, 4vw, 40px)}
.price .h2{color:var(--band-ink)}
.price .lead{color:var(--band-mid)}
.plans{display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px; margin-top:26px}
.plan{background:var(--band-2); border-radius:20px; padding:22px; border:2px solid transparent}
.plan.main{border-color:var(--band-hl)}
.plan .per{color:var(--band-mid); font-weight:700}
.plan .sum{font-size:44px; font-weight:800; letter-spacing:-0.03em; line-height:1.1; margin-top:4px; font-variant-numeric:tabular-nums}
.plan .trial{color:var(--band-hl); font-weight:700}
.plan .trial.off{color:var(--band-mid)}
.tiles{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:12px; margin-top:12px}
.tile{border:1px solid var(--band-line); border-radius:20px; padding:20px}
.tile-h{margin-bottom:6px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--band-hl)}
.no-traps{margin-top:18px; font-weight:700}
.price details{margin-top:14px; border-top:1px solid var(--band-line); padding-top:12px}
.price summary{cursor:pointer; font-weight:800}
.price details ul{margin-top:10px; padding-left:20px; color:var(--band-mid); display:flex; flex-direction:column; gap:6px; font-size:15px}
.price .more,.price .more:hover{color:var(--band-ink)}

/* ---------- реклама: вкладки ---------- */
.tabs{display:inline-flex; flex-wrap:wrap; gap:4px; background:var(--card); border:1px solid var(--line); border-radius:var(--pill); padding:5px; margin-top:28px}
.tabs [role="tab"]{font:inherit; font-weight:700; font-size:15px; min-height:42px; padding:0 18px; border:0; border-radius:var(--pill); background:transparent; color:var(--ink); cursor:pointer}
.tabs [role="tab"][aria-selected="true"]{background:var(--cta); color:var(--cta-ink)}
.tabpanel{margin-top:18px; display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr); gap:28px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:24px; padding:clamp(20px, 3vw, 32px)}
.tabpanel h3{font-size:22px; font-weight:800; margin-bottom:12px}
.tabpanel ul{padding-left:20px; display:flex; flex-direction:column; gap:10px; font-size:16px}
.tabpanel .vis{display:flex; justify-content:center}
@media (max-width:760px){.tabpanel{grid-template-columns:1fr}}
.ad-big{width:min(100%, 300px); aspect-ratio:4/5; object-fit:cover; border-radius:18px}
.pairs{display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:10px 28px; margin-top:20px; font-size:15px}
.know{margin-top:18px; background:var(--card); border:1px solid var(--line); border-radius:16px; padding:14px 18px}
.know summary{cursor:pointer; font-weight:700}
.know ul{margin-top:10px; padding-left:20px; color:var(--mid); font-size:15px; display:flex; flex-direction:column; gap:5px}

/* ---------- телефон ---------- */
.phone{border:7px solid var(--bezel); border-radius:32px; overflow:hidden; background:var(--card); flex:none; max-width:100%}
.phone img{width:100%; height:100%; object-fit:cover; object-position:top}
.ph-l{width:240px; height:500px}
.ph-m{width:210px; height:440px}
.ph-s{width:180px; height:380px}
.cap{font-size:12px; color:var(--soft); text-align:center; margin-top:8px}

/* ---------- бенто ---------- */
.bento{display:flex; flex-wrap:wrap; gap:16px; margin-top:32px}
.bento-main{flex:999 1 560px; min-width:0; background:var(--card); border:1px solid var(--line); border-radius:26px; padding:26px; display:flex; flex-wrap:wrap; gap:28px; align-items:flex-start}
.bento-main ol{flex:1 1 260px; min-width:0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:16px; counter-reset:s}
.bento-main li{counter-increment:s; display:grid; grid-template-columns:32px 1fr; gap:12px}
.bento-main li::before{content:counter(s); width:32px; height:32px; border-radius:50%; background:var(--mint-soft); color:var(--accent-ink); font-weight:800; display:flex; align-items:center; justify-content:center}
.bento-side{flex:1 1 300px; min-width:0; display:flex; flex-direction:column; gap:16px}
.bento-side img{width:100%; height:156px; object-fit:cover; object-position:top; border-radius:12px; border:1px solid var(--line); margin-top:14px; background:var(--fill)}

/* ---------- страница записи ---------- */
.reserve{display:flex; flex-wrap:wrap; gap:44px; align-items:center}
.reserve-text{flex:1 1 440px; min-width:0}
.reserve ol{margin-top:26px; padding-left:22px; display:flex; flex-direction:column; gap:12px}
.mini{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; margin-top:22px}
.mini .card{padding:18px}
.reserve-vis{flex:0 1 470px; display:flex; flex-wrap:wrap; justify-content:center; align-items:flex-end; gap:16px}
.reserve-ex{flex-basis:100%; text-align:center}
.free{display:inline-flex; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-ink); background:var(--mint-soft); border-radius:var(--pill); padding:6px 12px; margin-bottom:12px}

/* ---------- приложение ---------- */
.app-top{display:flex; flex-wrap:wrap; gap:44px; align-items:center}
.app-phones{flex:0 1 440px; display:flex; gap:16px; justify-content:center}
.app-phones .phone:last-child{margin-top:44px}
@media (max-width:520px){.app-phones .ph-m{width:calc(50% - 8px); height:auto; aspect-ratio:210 / 440}}
.app-text{flex:1 1 420px; min-width:0}
.tabs-line{margin-top:18px; list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:8px}
.tabs-line li{font-size:14px; font-weight:700; background:var(--card); border:1px solid var(--line); border-radius:var(--pill); padding:7px 13px}
.doors{display:grid; grid-template-columns:repeat(auto-fit, minmax(270px, 1fr)); gap:16px; margin-top:34px}
.doors .card{display:flex; flex-direction:column; gap:14px}
.doors .card h3{margin:0}
.doors p{flex:1}
.stores{display:flex; flex-wrap:wrap; gap:8px}
.center-row{justify-content:center; margin-top:16px}
.store{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0 14px; border-radius:12px; background:var(--cta); color:var(--cta-ink); font-weight:700; font-size:14px; text-decoration:none}
.store:hover{color:var(--cta-ink); background:var(--cta-hover)}
.store.out{background:transparent; color:var(--ink); border:1.5px solid var(--ink)}
.store.out:hover{background:var(--fill); color:var(--ink)}

/* ---------- результаты ---------- */
.nums{display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:12px; margin-top:28px}
.num{background:var(--card); border:1px solid var(--line); border-radius:20px; padding:20px}
.num b{display:block; font-size:clamp(30px, 3.4vw, 38px); font-weight:800; letter-spacing:-0.03em; font-variant-numeric:tabular-nums}
.num span{color:var(--mid)}
.case{margin-top:16px; background:var(--card); border:1px solid var(--line); border-radius:26px; padding:24px; display:flex; flex-wrap:wrap; gap:24px; align-items:center}
.case-imgs{display:flex; gap:14px}
.case-imgs img{height:260px; object-fit:cover; border-radius:14px; border:1px solid var(--line); background:var(--fill)}
.case-imgs img:first-child{width:208px}
.case-imgs img:last-child{width:130px; object-position:top}
.case-text{flex:1 1 280px; min-width:0}
.case-text .eyebrow{margin:0}
.case-text .t{font-size:clamp(22px, 2.4vw, 28px); font-weight:800; letter-spacing:-0.02em; line-height:1.15; margin-top:6px}
.case-text .f{font-size:18px; margin-top:10px; font-variant-numeric:tabular-nums}
@media (max-width:520px){.case-imgs img{height:200px} .case-imgs img:first-child{width:160px} .case-imgs img:last-child{width:100px}}
.honest{margin-top:18px; color:var(--mid)}

/* ---------- люди ---------- */
.trio{display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:16px; margin-top:28px}

/* ---------- финал ---------- */
.final{padding-block:104px}
.final h2{font-size:clamp(32px, 4.6vw, 58px); line-height:1.04}

/* ---------- подвал ---------- */
.ftr{background:var(--band); color:var(--band-mid); padding-block:60px 30px}
.ftr-grid{display:grid; grid-template-columns:1.4fr repeat(var(--cols, 5), minmax(0,1fr)); gap:28px; font-size:14px}
@media (max-width:1020px){.ftr-grid{grid-template-columns:repeat(auto-fit, minmax(160px, 1fr))}}
.ftr-grid > div > p{margin-top:10px}
.ftr-h{margin:0 0 12px; color:var(--band-ink); font-size:14px; font-weight:800}
.ftr ul{list-style:none; padding:0; display:flex; flex-direction:column; gap:8px}
.ftr a{color:var(--band-mid); text-decoration:none}
.ftr a:hover{color:var(--band-ink); text-decoration:underline}
.ftr .logo{color:var(--band-ink)}
.ftr .logo span{color:var(--band-hl)}
.ftr .country-link{color:var(--band-ink)}
.ftr-legal{margin-top:44px; padding-top:18px; border-top:1px solid var(--band-line); display:flex; flex-wrap:wrap; gap:8px 20px; font-size:13px}