/* T3_HEROPHOTO_SKIN_v1 — theme-3 hero photo, option B (full-bleed photo + dark search band).
   Every rule is gated on body.t3-hero-photo, which App.jsx T3_HEROPHOTO_v1 sets only after a hero image loads. */
.t3Hero{display:none}
body.t3-hero-photo .t3Hero{display:block;position:relative;min-height:440px;color:#fff;background:#0d1220 var(--t3-hero-url) right bottom/cover no-repeat} /* T3_HEROPHOTO_SKIN_v2 */
body.t3-hero-photo .t3Hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,7,13,.88) 0%,rgba(5,7,13,.45) 38%,rgba(5,7,13,0) 62%)}
body.t3-hero-photo .t3HeroText{position:relative;z-index:1;max-width:56%;padding:92px 0 60px 7rem}
body.t3-hero-photo .t3HeroText h2{font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1.02;font-weight:800;letter-spacing:-.025em;margin:0 0 16px;color:#fff}
body.t3-hero-photo .t3HeroText p{font-size:16px;opacity:.88;max-width:40ch;margin:0 0 26px;line-height:1.5;color:#fff}
body.t3-hero-photo .t3HeroCta{display:inline-block;background:var(--primary-color);color:#fff;font-weight:700;padding:14px 26px;border-radius:6px;text-decoration:none}
/* search fields become the dark band under the photo */
body.t3-hero-photo [class*="_searchInventory_"]{background:#0b1220;padding-top:1.6rem !important;padding-bottom:1.6rem !important}
body.t3-hero-photo [class*="_searchInventory_"] select,body.t3-hero-photo [class*="_searchInventory_"] input{background:#fff}
@media (max-width:1200px){
  body.t3-hero-photo .t3HeroText{padding-left:5rem;max-width:64%}
}
@media (max-width:700px){
  body.t3-hero-photo .t3Hero{min-height:340px;background-position:center}
  body.t3-hero-photo .t3Hero::before{background:linear-gradient(180deg,rgba(5,7,13,.25) 0%,rgba(5,7,13,.35) 45%,rgba(5,7,13,.9) 100%)}
  body.t3-hero-photo .t3HeroText{max-width:100%;padding:150px 18px 26px}
  body.t3-hero-photo .t3HeroText h2{font-size:30px}
  body.t3-hero-photo .t3HeroText p{font-size:14px;margin-bottom:16px}
  body.t3-hero-photo .t3HeroCta{display:block;text-align:center;padding:14px 0}
}
/* T3_HEROPHOTO_SKIN_v3 - phone: taller hero, photo anchored top so the car clears the headline */
@media (max-width:700px){
  body.t3-hero-photo .t3Hero{min-height:380px !important;background-position:top center !important}
  body.t3-hero-photo .t3Hero::before{background:linear-gradient(180deg,rgba(5,7,13,.15) 0%,rgba(5,7,13,.18) 40%,rgba(5,7,13,.82) 62%,rgba(5,7,13,.95) 100%) !important}
  body.t3-hero-photo .t3HeroText{padding:250px 16px 24px !important}
}
/* T3_HEROPHOTO_SKIN_v4 - phone: contain-to-width so the whole car shows, pinned top; taller hero, text below the photo */
@media (max-width:700px){
  body.t3-hero-photo .t3Hero{min-height:440px !important;background-size:100% auto !important;background-position:top center !important;background-repeat:no-repeat !important;background-color:#05070d !important}
  body.t3-hero-photo .t3Hero::before{background:linear-gradient(180deg,rgba(5,7,13,0) 0%,rgba(5,7,13,0) 34%,rgba(5,7,13,.55) 46%,rgba(5,7,13,.95) 60%,#05070d 100%) !important}
  body.t3-hero-photo .t3HeroText{padding:280px 16px 26px !important}
  body.t3-hero-photo .t3HeroText h2{font-size:27px !important}
}