/* =========================================================
   WHEELHOUSE — design tokens
   A single-dealer UK used-car showroom theme.
   Palette takes its cues from British roads: racing green
   trim, tarmac charcoal, and rear-numberplate yellow used
   sparingly as the one accent that always means "price".
   ========================================================= */

:root{
  /* colour */
  --wh-green:        #0B3D2E;
  --wh-green-dark:    #072A20;
  --wh-green-tint:    #E4EDE8;
  --wh-asphalt:       #1C1F1E;
  --wh-asphalt-soft:  #33362F;
  --wh-steel-50:      #F6F5F1;
  --wh-steel-100:     #ECE9E2;
  --wh-steel-200:     #DDD9CE;
  --wh-steel-300:     #B9B3A4;
  --wh-white:         #FFFFFF;
  --wh-plate:         #FFD204;
  --wh-plate-dark:    #E6BC00;
  --wh-alert:         #B23A24;
  --wh-mot:           #1E7A4C;

  /* type */
  --wh-font-display: "Oswald", "Arial Narrow", sans-serif;
  --wh-font-body:    "Libre Franklin", "Segoe UI", sans-serif;
  --wh-font-mono:    "JetBrains Mono", "Courier New", monospace;

  /* scale */
  --wh-radius-sm: 3px;
  --wh-radius-md: 6px;
  --wh-container: 1200px;
  --wh-gutter: clamp(1.25rem, 3vw, 2.5rem);

  --wh-shadow-card: 0 1px 2px rgba(28,31,30,.06), 0 8px 20px -12px rgba(28,31,30,.25);
  --wh-shadow-lift: 0 18px 40px -16px rgba(11,61,46,.35);
}

/* =========================================================
   Reset / base
   ========================================================= */
*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--wh-font-body);
  font-size: 16px;
  line-height: 1.55;
  color: var(--wh-asphalt);
  background: var(--wh-steel-50);
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; cursor:pointer; }
input, select, button{ font-family: inherit; font-size: 1rem; }

h1,h2,h3,h4{
  font-family: var(--wh-font-display);
  text-transform: uppercase;
  letter-spacing: .01em;
  line-height: 1.08;
  margin: 0 0 .5em;
  color: var(--wh-asphalt);
  font-weight: 600;
}
h1{ font-size: clamp(2.1rem, 4vw, 3.4rem); }
h2{ font-size: clamp(1.6rem, 2.6vw, 2.3rem); }
h3{ font-size: 1.25rem; }

/* Elementor compatibility: let Elementor's own typography controls
   fully take over inside anything it builds, instead of fighting the
   theme's uppercase/condensed heading style. */
.elementor h1, .elementor h2, .elementor h3, .elementor h4, .elementor h5, .elementor h6{
  font-family: inherit;
  text-transform: none;
  letter-spacing: normal;
  color: inherit;
}
.elementor-widget-text-editor p, .elementor-widget-text-editor li{ font-family: inherit; }

:focus-visible{
  outline: 3px solid var(--wh-plate);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
}

.wh-container{
  max-width: var(--wh-container);
  margin-inline: auto;
  padding-inline: var(--wh-gutter);
}
.wh-eyebrow{
  font-family: var(--wh-font-mono);
  font-size: .78rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--wh-green);
  display:flex;
  align-items:center;
  gap:.6em;
  margin-bottom: .9em;
}
.wh-eyebrow::before{
  content:"";
  width: 22px; height: 2px;
  background: var(--wh-plate);
  display:inline-block;
}

.wh-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5em;
  font-family: var(--wh-font-display);
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .92rem;
  font-weight: 600;
  padding: .85em 1.5em;
  border-radius: var(--wh-radius-sm);
  border: 2px solid transparent;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.wh-btn:hover{ transform: translateY(-2px); }
.wh-btn--plate{
  background: var(--wh-plate);
  color: var(--wh-asphalt);
  border-color: var(--wh-plate);
}
.wh-btn--plate:hover{ background: var(--wh-plate-dark); }
.wh-btn--outline{
  background: transparent;
  color: var(--wh-steel-50);
  border-color: rgba(246,245,241,.4);
}
.wh-btn--outline:hover{ border-color: var(--wh-plate); color: var(--wh-plate); }
.wh-btn--ghost{
  background: transparent;
  color: var(--wh-green);
  border-color: var(--wh-green);
}
.wh-btn--ghost:hover{ background: var(--wh-green); color:#fff; }
.wh-btn--full{ width:100%; }

/* =========================================================
   Site header
   ========================================================= */
.wh-header{
  background: var(--wh-white);
  border-bottom: 1px solid var(--wh-steel-200);
  position: sticky;
  top:0;
  z-index: 50;
}
.wh-header__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 1.5rem;
  padding-block: 1rem;
}
.wh-logo{
  font-family: var(--wh-font-display);
  font-size: 1.4rem;
  text-transform: uppercase;
  letter-spacing: .02em;
  display:flex;
  align-items:baseline;
  gap:.35em;
}
.wh-logo span{ color: var(--wh-green); }
.wh-logo em{
  font-style:normal;
  background: var(--wh-plate);
  color: var(--wh-asphalt);
  font-size:.55em;
  padding: .15em .4em;
  border-radius: 2px;
  letter-spacing: .06em;
  transform: translateY(-2px);
}
.wh-nav{ display:flex; align-items:center; gap: 1.3rem; flex-wrap:wrap; }
.wh-nav a{
  font-family: var(--wh-font-display);
  font-size: .88rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--wh-asphalt-soft);
  padding-bottom: 3px;
  border-bottom: 2px solid transparent;
}
.wh-nav a:hover, .wh-nav a.is-active{ color: var(--wh-green); border-color: var(--wh-plate); }

/* "Our Stock" dropdown */
.wh-nav__item--dropdown{ position:relative; }
.wh-nav__trigger{
  display:flex; align-items:center; gap:.3em;
  background:none; border:none; padding:0 0 3px;
  font-family: var(--wh-font-display);
  font-size: .88rem;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--wh-asphalt-soft);
  border-bottom: 2px solid transparent;
  cursor:pointer;
}
.wh-nav__trigger:hover{ color: var(--wh-green); }
.wh-nav__caret{ font-size:.75em; transition: transform .15s ease; }
.wh-nav__item--dropdown.is-open .wh-nav__trigger{ color: var(--wh-green); border-color: var(--wh-plate); }
.wh-nav__item--dropdown.is-open .wh-nav__caret{ transform: rotate(180deg); }
.wh-nav__dropdown{
  display:none;
  position:absolute; top:100%; left:0; margin-top:.9rem;
  background:#fff;
  border:1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  box-shadow: var(--wh-shadow-card);
  min-width: 220px;
  padding:.5rem;
  z-index:60;
}
.wh-nav__item--dropdown.is-open .wh-nav__dropdown{ display:block; }
.wh-nav__dropdown a{
  display:block;
  padding:.6em .8em;
  border-bottom:none;
  border-radius: var(--wh-radius-sm);
  font-size:.82rem;
}
.wh-nav__dropdown a:hover{ background: var(--wh-green-tint); color: var(--wh-green); }

.wh-header__cta{ display:flex; align-items:center; gap: .9rem; }
.wh-header__phone{
  font-family: var(--wh-font-mono);
  font-size: .85rem;
  color: var(--wh-asphalt-soft);
}
.wh-menu-toggle{
  display:none;
  background:none; border:none;
  width: 40px; height: 32px;
  flex-direction:column; justify-content:space-between;
}
.wh-menu-toggle span{ height:2px; background: var(--wh-asphalt); display:block; }

/* =========================================================
   Hero / search — "the forecourt"
   Dynamic background: a crossfading slideshow of the newest
   stock (or an uploaded video), dimmed under a green/asphalt
   tint so the headline always stays readable.
   ========================================================= */
.wh-hero{
  position: relative;
  background: var(--wh-green);
  color: var(--wh-steel-50);
  overflow:hidden;
}
.wh-hero__bg{
  position:absolute;
  inset:0;
  z-index:0;
}
.wh-hero__slide{
  position:absolute;
  inset:0;
  background-size: cover;
  background-position: center;
  opacity:0;
  transition: opacity 1.6s ease;
}
.wh-hero__slide.is-active{ opacity:1; }
.wh-hero__video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit: cover;
}
.wh-hero__overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(11,61,46,.06) 0, transparent 140px, transparent),
    linear-gradient(160deg, rgba(11,61,46,.92) 10%, rgba(11,61,46,.8) 45%, rgba(28,31,30,.88) 100%);
}
.wh-hero__overlay::after{
  content:"";
  position:absolute; inset:auto 0 0 0; height: 10px;
  background: repeating-linear-gradient(90deg, var(--wh-plate) 0 46px, transparent 46px 92px);
  opacity:.9;
}
.wh-hero__inner{
  padding-block: clamp(3rem, 7vw, 5.5rem) clamp(3.5rem, 8vw, 6rem);
  position:relative;
  z-index:2;
}
.wh-hero__kicker{
  font-family: var(--wh-font-mono);
  font-size: .8rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--wh-plate);
  margin-bottom: 1rem;
}
.wh-hero h1{ color:#fff; max-width: 16ch; text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.wh-hero__lead{
  max-width: 46ch;
  font-size: 1.08rem;
  color: rgba(246,245,241,.9);
  margin-bottom: 2.2rem;
}
.wh-hero__stats{
  display:flex; gap: 2.4rem; margin-top: 2.6rem; flex-wrap:wrap;
}
.wh-hero__stat b{
  display:block; font-family: var(--wh-font-display);
  font-size: 1.7rem; color: var(--wh-plate);
}
.wh-hero__stat span{ font-size:.82rem; color: rgba(246,245,241,.8); }

@media (prefers-reduced-motion: reduce){
  .wh-hero__slide{ transition: none; }
}

/* search plate */
.wh-search{
  background: var(--wh-steel-50);
  border-radius: var(--wh-radius-md);
  padding: 1.4rem;
  box-shadow: var(--wh-shadow-lift);
  margin-top: -1.5rem;
  position:relative;
  z-index:2;
}
.wh-search form{
  display:grid;
  grid-template-columns: repeat(4, 1fr) auto;
  gap: .9rem;
  align-items:end;
}
.wh-field{ display:flex; flex-direction:column; gap:.35rem; }
.wh-field label{
  font-family: var(--wh-font-mono);
  font-size: .7rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--wh-asphalt-soft);
}
.wh-field select, .wh-field input{
  border: 1.5px solid var(--wh-steel-200);
  background: #fff;
  border-radius: var(--wh-radius-sm);
  padding: .68em .8em;
  color: var(--wh-asphalt);
}
.wh-field select:focus, .wh-field input:focus{ border-color: var(--wh-green); }
.wh-search__submit{
  background: var(--wh-asphalt);
  color: #fff;
  border: none;
  border-radius: var(--wh-radius-sm);
  padding: .78em 1.4em;
  font-family: var(--wh-font-display);
  text-transform: uppercase;
  letter-spacing: .04em;
  white-space:nowrap;
}
.wh-search__submit:hover{ background: var(--wh-green); }

/* =========================================================
   Section shell
   ========================================================= */
.wh-section{ padding-block: clamp(3rem, 6vw, 5rem); }
.wh-section--tint{ background: var(--wh-green-tint); }
.wh-section--dark{ background: var(--wh-asphalt); color: var(--wh-steel-100); }
.wh-section--dark h2{ color:#fff; }
.wh-section__head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem;
  margin-bottom: 2.2rem; flex-wrap:wrap;
}
.wh-section__head p{ color: var(--wh-asphalt-soft); max-width:52ch; }

/* browse-by-category band */
.wh-categories{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}
.wh-category{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:.5rem;
  background:#fff;
  border: 1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  padding: 2rem 1.2rem;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.wh-category:hover{ border-color: var(--wh-green); transform: translateY(-3px); box-shadow: var(--wh-shadow-card); }
.wh-category__icon{ font-size: 2.4rem; }
.wh-category__name{ font-family: var(--wh-font-display); font-size: 1.1rem; text-transform:uppercase; letter-spacing:.02em; }
.wh-category__count{ font-family: var(--wh-font-mono); font-size:.8rem; color: var(--wh-steel-300); }

/* body-type cards — real photos, not icons */
.wh-bodytypes{
  display:grid;
  grid-template-columns: repeat(6,1fr);
  gap: 1rem;
}
.wh-bodytype{
  background:#fff;
  border:1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  overflow:hidden;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
  display:block;
}
.wh-bodytype:hover{ border-color: var(--wh-green); transform: translateY(-3px); box-shadow: var(--wh-shadow-card); }
.wh-bodytype__media{
  aspect-ratio: 4/3;
  background: var(--wh-steel-100);
  overflow:hidden;
}
.wh-bodytype__media img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .3s ease; }
.wh-bodytype:hover .wh-bodytype__media img{ transform: scale(1.05); }
.wh-bodytype__body{ padding: .8rem .9rem 1rem; text-align:center; }
.wh-bodytype__name{ font-family: var(--wh-font-display); font-size:.95rem; text-transform:uppercase; letter-spacing:.02em; }
.wh-bodytype__count{ display:block; font-size:.78rem; color:var(--wh-steel-300); font-family: var(--wh-font-mono); margin-top:.2rem; }

/* =========================================================
   Car card — signature element
   Styled like a logbook summary: plate-yellow price tag,
   monospace spec strip (mileage / gearbox / fuel / MOT).
   ========================================================= */
.wh-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.6rem;
}
.wh-grid > *, .wh-listing-grid > *{ min-width: 0; }
.wh-card{
  background:#fff;
  border-radius: var(--wh-radius-md);
  overflow:hidden;
  box-shadow: var(--wh-shadow-card);
  display:flex; flex-direction:column;
  transition: transform .18s ease, box-shadow .18s ease;
}
.wh-card:hover{ transform: translateY(-4px); box-shadow: 0 22px 40px -18px rgba(28,31,30,.35); }
.wh-card__media{ position:relative; aspect-ratio: 4/3; background: var(--wh-steel-100); overflow:hidden; }
.wh-card__media img{ width:100%; height:100%; object-fit:cover; }
.wh-card__tag{
  position:absolute; top:.7rem; left:.7rem;
  background: var(--wh-asphalt); color:#fff;
  font-family: var(--wh-font-mono); font-size:.68rem; letter-spacing:.06em;
  text-transform:uppercase; padding:.3em .6em; border-radius: 2px;
}
.wh-card__tag--reduced{ background: var(--wh-alert); }
.wh-card__price{
  position:absolute; bottom:.7rem; right:.7rem;
  background: var(--wh-plate);
  font-family: var(--wh-font-display);
  font-weight:700; font-size:1.05rem;
  padding:.35em .7em;
  border-radius: 2px;
  border: 1.5px solid var(--wh-asphalt);
  color: var(--wh-asphalt);
}
.wh-card__price-vat{ font-family: var(--wh-font-mono); font-weight:400; font-size:.62em; margin-left:.25em; opacity:.75; }
.wh-card__body{ padding: 1.1rem 1.2rem 1.3rem; display:flex; flex-direction:column; gap:.6rem; flex:1; min-width:0; }
.wh-card__title{ font-size: 1.05rem; margin:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wh-card__sub{ color: var(--wh-asphalt-soft); font-size:.86rem; margin-top:-.4rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wh-card__specs{
  display:flex; flex-wrap:wrap; gap: .5rem .9rem;
  font-family: var(--wh-font-mono);
  font-size: .76rem;
  color: var(--wh-asphalt-soft);
  border-top: 1px dashed var(--wh-steel-200);
  padding-top: .7rem;
  margin-top: .2rem;
}
.wh-card__specs span{ display:flex; align-items:center; gap:.35em; }
.wh-card__mot{
  display:inline-flex; align-items:center; gap:.4em;
  font-family: var(--wh-font-mono); font-size:.72rem;
  color: var(--wh-mot); margin-top:.2rem;
}
.wh-card__mot::before{ content:"●"; font-size:.6rem; }
.wh-card__foot{
  display:flex; justify-content:flex-end; align-items:center;
  margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--wh-steel-100);
}
.wh-card__link{
  font-family: var(--wh-font-display); font-size:.78rem;
  text-transform:uppercase; letter-spacing:.04em; color: var(--wh-green);
}
.wh-card__link:hover{ color: var(--wh-alert); }

/* =========================================================
   USP band
   ========================================================= */
.wh-usp{ display:grid; grid-template-columns: repeat(4,1fr); gap: 1.6rem; }
.wh-usp--3col{ grid-template-columns: repeat(3,1fr); }
.wh-usp__item{ display:flex; gap: 1rem; align-items:flex-start; }
.wh-usp__num{
  font-family: var(--wh-font-mono);
  font-size:.9rem; color: var(--wh-plate);
  border: 1px solid rgba(255,255,255,.25);
  border-radius:50%;
  width:2.2rem; height:2.2rem;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.wh-usp__item h3{ color:#fff; font-size:1rem; margin-bottom:.3em; }
.wh-usp__item p{ color: var(--wh-steel-300); font-size:.9rem; margin:0; }

/* =========================================================
   Dealers / testimonials
   ========================================================= */
.wh-reviews{ display:grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.wh-review{
  background:#fff; border-radius: var(--wh-radius-md);
  padding: 1.6rem; border: 1px solid var(--wh-steel-200);
}
.wh-review__stars{ color: var(--wh-plate-dark); letter-spacing:.15em; margin-bottom:.6rem; }
.wh-review p{ font-size:.95rem; color: var(--wh-asphalt-soft); }
.wh-review__who{ font-family: var(--wh-font-display); text-transform:uppercase; font-size:.85rem; margin-top:1rem; }

/* =========================================================
   Listings archive (search results)
   ========================================================= */
.wh-listing-head{
  background: var(--wh-white);
  border-bottom: 1px solid var(--wh-steel-200);
  padding-block: 1.6rem;
}
.wh-breadcrumb{
  font-family: var(--wh-font-mono); font-size:.75rem;
  color: var(--wh-steel-300); text-transform:uppercase; margin-bottom:.6rem;
}
.wh-listing-head__row{ display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; flex-wrap:wrap; }
.wh-result-count{ font-family: var(--wh-font-mono); font-size:.85rem; color: var(--wh-asphalt-soft); }
.wh-sort select{
  border:1.5px solid var(--wh-steel-200); border-radius: var(--wh-radius-sm);
  padding: .5em .8em; background:#fff;
}

.wh-listing-layout{
  display:grid;
  grid-template-columns: 280px 1fr;
  gap: 2rem;
  align-items:start;
  padding-block: 2.4rem;
}
.wh-filters{
  background:#fff; border:1px solid var(--wh-steel-200); border-radius: var(--wh-radius-md);
  padding: 1.4rem; position:sticky; top: 6.5rem;
}
.wh-filters h3{ font-size:1rem; margin-bottom:1rem; }
.wh-filter-group{ margin-bottom: 1.4rem; border-bottom:1px dashed var(--wh-steel-200); padding-bottom:1.2rem; }
.wh-filter-group:last-child{ border-bottom:none; }
.wh-filter-group h4{
  font-family: var(--wh-font-mono); text-transform:uppercase; font-size:.75rem;
  letter-spacing:.08em; color: var(--wh-asphalt-soft); margin:0 0 .7rem;
}
.wh-filter-group label{
  display:flex; align-items:center; gap:.55em;
  font-size:.88rem; margin-bottom:.5rem; color: var(--wh-asphalt-soft);
}
.wh-filter-group input[type="checkbox"], .wh-filter-group input[type="radio"]{ accent-color: var(--wh-green); }
.wh-filter-group select, .wh-filter-group input[type="text"], .wh-filter-group input[type="number"]{
  width:100%; border:1.5px solid var(--wh-steel-200); border-radius: var(--wh-radius-sm);
  padding:.55em .7em; margin-bottom:.5rem;
}
.wh-range{ display:flex; gap:.5rem; }
.wh-range input{ min-width:0; width:auto; flex:1 1 0%; }
.wh-filter-group input[type="number"]{ -moz-appearance: textfield; }

.wh-listing-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 1.5rem; }
.wh-pagination{ display:flex; gap:.5rem; justify-content:center; margin-top: 2.5rem; }
.wh-pagination a, .wh-pagination span{
  width: 2.4rem; height:2.4rem; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--wh-steel-200); border-radius: var(--wh-radius-sm);
  font-family: var(--wh-font-mono); font-size:.85rem;
}
.wh-pagination .current{ background: var(--wh-green); color:#fff; border-color: var(--wh-green); }

/* =========================================================
   Single car page
   ========================================================= */
.wh-vehicle{ padding-block: 2.4rem clamp(3rem,6vw,5rem); }
.wh-vehicle__layout{ display:grid; grid-template-columns: 1.7fr 1fr; gap: 2.4rem; align-items:start; }

.wh-gallery__main{
  border-radius: var(--wh-radius-md);
  overflow:hidden;
  aspect-ratio: 4/3;
  background: var(--wh-asphalt);
  display:flex;
  align-items:center;
  justify-content:center;
}
.wh-gallery__main img{
  width:100%;
  height:100%;
  object-fit: contain;
}
.wh-gallery__thumbs{ display:grid; grid-template-columns: repeat(5,1fr); gap:.6rem; margin-top:.6rem; }
.wh-gallery__thumbs img{ aspect-ratio: 4/3; object-fit:cover; border-radius: var(--wh-radius-sm); cursor:pointer; border:2px solid transparent; }
.wh-gallery__thumbs img.is-active{ border-color: var(--wh-plate); }

.wh-vehicle__title-row{ display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-top:1.6rem; flex-wrap:wrap; }
.wh-vehicle__title-row h1{ font-size: clamp(1.6rem,3vw,2.2rem); margin-bottom:.2em; }
.wh-plate-chip{
  font-family: var(--wh-font-mono); background: var(--wh-plate); color:var(--wh-asphalt);
  border: 2px solid var(--wh-asphalt); border-radius: 3px; padding:.2em .6em;
  font-weight:700; letter-spacing:.05em; display:inline-block;
}
.wh-vehicle__price{ font-family: var(--wh-font-display); font-size: 2.1rem; color: var(--wh-green); text-align:right; }
.wh-vehicle__price small{ display:block; font-family: var(--wh-font-body); text-transform:none; font-size:.7rem; color: var(--wh-steel-300); font-weight:400;}

.wh-spec-sheet{
  margin-top: 1.8rem;
  display:grid; grid-template-columns: repeat(4,1fr);
  border: 1px solid var(--wh-steel-200); border-radius: var(--wh-radius-md); overflow:hidden;
  background:#fff;
}
.wh-spec-sheet__cell{ padding: 1rem; border-right:1px dashed var(--wh-steel-200); border-bottom:1px dashed var(--wh-steel-200); }
.wh-spec-sheet__cell:nth-child(4n){ border-right:none; }
.wh-spec-sheet__cell b{ display:block; font-family: var(--wh-font-display); font-size:1rem; }
.wh-spec-sheet__cell span{ font-family: var(--wh-font-mono); font-size:.72rem; text-transform:uppercase; color: var(--wh-steel-300); }

.wh-vehicle__desc{ margin-top: 2.2rem; }
.wh-vehicle__desc h2{ font-size:1.3rem; }
.wh-feature-list{ display:grid; grid-template-columns: repeat(2,1fr); gap:.5rem 1.5rem; margin-top:1rem; }
.wh-feature-list li{ font-size:.92rem; display:flex; align-items:center; gap:.5em; }
.wh-feature-list li::before{ content:"✓"; color: var(--wh-mot); font-weight:700; }

.wh-enquiry{
  background:#fff; border:1px solid var(--wh-steel-200); border-radius: var(--wh-radius-md);
  padding: 1.6rem; position:sticky; top: 6.5rem;
}
.wh-enquiry__dealer{ display:flex; gap:.9rem; align-items:center; margin-bottom:1.2rem; padding-bottom:1.2rem; border-bottom:1px dashed var(--wh-steel-200); }
.wh-enquiry__dealer img{ width:48px; height:48px; border-radius:50%; object-fit:cover; }
.wh-enquiry__dealer strong{ display:block; font-size:.92rem; }
.wh-enquiry__dealer span{ font-size:.78rem; color: var(--wh-steel-300); }
.wh-enquiry form{ display:flex; flex-direction:column; gap:.7rem; }
.wh-enquiry input, .wh-enquiry textarea{
  border:1.5px solid var(--wh-steel-200); border-radius: var(--wh-radius-sm);
  padding:.7em .8em; width:100%;
}
.wh-enquiry__note{ font-size:.74rem; color: var(--wh-steel-300); margin-top:.8rem; }
.wh-enquiry__hours{ font-size:.78rem; color: var(--wh-asphalt-soft); text-align:center; margin:0 0 .8rem; }
.wh-enquiry__badges{ display:flex; gap:.6rem; margin-top:1.2rem; flex-wrap:wrap; }
.wh-badge{
  font-family: var(--wh-font-mono); font-size:.68rem; text-transform:uppercase;
  border:1px solid var(--wh-steel-200); border-radius: 999px; padding:.35em .7em;
  color: var(--wh-asphalt-soft);
}

.wh-similar{ margin-top: 3rem; }

/* =========================================================
   Footer
   ========================================================= */
.wh-footer{ background: var(--wh-asphalt); color: var(--wh-steel-300); padding-block: 3rem 1.6rem; }
.wh-footer__grid{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2rem; margin-bottom: 2.4rem; }
.wh-footer h4{ color:#fff; font-size:.85rem; letter-spacing:.06em; margin-bottom:1rem; }
.wh-footer a{ color: var(--wh-steel-300); font-size:.88rem; display:block; margin-bottom:.55rem; }
.wh-footer a:hover{ color: var(--wh-plate); }
.wh-footer__bottom{
  border-top: 1px solid rgba(246,245,241,.12); padding-top:1.4rem;
  display:flex; justify-content:space-between; font-size:.78rem; color: var(--wh-steel-300); flex-wrap:wrap; gap:.6rem;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 980px){
  .wh-nav, .wh-header__phone{ display:none; }
  .wh-menu-toggle{ display:flex; }
  .wh-search form{ grid-template-columns: 1fr 1fr; }
  .wh-grid, .wh-usp, .wh-reviews{ grid-template-columns: repeat(2,1fr); }
  .wh-bodytypes{ grid-template-columns: repeat(3,1fr); }
  .wh-categories{ grid-template-columns: 1fr; }
  .wh-listing-layout{ grid-template-columns: 1fr; }
  .wh-filters{ position:static; }
  .wh-vehicle__layout{ grid-template-columns: 1fr; }
  .wh-enquiry{ position:static; }
  .wh-footer__grid{ grid-template-columns: 1fr 1fr; }
  .wh-nav{ align-items:stretch; }
  .wh-nav__dropdown{ position:static; box-shadow:none; border:none; margin-top:.3rem; padding-left:.8rem; }
  .wh-nav__trigger{ width:100%; justify-content:space-between; }
}
/* =========================================================
   Homepage — visit/showroom band
   ========================================================= */
.wh-visit-band{
  display:grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 2.5rem;
  align-items:center;
}
.wh-visit-card{
  background: var(--wh-steel-50);
  border: 1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  padding: 1.6rem;
}
.wh-visit-card p{ margin:0; font-size:.92rem; color: var(--wh-asphalt-soft); }

/* =========================================================
   Contact page
   ========================================================= */
.wh-contact-layout{
  display:grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 2.4rem;
  align-items:start;
}
.wh-contact-form form.wh-enquiry{
  background:#fff;
  border: 1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  padding: 1.8rem;
  display:flex; flex-direction:column; gap:.8rem;
}

/* =========================================================
   Warranty page — plan cards
   ========================================================= */
.wh-plans{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.6rem;
  margin-top: 2rem;
}
.wh-plan{
  background:#fff;
  border: 1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  padding: 1.8rem;
}
.wh-plan--featured{ border-color: var(--wh-green); box-shadow: var(--wh-shadow-card); position:relative; }
.wh-plan--featured::before{
  content:"Most popular";
  position:absolute; top:-.8rem; left:1.6rem;
  background: var(--wh-plate);
  color: var(--wh-asphalt);
  font-family: var(--wh-font-mono);
  font-size:.7rem; text-transform:uppercase; letter-spacing:.05em;
  padding:.3em .7em; border-radius: 3px;
}
.wh-plan__head{ margin-bottom: 1.2rem; padding-bottom: 1.2rem; border-bottom: 1px dashed var(--wh-steel-200); }
.wh-plan__head h3{ margin-bottom:.2em; }
.wh-plan__price{ display:block; font-family: var(--wh-font-display); font-size:1.4rem; color: var(--wh-green); }
.wh-plan__head p{ margin:.2em 0 0; font-size:.85rem; color: var(--wh-steel-300); }

/* =========================================================
   About page — hero, odometer stat counters
   ========================================================= */
.wh-about-hero{
  background-size: cover;
  background-position: center;
  padding-block: clamp(3.5rem, 8vw, 6rem);
  color: #fff;
}
.wh-about-hero h1{ color:#fff; max-width: 18ch; }
.wh-about-hero__lead{ max-width: 50ch; font-size: 1.1rem; color: rgba(246,245,241,.88); }

.wh-odometer-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  text-align:center;
}
.wh-odometer__value{
  display:block;
  font-family: var(--wh-font-mono);
  font-size: clamp(2rem, 4vw, 2.8rem);
  font-weight: 500;
  color: var(--wh-plate);
  font-variant-numeric: tabular-nums;
  letter-spacing: -.01em;
}
.wh-odometer__label{
  display:block;
  margin-top: .5rem;
  font-size: .85rem;
  color: var(--wh-steel-300);
  text-transform: uppercase;
  letter-spacing: .04em;
}

/* =========================================================
   Delivery page — process steps, pricing band
   ========================================================= */
.wh-steps{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  margin-top: 2rem;
}
.wh-step{
  background:#fff;
  border: 1px solid var(--wh-steel-200);
  border-radius: var(--wh-radius-md);
  padding: 1.4rem 1.2rem;
}
.wh-step__num{
  display:inline-block;
  font-family: var(--wh-font-mono);
  font-size: .85rem;
  color: var(--wh-green);
  background: var(--wh-green-tint);
  border-radius: 999px;
  padding: .3em .7em;
  margin-bottom: .8rem;
}
.wh-step h3{ font-size: 1rem; margin-bottom: .4rem; }
.wh-step p{ font-size: .88rem; color: var(--wh-asphalt-soft); margin:0; }

.wh-pricing-band{
  display:flex; justify-content:space-between; align-items:center; gap: 2rem; flex-wrap:wrap;
}
.wh-pricing-figures{ display:flex; gap: 1.2rem; }
.wh-pricing-figure{
  background:#fff; border:1px solid var(--wh-steel-200); border-radius: var(--wh-radius-md);
  padding: 1.2rem 1.6rem; text-align:center; min-width: 160px;
}
.wh-pricing-figure span{ display:block; font-family: var(--wh-font-display); font-size: 1.7rem; color: var(--wh-asphalt); }
.wh-pricing-figure small{ font-size: .78rem; color: var(--wh-steel-300); }
.wh-pricing-figure--accent{ border-color: var(--wh-plate); }
.wh-pricing-figure--accent span{ color: var(--wh-green); }

/* =========================================================
   Testimonials page — grid variant with avatar row
   ========================================================= */
.wh-reviews--grid{ grid-template-columns: repeat(3, 1fr); }
.wh-review__who-row{ display:flex; align-items:center; gap:.7rem; margin-top: 1rem; }
.wh-review__avatar{ width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.wh-review__location{ font-size: .78rem; color: var(--wh-steel-300); }

/* =========================================================
   FAQ accordion
   ========================================================= */
.wh-accordion__item{
  border-bottom: 1px solid var(--wh-steel-200);
}
.wh-accordion__heading{ margin:0; }
.wh-accordion__trigger{
  width:100%;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:none; border:none;
  padding: 1.2rem 0;
  text-align:left;
  font-family: var(--wh-font-display);
  font-size: 1.02rem;
  text-transform:none;
  letter-spacing:0;
  color: var(--wh-asphalt);
}
.wh-accordion__trigger:hover{ color: var(--wh-green); }
.wh-accordion__icon{
  font-family: var(--wh-font-mono);
  font-size: 1.3rem;
  color: var(--wh-plate-dark);
  transition: transform .2s ease;
  flex-shrink:0;
}
.wh-accordion__trigger[aria-expanded="true"] .wh-accordion__icon{ transform: rotate(45deg); }
.wh-accordion__panel-inner{
  padding: 0 0 1.3rem;
  color: var(--wh-asphalt-soft);
  font-size: .95rem;
  max-width: 68ch;
}

@media (max-width: 980px){
  .wh-odometer-grid{ grid-template-columns: repeat(2,1fr); }
  .wh-steps{ grid-template-columns: repeat(2,1fr); }
  .wh-reviews--grid{ grid-template-columns: repeat(2,1fr); }
  .wh-visit-band{ grid-template-columns: 1fr; }
}
@media (max-width: 620px){
  .wh-search form{ grid-template-columns: 1fr; }
  .wh-grid, .wh-usp, .wh-reviews, .wh-listing-grid{ grid-template-columns: 1fr; }
  .wh-bodytypes{ grid-template-columns: repeat(2,1fr); }
  .wh-spec-sheet{ grid-template-columns: repeat(2,1fr); }
  .wh-feature-list{ grid-template-columns: 1fr; }
  .wh-footer__grid{ grid-template-columns: 1fr; }
  .wh-vehicle__price{ text-align:left; }
  .wh-odometer-grid, .wh-steps, .wh-reviews--grid{ grid-template-columns: 1fr; }
  .wh-pricing-band{ flex-direction:column; align-items:flex-start; }
  .wh-plans{ grid-template-columns: 1fr; }
}