div[class*="_heroSection_"]{background:#0B3D33 !important;padding:24px 16px 170px !important;min-height:unset !important;position:relative;}
div[class*="_heroImage_"]{display:none !important;}
div[class*="_heroSection_"] div[class*="_heroText_"]{color:#fff !important;margin-bottom:12px !important;}
div[class*="_heroSection_"] div[class*="_heroText_"] span{color:#fff !important;font-weight:500;}
span[class*="_inventorySection_"]{color:#9FE1CB !important;text-decoration:underline;cursor:pointer;}
div[class*="_homeFilterContainer_"]{background:#fff !important;border-radius:14px !important;box-shadow:0 1px 4px rgba(0,0,0,0.08) !important;border:none !important;padding:14px !important;}
body:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]{margin:-160px 12px 16px !important;position:relative;z-index:2;}
div[class*="_homeFilterContainer_"] input[type="text"]{border:1.5px solid #D3D1C7 !important;border-radius:10px !important;padding:11px 12px !important;font-size:14px !important;box-sizing:border-box !important;}
div[class*="_homeFilterContainer_"] input[type="text"]:focus{border-color:#0F6E56 !important;outline:none !important;}
div[class*="_homeFilterContainer_"] select{appearance:none;-webkit-appearance:none;background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%230F6E56' stroke-width='2' fill='none'/></svg>") no-repeat right 12px center !important;border:1.5px solid #D3D1C7 !important;border-radius:10px !important;padding:11px 34px 11px 12px !important;font-size:14px !important;color:#2C2C2A !important;box-sizing:border-box !important;}
div[class*="_homeFilterContainer_"] select:focus{border-color:#0F6E56 !important;outline:none !important;}
div[class*="_homeFilterContainer_"] label{font-size:13px !important;color:#5F5E5A !important;font-weight:500 !important;}
div[class*="_homeFilterContainer_"] button[class*="_findCarButton_"]{background-color:#0F6E56 !important;color:#fff !important;border:none !important;border-radius:10px !important;padding:13px 24px !important;font-size:15px !important;font-weight:500 !important;box-shadow:none !important;cursor:pointer;}
div[class*="_homeFilterContainer_"] button[class*="_findCarButton_"]:hover{background-color:#085041 !important;}
body:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] button[class*="_findCarButton_"]{width:100% !important;}


/* T2M_SKIN_MOBILE_v1 - phones: no white card, no pull-up; the search sits on the dark panel */
@media (max-width: 600px){
  div[class*="_homeFilterContainer_"]{background:linear-gradient(180deg,var(--t2-ink2,#071310) 0%,var(--t2-ink,#0f2620) 100%) !important;border-radius:0 !important;box-shadow:none !important;padding:1rem 1.3rem 1.6rem !important;}
  body:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]{margin:0 !important;}
  div[class*="_homeFilterContainer_"] label{color:rgba(255,255,255,0.88) !important;}
  div[class*="_homeFilterContainer_"] select{border:none !important;}
}

/* T2_HEROPHOTO_SKIN_v1 - optional per-dealer hero photo. body.t2-hero-photo and --t2-hero-url are set by
   App.jsx ONLY when <logo folder>/hero-primary.jpg actually loads; without it every rule below is inert. */
@media (min-width:601px){
  body.t2-hero-photo div[class*="_heroSection_"]{min-height:460px !important;padding:64px 16px 64px !important;overflow:hidden;background:linear-gradient(90deg,var(--t2-ink,#0B3D33) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.14) 66%,rgba(0,0,0,0) 88%),var(--t2-hero-url) center right / cover no-repeat,var(--t2-ink,#0B3D33) !important;}
  body.t2-hero-photo div[class*="_heroSection_"] div[class*="_heroText_"]{margin-bottom:0 !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]{margin:0 !important;border-radius:0 !important;box-shadow:none !important;background:var(--t2-ink2,#071310) !important;padding:18px 16px 22px !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] label{color:rgba(255,255,255,.82) !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] input[type="text"],
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] select{border-color:transparent !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] button[class*="_findCarButton_"]{background-color:#fff !important;color:var(--t2-ink,#0B3D33) !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] button[class*="_findCarButton_"]:hover{background-color:var(--t2-tint,#9FE1CB) !important;}
}
@media (max-width:600px){
  body.t2-hero-photo div[class*="_heroSection_"]{min-height:230px !important;display:flex;flex-direction:column;justify-content:flex-end;padding:6rem 1.3rem 1.2rem !important;background:linear-gradient(180deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,.2) 36%,var(--t2-ink2,#071310) 100%),var(--t2-hero-url) 70% 50% / cover no-repeat,var(--t2-ink,#0f2620) !important;}
}

/* T2_HEROPHOTO_SKIN_v2: the white card is the inner centeredDiv and Find a car is a <span>; v1 targeted the wrong nodes */
@media (min-width:601px){
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] div[class*="_centeredDiv_"]{background:transparent !important;box-shadow:none !important;border:none !important;border-radius:0 !important;margin:0 !important;padding:0 !important;width:100% !important;max-width:none !important;position:static !important;transform:none !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] [class*="_findCarButton_"]{background-color:#fff !important;color:var(--t2-ink,#0B3D33) !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] [class*="_findCarButton_"]:hover{background-color:var(--t2-tint,#9FE1CB) !important;}
}

/* T2_HEROPHOTO_SKIN_v3: findCarButton is a wrapper span around the real <button> */
@media (min-width:601px){
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] [class*="_findCarButton_"]{background:transparent !important;box-shadow:none !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] [class*="_findCarButton_"] button{background:#fff !important;color:var(--t2-ink,#0B3D33) !important;border:none !important;box-shadow:none !important;font-weight:600 !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] [class*="_findCarButton_"] button:hover{background:var(--t2-tint,#9FE1CB) !important;}
}

/* T2_HEROPHOTO_SKIN_v4: photo mode shows Year / Make / Model / Find a car only (the text box is unwired anyway) */
@media (min-width:601px){
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] div[class*="_centeredDiv_"] > span:has(> input[type="text"]){display:none !important;}
}

/* T2_HEROPHOTO_SKIN_v5: single-colour band (kill the ::before curtain + fixed 6rem height) and readable search typography */
@media (min-width:601px){
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]{height:auto !important;padding:22px 16px 26px !important;background:var(--t2-ink2,#071310) !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]::before,
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"]::after{display:none !important;content:none !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"]{display:flex !important;flex-direction:row !important;align-items:flex-end !important;gap:16px !important;height:auto !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] > span{flex:1 1 0 !important;min-width:0 !important;width:auto !important;display:flex !important;flex-direction:column !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] > span[class*="_findCarButton_"]{flex:0 0 auto !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] span label{font-size:14px !important;font-weight:600 !important;letter-spacing:.01em !important;color:rgba(255,255,255,.92) !important;margin:0 0 7px 2px !important;line-height:1.2 !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] span select{width:100% !important;height:48px !important;padding:0 40px 0 14px !important;font-size:16px !important;line-height:48px !important;border:none !important;border-radius:8px !important;color:#1f2a26 !important;}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] [class*="_findCarButton_"] button{height:48px !important;padding:0 34px !important;font-size:16px !important;font-weight:600 !important;border-radius:8px !important;line-height:48px !important;}
}

/* T2_HEROPHOTO_SKIN_v6: photo-mode headline, option B - fluid 78px at ~1300px, 48px floor, 88px cap, wider text column */
@media (min-width:601px){
  body.t2-hero-photo div[class*="_heroSection_"]{min-height:480px !important;}
  body.t2-hero-photo div[class*="_heroSection_"] div[class*="_heroText_"]{width:60% !important;}
  body.t2-hero-photo div[class*="_heroSection_"] div[class*="_heroText_"] > span{font-size:clamp(3rem, 6vw, 5.5rem) !important;line-height:1.04 !important;letter-spacing:-.01em !important;}
  body.t2-hero-photo div[class*="_heroSection_"] div[class*="_heroText_"] span[class*="_inventorySection_"]{font-size:inherit !important;text-underline-offset:8px;text-decoration-thickness:3px;}
}

/* T2M_CARD_TYPE_v1 - phone vehicle cards: readable type scale (title 18, spec 14, mileage 15, price 22, buttons 48/16). Spec/colour lines are inline-styled in ListViewCard.jsx, hence !important. */
@media (max-width:600px){
  div[class*="_textContainer_"] h3[class*="_productName_"]{font-size:18px !important;font-weight:600 !important;letter-spacing:-.01em !important;line-height:1.25 !important;color:#14201c !important;margin-bottom:6px !important;}
  div[class*="_textContainer_"] > h3 + div > div{font-size:14px !important;color:#3f4a46 !important;line-height:1.45 !important;}
  div[class*="_textContainer_"] > h3 + div > div:last-child > span{font-size:12px !important;padding:3px 10px !important;}
  div[class*="_textContainer_"] p[class*="_productMileage_"]{font-size:15px !important;font-weight:500 !important;color:#2c3733 !important;}
  div[class*="_textContainer_"] span[class*="_listingPrice_"]{font-size:22px !important;font-weight:700 !important;letter-spacing:-.01em !important;line-height:1.1 !important;}
  div[class*="_textContainer_"] span[class*="_listingEst_"]{font-size:14px !important;font-weight:500 !important;color:#5f6b66 !important;}
  div[class*="_textContainer_"] button{min-height:48px !important;font-size:16px !important;font-weight:600 !important;border-radius:8px !important;}
}

/* SEEMORE_SKIN_v1: View All Inventory - solid white on the green band */
[class*="seeMoreBtn"]{background:#ffffff !important;color:var(--primary-color,#17352e) !important;border:2px solid #ffffff !important;font-weight:700 !important;opacity:1 !important;box-shadow:0 2px 10px rgba(0,0,0,.25) !important;padding:12px 26px !important;border-radius:9px !important}
[class*="seeMoreBtn"]:hover{background:#E4F0EA !important;opacity:1 !important}

/* T2_HEROPHOTO_SKIN_v7 - phone: photo sits ABOVE the headline instead of behind it. The 2:1 image at 100% auto is always 50vw tall, so the text padding tracks it at any width. Field labels hidden visually but kept for screen readers. */
@media (max-width:700px){
  body.t2-hero-photo div[class*="_heroSection_"]{display:block !important;min-height:0 !important;padding:calc(50vw + 18px) 1.3rem 1.2rem !important;background:var(--t2-hero-url) top center / 100% auto no-repeat,var(--t2-ink2,#071310) !important}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_homeFilterContainer_"] label{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:0 !important;overflow:hidden !important;clip:rect(0 0 0 0) !important;white-space:nowrap !important;border:0 !important}
  body.t2-hero-photo:has(div[class*="_heroSection_"]) div[class*="_centeredDiv_"] > span{margin-bottom:0 !important}
}

/* T2_ORD_DUP_v1 - the OrderZone "Start your purchase online" card duplicates the Submit purchase order row at the top of the phone More sheet (t2mMore / T2M_SHEET_v1). Hidden on phones only; desktop has no sheet, so the card is the sole entry point there. */
@media (max-width:900px){
  .t2OrdSection{display:none !important}
}
