/* CARPRINCE final approved hero composition: port photo + service panel overlapping image */
.cp-design4-hero{
  position:relative!important;
  isolation:isolate!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:0!important;
  min-height:clamp(440px,45vw,620px)!important;
  padding:clamp(30px,4.5vw,68px) clamp(18px,5vw,78px) 94px!important;
  overflow:visible!important;
  color:#fff!important;
  background-color:#073f30!important;
  background-image:linear-gradient(90deg,rgba(2,48,36,.64) 0%,rgba(2,48,36,.36) 38%,rgba(2,48,36,.08) 72%,rgba(2,48,36,.02) 100%),url("assets/carprince-port-background-optimized.webp")!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  background-position:center 52%!important;
}
.cp-design4-hero:before{content:""!important;position:absolute!important;inset:0!important;z-index:-1!important;pointer-events:none!important;background:linear-gradient(0deg,rgba(0,48,35,.2),transparent 48%)!important}
.cp-hero-copy{position:relative!important;z-index:2!important;width:min(62%,760px)!important;max-width:760px!important;color:#fff!important}
.cp-hero-copy .eyebrow{color:#f1cf72!important;font-size:clamp(10px,1vw,15px)!important;letter-spacing:.16em!important;margin:0 0 10px!important}
.cp-hero-copy h1{font-family:Georgia,"Times New Roman",serif!important;font-size:clamp(27px,3.3vw,52px)!important;line-height:1.02!important;letter-spacing:-.025em!important;margin:0 0 10px!important;color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.28)!important}
.cp-hero-copy h1 span{color:#e8bd50!important}
.cp-shipping-line{color:#fff!important;font-size:clamp(12px,1.4vw,21px)!important;font-weight:800!important;line-height:1.25!important;margin:8px 0!important;text-shadow:0 1px 6px rgba(0,0,0,.25)!important}
.cp-hero-categories{color:#fff!important;font-size:clamp(11px,1.1vw,17px)!important;line-height:1.45!important;margin:10px 0 0!important;text-shadow:0 1px 6px rgba(0,0,0,.25)!important}
.cp-hero-search-wrap{position:relative!important;z-index:30!important;width:min(470px,100%)!important;margin:22px 0 0!important}
.cp-search-toggle{width:100%!important;min-height:52px!important;display:grid!important;grid-template-columns:28px minmax(0,1fr) 20px!important;align-items:center!important;gap:9px!important;padding:9px 15px!important;border:1px solid #e6bf51!important;border-radius:999px!important;background:linear-gradient(180deg,#087253,#034733)!important;color:#fff!important;font-size:clamp(11px,1vw,15px)!important;line-height:1.25!important;box-shadow:0 5px 16px rgba(0,0,0,.22)!important}
.cp-search-toggle span{min-width:0!important}
.cp-search-panel{position:absolute!important;top:calc(100% + 10px)!important;left:0!important;z-index:100!important;width:min(680px,calc(100vw - 32px))!important;max-width:calc(100vw - 32px)!important;max-height:min(72vh,620px)!important;overflow:auto!important;box-shadow:0 18px 50px rgba(0,0,0,.28)!important;border:1px solid #d7b454!important;border-radius:18px!important;background:#fff!important}
/* White service capsule overlaps the lower edge of the hero image, matching the approved sketch. */
.cp-service-strip{position:relative!important;z-index:8!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;align-items:center!important;gap:0!important;width:calc(100% - clamp(24px,8vw,120px))!important;max-width:1600px!important;margin:-52px auto 0!important;padding:13px clamp(8px,2vw,26px)!important;min-height:84px!important;height:auto!important;overflow:visible!important;border-radius:22px!important;background:rgba(255,255,255,.97)!important;color:#073f30!important;box-shadow:0 10px 28px rgba(0,40,29,.16)!important;backdrop-filter:blur(8px)!important}
.cp-service-strip .cp-service-item{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-width:0!important;min-height:46px!important;padding:6px clamp(4px,1vw,14px)!important;border-right:1px solid #d0ded8!important;border-bottom:0!important;font-size:clamp(9px,.88vw,14px)!important;line-height:1.2!important;white-space:normal!important;text-align:left!important}
.cp-service-strip .cp-service-item:last-child{border-right:0!important}
.cp-service-strip .cp-service-item svg{display:block!important;flex:0 0 clamp(20px,2.2vw,32px)!important;width:clamp(20px,2.2vw,32px)!important;height:clamp(20px,2.2vw,32px)!important;min-width:clamp(20px,2.2vw,32px)!important;min-height:clamp(20px,2.2vw,32px)!important;max-width:32px!important;max-height:32px!important;color:#064a37!important;overflow:visible!important}
.cp-service-strip .cp-service-item b{display:block!important;font-size:inherit!important;font-weight:800!important;line-height:1.22!important;overflow-wrap:anywhere!important}
.section.inventory{padding-top:clamp(34px,4vw,60px)!important}
@media(max-width:900px){
 .cp-design4-hero{min-height:400px!important;padding:32px 4vw 78px!important;background-position:58% center!important}
 .cp-hero-copy{width:72%!important;max-width:72%!important}
 .cp-hero-copy h1{font-size:clamp(26px,4.5vw,40px)!important}
 .cp-service-strip{width:calc(100% - 28px)!important;margin-top:-42px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:9px 5px!important;border-radius:18px!important;min-height:70px!important}
 .cp-service-strip .cp-service-item{flex-direction:column!important;gap:4px!important;text-align:center!important;padding:5px 3px!important;font-size:clamp(7px,1.15vw,10px)!important;line-height:1.1!important}
 .cp-service-strip .cp-service-item svg{flex-basis:22px!important;width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;max-width:22px!important;max-height:22px!important}
 .cp-service-strip .cp-service-item b{font-size:inherit!important;overflow-wrap:normal!important}
}
@media(max-width:520px){
 .cp-design4-hero{min-height:390px!important;padding:27px 5vw 68px!important;background-size:cover!important;background-position:58% center!important}
 .cp-hero-copy{width:100%!important;max-width:100%!important}
 .cp-hero-copy .eyebrow{font-size:9px!important;letter-spacing:.14em!important;margin-bottom:8px!important}
 .cp-hero-copy h1{font-family:Manrope,Arial,sans-serif!important;font-size:clamp(24px,6.5vw,31px)!important;line-height:1.04!important;letter-spacing:-.045em!important;max-width:100%!important}
 .cp-shipping-line{font-size:clamp(10px,3.1vw,14px)!important;max-width:100%!important;margin:7px 0!important}
 .cp-hero-categories{font-size:clamp(9px,2.8vw,12px)!important;line-height:1.35!important;margin-top:8px!important}
 .cp-hero-search-wrap{width:min(100%,420px)!important;margin-top:16px!important}
 .cp-search-toggle{min-height:46px!important;grid-template-columns:21px minmax(0,1fr) 17px!important;gap:6px!important;padding:7px 10px!important;font-size:clamp(9px,2.55vw,11px)!important}
 .cp-service-strip{width:calc(100% - 22px)!important;margin-top:-36px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;padding:8px 3px!important;min-height:68px!important;border-radius:15px!important}
 .cp-service-strip .cp-service-item{flex-direction:column!important;justify-content:center!important;gap:3px!important;min-height:52px!important;padding:4px 1px!important;font-size:clamp(6px,1.8vw,8px)!important;line-height:1.08!important;border-right:1px solid #d0ded8!important}
 .cp-service-strip .cp-service-item svg{flex-basis:17px!important;width:17px!important;height:17px!important;min-width:17px!important;min-height:17px!important;max-width:17px!important;max-height:17px!important}
 .cp-service-strip .cp-service-item b{font-size:inherit!important;line-height:1.1!important;overflow-wrap:anywhere!important}
 .cp-service-strip .cp-service-item:last-child{border-right:0!important}
 .section.inventory{padding-top:30px!important}
}
@media(max-width:370px){
 .cp-design4-hero{min-height:365px!important;padding:23px 4vw 60px!important;background-position:57% center!important}
 .cp-hero-copy h1{font-size:23px!important}
 .cp-service-strip{width:calc(100% - 14px)!important;margin-top:-30px!important;padding:6px 2px!important}
 .cp-service-strip .cp-service-item{font-size:6px!important}
 .cp-service-strip .cp-service-item svg{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important;flex-basis:15px!important}
}
@media(min-width:1400px){.cp-design4-hero{background-position:center 54%!important}.cp-hero-copy{width:58%!important}}


/* CARPRINCE: compact search trigger with an overlay popup (does not resize the hero). */
.cp-design4-hero .cp-hero-search-wrap{
  position:relative!important;
  z-index:100!important;
  width:min(250px,100%)!important;
  margin:14px 0 0!important;
}
.cp-design4-hero .cp-search-toggle{
  width:100%!important;
  min-height:42px!important;
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr) 16px!important;
  align-items:center!important;
  gap:6px!important;
  padding:7px 11px!important;
  border:1px solid #e6bf51!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#087253,#034733)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1.15!important;
  box-shadow:0 5px 16px rgba(0,0,0,.22)!important;
}
.cp-design4-hero .cp-search-panel[hidden]{display:none!important}
.cp-design4-hero .cp-search-panel{
  position:fixed!important;
  z-index:99999!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  width:min(560px,calc(100vw - 28px))!important;
  max-width:560px!important;
  max-height:calc(100dvh - 32px)!important;
  overflow:auto!important;
  margin:0!important;
  box-sizing:border-box!important;
  border:1px solid rgba(7,83,63,.22)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 20px 70px rgba(0,0,0,.45)!important;
  padding:20px!important;
}
.cp-search-popup-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:99998!important;
  background:rgba(5,25,20,.62)!important;
  -webkit-backdrop-filter:blur(3px)!important;
  backdrop-filter:blur(3px)!important;
}
@media(max-width:520px){
  .cp-design4-hero .cp-hero-search-wrap{width:min(230px,100%)!important;margin-top:12px!important}
  .cp-design4-hero .cp-search-toggle{min-height:40px!important;font-size:12px!important;padding:7px 10px!important}
  .cp-design4-hero .cp-search-panel{padding:15px!important;max-height:calc(100dvh - 24px)!important}
}



/* CARPRINCE cross-device hero consistency: keep the approved serif headline and exact white/gold palette on every screen. */
.cp-design4-hero .cp-hero-copy,
.cp-design4-hero .cp-hero-copy * {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
.cp-design4-hero .cp-hero-copy .eyebrow {
  color: #f1cf72 !important;
}
.cp-design4-hero .cp-hero-copy h1 {
  font-family: Georgia, "Times New Roman", serif !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.025em !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.28) !important;
  -webkit-text-fill-color: #ffffff;
}
.cp-design4-hero .cp-hero-copy h1 span {
  color: #e8bd50 !important;
  -webkit-text-fill-color: #e8bd50;
}
.cp-design4-hero .cp-hero-copy .cp-shipping-line {
  color: #ffffff !important;
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-family: Manrope, Arial, sans-serif !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  text-shadow: 0 1px 6px rgba(0,0,0,.25) !important;
}
.cp-design4-hero .cp-hero-copy .cp-hero-categories {
  color: #ffffff !important;
  font-family: Manrope, Arial, sans-serif !important;
  text-shadow: 0 1px 6px rgba(0,0,0,.25) !important;
}
.cp-design4-hero .cp-hero-copy .cp-hero-categories i {
  color: #e4b84a !important;
}
@media (max-width: 520px) {
  .cp-design4-hero .cp-hero-copy h1 {
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: clamp(25px, 7vw, 34px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em !important;
  }
  .cp-design4-hero .cp-hero-copy .cp-shipping-line {
    font-size: clamp(11px, 3.4vw, 15px) !important;
  }
  .cp-design4-hero .cp-hero-copy .cp-hero-categories {
    font-size: clamp(10px, 3vw, 13px) !important;
    line-height: 1.4 !important;
  }
}
@media (max-width: 360px) {
  .cp-design4-hero .cp-hero-copy h1 { font-size: 23px !important; }
}

/* CARPRINCE approved embossed Explore Vehicles button; stable across mobile, tablet and desktop. */
.section.inventory > .section-heading > a.text-link {
  position: relative !important; display: inline-flex !important; align-items: center !important;
  justify-content: center !important; gap: 10px !important; min-height: 52px !important;
  min-width: 0 !important; box-sizing: border-box !important; padding: 9px 12px 9px 15px !important;
  border: 1.5px solid #e4c45f !important; border-radius: 999px !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfaf5 100%) !important;
  color: #174d3d !important; font-family: Manrope, Arial, sans-serif !important;
  font-size: clamp(12px, 1.2vw, 16px) !important; font-weight: 800 !important;
  line-height: 1.15 !important; text-decoration: none !important; white-space: nowrap !important;
  box-shadow: 0 4px 0 rgba(188,148,35,.38), 0 8px 16px rgba(24,59,46,.12), inset 0 1px 0 rgba(255,255,255,.98) !important;
  transition: transform .18s ease, box-shadow .18s ease !important;
}
.section.inventory > .section-heading > a.text-link::before { content: "🚘" !important; display: inline-block !important; font-size: 17px !important; line-height: 1 !important; }
.section.inventory > .section-heading > a.text-link::after {
  content: "→" !important; display: inline-grid !important; place-items: center !important;
  flex: 0 0 34px !important; width: 34px !important; height: 34px !important; border-radius: 50% !important;
  background: linear-gradient(180deg, #ffe99a, #e9b933) !important; color: #174d3d !important;
  font-size: 23px !important; font-weight: 900 !important; line-height: 1 !important;
  box-shadow: 0 2px 5px rgba(106,79,12,.22), inset 0 1px 0 rgba(255,255,255,.8) !important;
}
.section.inventory > .section-heading > a.text-link:hover, .section.inventory > .section-heading > a.text-link:focus-visible {
  transform: translateY(-2px) !important; box-shadow: 0 6px 0 rgba(188,148,35,.34), 0 11px 20px rgba(24,59,46,.16), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
@media (max-width: 700px) {
 .section.inventory > .section-heading > a.text-link { min-height:46px !important; gap:7px !important; padding:6px 8px 6px 10px !important; font-size:12px !important; }
 .section.inventory > .section-heading > a.text-link::before { font-size:15px !important; }
 .section.inventory > .section-heading > a.text-link::after { flex-basis:30px !important; width:30px !important; height:30px !important; font-size:21px !important; }
}
@media (max-width: 390px) {
 .section.inventory > .section-heading { gap:10px !important; }
 .section.inventory > .section-heading > a.text-link { gap:5px !important; padding:5px 6px 5px 8px !important; font-size:11px !important; }
 .section.inventory > .section-heading > a.text-link::after { flex-basis:27px !important; width:27px !important; height:27px !important; }
}