/* ==========================================================================
   Каталог: /promo (pr-), /c/{slug} (ct-), /search (se-), /shops (sl-); общее — cg-.
   Макеты: холст 1, project/catalog/{promo,category,search,shops}.
   Точки: ≥1200 — ПК (контент 1200), 768–1199 — промежуточная, <768 — телефон.
   ========================================================================== */

/* --- Общее ---------------------------------------------------------------- */
.cg-main { padding-block: 32px 64px; }
.cg-page { display: flex; flex-direction: column; gap: 40px; }
.cg-top { display: flex; flex-direction: column; gap: 22px; }
.cg-head { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; min-width: 0; }
.cg-head .h1 { margin: 0; }

/* надпись-пилюля над H1 */
.cg-pill {
  display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 12px 0 10px;
  border-radius: var(--r-pill); background: var(--surface-2); color: var(--text-2);
  font-size: 13px; font-weight: 600; line-height: 1;
}
.cg-pill .ic { color: var(--text-3); }

/* строка «N предложений · показаны 1–24 · Все …» */
.cg-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; font-size: 15px; line-height: 1.4; color: var(--text-3); }
.cg-meta b { font-weight: 700; color: var(--text); }
.cg-meta-i { display: inline-flex; align-items: center; gap: 8px; }
.cg-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--placeholder); flex-shrink: 0; }
.cg-order { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.45; color: var(--text-3); }
.cg-order .ic { flex-shrink: 0; margin-top: 2px; }
.cg-note { display: flex; align-items: flex-start; gap: 8px; width: 100%; font-size: 14px; line-height: 1.45; color: var(--text-3); }
.cg-note .ic { flex-shrink: 0; margin-top: 2px; }

/* зелёная текстовая ссылка со стрелкой */
.cg-tl { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--brand-text); }
.cg-tl:hover { color: var(--link-hover); }
.cg-tl:hover > span, .cg-tl:hover { text-decoration: underline; text-underline-offset: 3px; }
.cg-tl-ar, .cg-ar, .cg-ar-l { transition: transform var(--dur-hover) var(--ease-std); }
.cg-tl:hover .cg-tl-ar, a:hover > .cg-ar { transform: translateX(3px); }
a:hover > .cg-ar-l { transform: translateX(-3px); }
.cg-green { color: var(--brand-text); }

/* вторичная кнопка страниц каталога: рамка темнеет на наведении */
.cg-sec:hover { background: var(--surface-2); border-color: var(--field-border); }

/* поле поиска в тулбаре (.search-field из base): лупа «сканирует» на наведении/фокусе */
.cg-field { min-width: 0; }
.cg-field:hover { border-color: var(--field-border); }
.cg-field .btn--dark .cg-go-i { display: none; }
.cg-field:focus-within .btn--dark { background: var(--brand); border-color: var(--brand); }
.cg-field:hover .cg-lens, .cg-field:focus-within .cg-lens { animation: cg-lens 2s var(--ease-std) infinite both; }
@keyframes cg-lens { 0%, 100% { transform: translate(-1.5px, 1px); } 50% { transform: translate(1.5px, -1px); } }

/* колокольчик «на почту»: качается раз при появлении, потом — на наведении */
.cg-bell { transform-origin: 12px 3px; transform-box: view-box; }
.cg-ring:hover .cg-bell, .cg-ring:focus-visible .cg-bell, .cg-ring:active .cg-bell { animation: vg-bell .7s var(--ease-std) both; }
.cg-ring:hover .cg-clap, .cg-ring:active .cg-clap { animation: cg-clap .7s var(--ease-std) both; }
.ct-bell-once .cg-bell { animation: vg-bell .7s var(--ease-std) 1.1s both; }
@keyframes cg-clap { 0% { transform: translateX(0); } 19% { transform: translateX(-2px); } 38% { transform: translateX(2px); } 57% { transform: translateX(-1.4px); } 76% { transform: translateX(.8px); } 100% { transform: translateX(0); } }

/* --- Полоса цифр (promo-stats A / shops-stats A) -------------------------- */
.cg-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; }
.cg-stat {
  display: flex; flex-direction: column; gap: 6px; min-width: 0;
  padding: 16px 18px 18px 20px; border-radius: var(--r-14); background: var(--surface-2);
}
.cg-stat dt { order: 2; margin: 0; font-size: 15px; line-height: 1.35; color: var(--text-3); }
.cg-stat dd {
  order: 1; margin: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  font-family: var(--font-display); font-weight: 600; font-size: 30px; letter-spacing: -0.02em; color: var(--text);
}
.cg-stat-v { display: inline-flex; align-items: baseline; gap: 8px; min-width: 0; white-space: nowrap; }
.cg-stat-of { font-family: var(--font); font-weight: 500; font-size: 15px; letter-spacing: 0; color: var(--text-3); }
.cg-stat-ic { width: 36px; height: 36px; border-radius: var(--r-10); background: var(--surface); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-left: auto; color: var(--text); }
.cg-stat--good { background: var(--brand-bg); }
.cg-stat--good dt { color: var(--brand-on-bg); }
.cg-stat--good dd, .cg-stat--good .cg-stat-ic, .cg-stat--scored .cg-stat-ic { color: var(--brand-text); }
.cg-stat--warm .cg-stat-ic { color: var(--warm-text); }
.cg-stat--dashed { background: var(--surface); border: 2px dashed var(--placeholder); padding: 14px 16px 16px 18px; }
.cg-stat--dashed dd { color: var(--text-2); flex-wrap: wrap; }
.cg-stat--dashed .cg-stat-ic { background: var(--surface-2); color: var(--text-2); }

/* цифры набегают: колонка 0…d уезжает вверх до своей цифры (CSS, без скрипта) */
.cg-num { position: relative; display: inline-flex; align-items: flex-start; line-height: 1.15; font-variant-numeric: tabular-nums; }
.cg-roll { display: inline-flex; align-items: flex-start; }
.cg-col { display: inline-block; height: 1.15em; overflow: hidden; }
.cg-gap { display: inline-block; width: .26em; }
.cg-strip { display: flex; flex-direction: column; transform: translateY(calc(var(--d) * -1.15em)); animation: cg-roll .9s var(--ease-out) both; }
.cg-strip > span { display: block; height: 1.15em; }
@keyframes cg-roll { from { transform: translateY(0); } }
.cg-c1 { animation-duration: .6s; } .cg-c2 { animation-duration: .7s; } .cg-c3 { animation-duration: .8s; } .cg-c4 { animation-duration: .9s; }
.cg-f1 { animation-delay: .59s; } .cg-f2 { animation-delay: .66s; } .cg-f3 { animation-delay: .73s; } .cg-f4 { animation-delay: .8s; }

/* ==========================================================================
   Промокоды и акции (pr-)
   ========================================================================== */
.pr-upd { display: flex; align-items: center; gap: 10px; font-size: 16px; line-height: 1.5; color: var(--text-2); }
.pr-upd time { color: var(--text); font-weight: 600; }
.pr-upd-at { color: var(--text-3); }
.pr-live { position: relative; width: 10px; height: 10px; flex-shrink: 0; border-radius: 50%; background: var(--trust-good); }
.pr-ping { position: absolute; inset: 0; border-radius: 50%; background: var(--trust-good); animation: pr-ping 2.4s var(--ease-std) infinite both; }
@keyframes pr-ping { 0% { transform: scale(1); opacity: .5; } 70%, 100% { transform: scale(2.6); opacity: 0; } }

.pr-shops { display: flex; flex-direction: column; gap: 20px; }
.pr-shops-head { display: flex; flex-direction: column; gap: 6px; }
.pr-shops-head .h2 { margin: 0; }
.pr-shops-sub { font-size: 15px; line-height: 1.5; color: var(--text-3); }
.pr-tiles { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.pr-tiles > li { display: flex; min-width: 0; }
.pr-tile {
  position: relative; width: 100%; height: 116px; padding: 16px; min-width: 0;
  display: flex; flex-direction: column; justify-content: space-between;
  border: 1px solid var(--line); border-radius: var(--r-14); background: var(--surface); color: var(--text);
  transition: background-color var(--dur-hover) var(--ease-std), border-color var(--dur-hover) var(--ease-std), transform var(--dur-hover) var(--ease-std);
}
.pr-tile:hover { background: var(--surface-quiet); color: var(--text); }
.pr-tile:active { transform: scale(.97); }
.pr-tile .shop-mono, .pr-tile .shop-logo { border-radius: var(--r-10); }
.pr-tile-t { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pr-tile-n { font-size: 15px; font-weight: 600; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pr-tile-m { font-size: 13px; line-height: 1.4; color: var(--text-3); white-space: nowrap; }
/* выбранная плитка «нажимается», тёмный значок выпрыгивает, галочка рисуется */
.pr-tile.is-on { border: 2px solid var(--text); padding: 15px; animation: pr-press .5s var(--ease-std) .35s both; }
.pr-tile-ok {
  position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--text); color: var(--bg); display: flex; align-items: center; justify-content: center;
  animation: pr-pop .32s var(--ease-out) .6s both;
}
.pr-tile-ok path { stroke-dasharray: 24; animation: pr-draw .3s var(--ease-std) .78s both; }
@keyframes pr-press { 0%, 40% { transform: scale(1); } 65% { transform: scale(.97); } 100% { transform: scale(1); } }
@keyframes pr-pop { 0% { transform: scale(0); } 60% { transform: scale(1.18); } 100% { transform: scale(1); } }
@keyframes pr-draw { from { stroke-dashoffset: 24; } to { stroke-dashoffset: 0; } }
.pr-nudge { display: none; }

.pr-offers { display: flex; flex-direction: column; gap: 24px; scroll-margin-top: 128px; }
/* тулбар: слева заголовок и строки, справа поиск; на телефоне — стопкой, порядок — под полем */
.pr-bar {
  display: grid; grid-template-columns: minmax(0, 1fr) 460px; column-gap: 48px; row-gap: 10px;
  grid-template-areas: "head form" "order form"; align-items: end;
  padding-bottom: 24px; border-bottom: 1px solid var(--line);
}
.pr-bar-head { grid-area: head; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pr-bar > .pr-search { grid-area: form; }
.pr-bar > .cg-order { grid-area: order; }
.pr-title { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; min-width: 0; }
.pr-title .h2 { margin: 0; min-width: 0; }
.pr-search { display: flex; flex-direction: column; gap: 8px; margin: 0; min-width: 0; }
.pr-label { font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--text-2); }
.pr-chip {
  height: 40px; padding: 0 10px 0 14px; border-radius: var(--r-12);
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; white-space: nowrap;
  background: var(--brand-bg); border: 1px solid var(--brand); color: var(--brand-on-bg); font-size: 15px; font-weight: 600;
  transform-origin: 0 50%; animation: pr-chip .42s var(--ease-out) .98s both;
  transition: background-color var(--dur-hover) var(--ease-std), border-color var(--dur-hover) var(--ease-std);
}
.pr-chip:hover { background: var(--surface); border-color: var(--brand-hover); color: var(--brand-on-bg); }
.pr-chip-x { transition: transform .18s var(--ease-std); }
.pr-chip:hover .pr-chip-x, .pr-chip:focus-visible .pr-chip-x { transform: rotate(90deg); }
@keyframes pr-chip { 0% { opacity: 0; transform: scale(.6); } 60% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } }

/* ==========================================================================
   Раздел (ct-)
   ========================================================================== */
.ct-head { gap: 18px; }
.ct-badge { display: flex; align-items: center; gap: 14px; }
.ct-tile {
  width: 60px; height: 60px; border-radius: var(--r-16); background: var(--brand-bg); color: var(--brand-text);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  animation: ct-pop .55s var(--ease-out) .28s both;
}
.ct-nod { transform-origin: 50% 75%; animation: ct-nod 2.4s var(--ease-std) 1.7s 2 both; }
@keyframes ct-pop { 0% { opacity: 0; transform: scale(.7); } 60% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } }
@keyframes ct-nod { 0%, 40%, 100% { transform: rotate(0); } 10% { transform: rotate(-10deg); } 22% { transform: rotate(7deg); } 32% { transform: rotate(-2deg); } }
.ct-h1 { max-width: 960px; }
.ct-intro-w { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; max-width: 760px; }
.ct-intro { font-size: 18px; line-height: 1.5; color: var(--text-2); text-wrap: pretty; }
.ct-more {
  height: 44px; padding: 0 2px; border: 0; background: transparent; color: var(--brand-text);
  font-size: 15px; font-weight: 600; display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
}
.ct-more:hover { color: var(--link-hover); }
.ct-chev { transition: transform var(--dur-hover) var(--ease-std); }
.ct-more:hover .ct-chev { transform: translateY(2px); }
.ct-more[aria-expanded="true"] .ct-chev { transform: rotate(180deg); }

.ct-list { display: flex; flex-direction: column; gap: 28px; }
.ct-bar {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; column-gap: 16px; row-gap: 14px;
  grid-template-areas: "sort . count sub" "order order order sub";
  align-items: center; padding-bottom: 18px; border-bottom: 1px solid var(--line);
}
.ct-sort { grid-area: sort; display: flex; gap: 4px; padding: 4px; border-radius: var(--r-12); background: var(--surface-3); }
.ct-seg {
  position: relative; height: 40px; padding: 0 16px; border-radius: 9px;
  display: flex; align-items: center; justify-content: center; gap: 8px; white-space: nowrap;
  color: var(--text-2); font-size: 15px; font-weight: 500;
  transition: background-color var(--dur-hover) var(--ease-std), color var(--dur-hover) var(--ease-std);
}
.ct-seg .ic { color: var(--text-3); }
.ct-seg:hover { background: color-mix(in srgb, var(--surface) 70%, transparent); color: var(--text); }
.ct-seg.is-on { background: var(--surface); color: var(--text); font-weight: 600; box-shadow: 0 1px 3px rgba(22,24,29,.16); animation: ct-ind .3s var(--ease-std) .62s both; }
.ct-seg.is-on .ic { color: var(--brand-text); }
@keyframes ct-ind { from { background-color: transparent; box-shadow: none; } }
.ct-count { grid-area: count; display: flex; align-items: center; gap: 8px; font-size: 15px; line-height: 1.4; color: var(--text-3); white-space: nowrap; }
.ct-count b { font-weight: 700; color: var(--text); }
.ct-sub {
  grid-area: sub; position: relative; align-self: start;
  height: 48px; padding: 0 16px 0 14px; border-radius: var(--r-12); border: 1px solid var(--line); background: var(--surface);
  display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 15px; font-weight: 600; white-space: nowrap;
  transition: background-color var(--dur-hover) var(--ease-std), border-color var(--dur-hover) var(--ease-std);
}
.ct-sub:hover { background: var(--surface-2); border-color: var(--field-border); color: var(--text); }
.ct-sub-ic { display: flex; color: var(--brand-text); }
.ct-sub-tx { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ct-narrow, .ct-go { display: none; }
/* подпись под кнопкой — во второй строке панели справа (она внутри ссылки: одна подпись на все ширины) */
.ct-sub-d {
  position: absolute; right: 0; top: calc(100% + 14px);
  font-size: 13px; line-height: 1.45; font-weight: 400; color: var(--text-3); white-space: nowrap; pointer-events: none;
}
.ct-order { grid-area: order; display: flex; align-items: flex-start; gap: 8px; font-size: 14px; line-height: 1.45; color: var(--text-2); min-width: 0; }
.ct-order .ic { flex-shrink: 0; color: var(--text-3); }
.ct-order b { font-weight: 700; color: var(--text); }

.ct-pgn { width: min(560px, 100%); margin-inline: auto; gap: 16px; padding-top: 12px; }
.ct-pgn > :first-child { justify-self: start; }
.ct-pgn > :last-child { justify-self: end; }
.ct-pgn-end { font-size: 14px; line-height: 1.4; color: var(--text-3); text-align: right; }
.ct-pgn-slot { width: 1px; }

/* ==========================================================================
   Поиск (se-)
   ========================================================================== */
.se-main { padding-block: 40px 72px; }
.se-page { gap: 56px; }
.se-top { display: flex; flex-direction: column; gap: 28px; }
.se-head { gap: 16px; }
.se-h1 {
  max-width: 1000px; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
  animation: se-show .56s var(--ease-out) .21s both;
}
@keyframes se-show { from { opacity: 0; transform: translateY(10px); filter: blur(6px); } to { opacity: 1; transform: none; filter: blur(0); } }
.se-form { width: min(820px, 100%); display: flex; flex-direction: column; gap: 8px; margin: 0; }
.se-label { font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--text-2); }
.se-field { gap: 10px; }
.se-field .se-lens-ic { color: var(--text-3); flex-shrink: 0; overflow: visible; }
.se-field input { color: var(--text); padding: 0; }
.se-field input::placeholder { color: var(--placeholder); }
.se-field input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.se-scan { stroke: var(--brand-text); opacity: 0; }
.se-form[aria-busy="true"] .se-lens { animation: cg-lens 2s var(--ease-std) infinite both; }
.se-form[aria-busy="true"] .se-scan { opacity: 1; animation: se-scan 2s var(--ease-std) infinite both; }
@keyframes se-scan { 0%, 50%, 100% { transform: translateY(-3px); } 25%, 75% { transform: translateY(3px); } }
.se-clear { width: 44px; height: 44px; border: 0; border-radius: var(--r-10); background: transparent; display: flex; align-items: center; justify-content: center; padding: 0; flex-shrink: 0; cursor: pointer; }
.se-clear-c { width: 24px; height: 24px; border-radius: 50%; background: var(--line); color: var(--text); display: flex; align-items: center; justify-content: center; transition: background-color var(--dur-hover) var(--ease-std); }
.se-clear:hover .se-clear-c { background: var(--field-border); }
.se-clear-x { transition: transform .18s var(--ease-std); }
.se-clear:hover .se-clear-x, .se-clear:focus-visible .se-clear-x { transform: rotate(90deg); }
html:not(.js) .se-clear, .se-field input:placeholder-shown ~ .se-clear { display: none; }
.se-go { --btn-h: 48px; padding: 0 20px 0 24px; border-radius: 11px; font-size: 17px; font-weight: 700; }
.se-arrow { transition: transform var(--dur-hover) var(--ease-std); }
.se-go:hover .se-arrow { transform: translateX(3px); }
.se-hint { display: flex; align-items: flex-start; gap: 8px; padding-top: 12px; font-size: 14px; line-height: 1.5; color: var(--text-3); }
.se-hint .ic { flex-shrink: 0; margin-top: 3px; }
.se-hint.is-warn .ic { color: var(--warn-text-2); }
.se-hint.is-warn b { color: var(--warn-text-2); font-weight: 700; margin-right: 4px; }

.se-quick { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.se-quick-h { font-family: var(--font); font-size: 15px; font-weight: 400; line-height: 1.5; letter-spacing: 0; color: var(--text-3); }
.se-quick-row { display: flex; flex-wrap: wrap; gap: 12px; }
.se-quick-a { font-size: 15px; font-weight: 600; padding: 0 16px 0 14px; }

.se-results { display: flex; flex-direction: column; gap: 56px; }
.se-sec { display: flex; flex-direction: column; gap: 20px; }
.se-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.se-sec-t { display: flex; align-items: center; gap: 14px; flex-shrink: 0; }
.se-sec-t .h2 { margin: 0; }
.se-sec-ic { width: 44px; height: 44px; border-radius: var(--r-12); background: var(--surface-2); color: var(--text); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.se-n { color: var(--text-3); }
.se-sec-p { display: flex; align-items: center; gap: 8px; font-size: 15px; line-height: 1.5; color: var(--text-3); text-align: right; }
.se-sec-p .ic { flex-shrink: 0; }

/* совпадение: маркер проводится слева направо после появления строки */
.se-mk {
  color: inherit; background-color: transparent; border-radius: 3px;
  background-image: linear-gradient(var(--warm-dots), var(--warm-dots)); background-repeat: no-repeat;
  background-position: 0 88%; background-size: 100% 60%;
  animation: se-mk .28s var(--ease-std) both; animation-delay: calc(.6s + var(--i, 0) * 60ms);
}
@keyframes se-mk { from { background-size: 0% 60%; } to { background-size: 100% 60%; } }
.se-li { animation: vg-rise var(--dur-enter) var(--ease-out) both; animation-delay: calc(.48s + var(--i, 0) * 60ms); }
.se-li .se-mk { animation-delay: calc(.54s + var(--i, 0) * 60ms); }

/* строки магазинов и товаров */
.se-shops, .se-prods { display: grid; border: 1px solid var(--line); border-radius: var(--r-20); background: var(--surface); overflow: hidden; }
.se-shops { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.se-shops > li { border-bottom: 1px solid var(--line-soft); }
.se-shops > li:nth-child(odd) { border-right: 1px solid var(--line-soft); }
.se-shops.is-one { grid-template-columns: minmax(0, 1fr); }
.se-shops.is-one > li { border-right: 0; }
.se-shops > li:nth-last-child(-n+2):nth-child(odd), .se-shops > li:last-child { border-bottom: 0; }
.se-shops.is-odd > li:last-child { border-right: 0; }
.se-row {
  display: flex; align-items: center; gap: 16px; min-height: 88px; padding: 16px 24px 16px 22px; height: 100%;
  color: var(--text); transition: background-color var(--dur-hover) var(--ease-std);
}
.se-row:hover { background: var(--surface-quiet); color: var(--text); }
.se-row:active { background: var(--surface-3); }
.se-row-t { display: flex; flex-direction: column; gap: 3px; flex-grow: 1; min-width: 0; }
.se-row-n { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.se-row-m { font-size: 14px; line-height: 1.4; color: var(--text-3); overflow-wrap: anywhere; }
.se-dom { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--text-3); min-width: 0; }
.se-dom .ic { flex-shrink: 0; }
.se-chev { flex-shrink: 0; margin-left: auto; color: var(--placeholder); transition: transform var(--dur-hover) var(--ease-std); }
.se-row:hover .se-chev { transform: translateX(3px); }
.se-more { display: none; }

.se-prods { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.se-prods--1 { grid-template-columns: minmax(0, 1fr); }
.se-prods--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.se-prods > li { display: flex; border-bottom: 1px solid var(--line-soft); border-right: 1px solid var(--line-soft); }
.se-prods--3 > li:nth-child(3n), .se-prods--2 > li:nth-child(2n), .se-prods--1 > li { border-right: 0; }
.se-prod { flex-grow: 1; min-height: 92px; padding: 18px 22px 18px 20px; }
.se-thumb { width: 52px; height: 52px; border-radius: var(--r-12); flex-shrink: 0; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--photo-tile); border: 1px solid var(--line-soft); }
.se-thumb img { width: 100%; height: 100%; object-fit: contain; }
.se-thumb.is-empty { background: var(--surface-quiet); border: 1px dashed var(--field-border); color: var(--placeholder); }
.se-prod-n { font-size: 16px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }

/* предложения: на ПК — таблица (search-offers B), уже — карточки */
.se-cols { display: none; }
.se-offers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.se-offers > li { display: flex; min-width: 0; }
.se-offer { flex: 1 1 auto; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "shop size" "body body" "act act"; gap: 14px 12px; align-content: start; }
.se-o-shop { grid-area: shop; }
.se-o-size { grid-area: size; align-self: center; }
.se-o-body { grid-area: body; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.se-o-act { grid-area: act; }
.se-o-body .oc-title { font-size: 18px; }
.se-offer .oc-shop-t .se-dom { font-size: 13px; }

.se-plate { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 12px 12px 20px; border-radius: var(--r-14); background: var(--surface-2); }
.se-plate p { display: flex; align-items: center; gap: 10px; font-size: 15px; line-height: 1.5; color: var(--text-2); }
.se-plate p .ic { flex-shrink: 0; color: var(--text-3); }
.se-plate b { color: var(--text); font-weight: 700; }
.se-plate .btn { --btn-h: 44px; flex-shrink: 0; }

/* подсказка про оповещение (search-alert-hint B) */
.se-alert { display: flex; align-items: center; gap: 24px; padding: 24px 28px; border-radius: var(--r-18); background: var(--surface-2); }
.se-alert-ic { width: 56px; height: 56px; border-radius: var(--r-14); background: var(--surface); color: var(--text); display: flex; align-items: center; justify-content: center; flex-shrink: 0; align-self: flex-start; }
.se-alert-ic .ic { transform-origin: 12px 4px; animation: vg-bell .7s var(--ease-std) 1.2s both; }
.se-alert-body { display: flex; flex-direction: column; gap: 8px; flex-grow: 1; min-width: 0; }
.se-alert-h { font-family: var(--font); font-size: 20px; font-weight: 700; line-height: 1.3; letter-spacing: 0; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.se-alert-p { font-size: 16px; line-height: 1.5; color: var(--text-2); max-width: 720px; }
.se-alert-list { display: flex; flex-wrap: wrap; gap: 8px 22px; padding-top: 4px; }
.se-alert-list li { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 1.4; color: var(--text-2); }
.se-alert-list .ic { flex-shrink: 0; color: var(--text-3); }
.se-alert-act { display: flex; flex-direction: column; align-items: center; gap: 8px; flex-shrink: 0; }
.se-alert-note { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; line-height: 1.4; color: var(--text-3); white-space: nowrap; }

/* ничего не нашлось / короткий запрос (search-empty B): тёплая панель с иллюстрацией */
.se-nf { display: flex; gap: 40px; align-items: stretch; padding: 48px 56px; border-radius: var(--r-32); overflow: hidden; }
.se-nf-main { width: 560px; flex-shrink: 0; display: flex; flex-direction: column; gap: 18px; }
.se-nf-main .h2 { margin: 0; }
.se-nf-pill {
  display: flex; align-items: center; gap: 8px; align-self: flex-start; max-width: 100%; min-height: 34px; padding: 6px 14px 6px 12px;
  border-radius: var(--r-32); background: var(--surface); color: var(--warm-on-bg); font-size: 14px; font-weight: 600; line-height: 1.35;
}
.se-nf-pill .ic { flex-shrink: 0; color: var(--warm-text); }
.se-nf-pill span { min-width: 0; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.se-nf-p { font-size: 17px; line-height: 1.5; color: var(--text-2); }
.se-nf-act { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.se-nf-btn { --btn-h: 56px; padding: 0 26px; font-size: 17px; font-weight: 700; gap: 10px; }
.se-nf-notes { display: flex; flex-direction: column; gap: 6px; }
.se-nf-notes > span { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.45; color: var(--text-3); }
.se-nf-notes .ic { flex-shrink: 0; color: var(--warm-on-bg); }
.se-nf-more { font-size: 15px; line-height: 1.5; color: var(--text-2); }
.se-nf-more .cg-tl { display: inline; }
.se-up { font-size: 16px; min-height: 44px; }
.se-up-ic { transition: transform var(--dur-hover) var(--ease-std); }
.se-up:hover .se-up-ic { transform: translateY(-3px); }
.se-nf-art { flex-grow: 1; position: relative; min-height: 420px; }
.se-nf-art--cat { min-height: 260px; display: flex; align-items: flex-end; justify-content: flex-end; }
.se-card { position: absolute; top: 0; left: 0; width: 300px; }
.se-card-in {
  transform: rotate(-2deg); padding: 18px 20px; border-radius: var(--r-20); background: var(--surface); box-shadow: var(--sh-float);
  display: flex; flex-direction: column; gap: 12px; transition: transform .24s var(--ease-std);
}
.se-card:hover .se-card-in { transform: rotate(-6deg); }
.se-card-h { display: flex; align-items: center; gap: 8px; font-size: 16px; font-weight: 700; color: var(--text); }
.se-card-h .ic { color: var(--brand-text); }
.se-card-q { display: flex; flex-direction: column; gap: 4px; padding-bottom: 10px; border-bottom: 1px solid var(--line-soft); }
.se-card-l { font-size: 13px; font-weight: 600; color: var(--text-3); }
.se-card-v { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.se-card-qt { font-size: 17px; font-weight: 700; line-height: 1.3; min-width: 0; overflow-wrap: anywhere; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; color: var(--text); }
.se-card-tag { height: 26px; padding: 0 8px; border-radius: var(--r-8); background: var(--brand-bg); color: var(--brand-on-bg); font-size: 13px; font-weight: 600; display: flex; align-items: center; flex-shrink: 0; white-space: nowrap; }
.se-card-r { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.4; color: var(--text); }
.se-card-r .ic { flex-shrink: 0; color: var(--text-3); }
.se-card-c { font-size: 13px; line-height: 1.4; color: var(--text-3); }
.se-card-cap { margin-top: 14px; padding-left: 6px; display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--warm-dark); }
.se-card-cap .ic { color: var(--warm-on-bg); }
.se-nf-art > .cat { position: absolute; right: 0; bottom: -48px; }
.se-nf-art--cat > .cat { position: static; }
.se-cat { animation: empty-in .5s var(--ease-out) .5s both; transform-origin: 50% 100%; }

/* ==========================================================================
   Магазины (sl-)
   ========================================================================== */
.sl-page { gap: 56px; }
.sl-page > .cg-top { gap: 22px; }
.sl-hero { display: grid; grid-template-columns: minmax(0, 1fr) 560px; gap: 64px; align-items: start; }
.sl-head { gap: 16px; padding-top: 8px; }
.sl-expl { display: flex; flex-direction: column; gap: 12px; padding-top: 4px; }
.sl-expl p { display: flex; align-items: flex-start; gap: 12px; font-size: 16px; line-height: 1.5; color: var(--text-2); }
.sl-expl b { color: var(--text); font-weight: 600; }
.sl-expl-ic { width: 34px; height: 24px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--text-3); }
.sl-q {
  min-width: 34px; height: 26px; padding: 0 7px; border-radius: var(--r-8); background: var(--surface);
  border: 1.5px dashed var(--placeholder); color: var(--text-2); font-size: 14px; font-weight: 700; line-height: 1;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-variant-numeric: tabular-nums;
}
.sl-how { min-height: 44px; font-size: 15px; }
.sl-rules { border: 1px solid var(--line); border-radius: var(--r-20); background: var(--surface); padding: 22px 28px 8px; display: flex; flex-direction: column; gap: 2px; }
.sl-rules-h { font-family: var(--font); font-size: 14px; line-height: 1.4; font-weight: 700; letter-spacing: 0; color: var(--text-3); }
.sl-rules-h--sep { margin-top: 2px; padding-top: 18px; border-top: 1px solid var(--line-total); }
.sl-rules-list li { display: flex; align-items: center; gap: 16px; padding: 14px 0; font-size: 17px; line-height: 1.4; font-weight: 600; color: var(--text); }
.sl-rules-list li + li { border-top: 1px solid var(--line-soft); }
.sl-rule-ic { width: 44px; height: 44px; border-radius: var(--r-12); background: var(--brand-bg); color: var(--brand-text); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sl-rule-ic--muted { background: var(--surface-2); color: var(--text-2); }
.sl-pop { animation: sl-pop .42s var(--ease-out) both; }
@keyframes sl-pop { 0% { opacity: 0; transform: scale(.6); } 70% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } }
.sl-rule-ic path { stroke-dasharray: 1 0; }

.sl-numbers { display: flex; flex-direction: column; gap: 14px; }
.sl-calc {
  display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px 0 9px; border-radius: var(--r-pill);
  background: var(--warm-bg); color: var(--warm-on-bg); font-family: var(--font); font-size: 13px; font-weight: 600; letter-spacing: 0; line-height: 1;
  white-space: nowrap; align-self: center;
}
.sl-calc .ic { color: var(--warm-text); }
.cg-stat--dashed dd { align-items: center; }
.sl-note { display: flex; align-items: center; gap: 14px; padding: 6px 12px 6px 16px; border-radius: var(--r-14); background: var(--surface-quiet); border: 1px solid var(--line-soft); }
.sl-note p { flex-grow: 1; min-width: 0; font-size: 15px; line-height: 1.45; color: var(--text-2); padding-block: 6px; }
.sl-note-b { color: var(--text); font-weight: 700; }
.sl-note .cg-tl { min-height: 44px; font-size: 15px; white-space: nowrap; flex-shrink: 0; }

.sl-list { display: flex; flex-direction: column; gap: 24px; }
.sl-bar { display: flex; align-items: flex-end; justify-content: space-between; gap: 48px; }
.sl-bar-head { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.sl-bar-head .h2 { margin: 0; }
.sl-order { font-size: 15px; line-height: 1.4; }
.sl-order .ic { margin-top: 2px; }
.sl-narrow { display: none; }
.sl-search { width: 460px; flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; margin: 0; }
.sl-field .sl-go { display: none; }
html:not(.js) .sl-field .sl-go { display: inline-flex; }
.sl-clear { width: 36px; height: 36px; border: 0; border-radius: var(--r-8); background: transparent; color: var(--text-2); display: flex; align-items: center; justify-content: center; padding: 0; flex-shrink: 0; cursor: pointer; }
.sl-clear:hover { background: var(--surface-2); }
.sl-clear[hidden] { display: none; }
.sl-x { transition: transform .18s var(--ease-std); }
.sl-clear:hover .sl-x, .sl-clear:focus-visible .sl-x { transform: rotate(90deg); }

.sl-table { border: 1px solid var(--line); border-radius: var(--r-20); overflow: hidden; background: var(--surface); }
.sl-table[hidden] { display: none; }
.sl-cols, .sl-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) 140px 140px 200px 20px; gap: 24px; align-items: center; }
.sl-cols { padding: 12px 24px; background: var(--surface-quiet); border-bottom: 1px solid var(--line-soft); font-size: 13px; font-weight: 600; color: var(--text-3); }
.sl-cols-name { grid-column: 1 / 3; }
.sl-cols-idx { padding-left: 16px; }
.sl-num { text-align: right; }
.sl-li[hidden] { display: none; }
.sl-rise { animation: vg-rise var(--dur-enter) var(--ease-out) both; animation-delay: calc(.84s + var(--i, 0) * 40ms); }
.sl-row {
  min-height: 76px; padding: 14px 24px; border-bottom: 1px solid var(--line-soft); color: var(--text); background: var(--surface);
  transition: background-color var(--dur-hover) var(--ease-std);
}
.sl-rows > li:last-child .sl-row { border-bottom: 0; }
.sl-row:hover { background: var(--surface-quiet); color: var(--text); }
.sl-row:active { background: var(--surface-3); }
.sl-row:focus-visible { outline-offset: -3px; }
.sl-name { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.sl-name-n { font-size: 17px; font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.sl-name-d { font-size: 14px; line-height: 1.4; color: var(--text-3); overflow-wrap: anywhere; }
.sl-name-m { display: none; }
.sl-num-v { font-size: 17px; font-weight: 600; font-variant-numeric: tabular-nums; }
.sl-num-v.is-none { font-size: 15px; font-weight: 500; color: var(--text-3); }
.sl-idx { display: flex; align-items: center; padding-left: 16px; min-width: 0; }
.sl-idx .trust-idx-t b { font-size: 15px; font-weight: 600; white-space: nowrap; }
.sl-chev { color: var(--placeholder); transition: transform var(--dur-hover) var(--ease-std); }
.sl-row:hover .sl-chev { transform: translateX(3px); }

.sl-nf { display: flex; align-items: center; gap: 20px; padding: 24px; border: 1px solid var(--line); border-radius: var(--r-20); background: var(--surface); animation: vg-rise var(--dur-enter) var(--ease-out) both; }
.sl-nf[hidden] { display: none; }
.sl-nf-ic { width: 56px; height: 56px; border-radius: var(--r-14); background: var(--surface-2); color: var(--text-2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.sl-nf-t { display: flex; flex-direction: column; gap: 4px; flex-grow: 1; min-width: 0; }
.sl-nf-h { font-family: var(--font); font-size: 18px; font-weight: 700; line-height: 1.35; letter-spacing: 0; overflow-wrap: anywhere; }
.sl-nf-t p { font-size: 15px; line-height: 1.45; color: var(--text-2); }
.sl-reset { flex-shrink: 0; }

.sl-scale { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; align-items: center; padding: 16px 24px; border-radius: var(--r-16); background: var(--surface-2); }
.sl-scale-h { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; }
.sl-scale-h h3 { font-family: var(--font); font-size: 15px; font-weight: 700; line-height: 1.4; letter-spacing: 0; }
.sl-scale-h .cg-tl { min-height: 32px; font-size: 14px; }
.sl-scale-list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.sl-scale-list li { display: flex; min-width: 0; }
.sl-scale-list .trust-idx-t { gap: 1px; }
.sl-scale-list .trust-idx-t b { font-size: 14px; font-weight: 700; }
.sl-scale-list .trust-idx-t span { white-space: nowrap; }

/* ==========================================================================
   Промежуточная ширина: 768–1199
   ========================================================================== */
@media (max-width: 1199px) {
  .cg-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-tiles { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
  .pr-bar { grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); column-gap: 32px; }
  .ct-bar { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "sort sort sort" "count . sub" "order order order"; padding-bottom: 18px; }
  .ct-sub { align-self: center; }
  .ct-sort { justify-self: start; }
  .ct-sub-d { display: none; }
  .ct-sub { height: auto; min-height: 48px; }
  .se-sec-head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .se-sec-p { text-align: left; }
  .sl-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
  .sl-cols, .sl-row { grid-template-columns: 44px minmax(0, 1fr) 100px 110px 170px 20px; gap: 16px; }
  .sl-scale { grid-template-columns: minmax(0, 1fr); }
  .sl-scale-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .se-nf { padding: 40px; }
  .se-nf-main { width: auto; flex: 1 1 0; }
  .se-nf-art { flex: 0 0 300px; }
  .se-nf-art > .cat { width: 200px; height: auto; }
}

/* ПК: предложения поиска — строкой таблицы (240 · 1fr · 112 · 320) */
@media (min-width: 1200px) {
  .se-cols { display: grid; grid-template-columns: 240px minmax(0, 1fr) 112px 320px; gap: 24px; padding: 0 24px; font-size: 13px; line-height: 1.4; font-weight: 500; color: var(--text-3); margin-bottom: -10px; }
  .se-cols > :nth-child(n+3) { text-align: right; }
  .se-offers { display: block; border: 1px solid var(--line); border-radius: var(--r-20); background: var(--surface); overflow: hidden; }
  .se-offers > li + li { border-top: 1px solid var(--line-soft); }
  .se-offer {
    grid-template-columns: 240px minmax(0, 1fr) 112px 320px; grid-template-areas: "shop body size act";
    gap: 24px; align-items: center; padding: 18px 24px; border: 0; border-radius: 0; box-shadow: none;
  }
  .se-offer:hover { border: 0; box-shadow: none; background: var(--surface-quiet); }
  .se-offer.oc--urgent { padding: 18px 24px; border: 0; box-shadow: inset 4px 0 0 var(--warn); }
  .se-o-size { justify-self: end; }
  .se-o-act { flex-direction: row; justify-content: flex-end; margin-top: 0; }
  .se-o-act .oc-code { width: 266px; height: 46px; }
  .se-o-act .oc-shut { left: 106px; }
  .se-o-go { width: 46px; --btn-h: 46px; padding: 0; flex-shrink: 0; }
  .se-o-go-t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .se-o-act .oc-cta { width: 320px; --btn-h: 46px; }
  .se-o-body .badges { gap: 6px 8px; }
  .se-o-body .oc-votes { width: 260px; }
  .se-o-body .oc-title { -webkit-line-clamp: 2; }
}

/* ==========================================================================
   Телефон: < 768
   ========================================================================== */
@media (max-width: 767px) {
  .cg-main { padding-block: 4px 40px; }
  .cg-page { gap: 32px; }
  .cg-top { gap: 2px; }
  .cg-head { gap: 10px; }
  .cg-pill { height: auto; padding: 0; background: none; font-size: 14px; color: var(--text-2); gap: 6px; }
  .cg-pill .ic { color: var(--brand-text); }
  .cg-meta { font-size: 14px; gap: 4px 8px; }
  .cg-meta .ic { width: 16px; height: 16px; }

  .cg-stats { gap: 10px; }
  .cg-stat { padding: 12px 12px 14px 14px; }
  .cg-stat dt { font-size: 14px; }
  .cg-stat dd { flex-wrap: wrap-reverse; align-items: center; gap: 6px 8px; font-size: 24px; min-width: 0; }
  .cg-stat-ic { width: 34px; height: 34px; }
  .cg-stat-v { flex-wrap: wrap; row-gap: 0; }
  .cg-stat-of { font-size: 13px; }
  .cg-stat--dashed { padding: 10px 10px 12px 12px; }

  /* promo */
  .pr-upd { font-size: 14px; gap: 4px 9px; flex-wrap: wrap; }
  .pr-shops { gap: 8px; }
  .pr-shops-sub { display: none; }
  .pr-shops-head .h2 { font-size: 22px; }
  .pr-tiles-wrap { position: relative; margin-inline: calc(-1 * var(--gutter)); }
  .pr-tiles-wrap::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 40px; background: linear-gradient(90deg, transparent, var(--bg)); pointer-events: none; }
  .pr-tiles { display: flex; gap: 8px; overflow-x: auto; overflow-y: hidden; padding: 10px var(--gutter) 4px; scroll-padding-inline: var(--gutter); scrollbar-width: none; }
  .pr-tiles::-webkit-scrollbar { display: none; }
  .pr-tiles > li { flex-shrink: 0; }
  .pr-tile { height: 64px; padding: 0 16px 0 12px; flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; }
  .pr-tile.is-on { padding: 0 15px 0 11px; }
  .pr-tile-n { font-size: 15px; line-height: 1.25; overflow: visible; }
  .pr-tile-m { line-height: 1.3; }
  .pr-nudge { display: flex; align-items: center; gap: 8px; font-size: 13px; line-height: 1.4; color: var(--text-3); }
  .pr-nudge .ic { animation: pr-nudge 1.6s var(--ease-std) 1.2s 2 both; }
  @keyframes pr-nudge { 0%, 100% { transform: none; } 50% { transform: translateX(4px); } }
  .pr-offers { gap: 20px; scroll-margin-top: 72px; }
  .pr-bar { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "form" "order"; row-gap: 18px; padding-bottom: 0; border-bottom: 0; }
  .pr-bar-head { gap: 6px; }
  .pr-title .h2 { font-size: 22px; line-height: 1.25; }
  .pr-bar > .cg-order { margin-top: 2px; }
  .cg-field { height: 52px; padding: 0 3px 0 14px; gap: 8px; }
  .cg-field:focus-within { padding: 0 2px 0 13px; }
  .cg-field .btn--dark { --btn-h: 44px; width: 44px; min-height: 44px; padding: 0; border-radius: var(--r-10); }
  .cg-field .btn--dark .cg-go-t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .cg-field .btn--dark .cg-go-i { display: block; }

  /* category */
  .ct-head { gap: 14px; }
  .ct-badge { gap: 12px; }
  .ct-tile { width: 56px; height: 56px; }
  .ct-tile .ic { width: 30px; height: 30px; }
  .ct-pill { height: 28px; padding: 0 12px; background: var(--surface-2); }
  .ct-pill-ic { display: none; }
  .ct-intro { font-size: 16px; }
  .js .ct-intro.is-clamped { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .ct-list { gap: 20px; }
  .ct-bar { grid-template-columns: minmax(0, 1fr); grid-template-areas: "count" "sub" "sort" "order"; row-gap: 10px; padding-bottom: 0; border-bottom: 0; }
  .ct-bar--beyond { display: none; }
  .ct-count { font-size: 14px; }
  .ct-count .ic { width: 16px; height: 16px; }
  .ct-sub { height: auto; min-height: 64px; padding: 10px 12px; gap: 12px; border: 0; border-radius: var(--r-14); background: var(--surface-2); white-space: normal; }
  .ct-sub:hover { background: var(--surface-3); }
  .ct-sub-ic { width: 40px; height: 40px; border-radius: var(--r-12); background: var(--brand-bg); align-items: center; justify-content: center; flex-shrink: 0; }
  .ct-sub-ic .ic { width: 20px; height: 20px; }
  .ct-sub-tx { flex-grow: 1; }
  .ct-sub-t { font-size: 15px; line-height: 1.3; }
  .ct-wide { display: none; }
  .ct-narrow { display: inline; }
  .ct-sub-d { display: block; position: static; white-space: normal; font-size: 13px; line-height: 1.4; }
  .ct-go { display: block; flex-shrink: 0; color: var(--brand-text); transition: transform var(--dur-hover) var(--ease-std); }
  .ct-sub:hover .ct-go { transform: translateX(3px); }
  .ct-sort { justify-self: stretch; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 3px; border-radius: var(--r-14); margin-top: 2px; }
  .ct-seg { height: auto; min-height: 64px; padding: 8px 6px; flex-direction: column; gap: 4px; border-radius: 11px; font-size: 14px; line-height: 1.2; white-space: normal; text-align: center; }
  .ct-seg .ic { width: 20px; height: 20px; }
  .ct-order { font-size: 14px; }
  .ct-pgn { width: 100%; gap: 12px 10px; }
  .ct-pgn > :first-child, .ct-pgn > :last-child { justify-self: stretch; }
  .ct-pgn-end { font-size: 13px; }

  /* search */
  .se-main { padding-block: 20px 40px; }
  .se-page { gap: 36px; }
  .se-top { gap: 18px; }
  .se-head { gap: 10px; }
  .se-h1 { font-size: 28px; line-height: 1.15; }
  .se-field { height: 56px; border-radius: var(--r-14); padding: 0 4px 0 14px; gap: 6px; }
  .se-field input { height: 48px; font-size: 16px; padding-left: 4px; }
  .se-field .se-lens-ic { width: 20px; height: 20px; }
  .se-go { --btn-h: 44px; width: 44px; padding: 0; border-radius: var(--r-10); }
  .se-go-t { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .se-quick-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 10px; }
  .se-quick-a { white-space: normal; justify-content: flex-start; line-height: 1.25; padding: 6px 12px; }
  .se-quick-a .cg-ar { display: none; }
  .se-quick-h { font-size: 14px; }
  .se-results { gap: 36px; }
  .se-sec { gap: 14px; }
  .se-sec-t { gap: 12px; }
  .se-sec-t .h2 { font-size: 22px; }
  .se-sec-ic { width: 40px; height: 40px; }
  .se-sec-ic .ic { width: 20px; height: 20px; }
  .se-sec-p { font-size: 14px; line-height: 1.45; }
  .se-sec-p .ic { display: none; }
  .se-shops, .se-prods, .se-prods--2, .se-prods--3 { grid-template-columns: minmax(0, 1fr); border-radius: var(--r-18); }
  .se-shops > li, .se-shops > li:nth-child(odd), .se-prods > li { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .se-shops > li:last-child, .se-prods > li:last-child { border-bottom: 0; }
  .se-row { min-height: 72px; padding: 12px 10px 12px 14px; gap: 12px; }
  .se-row-n { font-size: 16px; }
  .se-chev { width: 18px; height: 18px; }
  .js .se-shops:not(.is-open) > .se-extra { display: none; }
  .js .se-shops:not(.is-open) > li:nth-child(5) { border-bottom: 0; }
  .se-more[hidden] { display: none; }
  .se-more {
    display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; width: 100%;
    border-radius: var(--r-12); border: 1px solid var(--line); background: var(--surface); color: var(--text); font-size: 15px; font-weight: 600; cursor: pointer;
    transition: background-color var(--dur-hover) var(--ease-std), border-color var(--dur-hover) var(--ease-std);
  }
  .se-more:hover { background: var(--surface-2); border-color: var(--field-border); }
  .se-more-o, .se-more[aria-expanded="true"] .se-more-c { display: none; }
  .se-more[aria-expanded="true"] .se-more-o { display: inline; }
  .se-more-ic { transition: transform .2s var(--ease-std); }
  .se-more[aria-expanded="true"] .se-more-ic { transform: rotate(180deg); }
  .se-offers { grid-template-columns: minmax(0, 1fr); }
  .se-o-body .oc-title { font-size: 17px; }
  .se-prod { min-height: 72px; padding: 12px 10px 12px 14px; }
  .se-plate { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px; }
  .se-plate p { align-items: flex-start; font-size: 14px; }
  .se-plate .btn { white-space: normal; }
  .se-alert { flex-direction: column; align-items: stretch; gap: 14px; padding: 16px; }
  .se-alert-ic { width: 44px; height: 44px; border-radius: var(--r-12); }
  .se-alert-ic .ic { width: 22px; height: 22px; }
  .se-alert-h { font-size: 18px; }
  .se-alert-list { flex-direction: column; gap: 8px; }
  .se-alert-list li { align-items: flex-start; }
  .se-alert-act .btn { width: 100%; }
  .se-alert-note { white-space: normal; text-align: center; }

  .se-nf { flex-direction: column; gap: 14px; padding: 0; border-radius: 0; background: none; overflow: visible; }
  .se-nf-main { width: auto; display: contents; }
  .se-nf-pill { order: 1; padding: 0; min-height: 0; background: none; font-size: 15px; align-items: flex-start; }
  .se-nf-pill .ic { width: 18px; height: 18px; margin-top: 1px; }
  .se-nf .h2 { order: 2; font-size: 22px; }
  .se-nf-p { order: 3; font-size: 15px; }
  .se-nf-act { order: 4; gap: 10px; align-items: stretch; }
  .se-nf-btn { --btn-h: 52px; width: 100%; font-size: 16px; }
  .se-nf-art { order: 5; min-height: 0; height: 168px; flex: none; border-radius: var(--r-22); overflow: hidden; background-color: var(--warm-bg); background-image: var(--dots); background-size: var(--dots-size); }
  .se-nf-art--cat { height: 168px; justify-content: center; }
  .se-card { top: 12px; left: 12px; width: 204px; }
  .se-card-in { padding: 12px 14px; gap: 8px; border-radius: var(--r-18); }
  .se-card-h, .se-card-c, .se-card-l, .se-card-r--tag { display: none; }
  .se-card-q { padding-bottom: 0; border-bottom: 0; }
  .se-card-v { flex-direction: column-reverse; align-items: flex-start; gap: 8px; }
  .se-card-qt { font-size: 15px; -webkit-line-clamp: 1; max-width: 100%; }
  .se-card-tag { height: 22px; border-radius: var(--r-pill); }
  .se-card-r { font-size: 13px; gap: 6px; }
  .se-card-r .ic { width: 15px; height: 15px; }
  .se-card-cap { position: absolute; left: 4px; top: 126px; margin: 0; color: var(--warm-dark); }
  .se-card-cap .ic { display: none; }
  .se-nf-art > .cat { width: 140px; height: auto; right: 8px; bottom: -34px; }
  .se-nf-art--cat > .cat { width: 140px; margin-bottom: -30px; }
  .se-nf-more { order: 6; padding-top: 10px; border-top: 1px solid var(--line-soft); }

  /* shops */
  .sl-page { gap: 28px; }
  .sl-hero { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .sl-head { padding-top: 0; gap: 8px; display: contents; }
  .sl-head > .cg-pill { order: 1; }
  .sl-head > .h1 { order: 2; }
  .sl-hero { display: flex; flex-direction: column; }
  .sl-rules { order: 3; padding: 12px 14px 4px; border-radius: var(--r-16); }
  .sl-expl { order: 4; gap: 6px; padding-top: 0; }
  .sl-expl .sl-expl-order { display: none; }
  .sl-expl p { font-size: 14px; gap: 10px; }
  .sl-expl-ic { width: 22px; height: 22px; }
  .sl-expl .sl-q { min-width: 22px; height: 22px; padding: 0; border-radius: 6px; font-size: 13px; }
  .sl-rules-h { font-size: 13px; }
  .sl-rules-h--sep { padding-top: 12px; border-top-color: var(--line); }
  .sl-rules-list li { gap: 12px; padding: 10px 0; font-size: 15px; line-height: 1.35; }
  .sl-rules-list li + li { border-top: 0; }
  .sl-rule-ic, .sl-rule-ic--muted { width: 32px; height: 32px; border-radius: 9px; background: var(--brand-bg); color: var(--brand-text); }
  .sl-rule-ic .ic { width: 16px; height: 16px; }
  .sl-numbers { gap: 10px; }
  .sl-note { flex-direction: column; align-items: flex-start; gap: 0; padding: 12px 14px 0; background: var(--surface-2); border: 0; }
  .sl-note > .sl-q { display: none; }
  .sl-note p { font-size: 14px; padding: 0; }
  .sl-bar { flex-direction: column; align-items: stretch; gap: 14px; }
  .sl-bar-head { gap: 14px; }
  .sl-bar-head .h2 { font-size: 22px; line-height: 1.25; }
  .sl-wide { display: none; }
  .sl-narrow { display: inline; }
  .sl-order { font-size: 13px; order: 3; }
  .sl-bar-head { display: contents; }
  .sl-bar > .h2, .sl-bar-head > .h2 { order: 1; }
  .sl-search { width: auto; order: 2; }
  .sl-list { gap: 16px; }
  .sl-table { border-radius: var(--r-18); }
  .sl-cols { display: none; }
  .sl-row { display: flex; gap: 12px; min-height: 72px; padding: 12px 8px 12px 12px; }
  .sl-name { flex-grow: 1; gap: 2px; }
  .sl-name-n { font-size: 16px; }
  .sl-name-d, .sl-num-v { display: none; }
  .sl-name-m { display: block; font-size: 13px; line-height: 1.35; color: var(--text-3); }
  .sl-name-m > span { display: block; }
  .sl-idx { padding-left: 0; flex-shrink: 0; }
  .sl-idx .trust-idx-t { display: none; }
  .sl-chev { width: 18px; height: 18px; flex-shrink: 0; }
  .sl-nf { flex-direction: row; align-items: flex-start; flex-wrap: wrap; gap: 14px; padding: 16px 16px 12px; border-radius: var(--r-18); }
  .sl-nf-ic { width: 48px; height: 48px; background: var(--warm-bg); }
  .sl-nf-t { flex-basis: calc(100% - 62px); }
  .sl-nf-h { font-size: 17px; }
  .sl-nf-t p { font-size: 14px; }
  .sl-reset { margin-left: 62px; }
  .sl-scale { padding: 14px; }
  .sl-scale-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .cg-strip, .pr-ping, .pr-tile, .pr-tile-ok, .pr-tile-ok path, .pr-chip, .ct-tile, .ct-nod, .ct-seg, .se-h1, .se-mk, .se-li,
  .sl-pop, .sl-rise, .sl-nf, .se-cat, .se-alert-ic .ic, .cg-bell, .cg-clap { animation: none !important; }
}

/* H2 над списком предложений раздела (SEO-ТЗ, п. 3) */
.ct-list-h { margin: 0 0 var(--s-4); }

/* --- Каталог товаров со сравнением цен (/catalog, блок товаров на /c/…) --- */
.ctl-cats { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0 0 var(--s-5); }
.ctl-cat { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 14px;
  border: 1px solid var(--line); border-radius: 999px; color: var(--text); text-decoration: none; font-size: 14px; font-weight: 600; }
.ctl-cat b { color: var(--text-3); font-weight: 600; }
.ctl-cat:hover { border-color: var(--line-strong); background: var(--surface); }
.ctl-cat.is-on { border-color: var(--good); background: var(--good-bg); color: var(--good); }
.ctl-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3);
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
.ctl-card { display: flex; flex-direction: column; gap: var(--s-2); height: 100%; padding: var(--s-3);
  border: 1px solid var(--line-soft); border-radius: var(--r-12); color: inherit; text-decoration: none; background: var(--surface); }
.ctl-card:hover { border-color: var(--line); }
.ctl-img { display: flex; align-items: center; justify-content: center; height: 160px; color: var(--text-3); }
.ctl-img img { max-width: 100%; max-height: 160px; object-fit: contain; }
.ctl-t { font-size: 14px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ctl-price { margin-top: auto; display: flex; flex-direction: column; gap: 2px; }
.ctl-price b { font-size: 18px; }
.ctl-shops { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--good); }
.ctl-shops--one { color: var(--text-3); }
.ctl-save { font-size: 13px; color: var(--text-3); }
.ctl-more { margin: var(--s-5) 0 0; }
.ctl-block { margin-top: var(--s-6); }
.ctl-block-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--s-3); margin-bottom: var(--s-4); }
@media (max-width: 767px) {
  .ctl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctl-img { height: 120px; }
  .ctl-img img { max-height: 120px; }
}
.ctl-search { display: flex; flex-wrap: wrap; gap: var(--s-2); margin: 0 0 var(--s-4); max-width: 720px; }
.ctl-search-f { position: relative; flex: 1 1 280px; display: flex; align-items: center; }
.ctl-search-f .ic { position: absolute; left: 14px; color: var(--text-3); pointer-events: none; }
.ctl-search-f .input { width: 100%; padding-left: 42px; }