/*
 * 2026-07-27
 * Mobile-only hero image/text overlay and group-title sizing.
 * Desktop layout is intentionally untouched.
 */
@media (max-width: 760px) {
  body.special-page #preorderListView .preorder-list-head-main h2 {
    font-size: 34px !important;
  }

  body.special-page .hero-reference-vehicle {
    position: relative !important;
    display: block !important;
    width: calc(100% + 16px) !important;
    min-height: 270px !important;
    overflow: hidden !important;
    margin-left: -8px !important;
    margin-right: -8px !important;
    margin-bottom: 0 !important;
    border: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    box-sizing: border-box !important;
  }

  body.special-page .hero-reference-vehicle-copy {
    position: relative !important;
    z-index: 2 !important;
    width: 100% !important;
    margin-left: 0 !important;
    padding: 12px !important;
    border-radius: 12px !important;
    background: rgba(255, 255, 255, .8) !important;
    box-sizing: border-box !important;
  }

  body.special-page .hero-reference-vehicle > img.hero-reference-preorder-image {
    position: absolute !important;
    z-index: 1 !important;
    top: 20px !important;
    right: 0 !important;
    width: 82% !important;
    height: 230px !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: right top !important;
    pointer-events: none !important;
  }

  body.special-page .hero-reference-metrics {
    width: calc(100% + 16px) !important;
    margin-right: -8px !important;
    margin-left: -8px !important;
    margin-top: 0 !important;
    padding: 0 10px 10px !important;
    border: 0 !important;
    border-radius: 0 0 16px 16px !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }

  body.special-page .hero-reference-metrics > article:first-child svg {
    color: #111827 !important;
    stroke: #111827 !important;
  }
}
