/* ============================================================
   Skotovody redesign v4 — slice 1 (chrome + home)
   build marker: SKTV4-CSS-OK
   Токены глобальны (CSS-переменные безвредны); атомы и reset
   скоупятся под .skt-v4, чтобы не задеть остальной сайт.
   Компонентные слои (lst/hd3/ft3/hero/cat5/vc4/…) — ниже, конкатенированы
   из styles-v2/-v4/-v5 дословно (имена уникальны).
   ============================================================ */

:root {
  --font-ui: 'Manrope', system-ui, sans-serif;
  --font-display: 'Fraunces', Georgia, serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  --bg: oklch(0.97 0.012 85);
  --bg-elev: oklch(0.99 0.008 85);
  --bg-sunk: oklch(0.94 0.018 85);
  --surface: #ffffff;
  --line: oklch(0.88 0.015 75);
  --line-strong: oklch(0.78 0.02 70);

  --ink: oklch(0.22 0.018 60);
  --ink-2: oklch(0.40 0.02 60);
  --ink-3: oklch(0.55 0.018 65);
  --ink-mute: oklch(0.68 0.015 70);

  --forest: oklch(0.42 0.08 145);
  --forest-soft: oklch(0.92 0.04 145);
  --forest-ink: oklch(0.28 0.06 145);

  --ochre: oklch(0.62 0.10 65);
  --ochre-soft: oklch(0.93 0.05 75);
  --ochre-deep: oklch(0.48 0.10 60);

  --terracotta: oklch(0.55 0.13 35);
  --terracotta-soft: oklch(0.93 0.05 40);

  --sand: oklch(0.88 0.05 80);
  --hay: oklch(0.85 0.09 95);

  --ok: oklch(0.55 0.12 145);
  --warn: oklch(0.70 0.13 75);
  --err: oklch(0.55 0.16 28);
  --info: oklch(0.55 0.10 230);

  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;
  --r-2xl: 28px;

  --shadow-sm: 0 1px 2px rgb(60 40 20 / 0.06);
  --shadow-md: 0 6px 18px -8px rgb(60 40 20 / 0.18), 0 2px 4px rgb(60 40 20 / 0.06);
  --shadow-lg: 0 18px 40px -16px rgb(60 40 20 / 0.25), 0 4px 8px rgb(60 40 20 / 0.08);

  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
}

[data-theme="dark"] {
  --bg: oklch(0.18 0.012 60);
  --bg-elev: oklch(0.22 0.014 60);
  --bg-sunk: oklch(0.14 0.012 60);
  --surface: oklch(0.24 0.014 60);
  --line: oklch(0.32 0.018 60);
  --line-strong: oklch(0.42 0.022 60);
  --ink: oklch(0.94 0.012 85);
  --ink-2: oklch(0.80 0.014 80);
  --ink-3: oklch(0.66 0.016 75);
  --ink-mute: oklch(0.52 0.018 70);
  --forest: oklch(0.62 0.10 145);
  --forest-soft: oklch(0.30 0.05 145);
  --forest-ink: oklch(0.85 0.08 145);
  --ochre: oklch(0.72 0.12 70);
  --ochre-soft: oklch(0.32 0.06 70);
  --ochre-deep: oklch(0.58 0.12 60);
  --terracotta: oklch(0.65 0.14 35);
  --terracotta-soft: oklch(0.32 0.08 35);
  --sand: oklch(0.42 0.04 80);
  --hay: oklch(0.45 0.08 90);
  --shadow-sm: 0 1px 2px rgb(0 0 0 / 0.30);
  --shadow-md: 0 8px 22px -8px rgb(0 0 0 / 0.50), 0 2px 4px rgb(0 0 0 / 0.20);
  --shadow-lg: 0 22px 50px -16px rgb(0 0 0 / 0.60), 0 4px 8px rgb(0 0 0 / 0.30);
}

[data-font="modern"]  { --font-ui: 'Manrope', system-ui, sans-serif; --font-display: 'Fraunces', Georgia, serif; }
[data-font="classic"] { --font-ui: 'Inter', system-ui, sans-serif; --font-display: 'Lora', Georgia, serif; }
[data-font="utility"] { --font-ui: 'IBM Plex Sans', system-ui, sans-serif; --font-display: 'IBM Plex Serif', Georgia, serif; }

/* scoped reset + base typography */
.skt-v4, .skt-v4 *, .skt-v4 *::before, .skt-v4 *::after { box-sizing: border-box; }
.skt-v4 {
  font-family: var(--font-ui);
  color: var(--ink);
  background: var(--bg);
  font-feature-settings: "ss01", "cv11";
  -webkit-font-smoothing: antialiased;
}
.skt-v4 button { font-family: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
.skt-v4 input, .skt-v4 textarea, .skt-v4 select { font-family: inherit; color: inherit; }
.skt-v4 a { text-decoration: none; color: inherit; }

/* Dokan на каждой странице вешает глобальный inline `span,a,button,p,div { font-family: Montserrat }`.
   Нейтрализатор (двух-элементный селектор 0,0,0,2: бьёт Dokan 0,0,0,1, но НИЖЕ одноклассовых
   display/mono — .lst-price/.countdown3-cell 0,0,1,0) теперь ГЛОБАЛЬНО НЕ выводится — с site-wide
   rollout (этот файл грузится на всех страницах) он сменил бы шрифт ВСЕХ внутренних страниц.
   Выводится inline-<style> ТОЛЬКО на главной (chrome.php → home_font_neutralizer). Хром держит
   Manrope своими !important: шапка .skt-redesign-v4 .hd3 * (ниже), футер .l-footer .ft3 *.
   Marker: SKTV4-SITEWIDE-OK */

/* ===== atoms (scoped) ===== */
.skt-v4 .btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px; border-radius: var(--r-md);
  font-weight: 600; font-size: 14px; letter-spacing: -0.005em;
  transition: transform .12s ease, background .12s ease, box-shadow .12s ease;
  white-space: nowrap;
}
.skt-v4 .btn:active { transform: translateY(1px); }
.skt-v4 .btn-primary { background: var(--forest); color: #fafaf6; box-shadow: var(--shadow-sm); }
.skt-v4 .btn-primary:hover { background: var(--forest-ink); box-shadow: var(--shadow-md); }
.skt-v4 .btn-secondary { background: var(--surface); color: var(--ink); border: 1px solid var(--line); }
.skt-v4 .btn-secondary:hover { border-color: var(--line-strong); background: var(--bg-elev); }
.skt-v4 .btn-ghost { background: transparent; color: var(--ink-2); }
.skt-v4 .btn-ghost:hover { background: var(--bg-sunk); color: var(--ink); }
.skt-v4 .btn-accent { background: var(--ochre); color: #1d1408; }
.skt-v4 .btn-accent:hover { background: var(--ochre-deep); color: #fafaf6; }
.skt-v4 .btn-icon { width: 40px; height: 40px; padding: 0; justify-content: center; }

.skt-v4 .chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 100px;
  font-size: 12px; font-weight: 600;
  background: var(--bg-sunk); color: var(--ink-2); border: 1px solid var(--line);
}
.skt-v4 .chip-ok { background: var(--forest-soft); color: var(--forest-ink); border-color: transparent; }
.skt-v4 .chip-ochre { background: var(--ochre-soft); color: var(--ochre-deep); border-color: transparent; }
.skt-v4 .chip-terracotta { background: var(--terracotta-soft); color: var(--terracotta); border-color: transparent; }
/* Чип на тёмном герое (порода/регион) — кликабельный фильтр-тег. */
.skt-v4 .chip-hero { background: oklch(1 0 0 / 0.13); color: inherit; border-color: transparent; transition: background .15s; }
.skt-v4 a.chip-hero:hover { background: oklch(1 0 0 / 0.24); }

.skt-v4 .card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.skt-v4 .divider { height: 1px; background: var(--line); margin: 0; border: 0; }

.skt-v4 .input {
  width: 100%; padding: 11px 14px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--surface); font-size: 14px; outline: none;
  transition: border-color .12s, box-shadow .12s;
}
.skt-v4 .input:focus { border-color: var(--forest); box-shadow: 0 0 0 3px var(--forest-soft); }

.skt-v4 .label { font-size: 12px; font-weight: 600; color: var(--ink-2); letter-spacing: 0.02em; text-transform: uppercase; }

.skt-v4 .h1 { font-family: var(--font-display); font-weight: 500; font-size: 56px; line-height: 1.05; letter-spacing: -0.02em; margin: 0; }
.skt-v4 .h2 { font-family: var(--font-display); font-weight: 500; font-size: 36px; line-height: 1.1; letter-spacing: -0.015em; margin: 0; }
.skt-v4 .h3 { font-family: var(--font-display); font-weight: 500; font-size: 24px; line-height: 1.2; letter-spacing: -0.01em; margin: 0; }
.skt-v4 .mono { font-family: var(--font-mono); font-feature-settings: "ss02"; }

.skt-v4 .img-placeholder {
  background: repeating-linear-gradient(135deg, oklch(0.72 0.05 65) 0 12px, oklch(0.78 0.04 70) 12px 24px);
  display: flex; align-items: center; justify-content: center;
  color: oklch(0.32 0.04 60); font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.05em; text-transform: uppercase; position: relative;
}
.skt-v4 .img-placeholder::before {
  content: ''; position: absolute; inset: 8px;
  border: 1px dashed oklch(0.42 0.04 60 / 0.4); border-radius: 4px; pointer-events: none;
}

/* utilities (scoped) */
.skt-v4 .row { display: flex; align-items: center; }
.skt-v4 .col { display: flex; flex-direction: column; }
.skt-v4 .gap-1 { gap: 4px; }
.skt-v4 .gap-2 { gap: 8px; }
.skt-v4 .gap-3 { gap: 12px; }
.skt-v4 .gap-4 { gap: 16px; }
.skt-v4 .gap-6 { gap: 24px; }
.skt-v4 .spacer { flex: 1; }
.skt-v4 .animate-in { animation: sktFadeIn .25s ease both; }
.skt-v4 .pulse { animation: sktPulse 1.6s ease-in-out infinite; }

/* scrollbars (scoped to redesign regions) */
.skt-v4 ::-webkit-scrollbar { width: 10px; height: 10px; }
.skt-v4 ::-webkit-scrollbar-track { background: transparent; }
.skt-v4 ::-webkit-scrollbar-thumb { background: var(--line); border-radius: 100px; border: 2px solid var(--bg); }
.skt-v4 ::-webkit-scrollbar-thumb:hover { background: var(--line-strong); }

/* animations (global keyframes, prefixed to avoid clashes) */
@keyframes sktFadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sktPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 oklch(0.55 0.16 28 / 0.5); } 100% { box-shadow: 0 0 0 8px oklch(0.55 0.16 28 / 0); } }

/* live-dot (scoped) */
.skt-v4 .live-dot {
  width: 8px; height: 8px; border-radius: 100px;
  background: var(--err); box-shadow: 0 0 0 0 var(--err);
  animation: livePulse 1.6s infinite;
}

/* ============================================================
   Компонентные слои ниже — конкатенированы дословно из
   styles-v2.css (карточки) + styles-v4.css + styles-v5.css
   ============================================================ */

/* ---- styles-v2.css: vet-badge / countdown / listing-card (lines 70-342) ---- */

/* Vet/region status — Россельхознадзор statuses */
.vet-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 9px; border-radius: 100px;
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.vet-badge[data-level="ok"]         { background: oklch(0.93 0.05 145); color: oklch(0.32 0.10 145); }
.vet-badge[data-level="restricted"] { background: oklch(0.93 0.07 70);  color: oklch(0.45 0.13 50); }
.vet-badge[data-level="blocked"]    { background: oklch(0.92 0.06 25);  color: oklch(0.40 0.16 25); }
.vet-badge::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: currentColor; flex-shrink: 0;
}
.vet-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px;
  background: var(--bg-sunk);
  border-radius: 8px;
  font-size: 12px;
  border-left: 3px solid var(--ochre);
}
.vet-row[data-level="ok"]         { border-left-color: var(--forest); background: var(--forest-soft); }
.vet-row[data-level="restricted"] { border-left-color: var(--ochre); background: var(--ochre-soft); }
.vet-row[data-level="blocked"]    { border-left-color: var(--terracotta); background: var(--terracotta-soft); }

/* Hero auction card */
.hero-auction {
  background: linear-gradient(155deg, oklch(0.22 0.018 60) 0%, oklch(0.18 0.02 30) 100%);
  color: oklch(0.95 0.02 80);
  border-radius: var(--r-xl);
  padding: 28px;
  position: relative;
  overflow: hidden;
}
.hero-auction::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 80% 20%, oklch(0.72 0.13 70 / 0.25), transparent 50%);
  pointer-events: none;
}

/* Hero search — fallback when no live auctions */
.hero-search {
  background: linear-gradient(155deg, oklch(0.32 0.06 145) 0%, oklch(0.22 0.04 145) 100%);
  color: oklch(0.95 0.02 80);
  border-radius: var(--r-xl);
  padding: 36px 32px 32px;
  position: relative;
  overflow: hidden;
}
.hero-search::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 40% at 100% 100%, oklch(0.72 0.13 70 / 0.22), transparent 60%),
    radial-gradient(circle at 10% 30%, oklch(0.55 0.12 145 / 0.3), transparent 50%);
  pointer-events: none;
}

/* Open-launch banner */
.launch-banner {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 12px 18px;
  background: linear-gradient(90deg, var(--ochre-soft) 0%, var(--surface) 70%);
  border: 1px solid var(--ochre);
  border-color: oklch(0.78 0.12 70 / 0.4);
  border-radius: 100px;
  flex-wrap: wrap;
}
@media (max-width: 900px) {
  .launch-banner { border-radius: 14px; }
}

.countdown {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--font-mono);
  font-feature-settings: "tnum";
}
.countdown-cell {
  background: oklch(1 0 0 / 0.1);
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.01em;
  min-width: 44px;
  text-align: center;
}
.countdown-sep { font-size: 14px; opacity: .6; }
.countdown-label { font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: oklch(0.95 0.02 80 / 0.55); margin-top: 2px; display: block; text-align: center; }

/* Listing card v2 */
.lst-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .15s, box-shadow .15s, border-color .15s;
  cursor: pointer;
  position: relative;
}
.lst-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: var(--line-strong);
}

.lst-photo {
  aspect-ratio: 4/3;
  position: relative;
  overflow: hidden;
  background: var(--surface-2, oklch(0.92 0.01 80));
}
.lst-photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.lst-photo-dots {
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 4px;
}
.lst-photo-dot {
  width: 5px; height: 5px; border-radius: 100px;
  background: oklch(1 0 0 / 0.7);
}
.lst-photo-dot[data-active="1"] { background: oklch(1 0 0); width: 16px; }

.lst-status-row {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  gap: 6px;
  z-index: 1;
}

.lst-action-row {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 6px;
  z-index: 1;
}
.lst-icon-btn {
  width: 34px;
  height: 34px;
  border-radius: 100px;
  display: grid;
  place-items: center;
  background: oklch(0.97 0.012 85 / 0.92);
  backdrop-filter: blur(8px);
  color: var(--ink-2);
  border: 0.5px solid oklch(1 0 0 / 0.4);
}
.lst-icon-btn[data-active="1"] { color: var(--terracotta); }

.lst-body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}
.lst-price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  justify-content: space-between;
}
.lst-price {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.lst-price-per {
  font-size: 12px;
  color: var(--ink-3);
}

.lst-title {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.lst-attrs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.lst-attr {
  font-size: 11px;
  padding: 2px 8px;
  background: var(--bg-sunk);
  color: var(--ink-2);
  border-radius: 100px;
  font-weight: 600;
}

.lst-vendor-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
  margin-top: auto;
}
.lst-vendor-avatar {
  width: 22px; height: 22px;
  border-radius: 100px;
  background: var(--bg-sunk);
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 700;
  color: var(--ink-2);
  flex-shrink: 0;
}
.lst-vendor-name {
  font-size: 12px;
  color: var(--ink-2);
  font-weight: 600;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lst-foot {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--ink-3);
}

/* Auction-style listing card extension */
.lst-auction-bar {
  background: oklch(0.22 0.018 60);
  color: oklch(0.95 0.02 80);
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.lst-auction-time {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
}
.lst-auction-bid {
  font-size: 11px;
  color: oklch(0.95 0.02 80 / 0.7);
}

/* Impreza навязывает line-height ~28px на текст → пилюли/бейджи/строки карточек раздувает
   (замер: lst-attr 32px, LIVE-chip 38px вместо ~17/22). Возвращаем компактный line-height эталона. */
.skt-v4 .chip, .skt-v4 .lst-attr, .skt-v4 .vet-badge, .skt-v4 .promo-badge { line-height: 1.15 !important; }
/* Impreza line-height:28px раздувал высоту бейджей слайдов и КНОПОК (hero3-badge 38, paidtag 34, btn 54
   вместо эталонных ~23/18/44). Нейтрализуем — размеры под эталон. */
.skt-v4 .hero3-badge, .skt-v4 .hero3-paidtag { line-height: 1.15 !important; }
.skt-v4 .btn { line-height: 1.2 !important; }
.skt-v4 .sec-kicker, .skt-v4 .lst-vendor-name, .skt-v4 .lst-foot,
.skt-v4 .lst-auction-time, .skt-v4 .lst-auction-bid, .skt-v4 .lst-price-per { line-height: 1.25 !important; }
.skt-v4 .lst-title { line-height: 1.3 !important; }
/* Блог 09: Impreza раздувала jr-byline (28px) → ряды высокие → блок выше эталона. */
.skt-v4 .jr-byline, .skt-v4 .jr-topic, .skt-v4 .jr-row-title { line-height: 1.3 !important; }
/* Мокап Журнала (08): Impreza раздувала line-height (таблица/сайдбар 28px) → мокап высокий
   → зелёная полоса 540px. Возвращаем компактный line-height → мокап к min-height 270. */
.skt-v4 .ja-mock, .skt-v4 .ja-mock div, .skt-v4 .ja-mock span, .skt-v4 .ja-mock b { line-height: 1.3 !important; }
/* Карточка: поджать вертикальные зазоры тела (раздувало) — gap и отступ над/под разделителем. */
.skt-v4 .lst-body { gap: 6px !important; }
.skt-v4 .lst-vendor-row { padding-top: 6px !important; }
.skt-v4 .lst-foot { margin-top: 0 !important; }
/* Карточка хозяйства (vc4): Impreza раздувала line-height (статы/cta) и убивала рамку
   у кнопки-сердца (vc4-fav — это <button>). Возвращаем эталон. */
.skt-v4 .vc4-stat b, .skt-v4 .vc4-cta { line-height: 1.2 !important; }
.skt-v4 .vc4-stat span, .skt-v4 .vc4-meta, .skt-v4 .vc4-name-text { line-height: 1.25 !important; }
.skt-v4 .vc4-cta { padding: 10px 14px !important; height: auto !important; min-height: 0 !important; max-height: none !important; }
.skt-v4 .vc4-fav { width: 38px !important; height: 38px !important; min-height: 0 !important; max-height: none !important; padding: 0 !important; border: 1px solid var(--line) !important; border-radius: 10px !important; background: var(--surface) !important; }
.skt-v4 .vc4-fav[data-active="1"], .skt-v4 .vc4-fav:hover { border-color: var(--terracotta) !important; color: var(--terracotta) !important; }
/* Статы+cta прижаты к низу карточки → ряд унифицирован даже у хозяйств без описания. */
.skt-v4 .vc4-stats { margin-top: auto !important; }
/* Плитки инструментов (ce-card) на тёмном фоне: эталон color:oklch(0.96) светлый, но
   `.skt-v4 a {color:inherit}` (специфичнее) перебивал → текст тёмный, нечитаемо. Возвращаем. */
.skt-v4 .ce-card { color: oklch(0.96 0.02 80) !important; }
.skt-v4 .ce-blog { color: var(--ink) !important; }
.skt-v4 .ce-card .ce-feat svg { flex-shrink: 0; opacity: 0.85; }
/* аватар продавца крупнее (была 22 — терялась) + поддержка реального фото стора */
.skt-v4 .lst-vendor-avatar { width: 28px; height: 28px; font-size: 11px; overflow: hidden; }
.skt-v4 .lst-vendor-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.skt-v4 .lst-stars svg { display: block; }
/* «Продвигается» — иконка-only пилюля (без текста/эмодзи), компактный квадрат */
.skt-v4 .promo-badge-icon { padding: 4px 6px; gap: 0; }
.skt-v4 .promo-badge-icon svg { display: block; }
/* verified-щит и chip-ok-иконка по центру строки */
.skt-v4 .chip-ok svg { display: block; flex-shrink: 0; }
/* icon-only чип (напр. «проверено» без слова — только щит) — компактный квадрат */
.skt-v4 .chip-icon { padding: 5px 6px !important; gap: 0 !important; }
/* vet-badge как ИКОНКА-знак (благополучный/ограничения/карантин) — без слова, alt в title. Точку-::before убрать. */
.skt-v4 .vet-icon { padding: 4px 6px !important; gap: 0 !important; }
.skt-v4 .vet-icon::before { display: none !important; }
.skt-v4 .vet-icon svg { display: block; }
/* LIVE на карточке аукциона — как на слайдере: мигающая КРАСНАЯ точка (видна на фото) + красный бейдж «LIVE» */
.skt-v4 .lst-live { display: inline-flex; align-items: center; gap: 6px; }
.skt-v4 .lst-live .live-dot { width: 9px; height: 9px; border: 1.5px solid oklch(1 0 0 / 0.85); box-sizing: border-box; flex-shrink: 0; }
.skt-v4 .lst-live-badge { background: var(--err); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: 0.05em; padding: 3px 9px; border-radius: 100px; line-height: 1.15; }
/* Фильтр-ряд «Новые поступления»: чипы маленькие (как эталон), активный — тёмный (ink);
   «Весь каталог» чуть крупнее чипов, но без Impreza-раздувания (была 50px). Цвет активного
   чипа — здесь (не inline), чтобы клик его перекрашивал. */
.skt-v4 [data-skt-filter] .chip { cursor: pointer; }
.skt-v4 [data-skt-filter] .chip[data-active="1"] { background: var(--ink) !important; color: var(--bg) !important; border-color: transparent !important; }
.skt-v4 [data-skt-filter] .chip[data-active="0"] { background: var(--surface) !important; color: var(--ink-2) !important; border-color: var(--line) !important; }
/* «Весь каталог» = эталонная .btn (padding 10/16, font 14, radius --r-md 10px), Impreza-высоту гасим */
.skt-v4 [data-skt-filter] .btn { height: auto !important; min-height: 0 !important; max-height: none !important; padding: 10px 16px !important; font-size: 14px !important; line-height: 1.2 !important; border-radius: var(--r-md) !important; }
/* Impreza вешает padding-top:24px на ВСЕ h1–h6 → заголовки секций «отрываются» от кикера
   (замер: визуальный зазор 30px = margin 8 + padding 22). Редизайн ритм держит margin'ами — гасим padding. */
.skt-v4 h1, .skt-v4 h2, .skt-v4 h3, .skt-v4 h4, .skt-v4 h5, .skt-v4 h6 { padding-top: 0 !important; padding-bottom: 0 !important; }
/* Тот же line-height:28px Impreza раздувал белый низ плиток категорий → высота больше эталона.
   Возвращаем компактный line-height → белый футер минимальный, плитки эталонной высоты. */
.skt-v4 .cat5-name, .skt-v4 .cat5-sub, .skt-v4 .cat5-count, .skt-v4 .cat5-foot { line-height: 1.25 !important; }

/* ---- styles-v4.css (full) ---- */
/* ============================================
   Skotovody — концепция v3 (слой поверх v2)
   Полноширинный слайдер · новая шапка · футер · платные объявления · sell · promo
   ============================================ */

.v3 { --maxw: min(1680px, 95vw); } /* заполняет широкий экран, минимальные поля; кап 1680 = hero-зонт */
.v3-container { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.v3-section { margin: 0 auto; }
.sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.sec-kicker { font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ochre-deep); margin-bottom: 8px; }
.sec-title { font-family: var(--font-display); font-weight: 500; font-size: 28px; line-height: 1.1; letter-spacing: -0.015em; margin: 0; }
.sec-sub { font-size: 13px; color: var(--ink-3); margin-top: 4px; }
.sec-link { font-size: 13px; font-weight: 600; color: var(--forest); cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
.sec-link:hover { color: var(--forest-ink); }

/* Секция «Новые поступления» (05): шапка в 2 ряда — заголовок + «Весь каталог» сверху,
   фильтр-чипы отдельной строкой под ним (вместо тесной правой колонки). */
.skt-v4 .nl-head { flex-direction: column; align-items: stretch; gap: 14px; }
.skt-v4 .nl-head-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.skt-v4 .nl-chips { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* ───────── Header v3 ───────── */
.hd3 { position: sticky; top: 0; z-index: 60; background: oklch(0.975 0.012 85 / 0.9); backdrop-filter: blur(16px); border-bottom: 1px solid var(--line); }
[data-theme="dark"] .hd3 { background: oklch(0.20 0.012 60 / 0.9); }
.hd3-top { border-bottom: 1px solid var(--line); }
.hd3-top-inner { max-width: var(--maxw); margin: 0 auto; padding: 9px 24px; display: flex; align-items: center; gap: 22px; font-size: 13px; }
.hd3-navlink { color: var(--ink-2); font-weight: 600; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; transition: color .12s; }
.hd3-navlink:hover { color: var(--forest-ink); }
.hd3-navlink[data-active="1"] { color: var(--forest-ink); }
.hd3-ext { font-size: 9px; font-weight: 700; letter-spacing: 0.04em; color: var(--ink-mute); border: 1px solid var(--line); border-radius: 4px; padding: 1px 4px; text-transform: lowercase; }
.hd3-top-right { margin-left: auto; display: inline-flex; align-items: center; gap: 18px; color: var(--ink-3); }
.hd3-phone { color: var(--forest-ink); font-weight: 700; }

.hd3-main { max-width: var(--maxw); margin: 0 auto; padding: 13px 24px; display: flex; align-items: center; gap: 14px; }
.hd3-region { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; white-space: nowrap; padding: 9px 12px; border-radius: 10px; }
.hd3-region:hover { background: var(--bg-sunk); }
.hd3-search { flex: 1; position: relative; display: flex; align-items: center; }
.hd3-search input { width: 100%; padding: 12px 16px 12px 46px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 14px; outline: none; transition: border-color .12s, box-shadow .12s; }
.hd3-search input:focus { border-color: var(--forest); box-shadow: 0 0 0 3px var(--forest-soft); }
.hd3-search-ico { position: absolute; left: 15px; display: flex; color: var(--ink-3); }
.hd3-search-btn { position: absolute; right: 6px; }
.hd3-iconbtn { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; color: var(--ink-2); position: relative; transition: background .12s, color .12s; }
.hd3-iconbtn:hover { background: var(--bg-sunk); color: var(--ink); }
.hd3-iconbtn .dot { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: var(--err); border: 1.5px solid var(--surface); }
/* Sell — заметная отдельная кнопка */
.hd3-sell { background: var(--ochre); color: #1d1408; font-weight: 700; padding: 11px 18px; border-radius: 11px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; box-shadow: 0 1px 0 oklch(0.45 0.10 60 / 0.4); transition: background .12s, transform .12s; white-space: nowrap; }
.hd3-sell:hover { background: var(--ochre-deep); color: #fafaf6; }
.hd3-sell:active { transform: translateY(1px); }
.hd3-divider { width: 1px; height: 30px; background: var(--line); }
.hd3-account { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 11px; font-size: 13px; font-weight: 600; background: var(--surface); white-space: nowrap; }
.hd3-account-av { width: 24px; height: 24px; border-radius: 100px; background: var(--forest-soft); color: var(--forest-ink); font-size: 11px; font-weight: 700; display: grid; place-items: center; }

/* ───────── Full-bleed hero slider ───────── */
.hero3-wrap { width: 100%; background: var(--bg-sunk); border-bottom: 1px solid var(--line); }
.hero3 { position: relative; max-width: 1680px; margin: 0 auto; height: 440px; overflow: hidden; }
/* асимметричный фейд: уходящий гаснет быстро, входящий появляется с задержкой → нет «наслоения» текста */
.hero3-slide { position: absolute; inset: 0; opacity: 0; z-index: 1; transition: opacity .18s ease; pointer-events: none; }
.hero3-slide[data-active="1"] { opacity: 1; z-index: 2; pointer-events: auto; transition: opacity .45s ease .14s; }
.hero3-inner { max-width: var(--maxw); margin: 0 auto; height: 100%; padding: 0 72px; display: grid; align-items: center; }

/* slide chrome */
.hero3-nav { position: absolute; bottom: 16px; right: 24px; left: auto; transform: none; display: flex; gap: 7px; z-index: 22; }
.hero3-tab { display: inline-flex; align-items: center; gap: 7px; background: oklch(1 0 0 / 0.16); backdrop-filter: blur(8px); border: 1px solid oklch(1 0 0 / 0.12); color: oklch(0.97 0.02 80); padding: 7px 13px; border-radius: 100px; font-size: 11px; font-weight: 700; letter-spacing: 0.03em; cursor: pointer; transition: background .15s; }
.hero3-tab[data-active="1"] { background: oklch(0.88 0.13 82); color: oklch(0.22 0.05 60); border-color: transparent; }
.hero3-tab[data-active="1"] .hero3-tab-prog { background: oklch(0.22 0.05 60 / 0.25); }
.hero3-tab-prog { position: absolute; bottom: 0; left: 0; height: 2px; background: transparent; }
/* стрелки без кружков; белые + тёмный ореол-тень → чётко видны и на тёмных, и на светлых слайдах */
.skt-redesign-v4 .hero3-arrow,
.hero3-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 64px; background: none !important; border: none !important; border-radius: 0; backdrop-filter: none; color: #fff !important; font-size: 46px; line-height: 1; font-weight: 400; display: grid; place-items: center; z-index: 22; cursor: pointer; transition: opacity .15s, transform .15s; text-shadow: 0 0 5px rgba(0,0,0,.7), 0 1px 4px rgba(0,0,0,.6), 0 0 16px rgba(0,0,0,.45) !important; }
.hero3-arrow:hover { opacity: 0.75; }
.hero3-arrow[data-side="prev"]:hover { transform: translateY(-50%) translateX(-2px); }
.hero3-arrow[data-side="next"]:hover { transform: translateY(-50%) translateX(2px); }
.hero3-arrow[data-side="prev"] { left: max(16px, calc(50% - 840px + 16px)); }
.hero3-arrow[data-side="next"] { right: max(16px, calc(50% - 840px + 16px)); }
/* полоса прогресса автоплея — под слайдером */
.hero3-prog { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: oklch(1 0 0 / 0.16); z-index: 23; }
.hero3-prog-fill { height: 100%; width: 0; background: var(--ochre); animation: hero3-prog 7s linear forwards; will-change: width; }
@keyframes hero3-prog { from { width: 0; } to { width: 100%; } }
.hero3-badge { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 12px; border-radius: 100px; }
.hero3-paidtag { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 3px 8px; border-radius: 5px; background: oklch(1 0 0 / 0.18); color: oklch(0.97 0.02 80); }

/* auction slide bg */
.hero3-auction { background: linear-gradient(125deg, var(--forest-ink) 0%, oklch(0.20 0.04 150) 60%, oklch(0.26 0.05 120) 100%); color: oklch(0.96 0.02 80); }
.hero3-premium { background: linear-gradient(125deg, oklch(0.28 0.04 60) 0%, oklch(0.20 0.03 50) 100%); color: oklch(0.96 0.02 80); }
.hero3-event { background: linear-gradient(120deg, var(--ochre-soft) 0%, var(--hay) 100%); color: var(--ink); }
.hero3-club { background: linear-gradient(125deg, oklch(0.32 0.07 285) 0%, oklch(0.22 0.05 290) 100%); color: oklch(0.96 0.02 80); }
/* баннер-слайды (фото на всю площадь + затемнение слева под текст) */
.hero3-banner { color: #fff; background: oklch(0.18 0.02 60); }
.hero3-banner-bg { position: absolute; inset: 0; background-size: cover; background-position: center; }
.hero3-banner-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18,16,12,.82) 0%, rgba(18,16,12,.55) 42%, rgba(18,16,12,.12) 100%); }
.hero3-banner .hero3-inner { position: relative; z-index: 1; }
/* Клуб: фото-фон скотоводов-сообщества + фирменный пурпурный скрим (люди видны, текст/параметры читаемы).
   Люди справа → background-position смещён вправо. */
.skt-v4 .hero3-club-bg { position: absolute; inset: 0; background-size: cover; background-position: 72% center; z-index: 0; }
.skt-v4 .hero3-club-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, oklch(0.19 0.055 285 / 0.95) 0%, oklch(0.20 0.05 285 / 0.82) 48%, oklch(0.22 0.05 285 / 0.60) 100%); }
.skt-v4 .hero3-club .hero3-inner { position: relative; z-index: 1; }
.skt-v4 .hero3-club .hero3-inner > div { text-shadow: 0 1px 8px oklch(0.14 0.04 285 / 0.55); }

.hero3 .lst-photo { height: 100%; aspect-ratio: auto; }
.countdown3 { display: inline-flex; align-items: flex-end; gap: 5px; }
/* width фикс + tabular-nums: ширина ячейки не зависит от того, какие цифры — секунды тикают, ничего не дёргается. */
.countdown3-cell { font-family: var(--font-display); font-size: 21px; font-weight: 600; line-height: 1; padding: 6px 0; background: oklch(1 0 0 / 0.14); border-radius: 8px; width: 40px; text-align: center; font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }
.countdown3-lab { display: block; font-size: 9px; opacity: 0.7; text-align: center; margin-top: 4px; letter-spacing: 0.05em; text-transform: uppercase; }
.countdown3-sep { font-size: 18px; opacity: 0.5; padding-bottom: 13px; }

/* ───────── Category rail (КРС доминирует) ───────── */
.catrail { display: grid; grid-template-columns: 1.6fr repeat(6, 1fr); gap: 10px; }
.cattile3 { display: flex; flex-direction: column; gap: 8px; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; cursor: pointer; text-align: left; transition: transform .14s, box-shadow .14s, border-color .14s; }
.cattile3:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: oklch(0.55 0.12 145 / 0.4); }
.cattile3-ico { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--bg-sunk); color: var(--ink-2); }
.cattile3-name { font-weight: 700; font-size: 14px; }
.cattile3-count { font-size: 11px; color: var(--ink-3); }
.cattile3-sub { font-size: 11px; color: var(--ink-mute); }
/* hero category — КРС */
.cattile3.hero { background: linear-gradient(135deg, var(--forest-ink) 0%, oklch(0.30 0.06 150) 100%); color: oklch(0.96 0.02 80); border-color: transparent; justify-content: space-between; }
.cattile3.hero .cattile3-ico { background: oklch(1 0 0 / 0.14); color: oklch(0.96 0.02 80); width: 52px; height: 52px; }
.cattile3.hero .cattile3-count, .cattile3.hero .cattile3-sub { color: oklch(0.92 0.02 80 / 0.8); }
.cattile3.hero .cattile3-name { font-family: var(--font-display); font-size: 24px; font-weight: 600; }

/* ───────── Paid / promoted ───────── */
.promo-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 3px 8px; border-radius: 6px; background: oklch(0.85 0.13 82); color: oklch(0.25 0.06 60); }
.lst-promo-wrap { position: relative; }
.lst-promo-wrap.on > .lst-card { border-color: oklch(0.74 0.12 78 / 0.7); box-shadow: 0 0 0 2px oklch(0.80 0.12 80 / 0.45), var(--shadow-sm); }
.lst-promo-wrap.on > .lst-card:hover { box-shadow: 0 0 0 2px oklch(0.80 0.12 80 / 0.6), var(--shadow-md); }
.lst-promo-tag { position: absolute; top: 44px; left: 10px; z-index: 4; pointer-events: none; }
.promo-strip { background: linear-gradient(135deg, oklch(0.95 0.04 82) 0%, oklch(0.92 0.06 90) 100%); border: 1px solid oklch(0.80 0.10 80 / 0.4); border-radius: 18px; padding: 22px 24px; }
[data-theme="dark"] .promo-strip { background: linear-gradient(135deg, oklch(0.30 0.05 75) 0%, oklch(0.26 0.04 85) 100%); }

/* ───────── Buy/Sell dual entry ───────── */
.buysell { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bs-card { border-radius: 18px; padding: 26px; position: relative; overflow: hidden; cursor: pointer; transition: transform .15s, box-shadow .15s; }
.bs-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.bs-buy { background: linear-gradient(135deg, var(--forest-ink) 0%, oklch(0.32 0.06 150) 100%); color: oklch(0.96 0.02 80); }
.bs-sell { background: var(--surface); border: 1.5px solid var(--ochre); color: var(--ink); }
.bs-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.75; margin-bottom: 10px; }
.bs-title { font-family: var(--font-display); font-size: 26px; font-weight: 600; line-height: 1.1; margin-bottom: 8px; }
.bs-desc { font-size: 13px; opacity: 0.85; line-height: 1.5; margin-bottom: 18px; max-width: 320px; }

/* ───────── Club / Events promo cards (home) ───────── */
.ce-card { border-radius: 18px; padding: 26px; position: relative; overflow: hidden; color: oklch(0.96 0.02 80); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.ce-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.ce-club { background: linear-gradient(130deg, oklch(0.34 0.08 285) 0%, oklch(0.22 0.05 290) 100%); }
.ce-events { background: linear-gradient(130deg, var(--terracotta) 0%, oklch(0.40 0.10 30) 100%); }
.ce-domain { font-family: var(--font-mono); font-size: 11px; opacity: 0.7; letter-spacing: 0.02em; }
.ce-stat { font-family: var(--font-display); font-size: 24px; font-weight: 600; white-space: nowrap; }

/* ───────── Footer v3 ───────── */
.ft3 { background: oklch(0.20 0.016 60); color: oklch(0.82 0.014 80); margin-top: 60px; }
[data-theme="dark"] .ft3 { background: oklch(0.14 0.012 60); }
.ft3-top { max-width: var(--maxw); margin: 0 auto; padding: 48px 24px 32px; display: grid; grid-template-columns: 1.5fr 1.2fr 1fr 1fr 1fr; gap: 36px; }
/* бренд: лого + описание (тел/email убраны — есть в Контактах) */
.ft3-logo { height: 54px; width: auto; display: block; filter: brightness(0) invert(1); }
/* второй заголовок-группа в одной колонке (Документы под Хозяйствами на мобиле) — не ссылка */
.ft3-col-h2 { margin-top: 26px; }
/* Документы: на десктопе отдельной колонкой (.ft3-docs-desktop), на мобиле — под «Хозяйствам»
   (.ft3-docs-mobile). По умолчанию (десктоп) мобильная копия скрыта. */
.ft3-docs-mobile { display: none; }
.ft3-col-h { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: oklch(0.96 0.02 80); margin-bottom: 14px; }
.ft3-link { display: block; font-size: 13px; color: oklch(0.78 0.014 80); margin-bottom: 9px; cursor: pointer; transition: color .12s; }
.ft3-link:hover { color: oklch(0.88 0.13 82); }
.ft3-brand-desc { font-size: 13px; line-height: 1.55; color: oklch(0.72 0.014 80); margin: 14px 0; max-width: 320px; }
.ft3-contact { font-size: 14px; font-weight: 700; color: oklch(0.96 0.02 80); }
.ft3-app { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid oklch(1 0 0 / 0.16); border-radius: 10px; font-size: 12px; color: oklch(0.88 0.014 80); margin-top: 4px; }
.ft3-legal { border-top: 1px solid oklch(1 0 0 / 0.1); }
.ft3-legal-inner { max-width: var(--maxw); margin: 0 auto; padding: 22px 24px; }
.ft3-docs { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 16px; }
.ft3-doc { font-size: 12px; color: oklch(0.74 0.014 80); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.ft3-doc:hover { color: oklch(0.88 0.13 82); }
.ft3-requisites { font-size: 11.5px; color: oklch(0.62 0.014 80); line-height: 1.6; }
.ft3-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 14px; padding-top: 14px; border-top: 1px solid oklch(1 0 0 / 0.08); font-size: 12px; color: oklch(0.6 0.014 80); }
.ft3-pay { display: inline-flex; gap: 6px; align-items: center; }
.ft3-pay span { padding: 3px 8px; border: 1px solid oklch(1 0 0 / 0.16); border-radius: 5px; font-size: 10px; font-weight: 700; letter-spacing: 0.04em; }
.ft3-lang { display: inline-flex; gap: 4px; }
.ft3-lang button { padding: 4px 10px; border-radius: 7px; font-size: 12px; font-weight: 600; color: oklch(0.7 0.014 80); }
.ft3-lang button[data-active="1"] { background: oklch(1 0 0 / 0.12); color: oklch(0.96 0.02 80); }

/* ===== Footer v4 — компактный, без платёжек/реквизитов/2014 (2026-06-16) ===== */
.ft3-compact { margin-top: 40px; }
.ft3-compact .ft3-top { padding: 16px 24px 22px; }
.ft3-compact .ft3-legal-inner { padding: 16px 24px; }
.ft3-email { font-size: 13px; color: oklch(0.78 0.014 80); margin-top: 2px; }
/* ===== Footer: нейтрализация Impreza-bleed (шрифт Montserrat→Manrope, line-height 28px) ===== */
.skt-redesign-v4 .l-footer .ft3,
.skt-redesign-v4 .l-footer .ft3 * { font-family: var(--font-ui) !important; }
.skt-redesign-v4 .l-footer .ft3-link { line-height: 1.4 !important; }
.skt-redesign-v4 .l-footer .ft3-col-h { line-height: 1.3 !important; }
.skt-redesign-v4 .l-footer .ft3-brand-desc { line-height: 1.55 !important; }
.skt-redesign-v4 .l-footer .ft3-tool-t { line-height: 1.2 !important; }
.skt-redesign-v4 .l-footer .ft3-tool-s { line-height: 1.4 !important; }
.skt-redesign-v4 .l-footer .ft3-doc,
.skt-redesign-v4 .l-footer .ft3-copy,
.skt-redesign-v4 .l-footer .ft3-contact,
.skt-redesign-v4 .l-footer .ft3-email { line-height: 1.45 !important; }
/* стрелка внешней ссылки = как в эталоне (плейн ↗ в шрифте ссылки, лёгкий отступ) */
.ft3-ext { margin-left: 4px; font-weight: 600; }
/* карточки-инструменты — эталон: padding 13, r12, заголовок 14/700, подпись 11 */
.ft3-tool { display: block; padding: 13px; border-radius: 12px; margin-bottom: 9px; }
.ft3-tool:last-child { margin-bottom: 0; }
.ft3-tool-t { font-weight: 700; font-size: 14px; line-height: 1.2; }
.ft3-tool-s { font-size: 11px; margin-top: 3px; line-height: 1.4; }
/* нижняя строка: копирайт слева · документы ПО ЦЕНТРУ · язык справа; без короткой линии сверху */
.ft3-compact .ft3-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 0; padding-top: 0; border-top: none !important; }
.ft3-copy { justify-self: start; }
.ft3-compact .ft3-lang { margin-left: 0; }

/* ───────── Sell page ───────── */
.sell-hero { background: linear-gradient(135deg, oklch(0.30 0.05 60) 0%, oklch(0.22 0.03 50) 100%); color: oklch(0.96 0.02 80); border-radius: 22px; padding: 48px; position: relative; overflow: hidden; }
.sell-plan { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 26px; display: flex; flex-direction: column; position: relative; transition: transform .15s, box-shadow .15s; }
.sell-plan.accent { border-color: var(--ochre); box-shadow: 0 0 0 1px var(--ochre); }
.sell-plan:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.sell-plan-badge { position: absolute; top: -11px; left: 26px; background: var(--ochre); color: #1d1408; font-size: 11px; font-weight: 700; padding: 4px 12px; border-radius: 100px; letter-spacing: 0.03em; }
.sell-feat { display: flex; gap: 9px; align-items: flex-start; font-size: 13px; color: var(--ink-2); padding: 7px 0; }
.sell-feat svg { color: var(--forest); flex-shrink: 0; margin-top: 2px; }
.dokan-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.dokan-cell { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 18px; }

/* ───────── Promo landing (club / events) ───────── */
.promo-hero { border-radius: 24px; padding: 56px 48px; color: oklch(0.96 0.02 80); position: relative; overflow: hidden; }
.promo-hero.club { background: linear-gradient(130deg, oklch(0.34 0.08 285) 0%, oklch(0.20 0.05 290) 100%); }
.promo-hero.events { background: linear-gradient(130deg, var(--terracotta) 0%, oklch(0.38 0.10 28) 100%); }
.promo-stat { font-family: var(--font-display); font-size: 40px; font-weight: 600; line-height: 1; letter-spacing: -0.02em; white-space: nowrap; }
.ev-card { display: flex; gap: 16px; align-items: center; padding: 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; transition: border-color .15s, transform .15s, box-shadow .15s; cursor: pointer; }
.ev-card:hover { border-color: var(--terracotta); transform: translateX(2px); box-shadow: var(--shadow-md); }
.ev-date { width: 64px; height: 64px; border-radius: 12px; background: var(--terracotta-soft); color: var(--terracotta); display: grid; place-items: center; flex-shrink: 0; }
.ev-date-d { font-family: var(--font-display); font-size: 26px; font-weight: 600; line-height: 1; }
.ev-date-m { font-size: 10px; font-weight: 700; letter-spacing: 0.06em; }

/* ───────── Mobile screen frame ───────── */
.mob3 { width: 390px; margin: 0 auto; background: var(--bg); min-height: 844px; position: relative; }
.mob3-tabbar { position: sticky; bottom: 0; display: grid; grid-template-columns: repeat(5, 1fr); background: oklch(0.98 0.01 85 / 0.96); backdrop-filter: blur(12px); border-top: 1px solid var(--line); padding: 8px 0 calc(8px + env(safe-area-inset-bottom)); }
.mob3-tab { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10px; font-weight: 600; color: var(--ink-3); }
.mob3-tab[data-active="1"] { color: var(--forest); }
.mob3-tab.sell { color: var(--ochre-deep); }

/* ───────── Responsive ───────── */
@media (max-width: 1100px) {
  .catrail { grid-template-columns: repeat(4, 1fr); }
  .catrail .cattile3.hero { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 16px; }
  .ft3-top { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 760px) {
  .hd3-top { display: none; }
  .hero3 { height: auto; min-height: 380px; }
  .catrail { grid-template-columns: repeat(2, 1fr); }
  .buysell, .ce-grid { grid-template-columns: 1fr; }
  .ft3-top { grid-template-columns: 1fr 1fr; gap: 24px; }
  .sec-title { font-size: 22px; }
}

/* ---- styles-v5.css (full) ---- */
/* ============================================
   Skotovody — концепция v4 (слой поверх v2/v3)
   Журнал · спокойный hero · карточки хозяйств · корзина/избранное
   ============================================ */

/* ───────── Hero v4: точки слайдера вместо ярлыков ───────── */
.hero5-dot { width: 9px; height: 9px; border-radius: 100px; padding: 0; background: oklch(0.55 0.02 60 / 0.45); box-shadow: inset 0 0 0 1px oklch(1 0 0 / 0.5); cursor: pointer; transition: width .22s, background .22s; }
.hero5-dot[data-active="1"] { width: 30px; background: oklch(0.88 0.13 82); box-shadow: none; }

/* ───────── Категории с фото ───────── */
.cat5 { display: grid; grid-template-columns: 1.7fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.cat5-tile { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; cursor: pointer; text-align: left; padding: 0; transition: transform .14s, box-shadow .14s, border-color .14s; }
.cat5-tile:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: oklch(0.55 0.12 145 / 0.4); }
.cat5-photo { position: relative; }
.cat5-photo .lst-photo { aspect-ratio: 16 / 7; border-radius: 0; height: auto; }
.cat5-photo .lst-photo-dots { display: none; }
.cat5-body { padding: 11px 14px 13px; display: flex; flex-direction: column; gap: 3px; flex: 1; }
.cat5-name { font-weight: 700; font-size: 14px; }
.cat5-sub { font-size: 12px; color: var(--ink-3); }
.cat5-count { font-size: 11.5px; color: var(--ink-3); }
.cat5-foot { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 6px; color: var(--ink-3); }
.cat5-hero { grid-row: 1 / 3; grid-column: 1; }
.cat5-hero .cat5-photo { flex: 1; min-height: 150px; }
.cat5-hero .cat5-photo .lst-photo { aspect-ratio: auto; height: 100%; position: absolute; inset: 0; }
.cat5-hero .cat5-body { flex: 0 0 auto; padding: 14px 18px 16px; }

/* ───────── Единая высота карточек объявлений ───────── */
.grid-eq { align-items: stretch; }
.v3 .lst-card { height: 100%; width: 100%; display: flex; flex-direction: column; }
.v3 .lst-body { flex: 1; display: flex; flex-direction: column; }
.v3 .lst-foot { margin-top: auto; }
.v3 .lst-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.6em; }

/* ───────── Фильтр каталога хозяйств: явные группы и видимые кнопки ───────── */
.v3 .vendors-filterbar { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-end; padding: 16px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; margin-bottom: 16px; }
.vfgroup-lab { font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 7px; }
.v3 .vendors-filter-tabs { display: flex; gap: 6px; flex-wrap: wrap; background: none; border: none; padding: 0; }
.v3 .vendors-filter-tab { padding: 8px 14px; border-radius: 9px; border: 1px solid var(--line); background: var(--bg); color: var(--ink-2); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: all .12s; }
.v3 .vendors-filter-tab:hover { border-color: var(--ink-3); color: var(--ink); }
.v3 .vendors-filter-tab[data-active="1"] { background: var(--ink); color: var(--bg); border-color: transparent; }
.v3 .vendors-sort { padding: 9px 12px; border-radius: 9px; border: 1px solid var(--line); background: var(--bg); font-size: 12.5px; font-weight: 600; color: var(--ink); }

/* ───────── Header v4: счётчики избранного/корзины ───────── */
.hd4-countbtn { position: relative; }
.hd4-count { position: absolute; top: 3px; right: 3px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 100px; background: var(--terracotta); color: #fff; font-size: 10px; font-weight: 800; display: grid; place-items: center; border: 1.5px solid var(--surface); }

/* ───────── Hero v4: миссия + поиск + живой аукцион ───────── */
.hero4 { background: linear-gradient(118deg, var(--forest-ink) 0%, oklch(0.24 0.045 150) 58%, oklch(0.29 0.05 125) 100%); color: oklch(0.96 0.02 80); border-bottom: 1px solid var(--line); }
.hero4-inner { max-width: var(--maxw); margin: 0 auto; padding: 46px 24px 42px; display: grid; grid-template-columns: 1.45fr 1fr; gap: 56px; align-items: center; }
.hero4-kicker { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: oklch(0.88 0.13 82); margin-bottom: 14px; }
.hero4-title { font-family: var(--font-display); font-size: 46px; line-height: 1.04; font-weight: 600; letter-spacing: -0.02em; margin: 0 0 12px; }
.hero4-sub { font-size: 16px; line-height: 1.5; opacity: 0.82; margin: 0 0 26px; max-width: 540px; }
.hero4-search { display: flex; align-items: center; position: relative; max-width: 560px; }
.hero4-search input { width: 100%; padding: 15px 120px 15px 48px; border: 1px solid oklch(1 0 0 / 0.2); border-radius: 14px; background: oklch(0.99 0.005 85); color: var(--ink); font-size: 15px; outline: none; }
.hero4-search-ico { position: absolute; left: 16px; color: oklch(0.45 0.02 80); display: flex; }
.hero4-search-btn { position: absolute; right: 6px; }
.hero4-pop { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; margin-top: 14px; font-size: 12px; }
.hero4-pop-label { opacity: 0.6; margin-right: 2px; }
.hero4-pop-chip { padding: 5px 12px; border-radius: 100px; border: 1px solid oklch(1 0 0 / 0.22); color: oklch(0.94 0.02 80); font-size: 12px; font-weight: 600; cursor: pointer; transition: background .12s; }
.hero4-pop-chip:hover { background: oklch(1 0 0 / 0.12); }

/* живой аукцион — виджет, не реклама */
.hero4-auction { background: oklch(1 0 0 / 0.08); border: 1px solid oklch(1 0 0 / 0.14); border-radius: 18px; overflow: hidden; backdrop-filter: blur(6px); }
.hero4-auction-photo { height: 150px; position: relative; }
.hero4-auction-photo .lst-photo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.hero4-auction-body { padding: 16px 18px 18px; }
.hero4-auction-foot { display: flex; align-items: center; justify-content: space-between; padding: 11px 18px; border-top: 1px solid oklch(1 0 0 / 0.12); font-size: 12px; }

/* ───────── Карточка хозяйства v4: строго единый размер ───────── */
.vc4 { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 12px; cursor: pointer; transition: transform .14s, box-shadow .14s, border-color .14s; position: relative; height: 100%; }
.vc4:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: oklch(0.55 0.12 145 / 0.4); }
.vc4-head { display: flex; align-items: flex-start; gap: 12px; }
.vc4-name { font-size: 15px; font-weight: 700; line-height: 1.2; display: flex; align-items: center; gap: 6px; min-width: 0; }
.vc4-name-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vc4-check { color: var(--forest); display: inline-flex; flex-shrink: 0; }
.vc4-meta { font-size: 12px; color: var(--ink-3); margin-top: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vc4-spec { font-size: 13px; color: var(--ink-2); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; height: 2.9em; }
.vc4-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.vc4-stat { background: var(--bg-sunk); padding: 8px 10px; min-width: 0; }
.vc4-stat b { display: block; font-size: 14px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vc4-stat span { font-size: 10px; color: var(--ink-3); white-space: nowrap; }
.vc4-foot { display: flex; align-items: center; gap: 8px; margin-top: auto; }
.vc4-cta { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 14px; border-radius: 10px; background: var(--forest-soft); color: var(--forest-ink); font-size: 13px; font-weight: 700; transition: background .12s; }
.vc4:hover .vc4-cta { background: oklch(0.55 0.12 145 / 0.22); }
.vc4-fav { width: 38px; height: 38px; border-radius: 10px; border: 1px solid var(--line); display: grid; place-items: center; color: var(--ink-3); background: var(--surface); transition: color .12s, border-color .12s; }
.vc4-fav:hover, .vc4-fav[data-active="1"] { color: var(--terracotta); border-color: var(--terracotta); }

/* ───────── Журнал ───────── */
.jr-feature { display: grid; grid-template-columns: 1.15fr 1fr; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: var(--surface); cursor: pointer; transition: box-shadow .15s; }
.jr-feature:hover { box-shadow: var(--shadow-md); }
.jr-feature-photo { min-height: 260px; position: relative; }
.jr-feature-photo .lst-photo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.jr-feature-body { padding: 28px 30px; display: flex; flex-direction: column; gap: 12px; }
.jr-topic { display: inline-flex; width: fit-content; font-size: 10.5px; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: var(--forest-ink); background: var(--forest-soft); padding: 4px 10px; border-radius: 100px; }
.jr-feature-title { font-family: var(--font-display); font-size: 27px; font-weight: 600; line-height: 1.12; letter-spacing: -0.015em; }
.jr-feature-lead { font-size: 14px; color: var(--ink-2); line-height: 1.55; }
.jr-byline { font-size: 12px; color: var(--ink-3); margin-top: auto; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.jr-card { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; transition: transform .14s, box-shadow .14s; }
.jr-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.jr-card-photo { height: 120px; }
.jr-card-photo .lst-photo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.jr-card-body { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.jr-card-title { font-size: 14.5px; font-weight: 700; line-height: 1.3; }
.jr-row { display: flex; gap: 14px; padding: 13px 0; border-top: 1px solid var(--line); cursor: pointer; align-items: center; }
.jr-row:hover .jr-row-title { color: var(--forest-ink); }
.jr-row-title { font-size: 14px; font-weight: 600; line-height: 1.35; transition: color .12s; }
/* Блог: первая статья — большая фото-карточка слева, поэтому её дубль lead-строкой списка
   скрыт на десктопе (на мобиле наоборот — см. @media 640). */
.jr-row-lead { display: none; border-top: 0; }
.jr-row-lead + .jr-row { border-top: 0; }

/* «Как это работает» (11) — карточки-шаги (классы вместо инлайнов для адаптива) */
.hiw-card { padding: 22px; }
.hiw-num { font-family: var(--font-mono); font-size: 11px; color: var(--ochre-deep); font-weight: 700; letter-spacing: 0.1em; line-height: 1; margin-bottom: 10px; }
.hiw-title { font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.2; margin-bottom: 8px; }
.hiw-desc { font-size: 13px; color: var(--ink-2); line-height: 1.5; }
.jr-chip { padding: 7px 14px; border-radius: 100px; border: 1px solid var(--line); background: var(--surface); font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; white-space: nowrap; transition: all .12s; }
.jr-chip[data-active="1"] { background: var(--ink); color: var(--bg); border-color: transparent; }
.jr-subscribe { background: linear-gradient(135deg, oklch(0.95 0.04 82) 0%, oklch(0.92 0.06 90) 100%); border: 1px solid oklch(0.80 0.10 80 / 0.4); border-radius: 16px; padding: 22px; }
[data-theme="dark"] .jr-subscribe { background: linear-gradient(135deg, oklch(0.30 0.05 75) 0%, oklch(0.26 0.04 85) 100%); }

/* ───────── Трио: Клуб · Мероприятия · Журнал ───────── */
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.trio .ce-card { padding: 24px; }
.ce-journal { background: linear-gradient(130deg, oklch(0.33 0.05 150) 0%, oklch(0.23 0.04 145) 100%); }

/* ───────── Drawer (корзина / избранное) ───────── */
.drw-overlay { position: fixed; inset: 0; background: oklch(0.15 0.02 60 / 0.45); z-index: 90; animation: drwFade .18s ease; }
@keyframes drwFade { from { opacity: 0; } }
.drw { position: fixed; top: 0; right: 0; bottom: 0; width: min(430px, 100vw); background: var(--bg); z-index: 91; display: flex; flex-direction: column; box-shadow: var(--shadow-lg); animation: drwIn .22s ease; }
@keyframes drwIn { from { transform: translateX(40px); opacity: 0; } }
.drw-head { display: flex; align-items: center; gap: 10px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.drw-title { font-family: var(--font-display); font-size: 20px; font-weight: 600; }
.drw-body { flex: 1; overflow-y: auto; padding: 14px 22px; }
.drw-vendor { font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-3); margin: 14px 0 8px; display: flex; align-items: center; gap: 8px; }
.drw-item { display: flex; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); margin-bottom: 10px; }
.drw-item-photo { width: 72px; height: 58px; border-radius: 8px; overflow: hidden; flex-shrink: 0; }
.drw-item-photo .lst-photo { height: 100%; aspect-ratio: auto; border-radius: 0; }
.drw-item-title { font-size: 13px; font-weight: 600; line-height: 1.3; }
.drw-qty { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.drw-qty button { width: 26px; height: 26px; display: grid; place-items: center; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.drw-qty button:hover { background: var(--bg-sunk); }
.drw-qty span { min-width: 24px; text-align: center; font-size: 13px; font-weight: 700; }
.drw-foot { border-top: 1px solid var(--line); padding: 16px 22px calc(16px + env(safe-area-inset-bottom)); background: var(--surface); }
.drw-total { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; }
.drw-empty { text-align: center; padding: 60px 20px; color: var(--ink-3); }
.drw-x { margin-left: auto; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; color: var(--ink-3); }
.drw-x:hover { background: var(--bg-sunk); color: var(--ink); }
.drw-note { font-size: 11.5px; color: var(--ink-3); line-height: 1.5; margin-top: 10px; }

/* кнопка «в корзину» на карточке */
.lst-cart-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; border-radius: 9px; font-size: 12.5px; font-weight: 700; background: var(--forest-soft); color: var(--forest-ink); margin-top: 10px; transition: background .12s; }
.lst-cart-btn:hover { background: oklch(0.55 0.12 145 / 0.25); }
.lst-cart-btn[data-in="1"] { background: var(--forest); color: #fff; }
.lst-request-btn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; border-radius: 9px; font-size: 12.5px; font-weight: 700; border: 1px solid var(--line); color: var(--ink-2); margin-top: 10px; transition: all .12s; }
.lst-request-btn:hover { border-color: var(--forest); color: var(--forest-ink); }

/* ───────── Профиль хозяйства (облегчённый) ───────── */
.vp4-head { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; padding: 24px; display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.vp4-tabs { display: flex; gap: 5px; background: var(--bg-sunk); border: 1px solid var(--line); padding: 5px; border-radius: 12px; width: fit-content; max-width: 100%; margin: 26px 0 20px; overflow-x: auto; }
.vp4-tab { padding: 9px 16px; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: var(--ink-3); white-space: nowrap; transition: all .12s; }
.vp4-tab:hover { color: var(--ink); }
.vp4-tab[data-active="1"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-sm); }
.vp4-stat { text-align: center; padding: 0 18px; border-left: 1px solid var(--line); }
.vp4-stat:first-child { border-left: 0; padding-left: 0; }
.vp4-stat b { display: block; font-family: var(--font-display); font-size: 22px; font-weight: 600; }
.vp4-stat span { font-size: 11px; color: var(--ink-3); }

/* ───────── Инструменты: 4 акцента по приоритету ───────── */
.tools4 { display: grid; grid-template-columns: 1.5fr 1fr 1fr; grid-template-rows: auto auto; gap: 16px; }
.tools4-main { grid-row: 1 / 3; display: flex; flex-direction: column; justify-content: flex-start; }
.tools4 > .ce-card:nth-child(2) { grid-column: 2 / 4; }
.tools4-num { position: absolute; top: 18px; right: 20px; font-family: var(--font-mono); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; opacity: 0.55; }
.ce-blog { background: var(--surface); border: 1px solid var(--line); color: var(--ink); }
.jr-lock { display: inline-flex; align-items: center; font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; padding: 3px 9px; border-radius: 100px; background: oklch(0.34 0.08 285); color: oklch(0.93 0.02 285); }

/* ───────── Журнал скотовода — мок приложения ───────── */
.ja-mock { position: relative; border-radius: 16px; overflow: visible; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-lg); color: var(--ink); }
.ja-mock-bar { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--line); border-radius: 16px 16px 0 0; background: var(--bg-sunk); }
.ja-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--line); }
.ja-url { margin-left: 10px; font-family: var(--font-mono); font-size: 11px; color: var(--ink-3); background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 3px 12px; }
.ja-mock-body { display: grid; grid-template-columns: 150px 1fr; min-height: 270px; }
.ja-side { border-right: 1px solid var(--line); padding: 12px 10px; display: flex; flex-direction: column; gap: 2px; }
.ja-side-item { font-size: 12px; font-weight: 600; color: var(--ink-2); padding: 7px 10px; border-radius: 8px; }
.ja-side-item[data-active="1"] { background: var(--forest-soft); color: var(--forest-ink); font-weight: 700; }
.ja-side-remind { margin-top: 12px; padding: 10px; border-top: 1px solid var(--line); }
.ja-remind { font-size: 10.5px; color: var(--ink-2); line-height: 1.35; margin-bottom: 7px; display: flex; flex-direction: column; }
.ja-remind b { color: var(--ochre-deep); font-size: 10px; }
.ja-main { padding: 14px 16px; min-width: 0; }
.ja-main-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; font-size: 13px; }
.ja-add { font-size: 11px; font-weight: 700; color: var(--forest-ink); background: var(--forest-soft); padding: 5px 10px; border-radius: 7px; }
.ja-row { display: grid; grid-template-columns: 1.2fr 1.1fr 0.7fr 1fr 1fr; gap: 8px; align-items: center; font-size: 11.5px; padding: 8px 6px; border-top: 1px solid var(--line); color: var(--ink-2); }
.ja-row-head { border-top: 0; font-size: 9.5px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ink-3); padding-top: 0; }
.ja-status { font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 100px; background: var(--forest-soft); color: var(--forest-ink); white-space: nowrap; }
.ja-status[data-ok="0"] { background: oklch(0.93 0.05 75); color: var(--ochre-deep); }
.ja-phone { position: absolute; right: -14px; bottom: -18px; width: 132px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; padding: 12px; box-shadow: var(--shadow-lg); }
.ja-band { background: linear-gradient(125deg, oklch(0.30 0.05 150) 0%, oklch(0.22 0.04 145) 100%); color: oklch(0.96 0.02 80); border-radius: 22px; padding: 36px 40px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 44px; align-items: center; }
.ja-band .ja-mock { box-shadow: 0 18px 50px oklch(0.1 0.02 150 / 0.45); }

/* мобильный экран — PWA */
.ja-pwa-row { display: grid; grid-template-columns: 300px 1fr; gap: 56px; align-items: center; }
.ja-pwa { width: 270px; border-radius: 30px; border: 1px solid var(--line); background: var(--bg); box-shadow: var(--shadow-lg), 0 0 0 7px oklch(0.25 0.02 60), 0 0 0 8px oklch(0.45 0.02 60 / 0.4); overflow: hidden; margin: 10px auto; }
.ja-pwa-status { display: flex; justify-content: space-between; padding: 9px 18px 4px; font-size: 11px; font-weight: 700; }
.ja-pwa-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 16px 12px; border-bottom: 1px solid var(--line); }
.ja-pwa-sync { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; color: var(--forest-ink); background: var(--forest-soft); padding: 4px 9px; border-radius: 100px; }
.ja-pwa-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; background: var(--bg-sunk); position: relative; }
.ja-pwa-card { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1px solid var(--line); border-radius: 11px; padding: 9px 12px; }
.ja-pwa-fab { align-self: flex-end; margin-top: 2px; font-size: 11.5px; font-weight: 800; padding: 9px 16px; border-radius: 100px; background: var(--ochre); color: #1d1408; box-shadow: var(--shadow-md); }
.ja-pwa-tabs { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); background: var(--surface); padding: 9px 0 13px; }
.ja-pwa-tabs span { text-align: center; font-size: 10px; font-weight: 700; color: var(--ink-3); }
.ja-pwa-tabs span[data-active="1"] { color: var(--forest); }

/* ───────── Responsive ───────── */
@media (max-width: 1100px) {
  .hero4-inner { grid-template-columns: 1fr; gap: 26px; padding: 36px 24px; }
  .cat5 { grid-template-columns: repeat(3, 1fr); grid-template-rows: none; }
  .cat5-hero { grid-column: 1 / -1; grid-row: auto; }
  .trio { grid-template-columns: 1fr; }
  .tools4 { grid-template-columns: 1fr; grid-template-rows: none; }
  .tools4-main { grid-row: auto; }
  .tools4 > .ce-card:nth-child(2) { grid-column: auto; }
  .ja-band { grid-template-columns: 1fr; }
  .ja-pwa-row { grid-template-columns: 1fr; gap: 26px; }
  .ja-phone { display: none; }
  .jr-feature { grid-template-columns: 1fr; }
  .jr-feature-photo { min-height: 180px; }
}
@media (max-width: 760px) {
  .hero4-title { font-size: 32px; }
}

/* ---- brand mark (Logo2), from styles-v2.css lines 6-26 ---- */
.skt-v4 .brand-mark { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 600; font-size: 22px; letter-spacing: -0.02em; color: var(--ink); }
.skt-v4 .brand-glyph { width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg, var(--forest) 0%, oklch(0.32 0.06 145) 100%); display: grid; place-items: center; color: oklch(0.95 0.05 95); font-family: var(--font-display); font-weight: 700; }

/* ---- chrome (SITE-WIDE, .skt-redesign-v4): HB-шапка / FB-футер full-bleed + offset ----
   Site-wide rollout: .skt-redesign-v4 теперь на ВСЕХ страницах (кроме журнала/дашборда).
   Здесь — только то, что нужно хрому везде. Контентные правила главной — ниже, под .skt-v4-home. */
/* FB-обёртки футера — full-width, без контейнерных ограничений (наш .ft3 рулит сам) */
.skt-redesign-v4 .l-footer .l-section,
.skt-redesign-v4 .l-footer .l-section-h { max-width:none!important; width:100%!important; padding:0!important; margin:0!important; }
.skt-redesign-v4 .l-footer .skt-ftr-row,
.skt-redesign-v4 .l-footer .w-html { width:100%!important; max-width:none!important; }
/* HB-обёртка шапки — full-width, без лишних паддингов/высот (наш .hd3 рулит сам) */
.skt-redesign-v4 .l-header .l-subheader,
.skt-redesign-v4 .l-header .l-subheader-h { max-width:none!important; width:100%!important; padding:0!important; }
.skt-redesign-v4 .l-header .l-subheader-cell { padding:0!important; }
/* центр-ячейка — block (была flex, ужимала наш HTML-блок до контента); наш блок на всю ширину */
.skt-redesign-v4 .l-header .l-subheader-cell.at_center { display:block!important; }
.skt-redesign-v4 .l-header .w-html,
.skt-redesign-v4 .l-header .w-html > .skt-v4 { width:100%!important; }
/* sticky держит Impreza (.l-header.pos_fixed) — наш .hd3 внутри static, иначе sticky ломается в коротком родителе */
.skt-redesign-v4 .l-header .hd3 { position:static!important; }
/* бокс шапки = высота контента (Impreza-row был 80 при контенте 118 → клиппинг) */
.skt-redesign-v4 .l-header .l-subheader.at_middle,
.skt-redesign-v4 .l-header .l-subheader-h,
.skt-redesign-v4 .l-header .l-subheader-cell.at_center { height:auto!important; min-height:0!important; }
/* Хром-шрифт: вся шапка на Manrope независимо от Dokan (нет mono/display в шапке → blanket-force ОК).
   Футер — аналогичное правило ниже (.l-footer .ft3 *). Заменяет глобальный body-нейтрализатор для хрома. */
.skt-redesign-v4 .hd3,
.skt-redesign-v4 .hd3 * { font-family: var(--font-ui) !important; }
/* Offset под fixed-шапку (ТОЛЬКО padding-top — нужен на каждой странице). JS уточняет --skt-hdr-h.
   ДЕФОЛТ 118px (≈высота шапки на десктопе), НЕ 0: иначе до запуска JS контент лезет под шапку (FOUC). */
.skt-redesign-v4 .l-main { padding-top: var(--skt-hdr-h, 118px) !important; }
/* Impreza-обёртка футера .l-footer белая → красим в тон футера (везде, где наш футер). */
.skt-redesign-v4 .l-footer { background: oklch(0.2 0.016 60) !important; }
@media (max-width: 900px) { .skt-redesign-v4 .l-main { padding-top: var(--skt-hdr-h, 80px) !important; } }
/* телефон: фоллбэк ДО JS должен совпадать с реальной высотой 1-рядной шапки (~54px), иначе скачок. */
@media (max-width: 640px) { .skt-redesign-v4 .l-main { padding-top: var(--skt-hdr-h, 56px) !important; } }

/* ---- HOME-ONLY (.skt-v4-home): контент главной. На внутренние страницы НЕ течёт ----
   .skt-v4-home добавляется body_class'ом ТОЛЬКО на фронт-странице (chrome.php). Эти правила
   ломали бы вёрстку внутренних страниц (схлоп паддингов/контейнеров, скрытие titlebar). */
/* Родной Impreza-titlebar/мету прячем только на главной — внутри сайта они штатные. */
.skt-v4-home .l-titlebar,
.skt-v4-home .w-blogpost-meta { display: none !important; }
/* full-bleed: бока 0 + cream-фон (иначе margin последней секции даёт белую полосу перед футером). */
.skt-v4-home .l-main { padding-left: 0 !important; padding-right: 0 !important; padding-bottom: 0 !important; background: var(--bg) !important; }
/* .l-canvas (обёртка страницы) белая → её видно в зазоре перед футером. Красим в cream — только главная. */
.skt-v4-home .l-canvas { background: var(--bg) !important; }
.skt-v4-home .l-canvas > .l-main > .l-section:first-child { padding-top: 0 !important; }

/* ---- HOME-ONLY: full-bleed content (break out of Impreza .l-section-h) ---- */
.skt-v4-home .l-main .l-section,
.skt-v4-home .l-main .l-section-h { max-width: none !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }

/* ---- ВНУТРЕННИЕ redesign-страницы (каталог/товар/архивы/аккаунт и пр.): кремовый фон --bg
   как у журнала и главной. bzrkv: «фон у каталога другой» — был серый Impreza-дефолт
   rgb(242,244,247), журнал кремовый rgb(250,246,238). Красим body+canvas+секции в --bg.
   ТОЛЬКО фон (НЕ full-bleed — лейаут/гаттеры внутренних страниц не трогаем).
   `:not(.skt-v4-home)` — НЕ трогать секции главной (свой фон); `:not(.skt-v4-journal)` — НЕ трогать
   лейаут приложения-журнала (контейнер ломал full-width баннер установки). Журналу — только шапка/футер. */
/* --maxw — на ВСЕХ внутренних (вкл. журнал): нужен и для контейнера журнала (его контент должен
   align с лого v4-шапки, иначе крошка вываливается левее лого). */
body.skt-redesign-v4:not(.skt-v4-home) { --maxw: min(1680px, 95vw); }
/* Кремовый фон — НЕ на журнале (у приложения свой фон/лейаут). */
body.skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) { background: var(--bg) !important; }
.skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) .l-canvas { background: var(--bg) !important; }
.skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) .l-main > .l-section,
.skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) .l-main > .l-section > .l-section-h { background-color: var(--bg) !important; }
/* Контент в центрированный контейнер --maxw (как шапка/футер) — ВКЛ. журнал, чтобы его контент/крошка
   align по левому краю с лого шапки (~60px на 1440). bzrkv: «вот такой отступ». На журнале баннер
   установки остаётся full-bleed (правило ниже), приложение — в контейнере наравне с шапкой. */
.skt-redesign-v4:not(.skt-v4-home) .l-main > .l-section { padding-left: 0 !important; padding-right: 0 !important; }
.skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) .l-main .l-section > .l-section-h {
  max-width: var(--maxw) !important; margin-left: auto !important; margin-right: auto !important;
  padding-left: 24px !important; padding-right: 24px !important;
}
/* Мобайл: контейнер не нужен (узкий экран) — контент во всю ширину с 16px-гаттером. */
@media (max-width: 640px) {
  .skt-redesign-v4:not(.skt-v4-home):not(.skt-v4-journal) .l-main .l-section > .l-section-h {
    max-width: none !important; padding-left: 16px !important; padding-right: 16px !important;
  }
}
/* Журнал: баннер установки (.calf-install-bar--page) калиброван под СТАРУЮ шапку — v4-шапка сбила
   его привязку (стал 1360 в контейнере + зазор 80px). Возвращаем full-width (full-bleed 100vw) и
   убираем верхний зазор первой секции, чтобы баннер был вплотную к шапке, как в эталоне. */
.skt-v4-journal .l-main .l-section:has(.calf-install-bar) > .l-section-h { padding-top: 0 !important; }
.skt-v4-journal .calf-install-bar--page {
  /* full-bleed под АСИММЕТРИЧНЫЙ контейнер журнала: контр-отступ ровно на padding-left секции-h
     (= (100vw - --maxw)/2 + 24). `calc(50%-50vw)` тут не годится (он только для центрированного). */
  margin-left: calc((min(1680px, 95vw) - 100vw) / 2 - 24px) !important; margin-right: 0 !important;
  max-width: none !important; width: 100vw !important;
  /* КОНТЕНТ баннера — в ту же ось, что лого/Продавать (60 на 1440): полоса остаётся кремовой во всю
     ширину, но текст и кнопка садятся в контейнер. Паддинг = гаттер+24 (= padding-left секции-h),
     иначе контент торчал на ~44px левее лого и правее «Продавать» (базовые 16px у кромки). */
  padding-left: calc((100vw - min(1680px, 95vw)) / 2 + 24px) !important;
  padding-right: calc((100vw - min(1680px, 95vw)) / 2 + 24px) !important;
}
@media (max-width: 640px) {
  /* мобайл: section-h padding 16 → баннер вылетает на -16 влево, ширина 100vw, контент с 16px-гаттером */
  .skt-v4-journal .calf-install-bar--page {
    margin-left: -16px !important; width: 100vw !important;
    padding-left: 16px !important; padding-right: 16px !important;
  }
}
/* Крошка журнала: убрать её внутренний left-паддинг (родной 16px) — чтобы текст сел к левому краю
   контейнера, т.е. под лого шапки (как крошка каталога), а не отступал внутрь. */
.skt-v4-journal .calf-breadcrumb { padding-left: 0 !important; }
/* Журнал — контент в ОДНУ вертикаль с шапкой: левый край = лого, правый край = кнопка «Продавать».
   Оба паддинга = гаттер контейнера + 24px(паддинг .hd3-main) → ось слева и справа совпадает с шапкой
   (как у центрированного --maxw, но section-h держим full-width ради full-bleed баннера установки).
   bzrkv: «единая линия справа в линию с Продавать». Раньше правый был 24px у кромки → приложение
   выпирало правее Продавать на ширину гаттера. */
.skt-v4-journal .l-main .l-section > .l-section-h {
  max-width: none !important; margin-left: 0 !important; margin-right: 0 !important;
  padding-left: calc((100vw - min(1680px, 95vw)) / 2 + 24px) !important;
  padding-right: calc((100vw - min(1680px, 95vw)) / 2 + 24px) !important;
}
@media (max-width: 640px) {
  .skt-v4-journal .l-main .l-section > .l-section-h { padding-left: 16px !important; padding-right: 16px !important; }
}

/* neutralize Impreza content typography bleed (heading/link colors) */
.skt-v4 h1, .skt-v4 h2, .skt-v4 h3, .skt-v4 h4, .skt-v4 h5, .skt-v4 h6, .skt-v4 p { color: inherit !important; }

/* ===== header fixes: нейтрализовать наслоения Impreza, числа = эталон v4 ===== */
/* эталон: ряд-навигация 36px, .hd3-main 71px, инпут 45px, Кабинет 42px, Продавать 41px, ext-чип 16px */
.skt-redesign-v4 .hd3-navlink,
.skt-redesign-v4 .hd3-top-right,
.skt-redesign-v4 .hd3-phone{ line-height:normal!important; }
.skt-redesign-v4 .hd3-ext{
  line-height:normal!important; border:1px solid var(--line)!important;
  border-radius:4px!important; padding:1px 4px!important; font-size:9px!important;
  align-self:center!important; display:inline-flex!important; align-items:center!important;
}
.skt-redesign-v4 .hd3-search input{
  box-sizing:border-box!important; height:45px!important; min-height:0!important; max-height:45px!important;
  padding:0 108px 0 46px!important; line-height:normal!important; font-size:14px!important;
  margin:0!important; border-radius:12px!important;
  background-color:var(--surface)!important;
}
/* фокус = эталон: фон остаётся белым, зелёная рамка + мягкий зелёный глоу (не заливается фоном сайта) */
.skt-redesign-v4 .hd3-search input:focus{
  background-color:var(--surface)!important; border-color:var(--forest)!important;
  box-shadow:0 0 0 3px var(--forest-soft)!important; outline:none!important;
}
.skt-redesign-v4 .hd3-search-btn{ top:50%!important; bottom:auto!important; transform:translateY(-50%)!important; }
/* Кабинет и Продавать — одинаковый размер (высота 44, общий паддинг); аватар крупнее */
.skt-redesign-v4 .hd3-account{
  height:44px!important; padding:0 14px!important; gap:8px!important; box-sizing:border-box!important; line-height:1!important;
  display:inline-flex!important; align-items:center!important;
}
.skt-redesign-v4 .hd3-sell{
  height:44px!important; padding:0 14px!important; gap:8px!important; box-sizing:border-box!important; line-height:1!important;
  display:inline-flex!important; align-items:center!important;
}
/* кружок аватара крупнее — чтобы вмещал русские 2-буквенные инициалы (АШ/ШШ) */
.skt-redesign-v4 .hd3-account-av{
  width:30px!important; height:30px!important; min-width:30px!important; font-size:12px!important; flex-shrink:0;
}
/* логотип-эмблема крупнее (по просьбе) */
.skt-redesign-v4 .hd3-logo img{ height:54px!important; width:auto!important; }
/* кнопка «Найти» — эталон: радиус 10px (НЕ овал) + высота 36px (Impreza занижала до 33.6) */
.skt-redesign-v4 .hd3-search-btn{ border-radius:var(--r-md)!important; height:36px!important; line-height:normal!important; padding:0 18px!important; }
/* «Продавать» hover — эталон: фон ochre-deep + светлый текст (у нас Impreza делал тёмным) */
.skt-redesign-v4 .hd3-sell:hover{ background:var(--ochre-deep)!important; color:#fafaf6!important; }
/* аватар-картинка в кнопке «Кабинет» (реальный аватар юзера; инициалы — фоллбэк) */
.skt-redesign-v4 .hd3-account-av-img{ object-fit:cover!important; background:none!important; padding:0!important; border-radius:100px!important; overflow:hidden; }
.skt-redesign-v4 .hd3-account-av{ line-height:1!important; flex-shrink:0; }
.skt-redesign-v4 .hd3-iconbtn{ width:42px!important; height:42px!important; flex-shrink:0; }
.skt-redesign-v4 .hd4-count{ line-height:1!important; }
.skt-redesign-v4 .hd3-ext{ border-width:1px!important; }

.skt-redesign-v4 .hd3-search input{ width:100%!important; }

.skt-redesign-v4 .hd3-search{ position:relative!important; }
.skt-redesign-v4 .hd3-search-btn{ position:absolute!important; right:6px!important; left:auto!important; top:50%!important; bottom:auto!important; transform:translateY(-50%)!important; }

/* ШРИФТЫ шапки = эталон (Impreza перебивает family/size/weight → форсим). Числа: chrome-devtools на эталоне 1573 */
.skt-redesign-v4 .hd3-navlink,
.skt-redesign-v4 .hd3-top-right{ font-family:var(--font-ui)!important; font-size:13px!important; font-weight:600!important; }
.skt-redesign-v4 .hd3-phone{ font-family:var(--font-ui)!important; font-size:13px!important; font-weight:700!important; }
.skt-redesign-v4 .hd3-ext{ font-family:var(--font-ui)!important; font-size:9px!important; font-weight:700!important; letter-spacing:0.04em!important; }
.skt-redesign-v4 .hd3-account{ font-family:var(--font-ui)!important; font-size:13px!important; font-weight:600!important; }
.skt-redesign-v4 .hd3-sell{ font-family:var(--font-ui)!important; font-size:13px!important; font-weight:700!important; }
.skt-redesign-v4 .hd3-search input{ font-family:var(--font-ui)!important; font-size:14px!important; font-weight:400!important; }
.skt-redesign-v4 .hd3-search-btn{ font-family:var(--font-ui)!important; font-size:13px!important; font-weight:600!important; }
/* Кнопка «Найти» — насыщенный зелёный как кнопка «Принять» в cookie-тосте (#2a5934), не бледный forest */
.skt-redesign-v4 .hd3-search-btn{ background:#2a5934!important; border-color:#2a5934!important; color:#fff!important; }
.skt-redesign-v4 .hd3-search-btn:hover{ background:#1f4427!important; border-color:#1f4427!important; }

/* ============================================================
   МОБИЛЬНАЯ ВЕРСИЯ (≤640px) — сквозной брейкпоинт телефона.
   Цель (фидбэк bzrkv 2026-06-17): каждый блок влезает в экран,
   узкие поля по краям, ни одной обрезанной десктоп-сетки.
   build marker: SKTV4-MOBILE-OK
   ============================================================ */
@media (max-width: 640px) {
  /* — поля по краям: убрать «широкие» отступы (был ~5vw margin + 24px padding → 34px/сторону) — */
  .v3 { --maxw: 100vw; }
  .skt-v4 .v3-container { padding: 0 14px !important; margin-top: 26px !important; margin-bottom: 26px !important; }

  /* — заголовки секций компактнее — */
  .skt-v4 .sec-head { margin-bottom: 14px; gap: 10px; }
  .skt-v4 .sec-title { font-size: 22px; }

  /* — Фильтр-чипы «Новые поступления» (05): из тесной правой колонки → горизонтальный РЕЙЛ
       в одну строку, full-bleed до края экрана (как карточки), «Весь каталог» уехал в строку
       заголовка. Фидбэк bzrkv 2026-06-19: 5 чипов сыпались хаотично на 10 строк. — */
  .skt-v4 .nl-head { gap: 12px; }
  .skt-v4 .nl-chips {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    margin: 0 -14px !important;
    padding: 2px 14px !important;
    scroll-padding-left: 14px;
    scrollbar-width: none;
  }
  .skt-v4 .nl-chips::-webkit-scrollbar { display: none; }
  .skt-v4 .nl-chips .chip { flex: 0 0 auto !important; }

  /* — ВИТРИНЫ КАРТОЧЕК (аукционы 03 / премиум 04 / хозяйства 06): горизонтальный РЕЙЛ —
       карточки скроллятся справа-налево (как в эталоне screens-v4/mobile.jsx: vendor rail).
       Фикс-ширина карточки + peek следующей сигналит «листай».
       FULL-BLEED: рейл растянут до краёв экрана (отриц. margin гасит padding .v3-container 14px),
       первая карточка держится на отступе 14px → следующая выезжает ИЗ-ЗА КРАЯ ЭКРАНА, а не из-за
       белого «бордюра» контейнера (фидбэк bzrkv 2026-06-19). — */
  .skt-v4 .grid-eq {
    display: flex !important;
    grid-template-columns: none !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    gap: 12px !important;
    scroll-snap-type: x proximity;
    scroll-padding-left: 14px;
    -webkit-overflow-scrolling: touch;
    margin-left: -14px !important;
    margin-right: -14px !important;
    padding: 0 14px 6px !important;
    scrollbar-width: none;
  }
  .skt-v4 .grid-eq::-webkit-scrollbar { display: none; }
  .skt-v4 .grid-eq > * {
    flex: 0 0 auto !important;
    width: 250px !important;
    scroll-snap-align: start;
  }
  /* ПРЕМИУМ-ВИТРИНА (04): рейл вложен в .promo-strip (жёлтый band, padding 24px) — НЕ full-bleed
     до экрана (иначе −14px тянет относительно band → перекос). Здесь: band держит inset от экрана,
     card1 по контенту band'а (margin/padding-left 0), правый край рейла доведён до КРОМКИ band'а
     (margin-right −24 = гасим правый padding strip) → следующая карточка выезжает из-под кромки
     band'а без жёлтого зазора справа (фидбэк bzrkv 2026-06-19). */
  .skt-v4 .promo-strip .grid-eq {
    margin-left: 0 !important;
    margin-right: -24px !important;
    padding-left: 0 !important;
    padding-right: 24px !important;
    scroll-padding-left: 0 !important;
  }
  /* «Новые поступления» (05) — тоже горизонтальный рейл (по решению bzrkv: карточки везде скроллятся) */
  /* «Как это работает» (11) — 2×2 сетка шагов (не рейл) */
  .skt-v4 .hiw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
  /* «Как это работает» (11) на мобиле — компактнее: шрифты были громоздкие даже против соседних
     разделов. Уменьшаем padding/заголовок/описание. Фидбэк bzrkv 2026-06-19. */
  .skt-v4 .hiw-card { padding: 12px 13px !important; }
  .skt-v4 .hiw-num { font-size: 10px !important; margin-bottom: 6px !important; }
  .skt-v4 .hiw-title { font-size: 14px !important; line-height: 1.2 !important; margin-bottom: 4px !important; }
  .skt-v4 .hiw-desc { font-size: 11.5px !important; line-height: 1.4 !important; }
  /* Блог (09) на мобиле — ровно 3 статьи (как эталон mobile.jsx): прячем 4-ю и далее строки */
  .skt-v4 .jr-list .jr-row:nth-child(n+4) { display: none !important; }

  /* — категории (02): КРС-большая плитка на всю ширину + мелкие в 3 колонки (как эталон) — */
  .skt-v4 .cat5 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; grid-template-rows: none !important; gap: 8px; }
  .skt-v4 .cat5-hero { grid-column: 1 / -1 !important; grid-row: auto !important; }
  .skt-v4 .cat5-hero .cat5-photo { min-height: 150px; }
  /* «Смотреть» убрать — карточки меньше, тело в одну строку (имя). Вся плитка и так ссылка. */
  .skt-v4 .cat5 .cat5-foot { display: none !important; }
  .skt-v4 .cat5-tile:not(.cat5-hero) .cat5-photo .lst-photo { aspect-ratio: 16 / 9 !important; }
  .skt-v4 .cat5-tile:not(.cat5-hero) .cat5-body { padding: 6px 9px 8px !important; gap: 0 !important; }
  .skt-v4 .cat5-tile:not(.cat5-hero) .cat5-name { font-size: 12px !important; line-height: 1.2 !important; }
  .skt-v4 .cat5-tile:not(.cat5-hero) .cat5-sub, .skt-v4 .cat5-tile:not(.cat5-hero) .cat5-count { display: none !important; }

  /* — блог (09): фича + список → стопкой (класс-хук blog-grid) — */
  .skt-v4 .blog-grid { grid-template-columns: 1fr !important; }

  /* — БЛОГ (09) на мобиле = список строк (эталон mobile.jsx): большую фото-карточку скрываем,
       lead-строку (первая статья) показываем, отделяем её снизу. — */
  .skt-v4 .jr-feature { display: none !important; }
  .skt-v4 .jr-row-lead { display: flex !important; border-top: 0 !important; }
  .skt-v4 .jr-row-lead + .jr-row { border-top: 1px solid var(--line) !important; }

  /* — ИНСТРУМЕНТЫ (07): компактные карточки как в эталоне mobile.jsx (мини-кикер + title 16px +
       1–2 строки описания). У Клуба прячем буллеты и кнопку — только заголовок+описание. — */
  .skt-v4 .tools4 .ce-card { padding: 14px 16px !important; }
  .skt-v4 .tools4 .bs-title { font-size: 16px !important; margin-top: 4px !important; }
  .skt-v4 .tools4 .bs-desc {
    font-size: 12px !important; line-height: 1.4 !important; margin: 0 !important; max-width: none !important; opacity: 0.82;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .skt-v4 .tools4-main .ce-feat,
  .skt-v4 .tools4-main .btn { display: none !important; }
  /* Блог-плитка (4-я) на мобиле скрыта — блог идёт отдельной секцией-списком ниже (эталон: 3 плитки) */
  .skt-v4 .tools4 .ce-blog { display: none !important; }
  .skt-v4 .tools4-num { top: 13px !important; right: 14px !important; font-size: 10px !important; }
  .skt-v4 .tools4 .ce-domain { font-size: 10px !important; }
  .skt-v4 .tools4 .ce-card > span[style*="font-size:13px"] { font-size: 12px !important; }

  /* — ЖУРНАЛ-приложение (08): большой зелёный блок с визуалом приложения на мобиле НЕ показываем
       (журнал представлен компактной плиткой в «Инструментах»). Фидбэк bzrkv 2026-06-19. — */
  .skt-v4 .ja-section { display: none !important; }

  /* — hero (01): одна колонка, узкие поля, меньше заголовок/текст.
       Фикс-высота 470 — НЕ прыгает при автосмене слайдов; богатые слайды
       (аукцион/премиум/клуб) ужаты, чтобы цена/таймер/CTA не обрезались. — */
  .skt-v4 .hero3 { height: auto !important; min-height: 400px; }
  .skt-v4 .hero3-inner { grid-template-columns: 1fr !important; gap: 10px !important; padding: 18px 16px !important; }
  .skt-v4 .hero3 h1 { font-size: 22px !important; line-height: 1.1 !important; }
  /* подзаголовок компактнее + максимум 2 строки (меньше текста на слайде) */
  .skt-v4 .hero3 p { font-size: 13px !important; line-height: 1.4 !important; margin-bottom: 14px !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  /* — АУКЦИОН/ПРЕМИУМ: фото лота = ФОН на весь слайд + тёмный скрим, инфа компактно ПОВЕРХ
       (как баннеры), а не узкая полоска. Контент прижат вниз. — */
  .skt-v4 .hero3-auction .hero3-inner,
  .skt-v4 .hero3-premium .hero3-inner { position: relative; }
  /* фото-бокс (1-й ребёнок) → абсолютный фон слайда */
  .skt-v4 .hero3-auction .hero3-inner > div:first-child,
  .skt-v4 .hero3-premium .hero3-inner > div:first-child {
    position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important;
    height: auto !important; width: auto !important; margin: 0 !important; align-self: stretch !important;
    border-radius: 0 !important; z-index: 0;
  }
  .skt-v4 .hero3-auction .hero3-inner > div:first-child .lst-photo,
  .skt-v4 .hero3-premium .hero3-inner > div:first-child .lst-photo { height: 100% !important; aspect-ratio: auto !important; }
  /* тёмный скрим снизу — текст читается поверх фото */
  .skt-v4 .hero3-auction .hero3-inner > div:first-child::after,
  .skt-v4 .hero3-premium .hero3-inner > div:first-child::after {
    content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1;
    background: linear-gradient(180deg, rgba(14,12,9,0) 0%, rgba(14,12,9,.14) 26%, rgba(14,12,9,.64) 44%, rgba(14,12,9,.90) 60%, rgba(14,12,9,.98) 100%);
  }
  /* LIVE/promo бейдж (последний ребёнок фото-бокса) — поверх скрима. НЕ трогать .lst-photo (иначе фото лезет над скримом) */
  .skt-v4 .hero3-auction .hero3-inner > div:first-child > div:last-child,
  .skt-v4 .hero3-premium .hero3-inner > div:first-child > div:last-child { z-index: 2 !important; position: relative; }
  /* детали — поверх фото, прижаты вниз, со светотенью для читаемости поверх фото */
  /* z-index у grid-элемента работает БЕЗ position → details не становится positioned-предком,
     и абсолютный CTA внутри якорится к .hero3-inner (единая точка низ-лево на всех слайдах) */
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2),
  .skt-v4 .hero3-premium .hero3-inner > div:nth-child(2) { position: static !important; z-index: 2; align-self: end !important; text-shadow: 0 1px 10px rgba(0,0,0,.7), 0 2px 4px rgba(0,0,0,.65); }
  /* мелкие лейблы (СТАРТОВАЯ ЦЕНА/ДО КОНЦА/дн-час-мин) ярче — над фото читаемо */
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) [style*="opacity"] { opacity: .9 !important; }
  .skt-v4 .hero3-auction .countdown3-lab { opacity: .92 !important; }
  /* аукцион: убрать кикер «Аукцион сейчас» и чипы породы/региона (меньше текста) */
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) > div:first-child { display: none !important; }
  .skt-v4 .hero3-auction .chip-hero { display: none !important; }
  /* цена аукциона в ОДНУ строку, меньше шрифт; лейблы (СТАРТОВАЯ ЦЕНА | ДО КОНЦА) на одном уровне,
     значения (5 000 000 ₽ | таймер) на одном уровне → выравниваем блоки по ВЕРХУ + единый лейбл */
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) > div[style*="grid"] { gap: 12px !important; margin-bottom: 12px !important; align-items: start !important; }
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) > div[style*="grid"] > div > div:first-child { margin-bottom: 6px !important; line-height: 1 !important; }
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) > div[style*="grid"] > div:first-child > div:last-child { font-size: 21px !important; white-space: nowrap !important; line-height: 1 !important; }
  .skt-v4 .hero3 .countdown3 { gap: 3px !important; }
  .skt-v4 .hero3 .countdown3-cell { font-size: 13px !important; width: 21px !important; padding: 4px 0 !important; }
  .skt-v4 .hero3 .countdown3-sep { font-size: 13px !important; padding-bottom: 8px !important; }
  .skt-v4 .hero3 .countdown3-lab { font-size: 8px !important; }
  /* CTA — маленькая, БЕЗ тени текста (тень наследовалась от деталей → «колхоз» на кнопке) */
  .skt-v4 .hero3-slide .btn { padding: 7px 14px !important; font-size: 12px !important; text-shadow: none !important; align-self: flex-start !important; flex: 0 0 auto !important; }
  /* ── мобайл hero: МИНИМУМ текста (фидбэк bzrkv) ── */
  /* подзаголовки убрать */
  .skt-v4 .hero3-slide p { display: none !important; }
  /* премиум: оставить ОДИН бейдж «Продвигается» (.promo-badge в фото-боксе); убрать дубли
     «Премиум-лот недели» + «Платное размещение» (масло масляное) */
  .skt-v4 .hero3-premium .hero3-inner > div:nth-child(2) > div:first-child { display: none !important; }
  /* бейджи мельче + БЕЗ тени текста */
  .skt-v4 .hero3-slide .hero3-badge,
  .skt-v4 .hero3-slide .promo-badge,
  .skt-v4 .hero3-slide .hero3-paidtag { text-shadow: none !important; }
  .skt-v4 .hero3-slide .hero3-badge { font-size: 9.5px !important; padding: 4px 10px !important; gap: 5px !important; letter-spacing: 0.06em !important; }
  .skt-v4 .hero3-slide .promo-badge { font-size: 9.5px !important; padding: 3px 8px !important; }
  /* оставляем один главный CTA — вторичную кнопку прячем (пара не влезает в 358px) */
  .skt-v4 .hero3-slide .btn-secondary { display: none !important; }
  /* крупные числа цены/таймера чуть меньше */
  .skt-v4 .hero3 .countdown3-cell { font-size: 17px !important; width: 32px !important; }
  /* клуб: параметры сообщества (3 чек-пункта) — компактный список, без раздувания первого */
  .skt-v4 .hero3-club-feats { font-size: 13px !important; gap: 9px !important; justify-content: flex-start !important; padding-top: 6px; }
  .skt-v4 .hero3-club-feats span { font-size: 13px !important; line-height: 1.3 !important; }
  .skt-v4 .hero3-club-feats svg { width: 15px !important; height: 15px !important; }
  /* клуб мобайл: фокус на ЛЮДЕЙ (справа) + скрим плотнее снизу — заголовок/параметры/CTA читаемы */
  .skt-v4 .hero3-club-bg { background-position: 82% center !important; }
  /* скрим легче — фото скотоводов видно (фидбэк bzrkv: «только фон, изображений нет») */
  .skt-v4 .hero3-club-bg::after { background: linear-gradient(180deg, oklch(0.18 0.05 285 / 0.42) 0%, oklch(0.19 0.05 285 / 0.26) 38%, oklch(0.18 0.05 285 / 0.82) 100%) !important; }
  /* баннеры (Аукцион/Форум): на узком мобайле горизонтальный скрим топил фото → вертикальный, легче */
  .skt-v4 .hero3-banner-bg::after { background: linear-gradient(180deg, rgba(18,16,12,.34) 0%, rgba(18,16,12,.26) 42%, rgba(18,16,12,.82) 100%) !important; }

  /* ═══ УНИФИКАЦИЯ ПОЗИЦИЙ СЛАЙДОВ (bzrkv): бейдж верх-лево, кнопка низ-лево — фикс на ВСЕХ слайдах ═══ */
  .skt-v4 .hero3-inner { position: relative !important; padding-bottom: 56px !important; }
  /* контент банера/клуба: убрать промежуточный positioned-предок (position:static) → бейдж/CTA
     якорятся к .hero3-inner; z-index держится как у grid-элемента. Контент прижать вниз. */
  .skt-v4 .hero3-banner .hero3-inner > div { align-self: end !important; position: static !important; z-index: 2; }
  .skt-v4 .hero3-club .hero3-inner > div:first-child { position: static !important; z-index: 2; }
  /* CTA-ряд каждого слайда → абсолют НИЗ-ЛЕВО (одна точка при перелистывании) */
  .skt-v4 .hero3-auction .hero3-inner > div:nth-child(2) > div:last-child,
  .skt-v4 .hero3-premium .hero3-inner > div:nth-child(2) > div:last-child,
  .skt-v4 .hero3-banner .hero3-inner > div > div:last-child,
  .skt-v4 .hero3-club .hero3-inner > div:first-child > div:last-child {
    position: absolute !important; left: 16px !important; bottom: 16px !important; right: auto !important; margin: 0 !important; z-index: 4;
  }
  /* бейдж banner/club → абсолют ВЕРХ-ЛЕВО (у auction/premium бейдж уже в фото-боксе) */
  .skt-v4 .hero3-banner .hero3-inner > div > .hero3-badge,
  .skt-v4 .hero3-club .hero3-inner > div:first-child > .hero3-badge {
    position: absolute !important; top: 16px !important; left: 16px !important; margin: 0 !important; z-index: 4;
  }
  /* auction/premium бейдж — единые координаты верх-лево */
  .skt-v4 .hero3-auction .hero3-inner > div:first-child > div:last-child,
  .skt-v4 .hero3-premium .hero3-inner > div:first-child > div:last-child { top: 16px !important; left: 16px !important; }
  /* LIVE-бейдж аукциона — заметный (мигающая красная точка + слово LIVE), не мельчить */
  .skt-v4 .hero3-auction .hero3-badge { font-size: 11px !important; padding: 5px 11px !important; }
  .skt-v4 .hero3-auction .live-dot { width: 8px !important; height: 8px !important; }
  /* стрелки слайдера скрыты на телефоне — наезжали на текст/кнопки; навигация = точки + автоплей + тап по точкам */
  .skt-v4 .hero3-arrow { display: none !important; }

  /* — мокап Журнала (08): десктоп-таблица 150px+5кол не влезала → телефонный вид (3 колонки, без сайдбара) — */
  .skt-v4 .ja-band { padding: 22px 16px !important; gap: 20px !important; }
  .skt-v4 .ja-mock-body { grid-template-columns: 1fr !important; }
  .skt-v4 .ja-side { display: none !important; }
  .skt-v4 .ja-main { padding: 12px !important; }
  .skt-v4 .ja-row { grid-template-columns: 1.4fr 1fr 0.7fr !important; gap: 6px !important; font-size: 11px !important; }
  .skt-v4 .ja-row > :nth-child(n+4) { display: none !important; } /* Привес/Статус не влезают */

  /* — ШАПКА мобайл: ОДИН ряд (как старый сайт) — лого + короткий поиск + иконки ♥/корзина.
       Компактная высота. «Кабинет»/«Продавать» убраны → в нижний таб-бар.
       Поиск font-size 16px = БЕЗ авто-зума iOS при фокусе (фидбэк bzrkv). — */
  .skt-redesign-v4 .hd3-main { flex-wrap: nowrap !important; column-gap: 8px !important; row-gap: 0 !important; padding: 8px 12px !important; align-items: center !important; }
  .skt-redesign-v4 .hd3-logo { order: 0; flex-shrink: 0; margin-right: 0 !important; }
  .skt-redesign-v4 .hd3-logo img { height: 30px !important; }
  .skt-redesign-v4 .hd3-search { order: 1 !important; flex: 1 1 auto !important; min-width: 0 !important; }
  .skt-redesign-v4 .hd3-search input { height: 38px !important; max-height: 38px !important; font-size: 16px !important; padding: 0 12px 0 38px !important; }
  .skt-redesign-v4 .hd3-search-btn { display: none !important; }
  .skt-redesign-v4 .hd3-iconbtn { order: 2; width: 38px !important; height: 38px !important; flex-shrink: 0; }
  .skt-redesign-v4 .hd3-divider,
  .skt-redesign-v4 .hd3-account,
  .skt-redesign-v4 .hd3-sell { display: none !important; }

  /* ─── НИЖНИЙ ТАБ-БАР (мобайл) — порт mob3-tabbar из эталона mobile.jsx ─── */
  .skt-redesign-v4 .skt-tabbar {
    display: grid !important;
    /* Иконки сближены по образцу таб-бара журнала (.calf-tabbar-row): центр-колонка фиксирована
       (64px под кнопку-плюс), боковой отступ 16px, gap 4px → 4 иконки стягиваются к центру,
       а не разъезжаются к краям (было repeat(5,1fr) во всю ширину). */
    grid-template-columns: 1fr 1fr 64px 1fr 1fr; gap: 4px; align-items: center;
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 80;
    background: oklch(0.98 0.01 85 / 0.96); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
    border-top: 1px solid var(--line);
    padding: 7px 16px; /* вертикаль 7px НЕ трогаем (компакт, без env(safe-area)); боковые 16px = инсет журнала. НЕ растягивать min-height. */
  }
  .skt-tab { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 10px; font-weight: 600; color: var(--ink-3) !important; text-decoration: none; }
  .skt-tab[data-active="1"] { color: var(--forest) !important; }
  .skt-tab svg { display: block; }
  .skt-tab-sell { color: var(--ochre-deep) !important; }
  .skt-tab-sellbtn { width: 40px; height: 40px; border-radius: 12px; background: var(--ochre); color: #1d1408; display: grid; place-items: center; margin-top: -16px; box-shadow: var(--shadow-md); }
  /* — ФУТЕР (мобайл, фидбэк bzrkv 2026-06-19): бренд (лого + описание + документы списком) слева,
       цветные плитки-инструменты справа от лого, ниже — колонки ссылок 2-кол. Тел/email убраны
       (есть в Контактах). Зазор верх↔лого уменьшен вдвое (26→13px). — */
  .skt-v4 .ft3-top { grid-template-columns: 1fr 1fr !important; gap: 20px 14px !important; padding: 13px 16px 18px !important; }
  .skt-v4 .ft3-logo { height: 38px !important; }
  .skt-v4 .ft3-brand-desc { font-size: 12px !important; margin: 9px 0 0 !important; max-width: none !important; line-height: 1.45 !important; }
  .skt-v4 .ft3-col-h2 { margin-top: 18px !important; }
  /* Документы на мобиле — под «Хозяйствам» (показываем копию), отдельную колонку скрываем */
  .skt-v4 .ft3-docs-mobile { display: block !important; }
  .skt-v4 .ft3-docs-desktop { display: none !important; }
  .skt-v4 .ft3-col-h { font-size: 10.5px !important; margin-bottom: 9px !important; }
  .skt-v4 .ft3-link { font-size: 12px !important; margin-bottom: 6px !important; }
  /* плитки-инструменты компактнее, чтобы влезли в правый столбец */
  .skt-v4 .ft3-tool { padding: 9px 10px !important; margin-bottom: 7px !important; border-radius: 10px !important; }
  .skt-v4 .ft3-tool-t { font-size: 12.5px !important; }
  .skt-v4 .ft3-tool-s { font-size: 10px !important; margin-top: 2px !important; }
  /* легал: копирайт + язык */
  .skt-v4 .ft3-compact .ft3-bottom { flex-wrap: wrap !important; gap: 10px !important; }
  .skt-v4 .ft3-copy { font-size: 11px !important; }
  .skt-v4 .ft3-legal-inner { padding: 16px !important; }

  /* контент/футер не прячется под фикс-баром */
  .skt-redesign-v4 .l-footer { padding-bottom: 64px !important; }
  /* Impreza-кнопка «наверх» налезает на таб-бар → скрыть на телефоне */
  .skt-redesign-v4 .w-toplink { display: none !important; }
}
/* таб-бар скрыт на десктопе */
.skt-redesign-v4 .skt-tabbar { display: none; }

/* ===== ХЛЕБНЫЕ КРОШКИ — стиль КАК НА СТРАНИЦЕ ЖУРНАЛА (.calf-breadcrumb). Marker: SKTV4-CRUMB-OK =====
   bzrkv: «сделай такие крошки, как на журнале — там стильно». Эталон .calf-page--public .calf-breadcrumb:
   ссылки muted #7a7a6e (400, без подчёркивания) · ТЕКУЩАЯ = forest #2c4a2e + weight 500 (НЕ bold!) ·
   сепаратор тонкий глиф › · gap 4 · 13px (ТОЧНО как журнал) · шрифт НЕ навязываем (наследуется
   Montserrat — как у нативного виджета и у журнала). Прежний «оферта»-вариант (Manrope+bold-700+
   FA-иконка) откатили. Размер пробовали 15px (думали «крупнее»), но журнал = 13px → вернули 13 (1:1).
   Причина «не менялось» у bzrkv = Service Worker (calf-sw.js, корневой scope) держал старый CSS.
   Site-wide под .skt-redesign-v4; зазор шапка→крошки 18px (ниже). */
.skt-redesign-v4 .g-breadcrumbs {
  display: flex !important; align-items: baseline; flex-wrap: wrap; gap: 4px;
  font-size: 13px !important; color: #7a7a6e !important; line-height: 1.3 !important;
  margin: 0 0 16px !important; /* зазор крошка→заголовок = 16px, как у журнала (.calf-breadcrumb) */
}
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-item,
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-item a {
  font-size: 13px !important; font-weight: 400 !important; color: #7a7a6e !important; text-decoration: none !important;
}
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-item a:hover { color: #2c4a2e !important; }
/* текущая страница (последний item) — лёгкое зелёное выделение, как на журнале */
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-item:last-child { color: #2c4a2e !important; font-weight: 500 !important; }
/* сепаратор — тонкий глиф › (прячем FA-иконку Impreza, ставим глиф как у .calf-breadcrumb) */
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-separator { color: #7a7a6e !important; display: inline-flex !important; align-items: baseline; margin: 0 !important; }
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-separator i { display: none !important; }
.skt-redesign-v4 .g-breadcrumbs .g-breadcrumbs-separator::before { content: "\203A"; color: #7a7a6e; font-size: 13px; }
/* Док-крошки .ev-doc-crumb — те же цвета/вес: ссылки muted, текущая (span) зелёная 500, chevron muted */
.skt-redesign-v4 .ev-doc-crumb { font-size: 13px !important; }
.skt-redesign-v4 .ev-doc-crumb a { color: #7a7a6e !important; font-weight: 400 !important; text-decoration: none !important; }
.skt-redesign-v4 .ev-doc-crumb a:hover { color: #2c4a2e !important; }
.skt-redesign-v4 .ev-doc-crumb span { color: #2c4a2e !important; font-weight: 500 !important; }
.skt-redesign-v4 .ev-doc-crumb svg { color: #7a7a6e !important; }
/* Секция-тайтлбар (крошка+H1) Impreza была padding 18/24/24 → крошка/заголовок торчали на
   8px ПРАВЕЕ контента (товары на 16px-гаттере) на мобиле И не совпадали с журналом (16px).
   Выравниваем: top 20 (= зазор журнала до шапки), left/right 16 (= гаттер контента и журнала),
   bottom 0. На десктопе .l-section-h центрируется в контейнере, 16 не вредит. */
.skt-redesign-v4 .l-section:has(.g-breadcrumbs) { padding: 20px 0 0 !important; }
.skt-redesign-v4 .l-section:has(.g-breadcrumbs) > .l-section-h { padding-top: 0 !important; }
/* Док-крошки (.ev-doc-crumb внутри .ev-doc) — тот же зазор 18px для ЕДИНОЙ высоты.
   Цепочка section(pt64)+l-section-h(pt80)+.ev-doc(mt-64,pt16)=96 → схлопываем детерминированно:
   секция 18 + section-h 0 + ev-doc offset 0 = 18 (как у .g-breadcrumbs). */
.skt-redesign-v4 .l-section:has(.ev-doc-crumb) { padding-top: 18px !important; }
.skt-redesign-v4 .l-section:has(.ev-doc-crumb) > .l-section-h { padding-top: 0 !important; }
.skt-redesign-v4 .ev-doc { margin-top: 0 !important; padding-top: 0 !important; }

/* ═══════════════════ КАТАЛОГ /shop/ — карточки товара под эталон v4 (ListingCardV4) ═══════════════════
   Impreza рендерит магазин US-ГРИДОМ (.w-grid-list > article.w-grid-item.product), а НЕ ul.products —
   поэтому оверрайд woocommerce/content-product.php бесполезен (Impreza его обходит). Перекрашиваем
   грид-разметку в вид .lst-card. Всё scoped к `.w-grid-item.product` → блог/прочие US-гриды не трогаем.
   Структура ячейки: .w-grid-item-h > [woosq-глаз, ♥, .post_image, .sale_badge, .w-vwrapper(title,price,btn)]. */

/* поверхность карточки = .w-grid-item-h (внутренний враппер ячейки) */
.skt-redesign-v4 .w-grid-list .w-grid-item.product { display: flex !important; }
.skt-redesign-v4 .w-grid-list .w-grid-item.product > .w-grid-item-h {
  position: relative; width: 100%; height: 100%;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .15s, box-shadow .15s, border-color .15s;
}
.skt-redesign-v4 .w-grid-list .w-grid-item.product > .w-grid-item-h:hover {
  transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--line-strong);
}
/* пустые служебные html-элементы грида (countdown loop-cd) не должны давать flex-зазор */
.skt-redesign-v4 .w-grid-item.product .loop-cd:empty { display: none !important; }

/* фото: ratio 4/3 (как эталон), картинка cover, без отступов */
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_image {
  margin: 0 !important; aspect-ratio: 4 / 3; overflow: hidden; position: relative; order: 0;
}
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_image a,
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_image picture,
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_image img {
  width: 100% !important; height: 100% !important; object-fit: cover; display: block;
}

/* sale-бейдж «Распродажа!» → v4-пилюля терракота, поверх фото сверху-слева */
.skt-redesign-v4 .w-grid-item.product .product_field.sale_badge {
  position: absolute; top: 10px; left: 10px; z-index: 3; margin: 0 !important;
  background: var(--terracotta); color: #fff; font-size: 10px; font-weight: 700;
  letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 6px;
  line-height: normal;
}

/* ♥ + глаз (woosq) → круглые v4-кнопки сверху-справа поверх фото, в ряд */
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.for_add_to_favs,
.skt-redesign-v4 .w-grid-item.product .w-html.usg_html_2 {
  position: absolute !important; top: 10px; z-index: 4; margin: 0 !important; width: auto;
}
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.for_add_to_favs { right: 10px; }
.skt-redesign-v4 .w-grid-item.product .w-html.usg_html_2 { right: 52px; }
.skt-redesign-v4 .w-grid-item.product .us_add_to_favs,
.skt-redesign-v4 .w-grid-item.product .woosq-btn {
  width: 34px !important; height: 34px !important; min-height: 0 !important; padding: 0 !important;
  border-radius: 100px !important; display: grid !important; place-items: center !important;
  background: oklch(0.97 0.012 85 / 0.92) !important; backdrop-filter: blur(8px);
  color: var(--ink-2) !important; border: 0.5px solid oklch(1 0 0 / 0.4) !important;
  box-shadow: var(--shadow-sm) !important;
}
.skt-redesign-v4 .w-grid-item.product .us_add_to_favs:hover,
.skt-redesign-v4 .w-grid-item.product .us_add_to_favs.active { color: var(--terracotta) !important; }
.skt-redesign-v4 .w-grid-item.product .us-add-to-favs-tooltip { display: none !important; }

/* тело: .w-vwrapper → padding 14, flex column, gap 8 */
.skt-redesign-v4 .w-grid-item.product .w-vwrapper {
  padding: 14px !important; display: flex !important; flex-direction: column; gap: 8px;
  flex: 1; min-height: 0;
}
/* цена — Fraunces 22, поверх заголовка (order 1) */
.skt-redesign-v4 .w-grid-item.product .product_field.price {
  order: 1; margin: 0 !important; font-family: var(--font-display); font-size: 22px;
  font-weight: 600; letter-spacing: -.01em; color: var(--ink); line-height: 1.1;
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
}
.skt-redesign-v4 .w-grid-item.product .product_field.price del {
  font-family: var(--font-ui); font-size: 13px; font-weight: 500; color: var(--ink-mute);
  text-decoration: line-through; opacity: 1; order: 0;
}
.skt-redesign-v4 .w-grid-item.product .product_field.price ins { text-decoration: none; }
.skt-redesign-v4 .w-grid-item.product .product_field.price .woocommerce-Price-amount { font-size: 22px; }
/* заголовок — 14/600, clamp 2 строки (order 2) */
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_title {
  order: 2; margin: 0 !important; font-size: 14px !important; font-weight: 600 !important;
  line-height: 1.3 !important;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.skt-redesign-v4 .w-grid-item.product .w-post-elm.post_title a { color: var(--ink) !important; }

/* кнопка add-to-cart → full-width v4 (зелёная), прижата к низу */
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce {
  order: 3; margin: 10px 0 0 !important; margin-top: auto !important; width: 100%;
}
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce .button {
  width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  padding: 10px 12px !important; border-radius: 9px !important; min-height: 0 !important;
  font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: 0 !important;
  background: var(--forest-soft) !important; color: var(--forest-ink) !important;
  border: 0 !important; box-shadow: none !important; text-transform: none !important;
}
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce .button:hover {
  background: oklch(0.55 0.12 145 / 0.25) !important;
}
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce .button.added {
  background: var(--forest) !important; color: #fff !important;
}
/* вариант «Заявка продавцу · осмотр» (скот) — контурная кнопка (эталон .lst-request-btn) */
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce .button.skt-request-btn {
  background: transparent !important; color: var(--ink-2) !important;
  border: 1px solid var(--line) !important;
}
.skt-redesign-v4 .w-grid-item.product .w-btn-wrapper.woocommerce .button.skt-request-btn:hover {
  background: transparent !important; border-color: var(--forest) !important; color: var(--forest-ink) !important;
}

/* ───────── Каталог: фильтр-сайдбар (нативный Impreza .w-order/.w-filter) → v4 ───────── */
/* враппер сайдбара имеет padding-left:24 → панели уезжали на 84 (заголовок/крошка на 60, оси нет).
   Обнуляем гориз. паддинг ТОЛЬКО у враппера с фильтром (:has), чтобы панели сели на ось 60. */
.skt-redesign-v4 .wpb_column .vc_column-inner > .w-vwrapper:has(.w-filter.for_list) {
  padding-left: 0 !important; padding-right: 0 !important;
}
/* сортировка + фильтр в единые v4-панели (белая поверхность, бордюр, radius) */
.skt-redesign-v4 .l-main .w-order.for_list,
.skt-redesign-v4 .l-main .w-filter.for_list {
  background: var(--surface) !important; border: 1px solid var(--line) !important;
  border-radius: var(--r-lg) !important;
}
.skt-redesign-v4 .l-main .w-order.for_list { padding: 12px !important; margin-bottom: 16px !important; }
.skt-redesign-v4 .l-main .w-filter.for_list { padding: 6px 16px 16px !important; }

/* сортировка + поиск внутри групп — v4-инпуты */
.skt-redesign-v4 .w-order-select select,
.skt-redesign-v4 .w-filter-item-search input {
  border: 1px solid var(--line) !important; border-radius: 10px !important;
  background: var(--surface) !important; color: var(--ink) !important; font-size: 14px !important;
  height: 44px !important; min-height: 0 !important; padding: 0 14px !important; box-shadow: none !important;
}
.skt-redesign-v4 .w-order-select select:focus,
.skt-redesign-v4 .w-filter-item-search input:focus {
  border-color: var(--forest) !important; box-shadow: 0 0 0 3px var(--forest-soft) !important; outline: none !important;
}

/* заголовки групп фильтра */
.skt-redesign-v4 .w-filter-item-title {
  font-family: var(--font-ui) !important; font-size: 14px !important; font-weight: 700 !important;
  color: var(--ink) !important;
}
.skt-redesign-v4 .w-filter-list-title { font-weight: 700 !important; color: var(--ink-2) !important; }
.skt-redesign-v4 .w-filter-item-reset span,
.skt-redesign-v4 .w-filter-item-reset { color: var(--forest) !important; }
.skt-redesign-v4 .w-filter-item { border-top: 1px solid var(--line) !important; }

/* опции (radio/checkbox) — forest-акцент */
.skt-redesign-v4 .w-filter-item-value label { color: var(--ink-2) !important; font-size: 14px !important; }
.skt-redesign-v4 .w-filter-item-value input[type="radio"],
.skt-redesign-v4 .w-filter-item-value input[type="checkbox"] { accent-color: var(--forest); }
.skt-redesign-v4 .w-filter-item-value.disabled { opacity: .45 !important; }

/* слайдер цены — трек --bg-sunk, заполнение+ручка forest */
.skt-redesign-v4 .w-filter-item .ui-slider {
  background: var(--bg-sunk) !important; border: 0 !important; height: 4px !important; border-radius: 100px !important;
}
.skt-redesign-v4 .w-filter-item .ui-slider .ui-slider-range { background: var(--forest) !important; }
.skt-redesign-v4 .w-filter-item .ui-slider .ui-slider-handle {
  background: var(--surface) !important; border: 2px solid var(--forest) !important;
  border-radius: 100px !important; width: 16px !important; height: 16px !important;
  box-shadow: var(--shadow-sm) !important; top: -7px !important;
}

/* кнопка «Применить» фильтр — v4 зелёная */
.skt-redesign-v4 .w-filter-button-submit {
  background: var(--forest) !important; color: #fff !important; border: 0 !important;
  border-radius: 10px !important; font-weight: 700 !important; box-shadow: none !important;
}
.skt-redesign-v4 .w-filter-button-submit:hover { background: var(--forest-ink) !important; }