/* Trackside hero: aligned to the same content width as the rest of the site. */
.store-site .hero--trackside { background: #080b0d; min-height: 0; border-bottom: 0; }
.hero--trackside::before, .hero--trackside::after { display: none; }
.store-site .hero--trackside .hero__grid {
  position: relative;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr);
  gap: clamp(24px, 3vw, 44px);
  align-items: center;
  padding: 30px 0 36px;
  border-bottom: 1px solid var(--line);
}
.hero--trackside .hero__content { max-width: none; min-width: 0; }
.hero--trackside h1 { font-size: clamp(3.1rem, 5.4vw, 5.375rem); white-space: nowrap; text-wrap: nowrap; }
.hero--trackside h1 span { display: block; }
.hero--trackside p { max-width: 430px; }
.trackside-art {
  position: relative;
  width: 100%;
  height: 540px;
  container-type: inline-size;
  min-width: 0;
  overflow: hidden;
  background: #080b0d;
}
.trackside-art__background { display: block; position: absolute; right: 0; top: calc(125px - min(28cqw, 198px)); width: min(172%, 1200px); max-width: none; height: auto; }
.trackside-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #080b0d 0, transparent 17%, transparent 88%, #080b0d 100%); pointer-events: none; }
.trackside-art__brand { position: absolute; top: 5%; left: 4%; right: 4%; z-index: 1; pointer-events: none; }
.trackside-art__label { display: flex; align-items: center; gap: 14px; color: #e0e8e3; font: 800 11px/1.4 var(--font-body); letter-spacing: .2em; margin: 0 4% 20px; }
.trackside-art__label span { width: 42px; height: 4px; flex: none; background: var(--green); }
.hero--trackside .hero__stats {
  position: absolute;
  z-index: 2;
  left: 20px;
  right: 20px;
  bottom: 20px;
  margin: 0;
  max-width: none;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-color: #506157;
  border-radius: 10px;
  box-shadow: 0 8px 24px #0009;
}
.hero--trackside .hero__stat { min-width: 0; padding: 15px 12px; background: rgba(8, 11, 13, .96); }
.hero--trackside .hero__stat:hover { background: #19251c; }
.hero--trackside .hero__stat:focus-visible { outline-offset: -4px; }
.trackside-art__line { position: absolute; bottom: 0; left: 0; right: 0; height: 4px; background: var(--green); z-index: 1; }
@media (max-width: 950px) {
  .store-site .hero--trackside .hero__grid { grid-template-columns: 1fr; gap: 28px; }
  .hero--trackside p { max-width: 640px; }
  .trackside-art { height: 500px; }
  .trackside-art__brand { max-width: 610px; left: 50%; right: auto; width: 92%; transform: translateX(-50%); }

}
@media (max-width: 600px) {
  .hero--trackside h1 { font-size: clamp(2.2rem, 12.7vw, 4.5rem); }
  .store-site .hero--trackside .hero__grid { padding: 26px 0 30px; gap: 26px; }
  .trackside-art { height: 410px; }
  .trackside-art__label { font-size: 9px; letter-spacing: .06em; gap: 10px; }
  .trackside-art__label span { width: 26px; }
  .trackside-art__brand { top: 8%; }
  .hero--trackside .hero__stats { left: 10px; right: 10px; bottom: 14px; }
  .hero--trackside .hero__stat { padding: 12px 8px; }
  .hero--trackside .hero__stat strong { font-size: .9rem; }
  .hero--trackside .hero__stat span { font-size: .68rem; line-height: 1.35; }
}
