/* HOME headline: the scene registration and cinematic timeline remain intact. */
.mauto-home-runtime #device-shell[data-device] .hero-title-lockup {
  isolation: isolate;
  overflow: visible !important;
  grid-template-columns: minmax(0, max-content) !important;
  width: max-content !important;
  max-width: calc(100% - 36px) !important;
}

/* A feathered local light under the headline has no box edge and stays clear
   of the foreground Porsche. It belongs to the text, not the CGI image stack. */
.mauto-home-runtime #device-shell[data-device] .hero-title-lockup::before {
  content: "" !important;
  position: absolute !important;
  display: block !important;
  z-index: -1 !important;
  inset: -12px -20px -14px -14px !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: radial-gradient(ellipse at 42% 44%, rgba(255,255,255,1) 0%, rgba(255,255,255,.98) 42%, rgba(255,255,255,.78) 65%, rgba(255,255,255,0) 100%) !important;
  box-shadow: none !important;
  filter: blur(8px) !important;
  transform: none !important;
  opacity: .94 !important;
  pointer-events: none !important;
  animation: none !important;
}

.mauto-home-runtime #device-shell[data-device] .hero-title-lockup h1.hero-eco-title {
  position: relative;
  width: max-content !important;
  max-width: none !important;
  gap: 0 !important;
  font-weight: 800 !important;
  line-height: .96 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.72) !important;
}

.mauto-home-runtime #device-shell[data-device] .hero-eco-title--owner .hero-eco-title__auto {
  margin-top: .10em !important;
  margin-left: 0 !important;
  line-height: 1 !important;
  letter-spacing: -.055em !important;
}

/* Measure the two leading glyphs with the same font and tracking as “Eco”.
   The hidden spacer keeps the owner line aligned under “o” at every size. */
.mauto-home-runtime #device-shell[data-device] .hero-eco-title--owner .hero-eco-title__auto::before {
  content: "Ec";
  display: inline-block;
  visibility: hidden;
  font: inherit;
  letter-spacing: inherit;
}

.mauto-home-runtime #device-shell[data-device] .hero-eco-title__owner-copy,
.mauto-home-runtime #device-shell[data-device] .hero-eco-title__owner-copy > span {
  display: inline !important;
  font: inherit !important;
  letter-spacing: inherit !important;
  white-space: nowrap !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}
.mauto-home-runtime #device-shell[data-device] .hero-eco-title__auto-part {
  color: #102a43 !important;
}
.mauto-home-runtime #device-shell[data-device] .hero-eco-title__e,
.mauto-home-runtime #device-shell[data-device] .hero-eco-title__owner-copy > .hero-eco-title__owner-part {
  color: #164fc9 !important;
  background: linear-gradient(120deg, #2264df, #1649c4) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

.mauto-home-runtime #device-shell[data-device="desktop"] .hero-title-lockup h1.hero-eco-title {
  font-size: clamp(42px, 4.05vw, 66px) !important;
}
.mauto-home-runtime #device-shell[data-device="tablet"] .hero-title-lockup h1.hero-eco-title {
  font-size: 36px !important;
}
.mauto-home-runtime #device-shell[data-device="mobile"] .hero-title-lockup {
  top: 12px !important;
  left: 14px !important;
}
.mauto-home-runtime #device-shell[data-device="mobile"] .hero-title-lockup h1.hero-eco-title {
  font-size: 19px !important;
}
.mauto-home-runtime #device-shell[data-device="mobile"] .hero-title-lockup::before {
  inset: -8px -14px -10px -10px !important;
  filter: blur(5px) !important;
}

@media (max-width: 359px) {
  .mauto-home-runtime #device-shell[data-device="mobile"] .hero-title-lockup {
    left: 12px !important;
    top: 11px !important;
  }
  .mauto-home-runtime #device-shell[data-device="mobile"] .hero-title-lockup h1.hero-eco-title {
    font-size: 17px !important;
  }
}

@media (forced-colors: active) {
  .mauto-home-runtime #device-shell[data-device] .hero-title-lockup::before {
    background: Canvas !important;
    filter: none !important;
  }
  .mauto-home-runtime #device-shell[data-device] .hero-eco-title__owner-copy > span {
    color: CanvasText !important;
  }
}

/* Remove the old empty bands around the contained tablet plate. Every scene
   bitmap, mask and light overlay keeps the same centered contain registration. */
.mauto-home-runtime #device-shell[data-device="tablet"] .hero {
  height: clamp(280px, calc(100vw * 770 / 2041), 390px) !important;
  min-height: 280px !important;
}
.mauto-home-runtime #device-shell[data-device="tablet"] .hero-title-lockup {
  top: 22px !important;
}
.mauto-home-runtime #device-shell[data-device="tablet"] .hero-capability-deck {
  top: 112px !important;
  max-width: calc(40% - 28px) !important;
}
