:root {
  --topic-dark:#1a1d22;
  --topic-paper:#e9eaee;
  --topic-muted:#747980;
}

.products-page { overflow-x:hidden; background:var(--topic-paper); }

@media (min-width:992px) {
  .products-page main .wrap {
    width:calc(100vw - var(--gutter) * 2);
    margin-right:0;
    margin-left:var(--gutter);
  }
}

/* 1920 × 1080 topic banner */
.topic-hero {
  position:relative;
  min-height:max(720px,56.25vw);
  overflow:hidden;
  color:#fff;
  background:#050607;
}
.topic-hero-media,
.topic-hero-media img,
.topic-hero-media video,
.topic-hero-overlay,
.topic-grid-lines {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.topic-hero-media img,
.topic-hero-media video { object-fit:cover; }
.topic-hero-media [data-topic-hero-slide] { opacity:0; transition:opacity .8s ease; }
.topic-hero-media [data-topic-hero-slide].is-active { opacity:1; }
.topic-hero-media video {
  opacity:0;
  transition:opacity .8s ease;
}
.topic-hero-media video.is-active { opacity:1; }
.topic-hero-media.is-video-fallback video { display:none; }
.topic-hero-wheels .topic-hero-overlay { background:rgb(0 0 0 / 60%); }
.topic-hero-suspension .topic-hero-overlay { background:linear-gradient(90deg,#000c 0%,#0006 50%,#0003 100%); }
.topic-grid-lines {
  z-index:1;
  background:none;
  pointer-events:none;
}
.topic-hero-content {
  position:relative;
  z-index:2;
  min-height:inherit;
  padding-top:clamp(248px,19.322917vw,371px);
}
.topic-hero-rule {
  width:clamp(48px,3.75vw,72px);
  height:6px;
  display:block;
  background:var(--red);
}
.topic-hero h1 {
  max-width:1100px;
  margin-top:clamp(38px,2.916667vw,56px);
  font-size:clamp(58px,4.479167vw,86px);
  font-weight:700;
  line-height:1.0698;
  letter-spacing:-.045em;
  text-transform:uppercase;
}
.topic-hero h1 em,
.topic-section-heading h2 em,
.topic-feature-copy h2 em,
.journey-heading h2 em,
.production-heading h2 em {
  display:block;
  color:var(--red);
  font-style:italic;
}
.topic-hero-description {
  max-width:710px;
  margin-top:clamp(24px,1.354167vw,26px);
  color:#e0e1e3;
  font:italic clamp(13px,.833333vw,16px)/1.25 Arial,sans-serif;
}
.topic-hero-wheels .topic-hero-description { max-width:681px; }
.topic-hero .button {
  width:242px;
  margin-top:clamp(48px,3.90625vw,75px);
  padding-inline:0;
  gap:15px;
  border-left-width:8px;
  white-space:nowrap;
}
.products-page main .button-dark { background:#38383a; }
.topic-hero-index {
  position:absolute;
  z-index:2;
  right:clamp(40px,4.270833vw,82px);
  bottom:clamp(38px,3.020833vw,58px);
  color:#fff;
  font-size:30px;
  font-weight:800;
}
.topic-hero-index small { color:#b0b3b8; font-size:12px; font-weight:600; }
.topic-motion-toggle {
  position:absolute;
  z-index:3;
  right:clamp(125px,9vw,175px);
  bottom:clamp(38px,3.020833vw,58px);
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:0;
  color:#fff;
  border:1px solid #ffffff45;
  background:#090a0c80
}
.topic-motion-toggle svg {
  grid-area:1/1;
  width:14px;
  height:14px
}
.topic-motion-toggle .motion-play,
.topic-motion-toggle[aria-pressed="true"] .motion-pause { display:none; }
.topic-motion-toggle[aria-pressed="true"] .motion-play { display:block; }
.topic-motion-toggle:disabled { opacity:.65; cursor:default; }
.topic-scroll-cue {
  position:absolute;
  z-index:2;
  left:clamp(40px,4.114583vw,79px);
  bottom:clamp(38px,3.072917vw,59px);
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:var(--red);
  border:1px solid #ffffff30;
}
.topic-scroll-cue svg { width:12px; height:12px; fill:none; stroke:currentColor; transform:rotate(180deg); }

/* Suspension vehicle finder: 1920 × 200 */
.suspension-finder {
  min-height:max(160px,10.416667vw);
  padding:clamp(28px,2.5vw,48px) 0 clamp(29px,2.552083vw,49px);
  color:#fff;
  background:#0b0b0d;
}
.suspension-finder-form {
  height:103px;
  display:grid;
  grid-template-columns:600fr 320fr 320fr 320fr 200fr;
  background:#34383e;
}
.suspension-finder-field {
  position:relative;
  min-width:0;
  background:#272a2f;
  border-right:1px solid #41454b;
}
.suspension-finder-field span {
  position:absolute;
  top:16px;
  left:30px;
  color:#e7e8e9;
  font-size:10px;
  font-weight:700;
  line-height:14px;
}
.suspension-finder input,
.suspension-finder select {
  position:absolute;
  top:45px;
  right:27px;
  left:28px;
  width:auto;
  height:34px;
  margin:0;
  padding:0 12px;
  color:#c9ccd1;
  background:#22252a;
  border:1px solid #555960;
  border-radius:0;
  outline:0;
  box-shadow:none;
  font:12px/1.2 Arial,sans-serif;
}
.suspension-finder-search input { top:38px; height:44px; padding-right:46px; }
.suspension-finder-search>svg {
  position:absolute;
  top:51px;
  right:49px;
  width:19px;
  height:19px;
  color:#b5b9bf;
}
.suspension-finder-actions { display:grid; grid-template-rows:56px 47px; background:#272a2f; }
.suspension-finder-actions button,
.suspension-finder-actions a {
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
}
.suspension-finder-actions button { background:var(--red); }
.suspension-finder-actions button:hover,
.suspension-finder-actions button:focus-visible { background:#be0803; }
.suspension-finder-actions a { color:#c4c7cc; background:#272a2f; }

/* Category panels */
.topic-categories { position:relative; overflow:hidden; background:var(--topic-paper); }
.topic-categories>.wrap { position:relative; min-height:inherit; }
.topic-category-watermark {
  position:absolute;
  z-index:0;
  top:-8.802083vw;
  left:calc(var(--gutter) * -1 + 1.25vw);
  width:97.5vw;
  max-width:1872px;
  height:auto;
  filter:grayscale(1);
  opacity:.024;
  pointer-events:none;
}
.topic-kicker {
  display:flex;
  align-items:center;
  gap:18px;
  color:#24272b;
  font:700 clamp(10px,.729167vw,14px)/1.2 Arial,sans-serif;
  text-transform:uppercase;
}
.topic-kicker::before { width:42px; height:4px; flex:0 0 auto; content:""; background:var(--red); }

/* Wheels category carousel: 1920 × 1080 */
.wheels-categories {
  --wheel-card-size:clamp(420px,35.520833vw,682px);
  --wheel-carousel-size:clamp(646px,54.6875vw,1050px);
  min-height:0;
}
.wheel-section-index {
  position:absolute;
  z-index:2;
  top:clamp(62px,5vw,96px);
  left:0;
  color:#73787f;
  font:12px/1 Arial,sans-serif;
}
.wheel-section-index strong { color:var(--red); font:700 30px/1 Jakarta,Arial,sans-serif; }
.wheel-feature {
  display:grid;
  grid-template-columns:minmax(0,539fr) minmax(0,682fr) minmax(0,539fr);
  align-items:center;
  padding:clamp(105px,7.1875vw,138px) 0;
}
.wheel-feature-copy-stack,
.wheel-feature-callout-stack {
  position:relative;
  z-index:4;
  display:grid;
  align-items:center;
}
.wheel-feature-copy-stack { grid-column:1; grid-row:1; max-width:390px; }
.topic-feature-copy {
  grid-area:1/1;
  max-width:390px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(24px);
  transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s;
}
.topic-feature-copy.is-active {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
  transition-delay:.12s,.12s,0s;
}
.topic-feature-copy h2,
.topic-section-heading h2,
.journey-heading h2,
.production-heading h2 {
  margin-top:26px;
  font-size:clamp(42px,3.125vw,60px);
  font-weight:700;
  line-height:1.133333;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.topic-feature-copy>p:last-of-type { margin-top:17px; color:var(--topic-muted); font:14px/1.2857 Arial,sans-serif; }
.topic-feature-copy .button { width:242px; margin-top:42px; border-left-width:8px; }
.wheel-feature-carousel {
  position:static;
  z-index:2;
  grid-column:1 / -1;
  grid-row:1;
  justify-self:center;
  width:min(var(--wheel-carousel-size),100vw);
  height:var(--wheel-card-size);
  overflow:hidden;
  transform:none;
}
.wheel-feature-carousel .swiper-wrapper { align-items:center; }
.wheel-feature-carousel .swiper-slide {
  width:100%;
  height:var(--wheel-card-size);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:1;
}
.wheel-feature-carousel .swiper-slide-prev,
.wheel-feature-carousel .swiper-slide-next { z-index:2; }
.wheel-feature-carousel .swiper-slide-active { z-index:3; }
.wheel-feature-media {
  position:relative;
  width:var(--wheel-card-size);
  height:var(--wheel-card-size);
  flex:0 0 auto;
  display:block;
  overflow:hidden;
  background:transparent;
  box-shadow:none;
  opacity:0;
  pointer-events:none;
  transform:scale(.48);
  transition:transform .65s cubic-bezier(.22,.68,.28,1),opacity .45s ease,box-shadow .45s ease;
  will-change:transform;
}
.wheel-feature-carousel .swiper-slide-prev .wheel-feature-media,
.wheel-feature-carousel .swiper-slide-next .wheel-feature-media {
  opacity:1;
  pointer-events:auto;
  transform:scale(.58);
}
.wheel-feature-carousel .swiper-slide-active .wheel-feature-media {
  box-shadow:none;
  opacity:1;
  pointer-events:auto;
  transform:scale(1);
}
.wheel-feature-product {
  position:absolute;
  top:50%;
  left:50%;
  width:min(91.935484%,627px);
  height:auto;
  transform:translate(-50%,-50%);
}
.wheel-feature-logo { display:none; }
.wheel-feature-callout-stack { grid-column:3; grid-row:1; width:220px; justify-self:end; }
.wheel-feature-callout {
  grid-area:1/1;
  width:220px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(24px);
  transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s;
}
.wheel-feature-callout.is-active {
  opacity:1;
  visibility:visible;
  transform:none;
  transition-delay:.18s,.18s,0s;
}
.wheel-feature-callout::before { width:42px; height:4px; display:block; margin-bottom:25px; content:""; background:var(--red); }
.wheel-feature-callout p { font-size:36px; font-weight:800; line-height:.98; letter-spacing:-.04em; text-transform:uppercase; }
.wheel-feature-callout em { display:block; color:var(--red); font-style:normal; }
.wheel-category-nav {
  position:relative;
  z-index:3;
  right:auto;
  bottom:auto;
  left:auto;
  width:calc(100% + var(--gutter) * 2);
  min-height:clamp(98px,6.354167vw,122px);
  height:auto;
  margin-left:calc(var(--gutter) * -1);
  display:grid;
  grid-template-columns:repeat(var(--wheel-category-count,3),minmax(230px,1fr));
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  background:#0c0d0f;
  scrollbar-width:thin;
  scrollbar-color:var(--red) #0c0d0f;
}
.wheel-category-nav a {
  position:relative;
  min-width:0;
  display:flex;
  align-items:center;
  gap:28px;
  padding:0 clamp(36px,3.125vw,60px);
  color:#f1f2f4;
  border-top:4px solid transparent;
  border-right:1px solid #ffffff0e;
  font-size:16px;
  font-weight:700;
  transition:background .3s,border-color .3s;
}
.wheel-category-nav a:hover,
.wheel-category-nav a:focus-visible,
.wheel-category-nav a[aria-current="true"] { background:#202329; border-top-color:var(--red); }
.wheel-category-nav small { color:var(--red); font-size:11px; }
.wheel-category-arrow {
  position:absolute;
  top:50%;
  right:28px;
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--red);
  opacity:0;
  transform:translateY(-50%);
  transition:opacity .3s;
}
.wheel-category-arrow svg { width:15px; height:15px; }
.wheel-category-nav a:hover .wheel-category-arrow,
.wheel-category-nav a:focus-visible .wheel-category-arrow,
.wheel-category-nav a[aria-current="true"] .wheel-category-arrow { opacity:1; }

/* Suspension category panel: 1920 × 1800 */
.suspension-categories { min-height:0; }
.topic-section-heading {
  position:absolute;
  z-index:1;
  top:clamp(100px,6.770833vw,130px);
  left:0;
  max-width:520px;
}
.topic-section-heading>p:last-child { max-width:390px; margin-top:19px; color:var(--topic-muted); font:14px/1.2857 Arial,sans-serif; }
.suspension-category-list {
  position:relative;
  z-index:1;
  display:grid;
  gap:clamp(20px,1.458333vw,28px);
  padding-top:clamp(320px,21.614583vw,415px);
  padding-bottom:clamp(140px,10.052083vw,193px);
}
.suspension-category-card {
  min-height:max(448px,30.3125vw);
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#fff;
}
.suspension-category-card:nth-child(even) .suspension-category-media { order:2; }
.suspension-category-media { position:relative; min-width:0; display:grid; place-items:center; background:#fff; }
.suspension-category-media>img:not(.suspension-card-logo) { width:min(65.568%,577px); height:auto; max-height:100%; object-fit:contain; }
.suspension-card-logo { position:absolute; top:38px; left:50px; width:93px; height:auto; }
.suspension-category-copy {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  padding:clamp(82px,6.354167vw,122px) clamp(54px,4.114583vw,79px);
  color:#fff;
  background:#24272c;
}
.suspension-category-copy::after {
  position:absolute;
  top:32px;
  right:74px;
  color:#ffffff18;
  content:attr(data-index);
  font-size:100px;
  font-weight:800;
  line-height:1;
}
.suspension-category-copy .category-label { color:var(--red); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.suspension-category-copy h3 {
  max-width:500px;
  margin-top:27px;
  font-size:clamp(34px,2.395833vw,46px);
  line-height:1.2174;
  letter-spacing:-.035em;
  text-transform:uppercase;
}
.suspension-category-copy p { max-width:392px; margin-top:13px; color:#aeb2b8; font:14px/1.2857 Arial,sans-serif; }
.suspension-category-copy .button { width:240px; align-self:flex-start; margin-top:auto; }
.topic-category-empty {
  position:relative;
  z-index:1;
  max-width:720px;
  padding:clamp(180px,18vw,340px) 0 clamp(100px,10vw,190px);
}
.topic-category-empty h2 { font-size:clamp(42px,3.125vw,60px); line-height:1.1; text-transform:uppercase; }
.topic-category-empty p { margin-top:20px; color:var(--topic-muted); font:14px/1.5 Arial,sans-serif; }

/* Custom journey: 1920 × 1080 */
.custom-journey {
  position:relative;
  min-height:max(820px,56.25vw);
  overflow:visible;
  background:#f3f4f5;
}
.journey-background { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.journey-inner { position:relative; z-index:1; min-height:inherit; }
.journey-heading {
  position:absolute;
  top:clamp(118px,8.229167vw,158px);
  right:0;
  left:0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:60px;
}
.journey-heading>p:last-child { width:430px; margin-bottom:30px; color:#24272b; font:16px/1.375 Arial,sans-serif; text-align:right; }
.journey-steps {
  --journey-icon-size:94px;
  position:absolute;
  top:clamp(330px,23.125vw,444px);
  right:0;
  left:0;
  height:330px;
}
.journey-curve { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.journey-curve path { fill:none; stroke:var(--red); stroke-width:1; stroke-dasharray:2 3; }
.journey-step {
  --journey-x:50%;
  --journey-y:0px;
  position:absolute;
  top:var(--journey-y);
  left:var(--journey-x);
  width:300px;
  text-align:center;
  transform:translateX(-50%);
}
.journey-step:nth-of-type(1) { --journey-x:11.93%; --journey-y:calc(47px - var(--journey-icon-size) / 2); }
.journey-step:nth-of-type(2) { --journey-x:28.69%; --journey-y:calc(243px - var(--journey-icon-size) / 2); }
.journey-step:nth-of-type(3) { --journey-x:50%; --journey-y:calc(301px - var(--journey-icon-size) / 2); }
.journey-step:nth-of-type(4) { --journey-x:71.36%; --journey-y:calc(243px - var(--journey-icon-size) / 2); }
.journey-step:nth-of-type(5) { --journey-x:88.07%; --journey-y:calc(47px - var(--journey-icon-size) / 2); }
.products-wheels-page .journey-step { width:220px; }
.journey-step-icon {
  width:var(--journey-icon-size);
  height:var(--journey-icon-size);
  display:grid;
  place-items:center;
  margin:0 auto;
  background:#fff;
  border:1px solid var(--red);
  border-radius:50%;
}
.journey-step-icon img { width:auto; max-width:73px; height:auto; max-height:63px; }
.journey-step-number { display:block; margin-top:24px; color:var(--red); font-size:30px; font-weight:700; line-height:1; }
.journey-step h3 { margin-top:10px; font-size:18px; line-height:1.2; }
.journey-step p { margin:8px auto 0; color:#747980; font:14px/1.2857 Arial,sans-serif; }
.journey-inner>.button { position:absolute; top:clamp(692px,45.729167vw,878px); left:0; width:242px; border-left-width:8px; }

/* Production process: content-driven so WordPress items can be added or removed */
.production-process {
  --process-overlap:0px;
  position:relative;
  padding:clamp(64px,4.6875vw,90px) 0 var(--process-overlap);
  overflow:hidden;
  color:#fff;
  background:var(--topic-dark);
}
.production-process::before {
  position:absolute;
  z-index:0;
  top:0;
  bottom:0;
  left:50vw;
  width:4px;
  content:"";
  background:var(--red);
  transform:translateX(-50%);
  pointer-events:none;
}
.production-process::after {
  position:absolute;
  z-index:5;
  right:0;
  left:0;
  height:4px;
  content:"";
  background:var(--red);
  pointer-events:none;
  bottom:0;
}
.production-process>.wrap { position:relative; z-index:1; }
.production-heading {
  position:absolute;
  z-index:2;
  top:clamp(42px,3.125vw,60px);
  left:0;
  max-width:414px;
}
.production-heading .topic-kicker { color:#fff; }
.production-timeline {
  position:relative;
  display:grid;
  gap:clamp(58px,4.166667vw,80px);
}
.production-timeline::before {
  display:none;
  position:absolute;
  top:32px;
  bottom:32px;
  left:50%;
  width:4px;
  content:"";
  background:var(--red);
  transform:translateX(-50%);
}
.production-step {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);
  gap:78px;
  align-items:start;
}
.production-step-marker {
  position:relative;
  z-index:1;
  grid-column:2;
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  color:var(--red);
  background:#fff;
  border-radius:50%;
  font-size:20px;
  font-weight:800;
}
.production-step-copy { grid-row:1; padding-top:12px; }
.production-step:nth-child(odd) .production-step-copy { grid-column:3; }
.production-step:nth-child(even) .production-step-copy { grid-column:1; text-align:right; }
.production-step h3 { font:italic 700 28px/1.2857 Arial,sans-serif; text-transform:uppercase; }
.production-step p { max-width:620px; margin-top:17px; color:#f1f2f3; font:14px/1.5 Arial,sans-serif; }
.production-step:nth-child(even) p { margin-left:auto; }
.production-step img { width:clamp(260px,18.854167vw,362px); height:auto; aspect-ratio:362/222; margin-top:24px; object-fit:cover; }
.production-step:nth-child(even) img { margin-left:auto; transform:translateX(21px); }

@media (min-width:992px) {
  .production-process { --process-overlap:clamp(160px,13.5vw,190px); }
  .production-step + .production-step { margin-top:calc(-1 * var(--process-overlap)); }
  .production-step:not(:has(img)) + .production-step,
  .production-step + .production-step:not(:has(img)) { margin-top:0; }
}

@media (min-width:1600px) {
  .production-process { --process-overlap:clamp(160px,calc(350px - 10vw),190px); }
}

@media (max-width:1399.98px) and (min-width:992px) {
  .topic-hero h1 { font-size:clamp(58px,4.2vw,72px); }
  .topic-hero-description { max-width:600px; }
  .wheel-feature-logo { top:28px; left:28px; width:74px; }
  .wheel-feature-callout p { font-size:30px; }
  .suspension-card-logo { top:28px; left:36px; width:74px; }
  .suspension-category-copy::after { right:40px; font-size:72px; }
  .journey-step { width:250px; }
  .products-wheels-page .journey-step { width:190px; }
  .journey-steps { --journey-icon-size:74px; }
  .journey-step-icon img { max-width:56px; max-height:48px; }
  .journey-step-number { margin-top:14px; font-size:23px; }
  .journey-step h3 { margin-top:6px; font-size:14px; }
  .journey-step p { font-size:11px; }
  .production-step { grid-template-columns:minmax(0,1fr) 48px minmax(0,1fr); gap:50px; }
  .production-step-marker { width:48px; height:48px; font-size:14px; }
  .production-step-copy { padding-top:15px; }
  .production-step h3 { font-size:20px; }
  .production-step p { font-size:11px; }
  .production-step img { width:238px; height:auto; margin-top:14px; }
}

@media (min-width:1200px) and (max-width:1599.98px) {
  .wheel-feature-copy-stack,
  .topic-feature-copy { max-width:250px; }
  .wheel-feature-callout-stack,
  .wheel-feature-callout { width:180px; }
  .wheel-feature-callout p { font-size:26px; }
  .wheel-feature-carousel .swiper-slide-prev .wheel-feature-media,
  .wheel-feature-carousel .swiper-slide-next .wheel-feature-media { transform:scale(.5); }
}

@media (min-width:992px) and (max-width:1199.98px) {
  .wheels-categories {
    --wheel-card-size:min(64vw,520px);
    --wheel-carousel-size:100vw;
    min-height:0;
  }
  .wheel-section-index { position:relative; top:auto; padding-top:80px; }
  .wheel-feature { min-height:0; grid-template-columns:minmax(0,1fr); gap:54px; padding:60px 0 80px; }
  .wheel-feature-copy-stack { grid-column:1; grid-row:auto; order:2; max-width:520px; }
  .wheel-feature-carousel {
    position:relative;
    top:auto;
    left:auto;
    grid-row:auto;
    order:1;
    width:100vw;
    height:var(--wheel-card-size);
    margin-left:calc(50% - 50vw);
    transform:none;
  }
  .wheel-feature-callout-stack { grid-column:1; grid-row:auto; order:3; justify-self:start; }
  .wheel-category-nav {
    position:relative;
    right:auto;
    bottom:auto;
    left:auto;
    width:calc(100% + var(--gutter) * 2);
    margin-left:calc(var(--gutter) * -1);
  }
}

@media (min-width:992px) and (max-width:1599.98px) {
  .custom-journey { min-height:clamp(900px,64vw,1024px); }
  .journey-inner>.button { top:auto; bottom:64px; }
}

@media (min-width:1400px) and (max-width:1599.98px) {
  .journey-step { width:250px; }
  .products-wheels-page .journey-step { width:200px; }
  .journey-steps { --journey-icon-size:80px; }
  .journey-step-icon img { max-width:60px; max-height:52px; }
  .journey-step-number { margin-top:18px; font-size:25px; }
  .journey-step h3 { margin-top:7px; font-size:15px; }
  .journey-step p { font-size:12px; }
}

@media (max-width:991.98px) {
  .topic-hero { min-height:max(720px,90svh); }
  .topic-hero-content { display:flex; flex-direction:column; justify-content:flex-end; padding-top:100px; padding-bottom:120px; }
  .topic-hero h1 { font-size:clamp(48px,8.6vw,74px); }
  .topic-hero-description { max-width:620px; }
  .topic-hero .button { margin-top:42px; }
  .suspension-finder { min-height:0; padding:24px 0; }
  .suspension-finder-form { height:auto; grid-template-columns:1fr 1fr; }
  .suspension-finder-field { min-height:86px; }
  .suspension-finder-search { grid-column:1/-1; }
  .suspension-finder-actions { min-height:86px; }
  .wheels-categories,
  .suspension-categories,
  .custom-journey,
  .production-process { min-height:0; }
  .topic-category-watermark { top:0; }
  .wheel-section-index { position:relative; top:auto; padding-top:80px; }
  .wheel-feature { height:auto; grid-template-columns:minmax(0,1fr); gap:54px; padding:60px 0 80px; }
  .wheels-categories {
    --wheel-card-size:min(78vw,560px);
    --wheel-carousel-size:100vw;
  }
  .wheel-feature-copy-stack { grid-column:1; grid-row:auto; order:2; max-width:520px; }
  .wheel-feature-carousel {
    position:relative;
    top:auto;
    left:auto;
    grid-row:auto;
    order:1;
    width:100vw;
    height:var(--wheel-card-size);
    margin-left:calc(50% - 50vw);
    transform:none;
  }
  .wheel-feature-callout-stack { grid-column:1; grid-row:auto; order:3; justify-self:start; }
  .wheel-category-nav {
    position:relative;
    right:auto;
    bottom:auto;
    left:auto;
    width:calc(100% + var(--gutter) * 2);
    height:auto;
    margin-left:calc(var(--gutter) * -1);
    grid-template-columns:1fr;
    overflow:visible;
  }
  .wheel-category-nav a { min-height:82px; border-bottom:1px solid #ffffff10; }
  .topic-section-heading,
  .suspension-category-list { position:relative; top:auto; right:auto; left:auto; }
  .topic-section-heading { padding-top:100px; }
  .suspension-category-list { gap:24px; padding:70px 0 110px; }
  .suspension-category-card { min-height:0; grid-template-columns:1fr; }
  .suspension-category-card:nth-child(even) .suspension-category-media { order:0; }
  .suspension-category-media { min-height:500px; }
  .suspension-category-copy { min-height:480px; padding:76px 58px; }
  .custom-journey { padding:100px 0; }
  .journey-background { object-position:center top; }
  .journey-inner { height:auto; }
  .journey-heading { position:relative; top:auto; }
  .journey-heading>p:last-child { width:340px; }
  .journey-steps { position:relative; top:auto; height:auto; display:grid; gap:32px; margin-top:72px; }
  .journey-curve { display:none; }
  .journey-step,
  .products-wheels-page .journey-step,
  .journey-step:nth-of-type(n) {
    position:relative;
    top:auto;
    left:auto;
    width:auto;
    display:grid;
    grid-template-columns:94px 64px minmax(0,1fr);
    gap:22px;
    align-items:center;
    text-align:left;
    transform:none;
  }
  .journey-step-icon { grid-row:1/3; margin:0; }
  .journey-step-number { grid-row:1/3; margin:0; }
  .journey-step h3,.journey-step p { margin:0; }
  .journey-inner>.button { position:relative; top:auto; margin-top:70px; }
  .production-process { padding:100px 0; }
  .production-process>.wrap { height:auto; }
  .production-heading,
  .production-timeline,
  .production-step,
  .production-step:nth-child(n) { position:relative; top:auto; right:auto; left:auto; }
  .production-heading { margin-bottom:80px; }
  .production-timeline { gap:0; }
  .production-process::before { display:none; }
  .production-timeline::before { top:32px; bottom:32px; left:32px; display:block; }
  .production-step { grid-template-columns:64px minmax(0,1fr); gap:28px; padding:0 0 78px; }
  .production-step:last-child { padding-bottom:0; }
  .production-step-marker { grid-column:1; grid-row:1; }
  .production-step .production-step-copy,
  .production-step:nth-child(odd) .production-step-copy,
  .production-step:nth-child(even) .production-step-copy {
    grid-column:2;
    grid-row:1;
    padding-top:13px;
    text-align:left;
  }
  .production-step:nth-child(even) p { margin-left:0; }
  .production-step img { width:min(100%,440px); height:auto; margin-left:0; transform:none; }
}

@media (max-width:767.98px) {
  .topic-grid-lines { background:none; }
  .topic-hero-wheels .topic-hero-media img,
  .topic-hero-wheels .topic-hero-media video { object-position:60% center; }
  .topic-hero-suspension .topic-hero-media img,
  .topic-hero-suspension .topic-hero-media video { object-position:55% center; }
  .topic-hero h1 { font-size:clamp(46px,12vw,68px); }
  .topic-hero-index { right:24px; bottom:24px; font-size:22px; }
  .topic-motion-toggle { right:102px; bottom:20px; }
  .topic-scroll-cue { left:24px; bottom:24px; }
  .suspension-finder-form { grid-template-columns:1fr; }
  .suspension-finder-search { grid-column:auto; }
  .suspension-finder-field { min-height:82px; }
  .suspension-finder-actions { min-height:102px; }
  .wheel-feature-logo { top:24px; left:24px; width:72px; }
  .suspension-category-media { min-height:360px; }
  .suspension-card-logo { top:24px; left:24px; width:72px; }
  .suspension-category-copy { min-height:420px; padding:64px 30px; }
  .suspension-category-copy::after { top:22px; right:28px; font-size:70px; }
  .journey-heading { display:block; }
  .journey-heading>p:last-child { width:auto; margin:24px 0 0; text-align:left; }
  .journey-step,
  .products-wheels-page .journey-step,
  .journey-step:nth-of-type(n) { grid-template-columns:74px 48px minmax(0,1fr); gap:16px; }
  .journey-step-icon { width:74px; height:74px; }
  .journey-step-icon img { max-width:56px; max-height:48px; }
  .journey-step-number { font-size:22px; }
  .journey-step h3 { font-size:15px; }
  .journey-step p { font-size:12px; }
}

@media (max-width:575.98px) {
  .topic-hero { min-height:700px; }
  .topic-hero-content { padding-bottom:104px; }
  .topic-hero-rule { height:4px; }
  .topic-hero-description { font-size:12px; }
  .wheel-section-index { padding-top:66px; }
  .wheel-feature { gap:42px; padding-top:46px; }
  .wheel-feature-copy-stack,
  .topic-feature-copy { width:auto; max-width:100%; min-width:0; }
  .wheels-categories {
    --wheel-card-size:min(80vw,360px);
  }
  .wheel-feature-callout-stack { display:none; }
  .wheel-category-nav a { padding-inline:24px; }
  .wheel-category-arrow { right:18px; width:42px; height:42px; }
  .topic-section-heading { padding-top:78px; }
  .suspension-category-list { padding-top:54px; }
  .custom-journey,.production-process { padding:78px 0; }
  .journey-step,
  .products-wheels-page .journey-step,
  .journey-step:nth-of-type(n) { grid-template-columns:62px minmax(0,1fr); gap:16px; }
  .journey-step-icon { width:62px; height:62px; }
  .journey-step-icon img { max-width:44px; max-height:38px; }
  .journey-step-number { grid-column:2; grid-row:1; align-self:end; }
  .journey-step h3 { grid-column:2; grid-row:2; }
  .journey-step p { grid-column:2; grid-row:3; }
  .production-timeline::before { left:26px; }
  .production-step { grid-template-columns:52px minmax(0,1fr); gap:18px; }
  .production-step-marker { width:52px; height:52px; font-size:14px; }
}

@media (prefers-reduced-motion:reduce) {
  .topic-feature-copy,
  .wheel-feature-callout,
  .wheel-feature-media,
  .wheel-category-nav a,
  .wheel-category-arrow,
  .suspension-finder-actions button { transition:none; }
}

/* Quiet topic banner controls from the approved references. */
.products-wheels-page .topic-motion-toggle,
.products-suspension-page .topic-motion-toggle,
.products-wheels-page .topic-hero-index,
.products-suspension-page .topic-hero-index {
  opacity:0;
  pointer-events:none;
}

/* Keep translated topic headings readable on narrow screens. */
@media (max-width:767.98px) {
  .topic-hero-content { min-width:0; padding-top:120px; padding-bottom:96px; }
  .topic-hero h1,
  .topic-hero .managed-hero-copy :is(h1,h2).roova-pattern-title:not(.screen-reader-text) {
    width:100%;
    min-width:0;
    max-width:100% !important;
    font-size:clamp(34px,10vw,58px);
    line-height:1.02;
    white-space:normal !important;
    overflow-wrap:anywhere;
  }
  .topic-hero h1 em,
  .topic-hero .managed-hero-copy :is(h1,h2).roova-pattern-title em {
    display:block;
    max-width:100%;
    white-space:normal !important;
    overflow-wrap:anywhere;
  }
  .topic-hero-description,
  .topic-hero .managed-hero-copy .roova-pattern-intro {
    max-width:100%;
    overflow-wrap:anywhere;
  }
}