.v-lazy-image {
  filter: blur(10px);
  transition: filter 0.7s;
}
.v-lazy-image-loaded {
  filter: blur(0);
}
/* Grade picker in the hero panel. Sits over the panel's own colour, so the
   type is light and the chrome is kept to hairlines. */
.nav-build {
  padding: 0 28px 22px 0;
  text-align: right;
  max-width: 320px;
}
.nav-build__label {
  font-family: "TT Commons Pro Regular", Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6d6d6d;
  margin-bottom: 8px;
}
.nav-build__grades {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
}
.nav-build__grade {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  width: 100%;
  padding: 6px 0;
  background: none;
  border: 0;
  border-bottom: 1px solid #cbcbcb;
  color: #121212;
  cursor: pointer;
  font-family: "TT Commons Pro DemiBold", Arial, sans-serif;
  font-size: 13px;
  text-transform: uppercase;
  text-align: left;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}
.nav-build__grade:hover,
.nav-build__grade:focus-visible {
  opacity: 1;
}

/* The picked grade is the one that rides into the builder, so it is marked
   plainly rather than by a hover-ish tint. */
.nav-build__grade.is-picked {
  opacity: 1;
  border-bottom-color: currentColor;
}
.nav-build__grade-price {
  font-family: "TT Commons Pro Regular", Arial, sans-serif;
  white-space: nowrap;
}
.nav-build__disclaimer {
  font-family: "TT Commons Pro Regular", Arial, sans-serif;
  font-size: 11px;
  color: #6d6d6d;
  margin-bottom: 12px;
}
.nav-build__cta {
  display: inline-block;
  border: 1px solid #121212;
  color: #121212;
  padding: 9px 22px;
  font-family: "Loos Extd Bd", "SuzukiSlider", Arial, sans-serif;
  font-size: 13px;
  letter-spacing: 0.23px;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.nav-build__cta:hover {
  background: #121212;
  color: #fff;
  text-decoration: none;
}
@media (max-width: 1200px) {
.nav-build {
    display: none;
}
}

/* ---------------------------------------------------------------------------
   Vehicle menu, on suzuki.com.au's own values.

   The layout stays the dealer's: this menu carries destinations the OEM has no
   equivalent for — stock search, used cars, sell your car, fleet — and Suzuki's
   own vehicle menu is a plain strip with nowhere to put them. What is adopted
   is their visual language: the type, the row rhythm, the thumbnail size, and
   the current-item underline in place of a colour fill.
   --------------------------------------------------------------------------- */
.vehicle-item {
  border-bottom: 1px solid #cbcbcb;
  position: relative;
}

/*
  Suzuki marks the current item with a 2px rule along the bottom rather than by
  filling the row. The fill this replaced used each model's `bg` colour, which
  meant the row's contrast changed model to model — legible on the dark blues,
  much less so on the paler ones — and it is not a treatment the OEM uses
  anywhere.
*/
.vehicle-item.is-current:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-color: #001d31;
}
.vehicle-name {
  /* Same face as the Buying Tools sidebar (.buy-sidebar a) so the two columns
     read as one menu, and sized up from 14px for legibility. */
  font-family: "TTCommons_Regular", Helvetica, Arial, sans-serif;
  font-size: 1.125rem;
  font-weight: 400;
  text-transform: uppercase;
  text-align: left;
  color: #121212;
  margin-right: 2rem;
  padding-right: 1.5rem;
}
.vehicle-name.no-caps {
  text-transform: none;
}

/* 124.35 x 53 is the OEM's own thumbnail box; `contain` keeps the profile
   renders from being cropped to fill it. */
.vehicle-thumbnail {
  width: 124.35px;
  height: 53px;
  -o-object-fit: contain;
     object-fit: contain;
}
.b-r-t{
  border-right: 1px solid #ebebeb;
}
.vehicle-item{
cursor: pointer;
}
.mega-grid-mnu {
  background-color: #f1f1f1;
}

/*
  The dealer's wordmarks are a mix — white for Swift, Jimny, Ignis, S-Cross;
  black for Fronx and Vitara — because they were drawn for the dark fills this
  panel used to have. Flattening to black normalises the set against the light
  ground; without it half the range would show nothing at all here.
*/
.mega-grid-mnu .mnu-logo {
  filter: brightness(0);
}
.mnu-action {
  font-family: "TT Commons Pro DemiBold", "TTCommons_DemiBold", Arial, sans-serif;
  font-size: 1rem;
  letter-spacing: 0.04em;
  color: #121212;
}
.mnu-action:hover,
.mnu-action:focus {
  color: #00368f;
}
.mnu-caption {
  font-family: "TT Commons Pro Regular", "TTCommons_Regular", Arial, sans-serif;
  color: #6d6d6d;
}

/* The diagonal wash existed to even out the per-model fills underneath it.
   With one flat black ground there is nothing left for it to reconcile, and it
   only muddied the car. */
.mega-grid-mnu:before {
  content: none;
}