/* =========================================================================
   The Tyre Group: Track Day layer (loaded after main.css).
   Page: grandstand white (light) / asphalt (dark); cards are white or
   graphite; the hero, nav, specials banner and footer are always asphalt.
   Kerbs (lime / charcoal blocks) only on track edges: hero, specials banner,
   final call to action. Sale = red glowing outline, nothing else is red.
   ========================================================================= */

/* ---------- Base ---------- */
body { background: var(--bg); }
.sec--tint { background: var(--paper-2); }
.is-theming, .is-theming * { transition: background-color .3s ease, color .3s ease, border-color .3s ease !important; }
::selection { background: var(--lime); color: var(--ink); }
:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.kerb { height: 12px; background: var(--kerb); }

/* Headings: condensed capitals; emphasis is the italic, never a second colour. */
.shead { align-items: end; gap: 12px 28px; margin-bottom: clamp(22px, 3vw, 36px); }
.shead__title { font-size: clamp(2.2rem, 1.3rem + 3vw, 3.9rem); line-height: .9; margin: 0; }
.shead__title em, .phead__title span, .cta__title em, .mags__title em { color: inherit !important; font-style: italic; }
.shead__lead { margin: 12px 0 0; color: var(--text-2); max-width: 40em; font-size: 1.05rem; }
.link-arrow { font-family: var(--fd); font-weight: 700; font-size: 1.05rem; letter-spacing: .04em; text-transform: uppercase; color: var(--text); text-decoration: none; border-bottom: 3px solid var(--lime); padding-bottom: 2px; }
.link-arrow:hover { color: var(--green); }
.kicker { display: none; }

/* Buttons: squared, condensed labels. */
.btn { font-family: var(--fd); font-weight: 700; font-size: 1.08rem; letter-spacing: .04em; text-transform: uppercase; border-radius: var(--r-sm); }
.btn--line { border-color: var(--text); color: var(--text); }
.btn--line:hover { background: var(--text); color: var(--bg); }
.btn--dark { background: var(--ink); }

/* ---------- Header ---------- */
.util { background: var(--band); color: #c5c9cf; border: 0; }
.util a { color: #e6e8e3; }
.bar { background: var(--surface); border-bottom: 1px solid var(--line); }
.logo--dark-ui { display: none !important; }
:root[data-theme="dark"] .bar .logo--light-ui, :root[data-theme="dark"] .mnav .logo--light-ui { display: none !important; }
:root[data-theme="dark"] .bar .logo--dark-ui, :root[data-theme="dark"] .mnav .logo--dark-ui { display: block !important; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .bar .logo--light-ui, :root:not([data-theme="light"]) .mnav .logo--light-ui { display: none !important; }
	:root:not([data-theme="light"]) .bar .logo--dark-ui, :root:not([data-theme="light"]) .mnav .logo--dark-ui { display: block !important; }
}
.find__form { border: 2px solid var(--text); border-radius: var(--r-sm); background: var(--surface); }
.find__input { color: var(--text); background: transparent; }
.find__go { font-family: var(--fd); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--ink); color: #fff; border-radius: 0; }
.nav { background: var(--ink); }
.nav__link { font-family: var(--fd); font-weight: 700; font-size: 1.06rem; letter-spacing: .05em; text-transform: uppercase; color: #fff; }
.nav__link:hover, .nav__item.is-open > .nav__link { color: var(--lime); }
.nav__link--hot, .nav__link--hot:hover { background: var(--sale) !important; color: #fff !important; clip-path: none; border-radius: var(--r-sm); }
.nav__pages a { font-family: var(--fd); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.qbtn { border-radius: var(--r-sm); font-family: var(--fd); letter-spacing: .04em; text-transform: uppercase; }
.hbtn strong { font-family: var(--fd); text-transform: uppercase; letter-spacing: .03em; }
.themebtn { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--surface); color: var(--text); flex: none; }
.themebtn:hover { border-color: var(--text); }
.themebtn__sun { display: none; }
:root[data-theme="dark"] .themebtn__sun { display: block; }
:root[data-theme="dark"] .themebtn__moon { display: none; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .themebtn__sun { display: block; }
	:root:not([data-theme="light"]) .themebtn__moon { display: none; }
}
.dd { background: var(--surface); }

/* ---------- Hero: the starting grid ---------- */
.grid-start { position: relative; background: var(--band); color: #fff; overflow: hidden; isolation: isolate; }
.grid-start::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
	radial-gradient(42% 60% at 74% 46%, rgba(152, 202, 62, .14), transparent 70%),
	radial-gradient(1px 1px at 20% 30%, rgba(255, 255, 255, .06), transparent),
	linear-gradient(180deg, #17191d, #0f1013 70%); }
.grid-start::after { content: ""; position: absolute; left: 0; right: 0; bottom: 12px; height: 34%; z-index: -1; background: repeating-linear-gradient(90deg, transparent 0 46px, rgba(255, 255, 255, .05) 46px 48px); -webkit-mask-image: linear-gradient(0deg, #000, transparent); mask-image: linear-gradient(0deg, #000, transparent); }
.grid-start__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(20px, 4vw, 64px); align-items: center; padding-block: clamp(28px, 4vw, 60px) clamp(36px, 5vw, 72px); }
.grid-start__where { margin: 0 0 14px; font-family: var(--fd); font-weight: 600; font-size: .98rem; letter-spacing: .08em; text-transform: uppercase; color: #aeb3ba; }
.grid-start__where span { color: var(--lime); margin: 0 .3em; }
.grid-start__title { color: #fff; font-size: clamp(2.5rem, 1.2rem + 4.2vw, 5.2rem); line-height: .86; margin: 0 0 22px; }
.grid-start__title span { display: block; color: var(--lime); font-style: italic; }
.grid-start__facts { list-style: none; display: grid; gap: 6px; margin-top: 18px; padding: 0; color: #c9cdd3; font-size: .95rem; }
.grid-start__facts li { position: relative; padding-left: 22px; }
.grid-start__facts li::before { content: ""; position: absolute; left: 0; top: .52em; width: 12px; height: 4px; background: var(--lime); transform: skewX(-30deg); }

/* The finder as race-number dials (an empty dial shows its label small, in grey) */
.finder--hero { background: transparent; border: 0; box-shadow: none; border-radius: 0; overflow: visible; }
.finder--hero .finder__tabs { background: transparent; gap: 6px; flex-wrap: wrap; }
.finder--hero .finder__tabs button { flex: 0 0 auto; min-height: 40px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .2); border-radius: var(--r-sm); color: #d8dbe0; font-family: var(--fd); font-weight: 700; font-size: 1rem; letter-spacing: .05em; }
.finder--hero .finder__tabs button[aria-selected="true"] { background: var(--lime); border-color: var(--lime); color: var(--ink); }
.finder--hero .finder__tabs button[aria-selected="true"]::before { display: none; }
.finder--hero .finder__panel { padding: 18px 0 0; }
.finder--hero .ffield__l { color: #9fa4ab; }
.finder--hero [data-size-form] .finder__row { align-items: end; gap: 4px 10px; flex-wrap: wrap; }
.finder--hero [data-size-form] .select select { height: auto; padding: 0 30px 2px 0; background: transparent; border: 0; border-radius: 0; color: #fff; font: italic 800 clamp(2.6rem, 1.4rem + 4vw, 5rem)/1 var(--fd); letter-spacing: .01em; box-shadow: inset 0 -3px 0 var(--lime) !important; }
.finder--hero [data-size-form] .select select option { color: var(--text); background: var(--surface); font: 600 1rem var(--f); }
.finder--hero [data-size-form] .select select:focus-visible { outline: 2px solid var(--lime); outline-offset: 4px; }
.finder--hero [data-size-form] .select .ic { color: var(--lime); right: 2px; }
.finder--hero .finder__sep { color: #5f646c; font: italic 800 clamp(2.2rem, 1.2rem + 3vw, 4rem)/1 var(--fd); padding-bottom: 6px; }
.finder--hero .finder__go { flex: 1 1 100%; margin-top: 14px; min-height: 54px; }
.finder--hero .finder__live, .finder--hero .finder__q { color: #c9cdd3; }
.finder--hero .finder__live.is-hit strong { color: var(--lime); }
.finder--hero .sztoggle { color: var(--lime); }
.finder--hero [data-veh] .select select, .finder--hero .finder__rims a { background: #1d2025; border-color: #343941; color: #fff; }
.finder--hero .szchip { border-color: #3b4048; color: #fff; }
.finder--hero .szchip small { color: #aeb3ba; }
.finder--hero .finder__rims a { border-radius: 50%; }
.finder--hero .dial { background: #1d2025; border-color: #343941; color: #fff; }
.finder--hero .dial:hover { background: var(--lime); color: var(--ink); }
.finder--hero .ffield.has-dial { grid-template-rows: auto 1fr 1fr; }

/* The 3D tyre */
.grid-start__visual { display: grid; justify-items: center; }
.t3d { position: relative; width: min(100%, 560px); aspect-ratio: 1; cursor: grab; touch-action: pan-y; }
.t3d.is-drag { cursor: grabbing; }
.t3d__canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; z-index: 1; }
.t3d__poster { position: absolute; inset: 6%; width: 88%; height: 88%; object-fit: contain; transition: opacity .6s; }
.t3d.is-live .t3d__poster { opacity: 0; }
.t3d__shadow { position: absolute; left: 18%; right: 18%; bottom: 4%; height: 8%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 0, 0, .7), transparent); filter: blur(6px); }
.t3d__hint { margin: -4px 0 0; font-family: var(--fd); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; font-size: .8rem; color: #8f949b; }
.grid-start .decode { margin-top: 14px; width: min(100%, 540px); background: #1b1e23; border-color: #2c3037; }
.grid-start .decode__seg b { font-family: var(--fd); font-style: italic; font-size: 1.5rem; }

/* ---------- Product cards ---------- */
.grid--products { gap: 14px; }
.card { overflow: visible; border-radius: var(--r-lg); background: var(--surface); }
.card:hover { box-shadow: var(--sh-2); border-color: var(--line); transform: translateY(-3px); }
.card__media { background: var(--well); border-radius: var(--r-lg) var(--r-lg) 0 0; overflow: hidden; }
.card__media::before { display: none; }
.card:hover .card__img { transform: rotate(-10deg) scale(1.03); }
.card__logo { position: absolute; z-index: 1; left: 8px; top: 8px; display: grid; place-items: center; height: 30px; padding: 3px 8px; border-radius: var(--r-sm); background: #fff; box-shadow: 0 1px 4px rgba(21, 23, 27, .12); }
.card__logo .blogo { height: 22px; max-width: 96px; }
.card__off { position: absolute; z-index: 1; right: 8px; top: 8px; padding: 2px 10px 3px; border-radius: var(--r-sm); background: var(--sale); color: #fff; font: italic 800 1.3rem/1 var(--fd); letter-spacing: .01em; }
.card__tier { position: absolute; z-index: 1; left: 8px; bottom: 8px; top: auto; padding: 3px 8px; border-radius: var(--r-sm); font: 700 .78rem/1.1 var(--fd); letter-spacing: .1em; text-transform: uppercase; }
.card__tier--budget { background: #fff; color: #1d2026; box-shadow: inset 0 0 0 1px #c5c9c2; }
.card__tier--mid { background: var(--ink); color: #fff; }
.card__tier--premium { background: var(--lime); color: var(--ink); }
.card__cmp { left: auto; right: 8px; bottom: 8px; }
.card__qv { bottom: 44px; }
.card__body { gap: 4px; padding: 12px 14px 14px; }
.card__size span { font: italic 800 1.85rem/1 var(--fd); letter-spacing: .01em; }
.card__size small { font-family: var(--fd); font-weight: 700; font-size: .95rem; }
.card__title { font-size: .98rem; font-weight: 600; min-height: 2.5em; }
.card__title a { color: var(--text); }
.card__chips li { border-radius: var(--r-sm); background: var(--paper-2); }
.card__deal { margin: 4px 0 0; font: 700 .92rem/1.2 var(--fd); letter-spacing: .06em; text-transform: uppercase; color: var(--sale); }
.card__deal--soft { color: var(--text-3); }
:root[data-theme="dark"] .card__deal:not(.card__deal--soft) { color: #ff6b6f; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .card__deal:not(.card__deal--soft) { color: #ff6b6f; } }
.card__add { border: 0; border-radius: var(--r-sm); background: var(--ink); color: #fff; font-family: var(--fd); font-weight: 700; font-size: 1.02rem; letter-spacing: .05em; text-transform: uppercase; }
.card__add:hover { background: var(--lime); color: var(--ink); }
:root[data-theme="dark"] .card__add:not(.is-in) { background: #2e333b; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .card__add:not(.is-in) { background: #2e333b; } }

/* On sale: red outline that glows, so it is seen from across the page. */
.card--sale { border-color: var(--sale); box-shadow: 0 0 0 1px var(--sale); }
.card--sale::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; z-index: -1; box-shadow: 0 0 22px 3px rgba(224, 38, 43, .55); animation: saleglow 2.4s ease-in-out infinite; }
.card--sale:hover { border-color: var(--sale); box-shadow: 0 0 0 1px var(--sale), var(--sh-2); }
.grid--products, .slider__track, .match__picks, .aprods { isolation: isolate; }
@keyframes saleglow { 0%, 100% { opacity: .45; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .card--sale::before { animation: none; opacity: .8; } }

/* ---------- Home: vehicle types as a rail ---------- */
.portals__grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(200px, 22%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 10px; scrollbar-width: thin; }
.portals__grid > li { scroll-snap-align: start; }
.portal { border-radius: var(--r-lg); background: var(--surface); border: 1px solid var(--line); }
.portal:hover { background: var(--ink); border-color: var(--ink); }
.portal__name { font-family: var(--fd); font-size: 1.5rem; line-height: .95; }
.portal__img { background: var(--well); border-radius: var(--r); }
.portal--hot { background: var(--sale); border-color: var(--sale); color: #fff; }
.portal--hot small { color: #fff; }
.portal--hot:hover { background: #c01f24; }
.portal--hot .portal__img { background: transparent; }
.portal__burst { font-family: var(--fd); font-style: italic; color: #fff; background: rgba(0, 0, 0, .12); transform: none; }
@media (max-width: 760px) { .portals__grid { grid-auto-columns: 62%; } }

/* ---------- Home: on special now ---------- */
.hotlaps__clock { font-family: var(--fd); font-weight: 700; letter-spacing: .03em; color: var(--sale); }

/* ---------- Logo wall ---------- */
.logowall__grid { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; padding: 0; }
.lplate { display: grid; justify-items: center; gap: 6px; padding: 14px 10px 10px; border-radius: var(--r-lg); background: #fff; border: 1px solid #dcdfd9; text-decoration: none; transition: transform .25s var(--ease), border-color .25s, box-shadow .25s; }
.lplate:hover { transform: translateY(-3px); border-color: var(--lime-deep); box-shadow: var(--sh-1); }
.lplate__logo { display: grid; place-items: center; height: 48px; width: 100%; }
.blogo--wall { height: 46px; width: auto; max-width: 100%; object-fit: contain; }
.lplate__n { font: 600 .82rem/1 var(--fd); letter-spacing: .08em; text-transform: uppercase; color: #5c6169; }

/* ---------- How a quote works: one lap ---------- */
.lap__track { list-style: none; position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin: 0; padding: 34px 0 0; }
.lap__track::before { content: ""; position: absolute; left: 0; right: 0; top: 16px; height: 4px; background: repeating-linear-gradient(90deg, var(--grey-300) 0 18px, transparent 18px 28px); }
.lap__track::after { content: ""; position: absolute; right: 0; top: 4px; width: 36px; height: 28px; background: conic-gradient(var(--text) 25%, var(--surface) 0 50%, var(--text) 0 75%, var(--surface) 0) 0 0 / 14px 14px; border: 1px solid var(--text); }
.lap__step { position: relative; padding-top: 18px; }
.lap__n { position: absolute; top: -34px; left: 0; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--lime); color: var(--ink); font: italic 800 1.3rem/1 var(--fd); box-shadow: 0 0 0 5px var(--bg); }
.lap__h { font-family: var(--fd); font-weight: 800; font-size: 1.5rem; text-transform: uppercase; margin: 0 0 6px; }
.lap__step p { color: var(--text-2); margin: 0; }
@media (max-width: 860px) {
	.lap__track { grid-template-columns: minmax(0, 1fr); padding: 0 0 0 52px; gap: 26px; }
	.lap__track::before { left: 16px; right: auto; top: 0; bottom: 0; width: 4px; height: auto; background: repeating-linear-gradient(180deg, var(--grey-300) 0 18px, transparent 18px 28px); }
	.lap__track::after { display: none; }
	.lap__step { padding-top: 0; }
	.lap__n { top: -4px; left: -52px; }
}

/* ---------- Matcher, tools, branches, FAQ ---------- */
.match__q fieldset, .tool, .health__card, .calc__set { background: var(--surface); border-color: var(--line); border-radius: var(--r-lg); }
.match__q legend, .tool__name { font-family: var(--fd); font-weight: 800; font-size: 1.3rem; text-transform: uppercase; letter-spacing: .01em; }
.match__n { font-family: var(--fd); font-style: italic; }
.mopt span { border-radius: var(--r-sm); }
.mopt input:checked + span { color: var(--ink); }
.tool::after { border-radius: 0; border: 0; width: 90px; height: 12px; right: 0; top: 0; background: var(--kerb); transform: none; opacity: 0; }
.tool:hover::after { opacity: 1; transform: none; }
.tool__ic { border-radius: var(--r-sm); }
.faq__q, .faq summary { font-family: var(--fd); font-weight: 700; font-size: 1.25rem; text-transform: uppercase; letter-spacing: .01em; }

/* ---------- Call to action and footer ---------- */
.cta { background: var(--band); padding-top: 0; }
.cta .wrap { padding-top: clamp(40px, 5vw, 72px); }
.cta::before { display: none; }
.cta > .kerb { margin-bottom: 0; }
.cta__title { font-size: clamp(2.4rem, 1.4rem + 3.4vw, 4.4rem); }
.cta__title em { color: var(--lime) !important; }
.ftr { background: var(--band); }
.ftr__tread { display: none; }

/* ---------- Specials page ---------- */
.spx { position: relative; background: var(--band); color: #fff; overflow: hidden; }
.spx::before { content: ""; position: absolute; inset: 0; background: radial-gradient(40% 80% at 85% 30%, rgba(224, 38, 43, .22), transparent 70%); pointer-events: none; }
.spx__in { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px 40px; align-items: end; padding-block: clamp(22px, 3vw, 40px) clamp(26px, 3.4vw, 48px); }
.spx .crumbs, .spx .crumbs a { color: #aeb3ba; }
.spx__title { color: #fff; margin: 6px 0 8px; font: italic 800 clamp(3.4rem, 2rem + 6vw, 7.4rem)/.82 var(--fd); text-transform: uppercase; }
.spx__lead { margin: 0; max-width: 42em; color: #d0d4d9; font-size: 1.05rem; }
.spx__clocks { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; }
.spx__clock { display: grid; gap: 2px; min-width: 190px; padding: 12px 16px; border-radius: var(--r-lg); background: #1d2025; border: 1px solid #343941; color: #fff; text-decoration: none; transition: border-color .2s; }
.spx__clock:hover { border-color: var(--lime); color: #fff; }
.spx__clock-k { font: 700 .86rem/1 var(--fd); letter-spacing: .1em; text-transform: uppercase; color: #aeb3ba; }
.spx__clock strong { font: 800 1.5rem/1.1 var(--fd); font-variant-numeric: tabular-nums; }
.spx__clock strong.is-soon { color: #ff6b6f; }
.spx__clock-n { font-size: .82rem; color: var(--lime); }
.facet__list--radio { list-style: none; display: grid; gap: 2px; padding: 0; }
.radio { position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 38px; padding: 4px 8px; border-radius: var(--r-sm); cursor: pointer; }
.radio:hover { background: var(--paper-2); }
.radio input { width: 18px; height: 18px; margin: 0; accent-color: var(--lime-deep); }
.radio span { font-weight: 600; line-height: 1.2; }
.radio small { color: var(--text-3); font-variant-numeric: tabular-nums; }
.facet__ends { display: block; font-style: normal; font-size: .76rem; font-weight: 500; color: var(--sale); }
.facet__list--brands { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 0; }
.tick--brand { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; gap: 4px 6px; padding: 6px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--surface); cursor: pointer; }
.tick--brand:has(input:checked) { border-color: var(--lime-deep); box-shadow: inset 0 0 0 1px var(--lime-deep); }
.tick__logo { display: grid; place-items: center; height: 26px; padding: 2px 4px; border-radius: 3px; background: #fff; }
.tick__logo .blogo { height: 20px; max-width: 100%; }
.tick--brand small { grid-column: 1 / -1; font-size: .74rem; color: var(--text-3); }
.select--sm select { height: 40px; font-size: .92rem; }
.woocommerce-pagination .page-numbers { font-family: var(--fd); font-weight: 700; }
.woocommerce-pagination .page-numbers.current { background: var(--lime); color: var(--ink); }
@media (max-width: 860px) { .spx__in { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Dark mode touch-ups ---------- */
:root[data-theme="dark"] .card__logo, :root[data-theme="dark"] .lplate { box-shadow: none; }
:root[data-theme="dark"] .lplate { border-color: #2d3138; }
:root[data-theme="dark"] .facet, :root[data-theme="dark"] .shop__side { border-color: var(--line); }
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]), :root[data-theme="dark"] textarea, :root[data-theme="dark"] select { background-color: #14161a; color: var(--text); border-color: #3a3f47; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .lplate { border-color: #2d3138; }
	:root:not([data-theme="light"]) input:not([type="checkbox"]):not([type="radio"]), :root:not([data-theme="light"]) textarea, :root:not([data-theme="light"]) select { background-color: #14161a; color: var(--text); border-color: #3a3f47; }
}
.finder--hero [data-size-form] .select select { background-color: transparent !important; }

/* ---------- Phones ---------- */
@media (max-width: 900px) {
	.grid-start__in { grid-template-columns: minmax(0, 1fr); }
	.t3d { width: min(84%, 420px); }
}
@media (max-width: 600px) {
	.grid-start__title { font-size: clamp(2.2rem, 10vw, 3rem); }
	.finder--hero [data-size-form] .select select { font-size: clamp(2.1rem, 11vw, 3rem); padding-right: 22px; }
	.finder--hero .finder__sep { font-size: 2rem; }
	.finder--hero [data-size-form] .finder__row { flex-wrap: nowrap; }
	.finder--hero [data-size-form] .finder__row .ffield { flex: 1 1 0; min-width: 0; }
	.finder--hero [data-size-form] .finder__go { flex: 1 1 100%; }
	.finder--hero [data-size-form] .finder__row { flex-wrap: wrap; }
	.shead__title { font-size: clamp(2rem, 9vw, 2.6rem); }
}

.finder--hero [data-size-form] .select select:invalid { font: 700 clamp(1.1rem, .9rem + .8vw, 1.5rem)/1 var(--fd); letter-spacing: .06em; text-transform: uppercase; color: #8f949b; padding-block: 16px 10px; }

/* Brand logos in menus: white plates, so they read in both modes. */
.mnav__grand--brands { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.mnav__brand { display: grid !important; place-items: center; height: 56px; border-radius: var(--r); background: #fff; border: 1px solid #dcdfd9; }
.mnav__brand .blogo { height: 26px; max-width: 80%; }
.btile__logo { background: #fff; border-radius: var(--r-sm); }

/* Small phones: the dock already has Call, so the header keeps logo, theme, quote and menu on one row. */
@media (max-width: 480px) { .bar .hbtn { display: none; } .themebtn { width: 40px; height: 40px; } }

/* ---------- Audit fixes ---------- */
/* Sale red as small text needs a deeper red on light grounds (#b81c21: 5.3:1 or better); dark mode keeps the light red. */
:root { --sale-text: #b81c21; }
:root[data-theme="dark"] { --sale-text: #ff6b6f; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --sale-text: #ff6b6f; } }
.hotlaps__clock, .facet__ends, .card__deal:not(.card__deal--soft) { color: var(--sale-text) !important; }
.card--ask { background: var(--ink); color: #fff; border-color: var(--ink); }
.card--ask strong { color: #fff; }
.card--ask span { color: #d0d4d9; }
.svcl__n { color: var(--text-3); }
.readsize__plate { flex-wrap: wrap; max-width: 100%; font-family: var(--fd); font-style: italic; }
@media (max-width: 360px) { .readsize__plate { font-size: 1.6rem; padding: 10px 12px; } }
/* Tablets: the header keeps every action on one row (icon-only call and quote buttons). */
@media (max-width: 1000px) {
	.hbtn__txt, .qbtn__txt { display: none; }
	.bar__acts { gap: 6px; flex-wrap: nowrap; }
}
/* Brands without a logo file fall back to a wordmark: logo plates are always white, so it is always charcoal. */
.tick__logo .bword, .card__logo .bword, .lplate .bword, .mnav__brand .bword, .btile__logo .bword { color: #1d2026; font-family: var(--fd); }
@media (max-width: 480px) { .card__add { white-space: normal; line-height: 1.1; letter-spacing: .02em; padding-block: 6px; } }