html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:var(--fz-t)/1.55 var(--f-sans)}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.container{width:var(--container);margin:0 auto;padding:0 12px}

/* Базовые кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 18px;border-radius:var(--r-btn);border:1px solid var(--line);
  background:var(--surface);color:var(--text);cursor:pointer;min-height:44px}
.btn:hover{filter:brightness(1.05)}
.btn.primary{background:var(--accent);color:#081018;border:none}
.btn.ghost{background:transparent;border:1px solid var(--line)}

/* Бэйджики */
.badge-rrc{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--surface-2);
  border:1px solid var(--line);font-size:12px;letter-spacing:.3px}

/* Карточки/сетки */
.grid{display:grid;gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.card .p{padding:18px}

/* Герой-подложки (общие) */
.hero{padding:40px 0 16px;background:
  linear-gradient(180deg, rgba(54,163,255,.16), transparent 50%),
  radial-gradient(80% 60% at 50% -10%, rgba(120,230,178,.12), transparent 40%)}
.hero h1{margin:0 0 6px;font-size:var(--fz-1)}
.hero p{margin:0 0 16px;color:var(--muted);font-size:var(--fz-3)}
.hero.hero-cover{padding:42px 0 14px}

/* Фильтры/каталог (универсальные) */
.filters{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
select,input[type=range]{width:100%;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--bg-soft);color:var(--text)}
.catalog{grid-template-columns:repeat(4,1fr)}

@media (max-width:1024px){
  .catalog{grid-template-columns:repeat(3,1fr)}
  .filters{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:720px){
  .catalog{grid-template-columns:repeat(2,1fr)}
  .filters{grid-template-columns:repeat(2,1fr)}
  body{padding-bottom:var(--bar-h)}
}
@media (max-width:420px){
  .catalog{grid-template-columns:1fr}
  .filters{grid-template-columns:1fr}
}

/* Подвал */
.footer{margin-top:40px;padding:24px 0;border-top:1px solid var(--line);color:var(--muted);font-size:14px}

/* Таблички/списки */
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}
.kv{display:grid;grid-template-columns:160px 1fr;gap:8px}
.kv div{padding:6px 0;border-bottom:1px dashed var(--line)}
.breadcrumbs{font-size:14px;color:var(--muted);margin:8px 0 16px}
.visually-hidden{position:absolute;clip:rect(1px,1px,1px,1px);padding:0;border:0;height:1px;width:1px;overflow:hidden;white-space:nowrap}

/* Скелетоны */
.skeleton{position:relative;overflow:hidden;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;min-height:220px}
.skeleton::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
  transform:translateX(-100%);animation:shimmer 1.2s infinite}
@keyframes shimmer{to{transform:translateX(100%)}}

/* Мобильная нижняя панель */
.mobile-bar{position:fixed;inset-inline:0;bottom:0;height:var(--bar-h);z-index:30;
  background:color-mix(in oklab, var(--bg) 86%, transparent);backdrop-filter:saturate(140%) blur(12px);
  border-top:1px solid var(--line);display:none}
.mobile-bar__inner{height:100%;display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;align-items:center;padding:8px 12px}
.mobile-bar .btn{min-height:44px;padding:10px 12px}
@media (max-width:900px){ .mobile-bar{display:block} }

/* Липкая шапка страницы модели */
.model-sticky{position:sticky;top:56px;z-index:19;display:none;background:var(--surface);border-bottom:1px solid var(--line)}
.model-sticky__inner{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:8px 12px}
.model-sticky__title{font-weight:600}
.model-sticky__price{font-weight:800}
.model-sticky.show{display:block}

/* Уважение к доступности */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms;animation-iteration-count:1;transition-duration:.001ms;scroll-behavior:auto}
}

/* Небольшая косметика под фильтры в «finder» */
#filter .card{background:var(--surface)}
#filter .card.p{border-radius:16px}
@media (min-width:900px){
  .hero .card.p,#filter .card.p{backdrop-filter:blur(8px) saturate(120%);-webkit-backdrop-filter:blur(8px) saturate(120%)}
  .hero .card.p{background:color-mix(in oklab,var(--surface) 70%,transparent)}
}

/* Заголовки секций */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}

/* Карточки каталога (списки) */
.section{padding:28px 16px}
.section__head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:16px}
.morelink{color:var(--color-accent-2);text-decoration:none}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media (max-width:1200px){.cards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.cards{grid-template-columns:1fr}}

/* Всплывашка при входе */
.entrypopup{position:fixed;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.55);backdrop-filter:blur(4px)}
.entrypopup__box{width:min(560px,92vw);background:#0F1316;color:var(--color-fg);border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:18px;box-shadow:0 10px 40px rgba(0,0,0,.35)}
.entrypopup__close{position:absolute;top:10px;right:14px;background:transparent;border:none;color:var(--color-fg);font-size:26px;line-height:1;cursor:pointer}
.entrypopup__form{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:12px}
.entrypopup__form input{padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0C1013;color:var(--color-fg)}
.entrypopup__form .cta{padding:12px 16px;border-radius:12px;background:var(--color-accent);color:#fff;border:none}
@media (max-width:680px){.entrypopup__form{grid-template-columns:1fr}}
.searchpanel[hidden],.entrypopup[hidden]{display:none}
.searchpanel,.entrypopup{z-index:1200}
.entrypopup__box{position:relative}
/* --- Layout & rhythm --- */
:root{ --section-gap:40px; --container-max:1360px; }
:root{ /* дизайн-токены и базовые переменные */ 
}

/* Гарантированное скрытие любых элементов с hidden — защита от FOUC */
:where([hidden]){ display: none !important; }
.section{ padding-block:var(--section-gap); }
.container{ max-width:var(--container-max); margin:0 auto; padding-inline:16px; }

/* --- Brands compact --- */
.section-brands .brand-grid{
  display:grid; gap:16px;
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.section-brands .brand-card{
  height:260px; border-radius:var(--r-card); overflow:hidden; position:relative;
}

.section-brands .brand-card .badge{ position:absolute; left:16px; bottom:16px; }

/* --- Bridge (тонкая «перемычка» между блоками) --- */
.section-bridge{ display:flex; align-items:center; justify-content:space-between;
  margin-top:8px; margin-bottom:8px; }
.bridge-title{ font-size:20px; font-weight:700; }
.bridge-link{ font-size:14px; opacity:.8; text-decoration:none; }

/* --- Finder after brands: tighter top spacing --- */
.section-finder .finder-card{
  margin-top:12px; border-radius:var(--r-panel); box-shadow:var(--sh-card);
}

/* --- Responsive --- */
@media (max-width:1199px){
  .section-brands .brand-grid{ grid-template-columns:repeat(2,1fr); }
  .section-brands .brand-card{ height:220px; }
}
@media (max-width:767px){
  .section-brands .brand-grid{ display:flex; overflow-x:auto; gap:12px; padding-bottom:6px; }
  .section-brands .brand-card{ flex:0 0 72%; height:180px; }
  .bridge-title{ font-size:18px; }
}
