/* E «Гід»: сланцевий + теракотовий акцент на покупці. Rubik 400/500/700.
   Список — строками с параметрами и «сяде на»; главная ведёт через задачи. */
:root {
  --bg: #f4f5f3; --surface: #fff; --surface-2: #eef0ec; --ink: #1f2a36; --ink-2: #4a5665; --line: #dde2e8; --ctl: #778394;
  --accent: #c2410c; --on-accent: #fff; --accent-2: #a3360a; --brand: #15191c; --on-brand: #fff;
  --ok: #1c6b3a; --ok-bg: #e3f1e8; --warn: #7a4a00; --err: #b3261e; --err-bg: #fcebea;
  --r-sm: 10px; --r-md: 14px; --r-lg: 18px; --r-btn: 12px;
  --font: 'Rubik', system-ui, sans-serif; --font-head: 'Rubik', sans-serif; --head-w: 700; --head-track: -.01em;
  --focus: #1f2a36; --halo: #fff;
}
.logo__mark, .ft .logo__mark { color: var(--accent); }
.logo__word { font-weight: 700; }
.pc--row { min-height: 180px; }
.pc--row .pc__img { width: 200px; }
.pc--row .pc__img img { padding: 8%; }
.pc--row .pc__fav { top: 10px; left: 10px; right: auto; }
.pc--row .pc__name, .pc--row .pc__top { padding-right: 0; }
.rows .pc--row .pc__body { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "top buy" "name buy" "meta buy" "fit buy" "rate buy" "stock buy" "cmp buy"; column-gap: 24px; align-content: center; }
.rows .pc--row .pc__top { grid-area: top; } .rows .pc--row .pc__name { grid-area: name; } .rows .pc--row .pc__meta { grid-area: meta; }
.rows .pc--row .pc__fit { grid-area: fit; } .rows .pc--row .pc__rate { grid-area: rate; } .rows .pc--row .pc__stock { grid-area: stock; } .rows .pc--row .pc__cmp { grid-area: cmp; }
.rows .pc--row .pc__buy { grid-area: buy; flex-direction: column; align-items: flex-end; gap: 10px; margin: 0; padding: 0; }
.rows .pc--row .price { align-items: flex-end; }
.rows .pc--row .price__now { font-size: 24px; }
.xp--rail .xp__in, .pp__s { box-shadow: inset 0 0 0 1.5px var(--ink), var(--sh-1); }
.step { background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--accent); color: var(--accent-2); }

/* главная: задачи + машина */
.guide { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; padding-top: 28px; align-items: start; }
.guide__main h1 { font-size: clamp(28px, 3.2vw, 44px); margin-bottom: 18px; }
.tasks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; }
.tasks a { display: flex; flex-direction: column; gap: 4px; height: 100%; min-height: 150px; padding: 18px; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); text-decoration: none; transition: box-shadow var(--t), transform var(--t) var(--ease); }
.tasks a:hover { box-shadow: 0 0 0 2px var(--accent), var(--sh-2); transform: translateY(-2px); }
.tasks .i { width: 30px; height: 30px; color: var(--accent); margin-bottom: 6px; }
.tasks b { font-size: 17px; line-height: 1.25; } .tasks span { color: var(--ink-2); font-size: 14px; } .tasks small { margin-top: auto; color: var(--ink-2); font-weight: 600; }
.guide__car { padding: 20px; border-radius: var(--r-lg); background: var(--brand); color: #fff; --focus: #fff; --halo: #000; --ctl: #aab4c1; }
.guide__car h2 { display: flex; align-items: center; gap: 8px; font-size: 21px; }
.guide__car > p { margin: 6px 0 14px; color: #d3dae3; }
.guide__car h3 { font-size: 15px; margin: 18px 0 8px; }
.guide__car .btn-sec { color: #fff; border-color: #fff; margin-top: 10px; }
.glogos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; list-style: none; margin: 0; padding: 0; }
.glogos a { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 10px; border-radius: 10px; background: #2a3136; text-decoration: none; font-size: 14px; font-weight: 500; }
.glogos a:hover { background: #3a4248; }
.glogos img { filter: invert(1); width: 22px; height: 22px; }
.gchips { display: grid; gap: 6px; list-style: none; margin: 0; padding: 0; }
.gchips a { display: grid; grid-template-columns: 84px 1fr; gap: 12px; align-items: center; min-height: 56px; height: auto; padding: 4px; border-radius: 12px; background: #2a3136; text-decoration: none; }
.gchips a:hover { background: #3a4248; }
.gchips img { border-radius: 8px; }
.gchips span { display: flex; flex-direction: column; font-weight: 500; font-size: 15px; } .gchips small { color: #c9d1db; }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; list-style: none; margin: 0; padding: 0; counter-reset: s; }
.steps li { counter-increment: s; display: grid; grid-template-columns: 44px 1fr; gap: 0 12px; padding: 16px; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.steps li::before { content: counter(s); grid-row: span 2; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--accent); color: #fff; font-weight: 700; }
.steps span { color: var(--ink-2); font-size: 14px; }
.calls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; padding: 28px; border-radius: var(--r-lg); background: var(--brand); color: #fff; }
.calls__t { flex: 1 1 280px; min-width: 0; }
.calls h2 { margin: 0; font-size: clamp(22px, 2.4vw, 28px); font-weight: 700; color: #fff; }
.calls p { margin: 8px 0 0; max-width: 68ch; color: #d3dae3; }
.calls__btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 18px; border-radius: var(--r-btn); background: var(--accent); color: var(--on-accent); font-weight: 700; text-decoration: none; flex: none; }
.calls__btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.xsh { padding: 28px; border-radius: var(--r-lg); background: var(--brand); color: #fff; }
.xsh__h h2 { margin: 10px 0 8px; color: #fff; }
.xsh__h p { margin: 0 0 18px; max-width: 62ch; color: #d3dae3; }
.xsh .badge-excl { background: var(--accent); color: #fff; }
.xsh__g { display: grid; gap: 12px; }
.xsh .pc { background: var(--surface); color: var(--ink); }
.xsh .pc--row .pc__body { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 2px; align-content: center; align-items: center; }
.xsh .pc--row .pc__top, .xsh .pc--row .pc__name, .xsh .pc--row .pc__meta, .xsh .pc--row .pc__fit, .xsh .pc--row .pc__rate, .xsh .pc--row .pc__stock { grid-column: 1; }
.xsh .pc--row .pc__buy { grid-column: 2; grid-row: 1 / span 8; flex-direction: column; flex-wrap: nowrap; align-items: flex-end; align-self: center; gap: 6px; margin: 0; padding: 0; }
.xsh .pc--row .pc__cmp { flex: none; width: auto; min-height: 32px; margin: 0; }
.xsh .pc--row .price { align-items: flex-end; }
.xsh__all { display: inline-flex; align-items: center; min-height: 44px; margin-top: 16px; color: #fff; font-weight: 700; text-decoration: none; }
.xsh__all:hover { color: #ffb089; }
.split { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.split > .xp { position: sticky; top: 12px; margin-top: 52px; }
@media (max-width: 1180px) {
  .guide { grid-template-columns: minmax(0, 1fr); }
  .tasks { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lst--wide.lst--rail { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .guide { padding-top: 12px; gap: 16px; }
  .guide__main h1 { font-size: 25px; margin-bottom: 12px; }
  .tasks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tasks a { min-height: 128px; padding: 12px; }
  .tasks b { font-size: 15px; } .tasks span { font-size: 13px; }
  .glogos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps, .split { grid-template-columns: minmax(0, 1fr); }
  .calls { padding: 18px; }
  .calls h2 { font-size: 22px; }
  .calls__btn { width: 100%; }
  .xsh { padding: 18px; }
  .xsh .pc--row .pc__body { display: flex; }
  .xsh .pc--row .pc__buy { align-items: stretch; grid-column: auto; grid-row: auto; }
  .xsh .pc--row .price { align-items: flex-start; }
  .xsh .pc--row .pc__btn { width: 100%; }
  .split > .xp { position: static; margin-top: 0; }
  .rows .pc--row .pc__body { display: flex; }
  .rows .pc--row .pc__buy { align-items: stretch; }
  .rows .pc--row .price { align-items: flex-start; }
  .rows .pc--row .price__now { font-size: 19px; }
  .pc--row { min-height: 0; }
  .pc--row .pc__img { width: 116px; }
}

/* Шапка F: щільніший рядок службових посилань, липка шапка, активний розділ, прапор UA, вибір авто. */
.hd { position: sticky; top: 0; z-index: var(--z-drop); background: var(--surface); box-shadow: 0 1px 0 var(--line); }
.hd__utl a, .hd__hours, .hd__navcar { line-height: 1.15; }
.hd__utl .i { vertical-align: 0; }
.lang a { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.flag-ua { display: block; width: 18px; height: 12px; border-radius: 2px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .18); }
.ava { color: var(--accent); }
html[lang="uk"] .hd__util .lang,
html[lang="uk"] .ft .lang { position: relative; }
html[lang="uk"] .hd__util .lang a[hreflang="uk"],
html[lang="uk"] .ft .lang a[hreflang="uk"] { min-width: 76px; padding: 0 14px; gap: 8px; }
html[lang="uk"] .hd__util .lang::after,
html[lang="uk"] .ft .lang::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 8px; }
html[lang="uk"] .hd__util .lang a[hreflang="ru"],
html[lang="uk"] .ft .lang a[hreflang="ru"] { display: none; position: absolute; z-index: 6; top: calc(100% + 4px); left: 0; right: 0; min-height: 36px; padding: 0 10px; border-radius: 8px; background: var(--surface); color: var(--ink); box-shadow: var(--sh-2); }
html[lang="uk"] .hd__util .lang:hover a[hreflang="ru"],
html[lang="uk"] .hd__util .lang:focus-within a[hreflang="ru"],
html[lang="uk"] .ft .lang:hover a[hreflang="ru"],
html[lang="uk"] .ft .lang:focus-within a[hreflang="ru"] { display: inline-flex; }
.hd__nav .wrap > a.hd__navfit:not([aria-current="page"]) { background: transparent !important; color: inherit; }
.hd__nav .wrap > a[aria-current="page"], .more__b[aria-current="page"], .more__l a[aria-current="page"] { background: var(--brand) !important; color: var(--on-brand); }
.hd__nav a.nav-x { background: transparent !important; padding: 0 8px; }
.hd__nav a.nav-x span { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 8px; background: var(--accent); color: #fff; font-size: 14px; font-weight: 700; line-height: 1; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .18); }
.hd__nav a.nav-x:hover { background: transparent !important; }
.hd__nav a.nav-x:hover span { background: var(--accent-2); }
.hd__nav a.nav-x[aria-current="page"] { background: transparent !important; color: inherit; }
.hd__nav a.nav-x[aria-current="page"] span { box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .18), 0 0 0 2px var(--surface), 0 0 0 4px var(--accent); }
.hd__nav[data-nav-fit]:not(.is-fit) { overflow: hidden; }
.hd__nav[data-nav-fit] .wrap > a[data-nav-cat] > .i { display: none; }
.hd__nav[data-nav-fit] .more { z-index: 6; }
.hd__nav[data-nav-fit] .more__b { background-clip: padding-box; }
/* Меню відкривається вліво і починається від верху кнопки: інакше шлях миші до пункту виходить із «Ще» і список зникає. */
.hd__nav[data-nav-fit] .more__l { z-index: 7; top: 0; left: auto; right: 0; padding: 46px 6px 6px; background: transparent; box-shadow: none; }
.hd__nav[data-nav-fit] .more__l::before { content: ""; position: absolute; z-index: 0; left: 0; right: 0; top: 44px; bottom: 0; border-radius: var(--r-md); background: var(--surface); box-shadow: var(--sh-3); }
.hd__nav[data-nav-fit] .more__l li { position: relative; z-index: 1; }
.lst--wide.lst--rail { grid-template-columns: minmax(0, 1fr) 300px; }
.xps { margin-top: 48px; }
.gtabs { margin-bottom: 20px; }
.lp--gen { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding-top: 8px; padding-bottom: 8px; }
.lp--gen img { width: 112px; height: 70px; object-fit: contain; background: transparent; }
.refine__chk { display: none; }
.gens img, .pgens img { object-fit: contain; background: #eef0f2; }
.lst { gap: 36px; }
.lst__side { gap: 24px; }
.flt { padding: 20px 20px 22px; }
.flt fieldset { padding: 16px 0; }
.flt legend { margin-bottom: 10px; }
.flt__range { gap: 10px; }
.tb { gap: 12px 20px; margin-bottom: 24px; }
.rows { gap: 16px; }
.rows .pc--row .pc__body { row-gap: 8px; }
.hd__navcar, .hd__mycar { line-height: 1.15; }
.dlg__cats .i { color: var(--accent); }
#dlg-cats { max-width: 920px; }
.dlg__cats { gap: 12px; }
.dlg__cats a { gap: 14px; min-height: 72px; padding: 16px 18px; align-items: center; }
.dlg__cats a span { line-height: 1.3; }
.dlg__cats small { flex: none; padding-left: 12px; }
.dlg__brands .blogo { width: 24px; height: 24px; flex: none; background: var(--accent); -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }
.dlg--car { max-width: 920px; }
.carpick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.carpick h3 { margin: 0 0 8px; font-size: 14px; }
.carpick ul { list-style: none; margin: 0; padding: 2px 14px 2px 2px; max-height: min(52vh, 420px); overflow: auto; scrollbar-gutter: stable; }
.carpick button, .carpick a { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; margin: 0 0 4px; padding: 8px 10px; border: 0; border-radius: 10px; background: var(--surface-2); color: inherit; font: inherit; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
.carpick a img { width: 72px; height: 45px; object-fit: contain; background: #eef0f2; border-radius: 6px; flex: none; }
.carpick a span { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.carpick button[aria-current="true"], .carpick a:hover, .carpick button:hover { box-shadow: inset 0 0 0 2px var(--accent); }
.carpick small { color: var(--ink-2); font-weight: 500; }
.carpick__back { display: none; }
.dlg--car .btn-sec { margin: 12px 0 4px; }
html { scroll-padding-top: 180px; }
.gtabs, .anchors, .slices--bar { top: 174px; }
.fitline { display: none; }
.pp.pp--split:has(.pp__side) { grid-template-areas: "g side"; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); }
.pp__side { grid-area: side; display: flex; flex-direction: column; gap: 12px; align-self: start; min-width: 0; }
.cfg { padding: 12px 14px 8px; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.cfg .opts { margin: 0; }
.cfg .opts__g { margin: 0 0 6px; }
.cfg .opts__g legend { margin-bottom: 4px; }
.cfg .opts__it > span { min-height: 32px; padding: 2px 10px; }
.cfg .opts__it b { font-size: 13px; font-weight: 600; }
.cfg .opts__ok { width: 16px; height: 16px; top: -6px; right: -6px; padding: 2px; }
.pp2 { grid-template-columns: minmax(0, 1fr); }
.desc p { max-width: none; }
.spec { position: static; }
#opys, #kharakterystyky, #vidguky, #pytannia { scroll-margin-top: 72px; }
.anchors a.is-on { background: var(--ink); color: var(--bg); box-shadow: none; }
.pp__g .gal__track > li:not(.gal__vid) { cursor: pointer; }
.pp3:has(.pp3__main) { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; gap: 28px; }
.pp3__main { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.pp3__main .rv + .qa { margin-top: 0; }
.pp3 > .xp { position: sticky; top: 248px; }
.rv__head > a, .qa__head > a { display: none; }
.form-box { width: max-content; max-width: 100%; background: none; box-shadow: none; }
.form-box > summary { display: inline-flex; align-items: center; justify-content: center; width: auto; min-height: 44px; margin-top: 14px; padding: 0 18px; border-radius: var(--r-btn); background: var(--accent); color: var(--on-accent); font-weight: 700; cursor: pointer; list-style: none; }
.form-box > summary::-webkit-details-marker { display: none; }
.form-box[open] { width: 100%; }
.form-box[open] > summary { margin-bottom: 12px; }
.form-box .form { margin: 0; padding: 18px; border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--sh-1); }
.rel__h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.rel__h h2 { margin: 0; }
.rel__nav { display: flex; gap: 8px; }
.rel__btn { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--ink); color: #fff; cursor: pointer; }
.rel__btn .i { width: 18px; height: 18px; }
.rel__btn--next .i { transform: none; }
.rel__btn:not(.rel__btn--next) .i { transform: rotate(180deg); }
.rel__btn:disabled { background: var(--surface-2); color: var(--ink-2); cursor: default; }
.rel__car { --car-n: 4; display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding-bottom: 8px; scrollbar-width: none; }
.rel__car::-webkit-scrollbar { display: none; }
.rel__car > .pc { flex: 0 0 calc((100% - (var(--car-n) - 1) * 16px) / var(--car-n)); width: calc((100% - (var(--car-n) - 1) * 16px) / var(--car-n)); max-width: none; scroll-snap-align: start; }
.lb[open] { position: fixed; inset: 0; z-index: 80; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; margin: 0; padding: 24px; border: 0; width: 100%; height: 100%; max-width: none; max-height: none; background: rgba(10, 14, 20, .92); }
.lb::backdrop { background: transparent; }
.lb img { width: 100%; height: min(86vh, 900px); object-fit: contain; }
.lb__x { position: absolute; top: 16px; right: 16px; }
.lb__btn { display: grid; place-items: center; width: 52px; height: 52px; border: 0; border-radius: 50%; background: #fff; color: var(--ink); cursor: pointer; font-size: 28px; line-height: 1; }
.lst__side, .lst > .xp, .lst__side > .xp { top: 250px; }
.pp__g, .pp__s, .sum, .spec, .inst__map { top: 180px; }
.split > .xp { top: 180px; }
@media (max-width: 900px) {
  #dlg-cats { max-width: none; }
  .dlg__cats { grid-template-columns: minmax(0, 1fr); }
  .hd__nav a.nav-x { justify-content: flex-start; padding: 0 12px; }
  .lst--wide.lst--rail { grid-template-columns: minmax(0, 1fr); }
  .xps, .lst__main > .xps { margin-top: 36px; }
  .gtabs { margin-bottom: 16px; }
  .lp--gen { padding-top: 4px; padding-bottom: 4px; }
  .lp--gen img { width: 88px; height: 56px; }
  .lst { gap: 24px; }
  .tb { margin-bottom: 16px; }
  .rows { gap: 14px; }
  .flt { padding: 16px 16px 18px; }
  .hd__row2 { flex-wrap: wrap; }
  .hd__fit { flex: 0 0 auto; }
  .hd__mycar { display: inline-flex; flex: 1 1 8em; min-width: 8em; max-width: none; }
  .hd__mycar span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .hd__fit:not([aria-current="page"]) { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ctl); }
  .dlg--car[data-step="brand"] .carpick section:not([data-step="brand"]),
  .dlg--car[data-step="model"] .carpick section:not([data-step="model"]),
  .dlg--car[data-step="gen"] .carpick section:not([data-step="gen"]) { display: none; }
  .carpick { grid-template-columns: 1fr; }
  .carpick__back { display: inline-flex; width: auto; margin-bottom: 8px; background: transparent; box-shadow: inset 0 0 0 1.5px var(--ctl); }
  html { scroll-padding-top: 120px; }
  .slices li, .gtabs li { flex: none; }
  .slices--bar .slices, .gtabs ul { padding-right: 8px; }
  .slices--bar.can-next::after, .gtabs.can-next::after, .slices--bar.can-prev::before, .gtabs.can-prev::before { content: ""; position: absolute; top: 0; bottom: 0; width: 52px; pointer-events: none; z-index: 2; }
  .slices--bar.can-next::after, .gtabs.can-next::after { right: 0; background: linear-gradient(to right, transparent, var(--bg) 46%); }
  .slices--bar.can-prev::before, .gtabs.can-prev::before { left: 0; background: linear-gradient(to left, transparent, var(--bg) 46%); }
  .crumbs li { flex: none; }
  .crumbs li:last-child { max-width: 100%; }
  .crumbs li:last-child a { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .gtabs, .anchors, .slices--bar { top: 112px; }
  .pp.pp--split:has(.pp__side) { grid-template-columns: minmax(0, 1fr); grid-template-areas: "g" "side"; }
  .pp3:has(.pp3__main) { grid-template-columns: minmax(0, 1fr); }
  .pp3 > .xp { position: static; }
  .rel__car { --car-n: 2; }
  .lst__side, .lst > .xp, .lst__side > .xp, .pp__g, .pp__s, .sum, .spec, .inst__map, .split > .xp { top: 12px; }
}

/* главная (BL-25): два входа «По марках» / «По категоріях» на первом экране, как в B, в стилистике E */
.ehero { padding-top: 24px; }
.ehero h1 { font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 16px; }
.edoors { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.edoor { padding: 20px; border-radius: var(--r-lg); }
.edoor h2 { display: flex; align-items: center; gap: 8px; font-size: 21px; }
.edoor > p { margin: 4px 0 14px; }
.edoor--car { background: var(--brand); color: #fff; --focus: #fff; --halo: #000; --ctl: #aab4c1; }
.edoor--car > p { color: #d3dae3; }
.edoor--car .btn-sec { color: #fff; border-color: #fff; }
.edoor--cat { background: var(--surface); box-shadow: var(--sh-1); }
.edoor--cat > p { color: var(--ink-2); }
.edoor__all { margin-top: 12px; }
.edoor__sub { font-size: 15px; margin: 18px 0 8px; }
.elogos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; list-style: none; margin: 0; padding: 0; }
.elogos a { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 10px; border-radius: 10px; background: #2a3136; text-decoration: none; font-size: 14px; font-weight: 500; color: #fff; }
.elogos a:hover { background: #3a4248; }
.elogos img { filter: invert(1); width: 22px; height: 22px; flex: none; }
.elogos span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edoor__gens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ectiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; list-style: none; margin: 0; padding: 0; }
.ectiles a { display: flex; flex-direction: column; gap: 4px; height: 100%; min-height: 84px; padding: 12px; border-radius: var(--r-md); background: var(--bg); text-decoration: none; font-weight: 600; font-size: 15px; color: var(--ink); }
.ectiles a:hover { box-shadow: 0 0 0 2px var(--accent); }
.ectiles .i { width: 24px; height: 24px; color: var(--accent); }
.ectiles small { margin-top: auto; color: var(--ink-2); font-weight: 500; }
@media (max-width: 900px) {
  .ehero { padding-top: 10px; }
  .ehero h1 { font-size: 22px; margin-bottom: 10px; }
  .edoors { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .edoor { padding: 14px; }
  .edoor h2 { font-size: 18px; }
  .edoor > p { display: none; }
  .edoor h2 { margin-bottom: 10px; }
  .elogos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .elogos li:nth-child(n+7) { display: none; }
  .edoor__sub, .edoor__gens { display: none; }
  .ectiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .ectiles li:nth-child(n+7) { display: none; }
  .ectiles a { min-height: 64px; padding: 8px 10px; font-size: 13px; }
  .ectiles .i { width: 20px; height: 20px; }
  .edoor__all { margin-top: 8px; min-height: 44px; }
}

/* оформлення: тонкі рамки, повітря між блоками, справжні знаки оплати */
.co-page .pg-h { margin-bottom: 6px; }
.co-page .two { gap: 20px; }
.co-page .co { gap: 14px; }
.co-page .co__lead { margin: 0 0 2px; font-size: 14px; }
.co-page .co__step,
.co-page .co__consent,
.co-page .co-side .cart__it,
.co-page .co-side .sum {
  border: 1px solid #e7e9ee;
  box-shadow: none;
  border-radius: 16px;
}
.co-page .co__step { padding: 18px 20px 20px; }
.co-page .co__step > legend { margin-bottom: 14px; font-size: 18px; }
.co-page .co__step > legend span { width: 26px; height: 26px; background: var(--accent); color: #fff; font-size: 13px; }
.co-page .co__grid { gap: 14px 16px; }
.co-page .fld > label { font-weight: 600; color: var(--ink-2); }
.co-page .fld input:not([type="checkbox"]):not([type="radio"]) {
  border: 1px solid #d8dbe2;
  background: #fbfbfc;
  border-radius: 10px;
  min-height: 46px;
}
.co-page .fld input:not([type="checkbox"]):not([type="radio"]):focus {
  border-color: var(--accent);
  background: #fff;
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);
}
.co-page .co__carrier { margin: 0 0 12px; }
.co-page .co__carrier img { display: block; height: 26px; width: auto; }
.co-page .co__radios { gap: 8px; margin-bottom: 16px; }
.co-page .co__radios--ship { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.co-page .co__radios label {
  box-shadow: none;
  border: 1px solid #e4e6eb;
  background: #fff;
  border-radius: 12px;
  min-height: 52px;
  padding: 10px 14px;
  gap: 12px;
}
.co-page .co__radios label:hover { border-color: #c5c9d1; }
.co-page .co__radios label:has(input:checked) {
  border-color: var(--accent);
  background: #fff7f4;
  box-shadow: none;
}
.co-page .co__radios input { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }
.co-page .co__radios--ship label { justify-content: center; }
.co-page .co__radios--ship span { font-weight: 650; font-size: 15px; }
.co-page .co__radios--pay { grid-template-columns: minmax(0, 1fr); margin-bottom: 0; }
.co-page .co__radios--pay label { min-height: 64px; }
.co-page .co__radios b { font-weight: 650; }
.co-page .co__logo { width: 40px; height: 40px; object-fit: contain; flex: none; }
.co-page .co__logo--wide { width: 112px; height: 22px; }
.co-page .co__cards { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: flex-start; gap: 6px; width: 88px; flex: none; }
.co-page .co__cards img { width: 40px; height: 18px; object-fit: contain; }
.co-page .co__consent { padding: 14px 18px; }
.co-page .co-side { display: grid; gap: 12px; align-content: start; position: sticky; top: 16px; }
.co-page .co-side .sum { position: static; margin: 0; padding: 16px 18px 14px; }
.co-page .co-side .sum h2 { font-size: 18px; }
.co-page .co-side .sum dl div { align-items: baseline; gap: 16px; padding: 8px 0; }
.co-page .co-side .sum dt { white-space: nowrap; font-weight: 600; }
.co-page .co-side .sum dd { line-height: 1.35; }
.co-page .co-side .sum__total { margin: 12px 0; }
.co-page .co-side .sum__total b { font-size: 26px; }
.co-page .co-side .cart__list { gap: 0; }
.co-page .co-side .cart__it { padding: 12px 14px; }
.co-page .co-side .cart__name { font-size: 14.5px; font-weight: 650; line-height: 1.35; }
.co-page .co-side .cart__sum { font-size: 16px; font-weight: 750; }
.co-page .co-side .cart__qty { box-shadow: inset 0 0 0 1px #d7dae1; }
.co-page .co-side .cart__qty button,
.co-page .co-side .cart__qty input { width: 32px; height: 32px; }
.co-page .co-side .cart__rm { min-height: 32px; padding: 0 8px; font-size: 13px; }
@media (max-width: 640px) {
  .co-page .co__radios--ship { grid-template-columns: minmax(0, 1fr); }
  .co-page .co__radios--ship label { justify-content: flex-start; }
}