/* Site layout on top of the design system components (tn.css): base, header, footer, home, catalogue (with the
   Filter Everything widget restyled as the design's filter panel), car page, consultation form, credit, contacts,
   blog.

   Breakpoints: 1099 px — phone header and menu; 899 px — catalogue filters become a full-screen layer, page
   columns stack; 767 px — phone type scale, 16 px page gutters, swipe rows, the pinned call bar. */

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 80px; }
body { margin: 0; min-height: 100vh; }
body.tn { background: var(--surface); }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible, summary:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.tn-skip:focus { position: fixed !important; top: 8px; left: 8px; z-index: 1000; width: auto; height: auto; padding: 12px 18px; margin: 0; clip: auto; background: var(--surface); color: var(--ink-900); box-shadow: var(--focus-ring); font: 600 15px/20px var(--font-display); }
.tn-site { display: flex; flex-direction: column; min-height: 100vh; }
.tn-content { flex: 1; }
.tn-content:focus { outline: none; }

.tn-stack { display: flex; flex-direction: column; gap: 28px; }
.tn-stack--s { gap: 18px; }
.tn-stack--l { gap: 40px; }
.tn-page { padding: 28px 0 96px; }
.tn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(270px, 100%), 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.tn-grid__item { display: flex; }
.tn-grid__item > .tn-card { flex: 1; }
.tn-only-m { display: none; }
.tn-panel .tn-caption, .tn-caption:has(.tn-i) { display: flex; align-items: center; gap: 8px; }
.tn-caption .tn-i { color: var(--brand-700); }
.tn-price--ask { font-size: 17px; color: var(--ink-700); }
.tn-hours__note { grid-column: 1 / -1; color: var(--ink-500); font-weight: 500; }
.tn-card__title { overflow-wrap: anywhere; }

/* Text written in the editor (pages, car description, the home credit text). */
.tn-prose { font: 400 16px/26px var(--font-body); color: var(--ink-700); max-width: 760px; }
.tn-prose > * + * { margin-top: 16px; }
.tn-prose h2 { font: 600 26px/32px var(--font-display); color: var(--ink-900); margin-top: 36px; }
.tn-prose h3 { font: 600 20px/28px var(--font-display); color: var(--ink-900); margin-top: 28px; }
.tn-prose ul, .tn-prose ol { padding-left: 1.4em; }
.tn-prose ul { list-style: square; }
.tn-prose ol { list-style: decimal; }
.tn-prose li + li { margin-top: 6px; }
.tn-prose a { color: var(--brand-700); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: rgba(194,64,0,.4); }
.tn-prose a:hover { color: var(--ink-900); }
.tn-prose strong, .tn-prose b { color: var(--ink-900); }
.tn-prose--ticks ul { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 12px; font: 500 16px/24px var(--font-body); }
.tn-prose--ticks li { display: flex; gap: 12px; align-items: flex-start; margin: 0 !important; }
.tn-prose--ticks li::before { content: ""; flex: none; width: 20px; height: 20px; margin-top: 2px; background: var(--brand-700); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
  --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E"); }
.tn-prose--ticks strong, .tn-prose--ticks b { font-weight: 700; }
.tn-page__article { display: flex; flex-direction: column; gap: 24px; }

/* ---------- Header ---------- */
.tn-topbar a { color: inherit; }
.tn-topbar a.tn-topbar__item:hover { color: var(--brand-700); }
.tn-topbar__items { display: flex; flex-wrap: wrap; gap: 4px 28px; align-items: center; min-width: 0; }
.tn-topbar__phone .tn-i { color: var(--brand-700); }
.tn-topbar .tn-socials { flex: none; }
.tn-header { position: relative; z-index: 20; }
.tn-header__m { display: none; gap: 6px; }
.tn-header__m .tn-btn { width: 44px; height: 44px; }
.tn-logo__img { display: block; width: auto; max-height: 52px; }
.tn-logo--compact { gap: 10px; }
.tn-logo--compact .tn-carart { width: 44px; }
.tn-logo--compact .tn-logo__text { font-size: 14px; }
.tn-logo--compact .tn-logo__img { max-height: 40px; }
.tn-nav { min-width: 0; }

/* Compact bar after scrolling down (desktop only). */
.tn-stickybar { position: fixed; top: var(--wp-admin--admin-bar--height, 0px); left: 0; right: 0; z-index: 100; background: var(--surface); border-bottom: 1px solid var(--line-200); box-shadow: 0 8px 24px -16px rgba(35,38,40,.25); transform: translateY(calc(-100% - var(--wp-admin--admin-bar--height, 0px))); transition: transform .2s ease; }
.tn-stickybar.is-visible { transform: none; }
.tn-stickybar__in { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 64px; }
.tn-stickybar .tn-nav { gap: 22px; }
.tn-stickybar .tn-nav a { font-size: 14px; }
.tn-stickybar__end { display: flex; align-items: center; gap: 16px; flex: none; }
.tn-stickybar__phone { display: inline-flex; align-items: center; gap: 8px; font: 700 15px/20px var(--font-display); color: var(--ink-900); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tn-stickybar__phone .tn-i { width: 16px; height: 16px; color: var(--brand-700); }
.tn-stickybar__phone:hover { color: var(--brand-700); }

/* Phone menu (full-screen layer). */
.tn-mmenu { position: fixed; inset: 0; z-index: 300; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; background: var(--surface); }
.tn-mmenu[hidden] { display: none; }
.tn-mmenu__head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; min-height: 64px; padding: 0 16px; background: var(--surface); border-bottom: 1px solid var(--line-200); }
.tn-mmenu__head .tn-btn { width: 44px; height: 44px; }
.tn-mmenu__nav { display: flex; flex-direction: column; padding: 8px 16px; }
.tn-mmenu__nav a { display: flex; align-items: center; gap: 12px; min-height: 56px; border-bottom: 1px solid var(--line-200); font: 600 20px/28px var(--font-display); color: var(--ink-900); }
.tn-mmenu__nav a:last-child { border-bottom: 0; }
.tn-mmenu__nav a > .tn-i { margin-left: auto; color: var(--line-400); }
.tn-mmenu__nav a[aria-current="page"] { color: var(--brand-700); }
.tn-mmenu__nav .tn-lane { width: 22px; flex: none; }
.tn-mmenu__nav .tn-check__count { margin-left: auto; }
.tn-mmenu__contacts { display: flex; flex-direction: column; gap: 16px; padding: 8px 16px 0; }
.tn-mmenu__phones { display: flex; flex-direction: column; gap: 12px; padding: 18px; background: var(--surface-2); }
.tn-mmenu__phones a { display: flex; align-items: center; justify-content: space-between; font: 700 18px/24px var(--font-display); color: var(--ink-900); font-variant-numeric: tabular-nums; }
.tn-mmenu__phones a .tn-i { color: var(--brand-700); }
.tn-mmenu__phones .tn-small { display: flex; gap: 8px; align-items: flex-start; }
.tn-mmenu__phones .tn-small .tn-i { margin-top: 3px; }
.tn-mmenu .tn-socials { gap: 8px; }
.tn-mmenu__cta { margin-top: auto; padding: 16px 16px 20px; }
body.tn-menu-open { overflow: hidden; }

/* ---------- Footer ---------- */
.tn-site-footer { padding-top: 64px; }
.tn-footer__main { display: flex; flex-direction: column; gap: 56px; }
.tn-footer__cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 40px; padding: 32px 40px; background: var(--surface); }
.tn-footer__cta-text { display: flex; flex-direction: column; gap: 6px; max-width: 560px; }
.tn-footer__cta .tn-h4 { font-size: 20px; line-height: 26px; }
.tn-footer__cta .tn-small { color: var(--ink-700); font-size: 14px; line-height: 22px; }
.tn-footer__cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.tn-footer .tn-footer__cta a.tn-btn--outline { color: var(--ink-900); }
.tn-footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 40px; }
.tn-footer__brand { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.tn-footer__brand .tn-small { color: var(--ink-700); }
.tn-footer__brand .tn-socials { gap: 8px; }
.tn-footer .tn-flist a { color: var(--ink-900); }
.tn-copy { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 48px; }
.tn-copy a { color: var(--ink-500) !important; }
.tn-copy a:hover { color: var(--brand-700) !important; }

/* Phone call bar, pinned to the bottom on phones. */
.tn-callbar { display: none; }

/* ---------- Home ---------- */
.tn-home .tn-stack { gap: 40px; }

.tn-hero { display: grid; }
.tn-hero__slide { grid-area: 1 / 1; position: relative; opacity: 0; visibility: hidden; transition: opacity .6s ease, visibility .6s; }
.tn-hero__slide.is-active { opacity: 1; visibility: visible; z-index: 1; }
.tn-hero__panel .tn-display { font-size: 52px; line-height: 58px; }
.tn-hero__panel .tn-lead { color: var(--ink-900); }
.tn-hero__slide .tn-hero__panel { opacity: 0; transform: translateY(12px); transition: opacity .25s ease .15s, transform .25s ease .15s; }
.tn-hero__slide.is-active .tn-hero__panel { opacity: 1; transform: none; }
.tn-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.tn-hero__phone { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.tn-hero__phone > .tn-i { color: var(--brand-700); }
.tn-hero__phone b { font: 700 17px/22px var(--font-display); color: var(--ink-900); font-variant-numeric: tabular-nums; }
.tn-hero__phone .tn-small { color: var(--ink-700); }
.tn-hero__phone:hover b { color: var(--brand-700); }
.tn-hero__controls { z-index: 2; }
.tn-hero__arrows { display: flex; gap: 8px; }
.tn-hero__dots { gap: 0; }
.tn-hero__dot { display: grid; align-items: center; height: 44px; padding: 0 3px; margin: 0; background: none; border: 0; cursor: pointer; }
.tn-hero .tn-hero__dot span { position: relative; display: block; width: 18px; height: 1px; overflow: hidden; transition: width .25s ease; }
.tn-hero .tn-hero__dot:hover span { background: rgba(255,255,255,.85); }
.tn-hero .tn-hero__dot[aria-current="true"] span { width: 42px; }
.tn-hero__dot[aria-current="true"] span::after { content: ""; position: absolute; inset: 0; background: var(--brand-500); transform-origin: left; animation: tn-dot-fill var(--hero-interval, 6s) linear forwards; }
.tn-hero.is-paused .tn-hero__dot span::after { animation-play-state: paused; }
@keyframes tn-dot-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.tn-home-trust__in { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 56px 80px; align-items: start; }
.tn-home-trust__in > .tn-shead { gap: 18px; }
.tn-home-trust__btn { padding-top: 12px; }
/* Lists need .tn in the selector: tn.css resets ".tn ul, .tn ol" padding and margin. */
.tn .tn-home-trust__list { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line-200); padding: 8px 32px; }
.tn-home-trust__list li { display: grid; grid-template-columns: 52px 1fr; gap: 20px; padding: 26px 0; border-bottom: 1px solid var(--line-200); }
.tn-home-trust__list li:last-child { border-bottom: 0; }
.tn-home-trust__list li > div { display: flex; flex-direction: column; gap: 8px; }
.tn-home-trust__list .tn-h4 { font-size: 19px; line-height: 26px; }

.tn-home-credit__box { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); background: var(--brand-50); overflow: hidden; }
.tn-home-credit__photo { aspect-ratio: auto; min-height: 480px; }
.tn-home-credit__body { display: flex; flex-direction: column; gap: 22px; padding: 56px; }
.tn-home-credit__actions { display: flex; flex-wrap: wrap; gap: 12px; padding-top: 8px; }
.tn-home-credit .tn-prose > * + * { margin-top: 22px; }

.tn .tn-home-reviews__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 3); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: -4px; padding: 4px; }
.tn-home-reviews__track::-webkit-scrollbar { display: none; }
.tn-home-reviews__track > li { display: flex; scroll-snap-align: start; min-width: 0; }
.tn-home-reviews__track .tn-review { flex: 1; }
.tn-review__text { margin: 0; }
.tn-review__who > span:last-child { display: flex; flex-direction: column; }
.tn-avatar { overflow: hidden; }
.tn-avatar img { width: 100%; height: 100%; object-fit: cover; }
.tn-carousel-nav { display: flex; gap: 8px; }
.tn-carousel-nav[hidden], .tn-home-reviews__dots:empty { display: none; }
.tn-home-reviews__dots { justify-content: center; }

.tn-home-brands__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); gap: 12px; }
.tn-home-brands__grid > li { display: flex; }
.tn-make { flex: 1; }
/* Logo boxes centre with flex, not tn.css's grid: an auto grid track grows to the image, so max-width/height
   would not limit it. */
.tn-logo-slot, .tn-filters .wpc-term-image-wrapper { display: flex; align-items: center; justify-content: center; }
.tn-logo-slot img, .tn-filters .wpc-term-image-wrapper img { display: block; min-width: 0; min-height: 0; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.tn-make__text { min-width: 0; max-width: 100%; }

/* ---------- Catalogue ---------- */
.tn-cat__in { display: flex; flex-direction: column; gap: 28px; }
.tn-cat__head { display: flex; flex-direction: column; gap: 18px; }
.tn-cat__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; }
.tn-cat__title .tn-vin { font-size: 14px; }
.tn-cat__desc { max-width: 760px; }
.tn-cat__layout { display: flex; gap: 32px; align-items: flex-start; }
.tn-cat__filters { flex: 0 0 320px; min-width: 0; }
.tn-cat__results { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.tn-cat__tools { display: flex; flex-wrap: wrap; gap: 12px; }
.tn-cat__search { flex: 1 1 320px; margin: 0; }
.tn-cat__search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.tn-cat__sort { flex: 0 1 260px; margin: 0; }
.tn-cat__filters-btn { display: none; }
.tn-cat__filters-n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; background: var(--brand-500); color: var(--ink-900); font: 700 12px/1 var(--font-body); }
.tn-cat__pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-top: 12px; }
.tn-pager__m { display: none !important; }
.tn-pager > .tn-pager-note { min-width: 150px; }
.tn-empty__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; padding-top: 8px; }
.tn-empty .tn-h3 { font-size: 26px; line-height: 32px; }
.tn-empty .tn-text { max-width: 520px; }
.tn-empty__call { display: inline-flex; gap: 8px; align-items: center; }
.tn-cat__help { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-top: 28px; padding: 28px 32px; background: var(--brand-50); }
.tn-cat__help-text { display: flex; align-items: center; gap: 18px; }
.tn-cat__help .tn-iconbox { background: var(--surface); }
.tn-cat__help .tn-h4 { font-size: 19px; }
.tn-cat__help .tn-small { color: var(--ink-700); }
.tn-filters-m__head, .tn-filters-m__foot { display: none; }

/* Selected-filter chips ([fe_chips]). */
.tn-cat__chips .wpc-filter-chips-list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; padding: 0; list-style: none; }
.tn-cat__chips .wpc-filter-chips-list.wpc-empty-chips-container { display: none; }
/* !important where Filter Everything's own chip styles (rounded, bordered) are more specific. */
.tn-cat__chips .wpc-filter-chip { margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; }
.tn-cat__chips .wpc-filter-chip > a, .tn-cat__chips .wpc-filter-chip > span { box-sizing: border-box; display: inline-flex; align-items: center; height: var(--control-h-s); padding: 0 8px 0 14px !important; background: var(--surface) !important; box-shadow: inset 0 0 0 1px var(--line-200); font: 600 14px/20px var(--font-body) !important; color: var(--ink-900) !important; white-space: nowrap; cursor: pointer; text-decoration: none !important; border: 0 !important; border-radius: 0 !important; }
.tn-cat__chips .wpc-filter-chip-name { display: inline; }
.tn-cat__chips .wpc-filter-chip > a:hover { box-shadow: inset 0 0 0 1px var(--line-400); }
.tn-cat__chips .wpc-chip-content { display: inline-flex; align-items: center; gap: 6px; }
.tn-cat__chips .wpc-chip-remove-icon { display: grid !important; place-items: center; width: 26px; height: 26px; margin: 0 !important; background: var(--surface-2); color: transparent !important; font-size: 0 !important; position: relative; border-radius: 0 !important; }
.tn-cat__chips .wpc-chip-remove-icon::before { content: ""; width: 14px; height: 14px; background: var(--ink-700); -webkit-mask: var(--x) center / contain no-repeat; mask: var(--x) center / contain no-repeat;
  --x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
.tn-cat__chips .wpc-filter-chip > a:hover .wpc-chip-remove-icon { background: var(--brand-500); }
.tn-cat__chips .wpc-filter-chip > a:hover .wpc-chip-remove-icon::before { background: var(--on-brand); }
.tn-cat__chips .wpc-chip-reset-all > a { padding: 0 14px !important; box-shadow: none; background: transparent !important; color: var(--brand-700) !important; }
.tn-cat__chips .wpc-chip-reset-all > a:hover { box-shadow: none; color: var(--ink-900); }
.tn-cat__chips .wpc-chip-reset-all .wpc-chip-remove-icon { display: none; }

/* Filter Everything widget → the design's filter panel (.tn-filters / .tn-fgroup / .tn-check / .tn-range). */
.tn-filters .widget { margin: 0; }
.tn-filters .widget-title.wpc-filter-title, .tn-filters .wpc-filter-title { margin: 0; }
.tn-filters .wpc-filters-open-button-container, .tn-filters .wpc-widget-close-container, .tn-filters .wpc-filters-widget-top-container,
.tn-filters .wpc-filter-set-widget-title, .tn-filters .wpc-posts-found, .tn-filters .wpc-filter-layout-search-field, .tn-filters .wpc-spinner,
.tn-filters .wpc-filters-range-column .wpc-range-clear, .tn-filters .wpc-term-count-brackets-open, .tn-filters .wpc-term-count-brackets-close { display: none !important; }
.tn-filters .wpc-filters-main-wrap, .tn-filters .wpc-filters-widget-content, .tn-filters .wpc-filters-scroll-container, .tn-filters .wpc-filters-widget-wrapper { display: block; margin: 0; padding: 0; max-height: none; overflow: visible; background: none; box-shadow: none; position: static; }
.tn-filters .wpc-filters-section { margin: 0; border-bottom: 1px solid var(--line-200); }
.tn-filters .wpc-filters-section:last-child { border-bottom: 0; }
.tn-filters .wpc-filter-header { margin: 0; }
.tn-filters .wpc-filter-title { display: flex; align-items: center; min-height: 56px; font: 600 15px/20px var(--font-display); color: var(--ink-900); }
.tn-filters .wpc-filter-title button { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 56px; cursor: pointer; }
.tn-filters .wpc-filter-title button:hover { color: var(--brand-700); }
.tn-filters .wpc-filter-title button:focus-visible { box-shadow: var(--focus-ring); }
.tn-filters .wpc-wrap-icons { flex: 1; }
.tn-filters .wpc-open-icon, .tn-filters .wpc-filter-collapsible .wpc-filter-title .wpc-open-icon { position: static !important; flex: none; width: 20px !important; min-width: 20px !important; height: 20px !important; border: 0 !important; background: var(--ink-500); transform: none !important; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; transition: transform .2s;
  --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.tn-filters .wpc-filter-collapsible.wpc-opened .wpc-filter-title .wpc-open-icon, .tn-filters .wpc-filter-has-selected:not(.wpc-closed) .wpc-filter-title .wpc-open-icon { transform: rotate(180deg) !important; }
.tn-filters .wpc-filter-content { padding: 0 0 18px; }
.tn-filters .wpc-filter-collapsible.wpc-closed .wpc-filter-content, .tn-filters .wpc-filter-collapsible:not(.wpc-opened):not(.wpc-filter-has-selected) .wpc-filter-content { display: none; }
.tn-filters ul.wpc-filters-ul-list, .tn-filters ul.children { list-style: none; margin: 0; padding: 0; }
.tn-filters ul.children { padding-left: 32px; margin: -2px 0 4px; }
.tn-filters li.wpc-term-item { position: relative; margin: 0; padding: 0; }
.tn-filters .wpc-term-item-content-wrapper { display: flex; align-items: center; gap: 12px; min-height: 40px; position: relative; }
/* Filter Everything reserves right padding for its absolutely placed +/− toggle; here the toggle sits in the row. */
body .wpc-filters-main-wrap .wpc-filter-has-hierarchy .wpc-term-item-content-wrapper { padding-right: 0!important; }
.tn-filters .wpc-term-item-content-wrapper > input[type="checkbox"], .tn-filters .wpc-term-item-content-wrapper > input[type="radio"] { appearance: none; -webkit-appearance: none; position: static; flex: none; display: grid; place-items: center; width: 20px; height: 20px; margin: 0; background: var(--surface); border: 1px solid var(--line-400); border-radius: 0; cursor: pointer; opacity: 1; }
.tn-filters .wpc-term-item-content-wrapper > input::before { content: ""; width: 14px; height: 14px; background: var(--on-brand); transform: scale(0); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
  --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E"); }
.tn-filters .wpc-term-item-content-wrapper > input:checked { background: var(--brand-500); border-color: var(--brand-500); }
.tn-filters .wpc-term-item-content-wrapper > input:checked::before { transform: scale(1); }
.tn-filters .wpc-term-item-content-wrapper:hover > input { border-color: var(--ink-900); }
.tn-filters .wpc-term-item-content-wrapper > input:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.tn-filters .wpc-term-item-content-wrapper > label { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; margin: 0; padding: 0; cursor: pointer; font: 500 15px/22px var(--font-body); color: var(--ink-900); }
.tn-filters .wpc-filter-link { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; }
.tn-filters .wpc-term-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tn-filters .wpc-filter-has-brands .wpc-term-image-wrapper, .tn-filters .wpc-term-image-wrapper { flex: none; width: 32px !important; min-width: 32px; max-width: 32px; border: 0 !important; border-radius: 0 !important; margin: 0 !important; height: 32px; padding: 3px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--line-200); }
.tn-filters .wpc-term-image-wrapper img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.tn-filters .wpc-term-count { flex: none; width: auto !important; min-width: 28px; padding: 0 8px; margin: 0; opacity: 1; background: var(--surface-2); font: 600 12px/22px var(--font-body); color: var(--ink-500); text-align: center; font-variant-numeric: tabular-nums; }
.tn-filters .wpc-term-selected > .wpc-term-item-content-wrapper .wpc-term-count, .tn-filters input:checked + label .wpc-term-count { background: var(--brand-50); color: var(--brand-700); }
.tn-filters .wpc-term-disabled > .wpc-term-item-content-wrapper > label, .tn-filters .wpc-term-count-0 > .wpc-term-item-content-wrapper > label { color: var(--ink-500); }
.tn-filters i.wpc-toggle-children-list { position: static !important; flex: none; display: grid; place-items: center; width: 32px; height: 32px; margin-right: -6px; color: var(--ink-500); cursor: pointer; font-style: normal; }
.tn-filters i.wpc-toggle-children-list:hover { background: var(--surface-2); color: var(--ink-900); }
.tn-filters i.wpc-toggle-children-list::before, .tn-filters .wpc-checkbox-item.wpc-opened > .wpc-term-item-content-wrapper > i.wpc-toggle-children-list::before, .tn-filters .wpc-checkbox-item.wpc-term-selected:not(.wpc-closed) > .wpc-term-item-content-wrapper > i.wpc-toggle-children-list::before { content: "" !important; display: block !important; position: static !important; width: 16px !important; height: 16px !important; border: 0 !important; transform: none !important; background: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
  --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"); }
.tn-filters i.wpc-toggle-children-list::after { content: none !important; }
.tn-filters .wpc-checkbox-item.wpc-opened > .wpc-term-item-content-wrapper > i.wpc-toggle-children-list::before, .tn-filters .wpc-checkbox-item.wpc-term-selected:not(.wpc-closed) > .wpc-term-item-content-wrapper > i.wpc-toggle-children-list::before { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E"); }
.tn-filters .wpc-see-more-control, .tn-filters .wpc-see-less-control { align-items: center; gap: 6px; min-height: 40px; cursor: pointer; font: 600 14px/40px var(--font-body); color: var(--brand-700); text-decoration: none; }
.tn-filters .wpc-see-more-control::before { content: "+ "; }
.tn-filters .wpc-see-more-control:hover, .tn-filters .wpc-see-less-control:hover { color: var(--ink-900); }
.tn-filters .wpc-filter-search-wrapper { position: relative; display: flex; align-items: center; height: var(--control-h-s); margin: 0 0 8px; background: var(--surface-2); border: 1px solid transparent; }
.tn-filters .wpc-filter-search-wrapper:hover { border-color: var(--line-400); }
.tn-filters .wpc-filter-search-wrapper:focus-within { border-color: var(--brand-500); }
.tn-filters .wpc-filter-search-wrapper .wpc-search-icon { position: absolute; left: 12px; top: 0; bottom: 0; width: 16px; background: var(--ink-500); -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
  --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E"); }
.tn-filters .wpc-filter-search-wrapper .wpc-search-icon * { display: none; }
.tn-filters .wpc-filter-search-field { all: unset; box-sizing: border-box; width: 100%; height: 100%; font: 500 15px/22px var(--font-body); color: var(--ink-900); }
.tn-filters .wpc-filters-widget-content .wpc-filter-search-wrapper .wpc-filter-search-field { padding: 8px 16px 8px 36px !important; }
.tn-filters .wpc-filter-search-field::placeholder { color: var(--ink-500); }
.tn-filters .wpc-filter-search-wrapper button.wpc-search-clear { position: absolute; right: 0; top: 0; width: 36px; height: 100%; border: 0; background: none; color: var(--ink-500); font-size: 20px; cursor: pointer; }
.tn-filters .wpc-filters-range-inputs { display: block; }
.tn-filters .wpc-filter-range-form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.tn-filters .wpc-filters-range-wrapper { display: flex; gap: 8px; }
.tn-filters .wpc-filters-range-column { position: relative; flex: 1 1 0; min-width: 0; display: flex; align-items: center; height: 44px; background: var(--surface); border: 1px solid var(--line-400); }
.tn-filters .wpc-filters-range-column:hover { border-color: var(--ink-700); }
.tn-filters .wpc-filters-range-column:focus-within { border-color: var(--brand-500); }
.tn-filters .wpc-filters-range-column::before { flex: none; padding: 0 6px; font: 500 13px/1 var(--font-body); color: var(--ink-500); }
.tn-filters .wpc-filters-range-min-column::before { content: "від"; }
.tn-filters .wpc-filters-range-max-column::before { content: "до"; }
/* Cancels Filter Everything's "input.wpc-filter-search-field, input[type=number].wpc-filters-range-min/max
   { padding-right: 40px !important }" (room for its clear buttons, which the theme hides on ranges). */
.tn-filters .wpc-filters-range-column input { all: unset; box-sizing: border-box; flex: 1; min-width: 0; width: 100%; height: 100%; padding: 8px 16px !important; font: 500 15px/24px var(--font-body); color: var(--ink-900); font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.tn-filters .wpc-filters-range-column input::-webkit-outer-spin-button, .tn-filters .wpc-filters-range-column input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.tn-filters .wpc-filters-range-slider-wrapper { padding: 11px 11px 12px; }
.tn-filters .ui-slider-horizontal { position: relative; height: 1px; background: var(--line-400); border: 0; border-radius: 0; }
.tn-filters .ui-slider-horizontal .ui-slider-range { top: 0; height: 1px; background: var(--brand-500); }
.tn-filters .ui-slider-horizontal .ui-slider-handle { top: -11px; width: 22px; height: 22px; margin-left: -11px; border: 1px solid var(--brand-500); border-radius: 0; background: var(--surface); box-shadow: 0 1px 3px rgba(35,38,40,.2); cursor: grab; }
.tn-filters .ui-slider-horizontal .ui-slider-handle:hover { background: var(--brand-50); }
.tn-filters .ui-slider-horizontal .ui-slider-handle:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.tn-filters .ui-slider-horizontal .ui-slider-handle.ui-state-active { cursor: grabbing; background: var(--brand-500); }
.tn-filters .wpc-filters-section .wpc-filters-range-values-wrapper p { margin: 0; font: 500 13px/18px var(--font-body); color: var(--ink-500); }
.tn-filters .wpc-ask-to-parent-display, .tn-filters .wpc-no-filter-terms { padding: 8px 0; font: 500 14px/20px var(--font-body); color: var(--ink-500); }

/* ---------- Car page ---------- */
.tn-car__in { display: flex; flex-direction: column; gap: 28px; }
.tn-car__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.tn-car__back { display: none; }
.tn-car__adjacent { display: flex; gap: 8px; }
.tn-car__main { display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; }
.tn-car__gallery { flex: 7 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.tn-car__photo { color: var(--line-400); }
.tn-car__photo > .tn-carart { width: 60%; }
.tn-car__slides { position: absolute; inset: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.tn-car__slides::-webkit-scrollbar { display: none; }
.tn-car__slide { position: relative; flex: 0 0 100%; margin: 0; scroll-snap-align: start; }
.tn-car__slide img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.tn-car__badge { position: absolute; top: 18px; left: 18px; z-index: 1; }
.tn-car__count { top: 18px; right: 18px; bottom: auto; height: 30px; padding: 0 12px; z-index: 1; font-variant-numeric: tabular-nums; }
.tn-car__arrow { position: absolute; top: 50%; margin-top: -24px; z-index: 1; box-shadow: var(--shadow-1), inset 0 0 0 1px var(--line-400); }
.tn-car__arrow--prev { left: 18px; }
.tn-car__arrow--next { right: 18px; }
.tn-gallery-thumbs { grid-template-columns: repeat(auto-fill, minmax(min(120px, 30%), 1fr)); }
.tn-gallery-thumbs .tn-photo { padding: 0; border: 0; cursor: pointer; }
.tn-gallery-thumbs .tn-photo::after { content: ""; position: absolute; inset: 0; z-index: 1; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .15s; }
.tn-gallery-thumbs .tn-photo:hover::after { box-shadow: inset 0 0 0 1px var(--line-400); }
.tn-gallery-thumbs .tn-photo.is-on::after { box-shadow: inset 0 0 0 2px var(--brand-500); }
.tn-car__dots { display: none; justify-content: center; }
.tn-car__panel { flex: 5 1 400px; min-width: 0; display: flex; flex-direction: column; gap: 22px; position: sticky; top: 88px; }
.tn-car__status { display: flex; align-items: center; gap: 10px; min-height: 40px; }
.tn-car__make { width: 40px; height: 40px; padding: 4px; }
.tn-car__name { display: flex; flex-direction: column; gap: 10px; }
.tn-car__name .tn-h1 { font-size: 38px; line-height: 44px; overflow-wrap: anywhere; }
.tn-car__vin { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.tn-car__vin .tn-vin { font-size: 14px; }
.tn-car__actions { display: flex; flex-direction: column; gap: 10px; }
.tn-car__actions-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.tn-car__seller { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; padding: 18px 20px; }
.tn-car__seller .tn-avatar { width: 52px; height: 52px; background: var(--surface); }
.tn-car__seller-who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.tn-car__seller-who .tn-small { display: flex; align-items: center; gap: 6px; }
.tn-car__seller-phone { display: inline-flex; align-items: center; gap: 8px; font: 700 16px/22px var(--font-display); color: var(--ink-900); white-space: nowrap; font-variant-numeric: tabular-nums; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; text-decoration-color: var(--line-400); }
.tn-car__seller-phone .tn-i { display: none; }
.tn-car__seller-phone:hover { color: var(--brand-700); text-decoration-color: var(--brand-500); }
.tn-car__info { display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; padding-top: 40px; }
.tn-car__tabs { flex: 7 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.tn-car__pane { border-top: 0; }
.tn-car__pane .tn-acc__head { display: none; }
.tn-car__pane:not(.is-active) { display: none; }
.tn-car__pane .tn-prose { padding-top: 16px; }
.tn-car__ask { flex: 5 1 400px; min-width: 0; display: flex; flex-direction: column; gap: 16px; padding: 32px; background: var(--brand-50); position: sticky; top: 88px; }
.tn-car__related { display: flex; flex-direction: column; gap: 32px; padding-top: 56px; }
.tn-acc__head .tn-i { color: var(--ink-500); transition: transform .2s; }
.tn-acc__head[aria-expanded="true"] .tn-i { transform: rotate(180deg); }

/* ---------- Consultation page and request form ---------- */
.tn-order__layout { display: flex; flex-wrap: wrap; gap: 56px; align-items: flex-start; }
.tn-order__intro { flex: 1 1 440px; min-width: 0; display: flex; flex-direction: column; gap: 26px; padding-top: 12px; }
.tn-order__card { flex: 1 1 440px; min-width: 0; max-width: 560px; padding: 40px; background: var(--surface); border: 1px solid var(--line-200); box-shadow: var(--shadow-2); }
.tn-order__car { display: flex; gap: 16px; align-items: center; padding: 12px; color: inherit; transition: border-color .15s; }
.tn-order__car:hover { border-color: var(--ink-900); }
.tn-order__car .tn-photo { width: 132px; flex: none; }
.tn-order__car .tn-photo .tn-carart { width: 70%; }
.tn-order__car-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.tn-order__car .tn-price { padding-right: 12px; }
.tn-order__steps { display: flex; flex-direction: column; border-top: 1px solid var(--line-200); }
.tn-order__steps li { display: flex; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line-200); }
.tn-order__steps .tn-step__n { flex: none; width: 40px; height: 40px; font-size: 13px; }
.tn-order__steps .tn-text { color: var(--ink-900); }

.car-order__form { display: flex; flex-direction: column; gap: 22px; margin: 0; }
.car-order__head { display: flex; flex-direction: column; gap: 6px; }
.car-order .req { color: var(--brand-700); }
.car-order__fields { display: flex; flex-direction: column; gap: 22px; }
.car-order--compact .car-order__form, .car-order--compact .car-order__fields { gap: 18px; }
.car-order--inline .car-order__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 12px; }
.car-order__captcha { min-height: 78px; }
.car-order__captcha .g-recaptcha { width: 304px; max-width: 100%; min-height: 78px; }
.car-order__captcha .g-recaptcha.is-error { outline: 1px solid var(--error-600); outline-offset: 2px; }
.car-order__call { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.car-order .tn-input.is-disabled input { color: var(--ink-500); }
.car-order__sent { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.car-order__sent .tn-h2 { font-size: 30px; line-height: 36px; }
.car-order__sent b { color: var(--ink-900); }
.car-order__sent-icon { width: 64px; height: 64px; background: var(--success-50); color: var(--success-600); }
.car-order__sent .tn-hours { width: 100%; padding: 16px 20px; background: var(--surface-2); }
.car-order__sent .tn-lane { width: 100%; }
.car-order__sent-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ---------- Credit page ---------- */
.tn-credit__hero { padding: 28px 0 88px; }
.tn-credit__hero .tn-stack { gap: 32px; }
.tn-credit__hero-in { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr)); gap: 56px; align-items: center; }
.tn-credit__lead { display: flex; flex-direction: column; gap: 24px; }
.tn-credit__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.tn-credit__terms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; }
.tn-credit__terms .tn-panel { display: flex; flex-direction: column; gap: 10px; }
.tn-credit__terms dt { display: flex; align-items: center; gap: 8px; color: var(--ink-700); }
.tn-credit__terms dt .tn-i { color: var(--brand-700); }
.tn-credit__terms dd { font: 600 40px/44px var(--font-display); letter-spacing: -0.02em; color: var(--ink-900); }
.tn-steps { margin: 0; padding: 0; list-style: none; }
.tn-step .tn-h4 { font-size: 19px; }
.tn-step .tn-small { color: var(--ink-700); }
.tn-section .tn-stack--l { gap: 48px; }
.tn-credit__info { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr)); gap: 32px; }
.tn-credit__info .tn-panel { display: flex; flex-direction: column; gap: 20px; padding: 40px; }
.tn-credit__info .tn-h3 { font-size: 28px; line-height: 34px; }
.tn-credit__logos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.tn-credit__logo { display: grid; place-items: center; height: 88px; background: var(--surface); font: 500 12px/16px var(--font-mono); color: var(--ink-500); text-align: center; }
.tn-credit__apply { padding-bottom: 96px; }
.tn-credit__apply-in { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); gap: 48px; align-items: center; padding: 56px; background: var(--brand-50); }
.tn-credit__car { width: 260px; max-width: 100%; color: var(--brand-500); margin-top: 12px; }
.tn-credit__form { padding: 32px; background: var(--surface); box-shadow: var(--shadow-2); }

/* ---------- Contacts page ---------- */
.tn-contacts__layout { display: flex; flex-wrap: wrap; gap: 24px; align-items: stretch; }
.tn-contacts__info { flex: 1 1 400px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.tn-contacts__phones { display: flex; flex-direction: column; gap: 16px; }
.tn-contacts__phone { display: flex; align-items: center; justify-content: space-between; gap: 12px; font: 700 24px/30px var(--font-display); color: var(--ink-900); font-variant-numeric: tabular-nums; }
.tn-contacts__phone:hover { color: var(--brand-700); }
.tn-contacts__messengers { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; padding-top: 4px; }
.tn-contacts__pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 16px; }
.tn-contacts__pair .tn-panel { display: flex; flex-direction: column; gap: 10px; padding: 22px; }
.tn-contacts__pair .tn-hours { font-size: 14px; }
.tn-contacts__pair .tn-link { font-size: 15px; align-self: flex-start; overflow-wrap: anywhere; }
.tn-contacts__address { display: flex; flex-direction: column; gap: 12px; }
.tn-contacts__street { font: 600 20px/28px var(--font-display); color: var(--ink-900); }
.tn-contacts__socials { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 4px 0; }
.tn-contacts__socials .tn-socials { gap: 8px; }
.tn-contacts__map { flex: 1.4 1 520px; min-width: 0; min-height: 620px; }
.tn-contacts__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.tn-contacts__callback { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); gap: 40px; align-items: center; margin-top: 40px; padding: 48px 56px; background: var(--brand-50); }

/* ---------- Blog ---------- */
.tn-blog__head { display: flex; flex-direction: column; gap: 18px; }
.tn-blog__intro { max-width: 640px; }
.tn-blog__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(360px, 100%), 1fr)); gap: 24px; }
.tn-blog__pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.tn-blog__help { margin-top: 16px; }
.tn-post__meta time { font: inherit; }

/* Post page. */
.tn-post-page__in { display: flex; flex-direction: column; gap: 40px; }
.tn-post-page__head { display: flex; flex-direction: column; gap: 20px; max-width: 880px; }
.tn-post-page__head .tn-post__meta { font-size: 14px; }
.tn-post-page__back { display: none; }
.tn-post-page__photo { aspect-ratio: 21 / 9; }
.tn-post-page__body { display: flex; flex-wrap: wrap; gap: 40px 80px; align-items: flex-start; }
.tn-post-page__text { flex: 1 1 560px; max-width: 760px; min-width: 0; }
/* Text from the block editor: images fill the column, lists keep their numbers. */
.tn-article ol { list-style: decimal; }
.tn-article figure img { display: block; width: 100%; height: auto; }
.tn-article .wp-block-image img { aspect-ratio: 16 / 9; object-fit: cover; }
.tn-article blockquote p { margin: 0; }
.tn-article > :first-child { margin-top: 0; }
.tn-post-page__aside { flex: 0 1 340px; min-width: 0; display: flex; flex-direction: column; gap: 16px; position: sticky; top: 88px; }
.tn-post-page__cta { display: flex; flex-direction: column; gap: 14px; padding: 28px; background: var(--brand-50); }
.tn-post-page__cta .tn-iconbox { background: var(--surface); }
.tn-post-page__cta .tn-h4 { font-size: 20px; line-height: 26px; }
.tn-post-page__cta .tn-small { color: var(--ink-700); }
.tn-post-page__aside > .tn-link--more { padding: 4px; }
.tn-post-page__nav { display: flex; flex-direction: column; gap: 20px; padding-top: 40px; border-top: 1px solid var(--line-200); }
.tn-post-page__all { align-self: center; }
.tn-post-page__all:hover .tn-i { transform: translateX(-4px); }
.tn-postnav__title { overflow-wrap: anywhere; }

/* ---------- ≤ 1180 px: tighter desktop header ---------- */
@media (max-width: 1280px) {
  .tn-header .tn-nav { gap: 20px; }
  .tn-header .tn-nav a { font-size: 14px; }
  .tn-stickybar .tn-nav { gap: 16px; }
  .tn-stickybar__phone { display: none; }
}

/* ---------- ≤ 1099 px: phone header and menu ---------- */
@media (max-width: 1099px) {
  .tn-topbar, .tn-header .tn-nav, .tn-header__cta, .tn-stickybar { display: none; }
  .tn-header__m { display: flex; }
  .tn-header .tn-header__in { height: 64px; gap: 8px; }
  .tn-header .tn-logo { gap: 10px; }
  .tn-header .tn-carart { width: 44px; }
  .tn-header .tn-logo__text { font-size: 14px; }
  .tn-header .tn-logo__text small { display: none; }
  .tn-header .tn-logo__img { max-height: 40px; }
  .tn-car__panel, .tn-car__ask, .tn-post-page__aside { top: 24px; }
  html { scroll-padding-top: 16px; }
}

/* ---------- ≤ 899 px: columns stack, filters become a full-screen layer ---------- */
@media (max-width: 899px) {
  .tn-cat__layout { display: block; }
  .tn-cat__tools { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .tn-cat__search { grid-column: 1 / -1; background: var(--surface-2); border-color: transparent; }
  .tn-cat__search:focus-within { border-color: var(--brand-500); }
  .tn-cat__filters-btn { display: inline-flex; }
  .tn-cat__sort { flex: auto; height: var(--control-h); min-width: 0; }
  .tn-cat__sort select { font: 600 15px/20px var(--font-display) !important; line-height: calc(var(--control-h) - 2px) !important; }
  .tn-cat__chips .wpc-filter-chips-list { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -16px; padding: 0 16px; }

  .tn-cat__filters { position: fixed; inset: 0; z-index: 250; display: flex; flex-direction: column; background: var(--surface); visibility: hidden; opacity: 0; transform: translateY(16px); transition: opacity .2s, transform .2s, visibility .2s; }
  body.tn-filters-open { overflow: hidden; }
  body.tn-filters-open .tn-cat__filters { visibility: visible; opacity: 1; transform: none; }
  .tn-filters-m__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 64px; padding: 0 8px 0 16px; border-bottom: 1px solid var(--line-200); flex: none; }
  .tn-filters-m__head .tn-btn--icon { width: 44px; height: 44px; }
  .tn-filters-m__head .tn-h4 { font-size: 19px; }
  .tn-filters-m__head .tn-btn--ghost { color: var(--brand-700); }
  .tn-filters-m__n { color: var(--brand-700); }
  .tn-cat__filters > .tn-filters { flex: 1; overflow-y: auto; overscroll-behavior: contain; border: 0; padding: 0 16px; }
  .tn-filters-m__foot { display: block; flex: none; padding: 12px 16px calc(16px + env(safe-area-inset-bottom)); background: var(--surface); box-shadow: var(--shadow-3); }
  .tn-filters .wpc-term-item-content-wrapper { min-height: 48px; }
  .tn-filters i.wpc-toggle-children-list { width: 44px; height: 44px; }

  .tn-car__panel, .tn-car__ask { position: static; }
  .tn-order__card { max-width: none; }
}

/* ---------- ≤ 767 px: phone ---------- */
@media (max-width: 767px) {
  .tn-container { padding: 0 16px; }
  .tn-section { padding: 56px 0; }
  .tn-page { padding: 16px 0 48px; }
  .tn-stack, .tn-home .tn-stack { gap: 24px; }
  .tn-display { font-size: 36px; line-height: 40px; letter-spacing: -0.02em; }
  .tn-h1 { font-size: 30px; line-height: 36px; letter-spacing: -0.015em; }
  .tn-h2 { font-size: 26px; line-height: 32px; letter-spacing: -0.015em; }
  .tn-lead { font-size: 16px; line-height: 26px; }
  .tn-shead > .tn-text { font: 500 14px/22px var(--font-body); }
  .tn-only-m { display: flex; }
  .tn-crumbs { font-size: 13px; }

  /* Swipe rows instead of grids. */
  .tn-grid--swipe { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 -16px; padding: 4px 16px 16px; }
  .tn-grid--swipe::-webkit-scrollbar { display: none; }
  .tn-grid--swipe > * { flex: 0 0 min(300px, 82vw); scroll-snap-align: start; }
  .tn-grid--cat { grid-template-columns: 1fr; gap: 14px; }

  /* Footer and call bar. */
  .tn-site-footer { padding-top: 40px; }
  .tn-footer__main { gap: 36px; }
  .tn-footer__cta { flex-direction: column; align-items: stretch; gap: 16px; padding: 24px; }
  .tn-footer__cta .tn-h4 { font-size: 18px; }
  .tn-footer__cta-actions { flex-direction: column-reverse; align-items: stretch; }
  .tn-footer__grid { gap: 36px; }
  .tn-footer__nav { order: 4; }
  .tn-footer__nav .tn-flist { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
  .tn-footer__nav .tn-flist a { display: block; padding: 8px 0; }
  .tn-copy { margin-top: 32px; }
  .tn-callbar { display: grid; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .tn-callbar:has(> :only-child) { grid-template-columns: 1fr; }
  body.tn { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  body.tn-no-callbar { padding-bottom: 0; }
  body.tn-no-callbar .tn-callbar, body.tn-menu-open .tn-callbar, body.tn-filters-open .tn-callbar { display: none; }

  /* Home. */
  .tn-hero__in { min-height: 0; padding: 16px 12px 300px; align-items: flex-start; }
  .tn-hero__panel { padding: 22px 18px; gap: 14px; }
  .tn-hero__panel .tn-display { font-size: 30px; line-height: 34px; }
  .tn-hero__panel .tn-lead { font: 500 15px/22px var(--font-body); }
  .tn-hero__actions { flex-direction: column; }
  .tn-hero__actions .tn-btn { width: 100%; height: var(--control-h); font-size: 15px; }
  .tn-hero__phone, .tn-hero__arrows { display: none; }
  .tn-hero__media img { object-position: 50% 100%; }
  .tn-hero__controls { bottom: 12px; }
  .tn-hero__controls .tn-container { justify-content: center; }
  .tn-hero .tn-hero__dot[aria-current="true"] span { width: 28px; }
  .tn-hero .tn-hero__dot span { width: 12px; }

  .tn-home-new .tn-shead-row > .tn-link--more { display: none; }
  .tn-home-trust__in { gap: 24px; }
  .tn .tn-home-trust__list { padding: 4px 20px; }
  .tn-home-trust__list li { grid-template-columns: 1fr; gap: 10px; padding: 20px 0; }
  .tn-home-trust__list .tn-iconbox { width: 44px; height: 44px; }
  .tn-home-trust__list .tn-h4 { font-size: 17px; line-height: 24px; }
  .tn-home-trust__list .tn-text { font: 500 14px/22px var(--font-body); }
  .tn-home-trust__btn .tn-btn { width: 100%; }
  .tn-home-credit__photo { aspect-ratio: 3 / 2; min-height: 0; }
  .tn-home-credit__body { padding: 24px 20px; gap: 16px; }
  .tn-home-credit .tn-prose { font: 500 14px/22px var(--font-body); }
  .tn-home-credit .tn-prose--ticks ul { font-size: 15px; }
  .tn-home-credit__actions { flex-direction: column; }
  .tn-home-credit__actions .tn-btn { width: 100%; }
  .tn-home-reviews .tn-carousel-nav { display: none; }
  .tn .tn-home-reviews__track { grid-auto-columns: min(310px, 82vw); gap: 12px; margin: 0 -16px; padding: 0 16px; }
  .tn-home-reviews .tn-review { padding: 22px; }
  .tn-home-reviews .tn-review__text { font-size: 15px; line-height: 24px; }
  .tn-home-brands__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .tn-home-brands__grid .tn-make { padding: 20px 10px 16px; gap: 10px; }
  .tn-home-brands__grid .tn-logo-slot { width: 96px; height: 56px; }
  [data-brands]:not(.is-all) .tn-home-brands__grid > li:nth-child(n+11) { display: none; }
  .tn-home-brands .tn-shead-row > .tn-link--more { display: none; }

  /* Catalogue. */
  .tn-cat__in { gap: 16px; }
  .tn-cat__head { gap: 10px; }
  .tn-cat__results { gap: 14px; }
  .tn-cat__results > .tn-pager-note:first-of-type { display: none; }
  .tn-cat__pager { justify-content: center; }
  .tn-cat__pager > .tn-pager-note { display: none; }
  .tn-pager .tn-pager__num { display: none; }
  .tn-pager__m { display: grid !important; }
  .tn-cat__help { flex-direction: column; align-items: stretch; gap: 12px; margin-top: 0; padding: 22px 20px; }
  .tn-cat__help .tn-iconbox { display: none; }
  .tn-empty { padding: 40px 20px; }
  .tn-empty .tn-carart { width: 160px; }
  .tn-empty .tn-h3 { font-size: 22px; line-height: 28px; }
  .tn-empty__actions { flex-direction: column-reverse; width: 100%; }
  .tn-empty__actions .tn-btn { width: 100%; }

  /* Car page. */
  .tn-car__in { gap: 20px; }
  .tn-car__crumbs, .tn-car__adjacent { display: none; }
  .tn-car__back { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; font: 500 13px/20px var(--font-body); color: var(--ink-700); }
  .tn-car__main { gap: 20px; }
  .tn-car__gallery { flex-basis: 100%; gap: 10px; }
  .tn-car__badge { top: 12px; left: 12px; }
  .tn-car__count { top: 12px; right: 12px; height: 24px; padding: 0 8px; }
  .tn-car__arrow, .tn-gallery-thumbs { display: none; }
  .tn-car__dots { display: flex; }
  .tn-car__dots span { width: 12px; }
  .tn-car__dots span.on { width: 28px; }
  .tn-car__panel { flex-basis: 100%; gap: 14px; }
  .tn-car__name .tn-h1 { font-size: 30px; line-height: 36px; }
  .tn-car__panel .tn-price--xl { font-size: 32px; line-height: 38px; }
  .tn-car__panel .tn-alert { font-size: 14px; line-height: 20px; }
  .tn-car__panel .tn-keyspecs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tn-car__actions-row { grid-template-columns: 1fr; }
  .tn-car__call { display: none; }
  .tn-car__seller { flex-direction: column; align-items: stretch; padding: 18px; }
  .tn-car__seller-phone { justify-content: center; height: var(--control-h); background: var(--ink-900); color: var(--on-dark); text-decoration: none; font: 600 15px/20px var(--font-display); }
  .tn-car__seller-phone .tn-i { display: inline-block; }
  .tn-car__seller-phone:hover { background: var(--ink-700); color: var(--on-dark); }
  .tn-car__info { padding-top: 8px; gap: 24px; }
  .tn-car__tabs { flex-basis: 100%; gap: 0; }
  .tn-car__tabs .tn-tabs { display: none; }
  .tn-car__pane, .tn-car__pane:not(.is-active) { display: block; border-top: 1px solid var(--line-200); }
  .tn-car__pane:last-child { border-bottom: 1px solid var(--line-200); }
  .tn-car__pane .tn-acc__head { display: flex; }
  .tn-car__pane:not(.is-open) .tn-acc__body { display: none; }
  .tn-car__pane .tn-acc__body { padding-bottom: 12px; }
  .tn-car__pane .tn-specs th, .tn-car__pane .tn-specs td { display: block; width: auto; border: 0; padding: 0; }
  .tn-car__pane .tn-specs tr { display: block; padding: 12px 0; border-bottom: 1px solid var(--line-200); }
  .tn-car__pane .tn-specs tr:last-child { border-bottom: 0; }
  .tn-car__pane .tn-specs th { margin-bottom: 2px; font-size: 13px; line-height: 18px; }
  .tn-car__pane .tn-specs tr.grp th { padding-top: 16px; margin: 0; }
  .tn-car__ask { flex-basis: 100%; padding: 24px 20px; }
  .tn-car__related { gap: 16px; padding-top: 24px; }
  .tn-car__related .tn-eyebrow, .tn-car__related .tn-link--more { display: none; }

  /* Blog: every card the same, the first one too; pager centred with "Сторінка 1 із 2" between the arrows. */
  .tn-blog .tn-stack { gap: 20px; }
  .tn-blog__head { gap: 10px; }
  .tn-blog__head .tn-crumbs { margin-bottom: 10px; }
  .tn-blog .tn-blog__intro { font: 400 16px/26px var(--font-body); }
  .tn-blog__grid { gap: 20px; }
  .tn-post--wide { display: flex; }
  .tn-post--wide .tn-photo { aspect-ratio: 16 / 10; min-height: 0; height: auto; }
  .tn-post .tn-post__body, .tn-post--wide .tn-post__body { padding: 18px 18px 20px; gap: 10px; }
  .tn-post .tn-post__title, .tn-post--wide .tn-post__title { font-size: 19px; line-height: 25px; }
  .tn-post--wide .tn-post__excerpt { font-size: 15px; line-height: 24px; }
  .tn-blog__pager { justify-content: center; padding-top: 8px; }
  .tn-blog__pager > .tn-pager-note { display: none; }
  .tn-blog__help { margin-top: 8px; }

  /* Post page: back link instead of breadcrumbs, photo edge to edge, the consultation box after the text. */
  .tn-post-page__in { gap: 20px; }
  .tn-post-page__head { gap: 14px; }
  .tn-post-page__crumbs { display: none; }
  .tn-post-page__back { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; min-height: 32px; font: 500 13px/20px var(--font-body); color: var(--ink-700); }
  .tn-post-page__head .tn-post__meta { font-size: 13px; }
  .tn-post-page__head .tn-h1 { font-size: 27px; line-height: 33px; }
  .tn-post-page__head .tn-lead { font-size: 16px; line-height: 26px; color: var(--ink-900); }
  .tn-post-page__photo { aspect-ratio: 3 / 2; margin: 0 -16px; }
  .tn-post-page__body { gap: 28px; }
  .tn-post-page__text { flex-basis: 100%; }
  .tn-article { font-size: 16px; line-height: 27px; }
  .tn-article h2 { font-size: 23px; line-height: 30px; margin-top: 34px; }
  .tn-article blockquote { font-size: 18px; line-height: 28px; }
  .tn-post-page__aside { flex-basis: 100%; position: static; }
  .tn-post-page__cta { gap: 12px; padding: 20px 18px; }
  .tn-post-page__cta .tn-iconbox, .tn-post-page__call, .tn-post-page__aside > .tn-link--more { display: none; }
  .tn-post-page__cta .tn-h4 { font-size: 18px; line-height: 24px; }
  .tn-post-page__nav { gap: 14px; padding-top: 28px; margin-top: 12px; }
  .tn-postnav { gap: 10px; }
  .tn-postnav a { gap: 14px; padding: 12px; }
  .tn-postnav .tn-photo { width: 88px; }
  .tn-postnav__title { font-size: 15px; line-height: 21px; }
  .tn-postnav__word, .tn-postnav .is-empty, .tn-post-page__all { display: none; }

  /* Consultation, credit, contacts. */
  .tn-order__layout { gap: 24px; }
  .tn-order__intro { gap: 18px; padding-top: 0; }
  .tn-order__steps { display: none; }
  .tn-order__car .tn-photo { width: 96px; }
  .tn-order__car .tn-price { display: none; }
  .tn-order__card { padding: 24px 20px; box-shadow: var(--shadow-1); }
  .car-order__sent .tn-h2 { font-size: 26px; line-height: 32px; }
  .car-order__sent-actions { flex-direction: column; width: 100%; }
  .car-order__sent-actions .tn-btn { width: 100%; }

  .tn-credit__hero { padding: 16px 0 56px; }
  .tn-credit__hero .tn-stack { gap: 24px; }
  .tn-credit__hero-in { gap: 32px; }
  .tn-credit__lead { gap: 18px; }
  .tn-credit__actions { flex-direction: column; }
  .tn-credit__actions .tn-btn { width: 100%; }
  .tn-credit__terms { gap: 8px; }
  .tn-credit__terms .tn-panel { padding: 18px 16px; gap: 6px; }
  .tn-credit__terms dd { font-size: 26px; line-height: 32px; }
  .tn-steps { grid-template-columns: 1fr; gap: 0; }
  .tn-step { display: grid; grid-template-columns: 48px 1fr; gap: 4px 16px; padding-bottom: 28px; }
  .tn-step .tn-step__n { grid-row: span 2; }
  .tn-step .tn-lane { left: 24px; right: auto; top: 48px; bottom: 0; width: 1px; height: auto; }
  .tn-credit__info { gap: 16px; }
  .tn-credit__info .tn-panel { padding: 24px 20px; }
  .tn-credit__info .tn-h3 { font-size: 22px; line-height: 28px; }
  .tn-credit__logo { height: 72px; }
  .tn-credit__apply { padding-bottom: 56px; }
  .tn-credit__apply-in { gap: 24px; padding: 24px 16px; margin: 0 -16px; }
  .tn-credit__car { display: none; }
  .tn-credit__form { padding: 20px; }

  .tn-contacts__phone { font-size: 20px; line-height: 26px; }
  .tn-contacts__map { flex-basis: 100%; min-height: 320px; }
  .tn-contacts__callback { gap: 20px; margin: 16px -16px 0; padding: 32px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
  .tn-hero__dot[aria-current="true"] span::after { animation: none; transform: none; }
}
