/* SG-Tronic Motorsport V9.8 — prevent hero image/backdrop from encroaching on H1.
   Supersedes the legacy global horizontal artwork offsets (V9.4/V9.5).
   Retains V9.7 separate technical backdrop and foreground composition. */

/* Keep a real text column with intrinsic zero minimum, and do not let display
   typography overflow beyond its allocated grid track. */
body.sgtm-v4 .inner-hero.v7-inner-hero .inner-layout > div:first-child {
  min-width:0!important;
  max-width:100%!important;
  position:relative;
  z-index:2;
  padding-right:0!important;
}
body.sgtm-v4 .inner-hero.v7-inner-hero h1 {
  max-width:100%!important;
  width:100%;
  min-width:0;
  white-space:normal!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
  text-wrap:balance;
}
/* Never translate the entire image/background square into the H1 column. */
body.sgtm-v4 .inner-hero.v7-inner-hero .hero-technical.v7-service-art {
  position:relative!important;
  left:0!important;
  right:auto!important;
  margin-inline:0!important;
  justify-self:end;
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  transform:none!important;
  z-index:1;
}
body.sgtm-v4 .inner-hero.v7-inner-hero .hero-technical.v7-service-art > img {
  max-width:100%!important;
}

@media (min-width:981px) {
  body.sgtm-v4 .inner-hero.v7-inner-hero .inner-layout {
    display:grid!important;
    grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr)!important;
    column-gap:clamp(64px,5vw,94px)!important;
    align-items:center!important;
  }
  /* Short, premium two-line headings read better than a one-line H1
     colliding visually with the technical panel at browser zoom levels. */
  body.sgtm-v4 .inner-hero.v7-inner-hero h1 {
    font-size:clamp(39px,3.8vw,57px)!important;
    line-height:1.09!important;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero h1 .blue {
    display:block;
    max-width:100%;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero .hero-technical.v7-service-art {
    max-width:620px!important;
  }
}

@media (min-width:721px) and (max-width:980px) {
  body.sgtm-v4 .inner-hero.v7-inner-hero .inner-layout {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    row-gap:28px!important;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero h1 {
    font-size:clamp(36px,4.6vw,46px)!important;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero .hero-technical.v7-service-art {
    width:min(100%,560px)!important;
    justify-self:center!important;
    margin-inline:auto!important;
  }
}

@media (max-width:720px) {
  body.sgtm-v4 .inner-hero.v7-inner-hero .inner-layout {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    row-gap:22px!important;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero h1 {
    font-size:clamp(34px,9.8vw,42px)!important;
    line-height:1.09!important;
  }
  body.sgtm-v4 .inner-hero.v7-inner-hero .hero-technical.v7-service-art {
    margin:0 auto!important;
    justify-self:center!important;
    max-width:540px!important;
  }
}
