.car-detail-page {
  background:
    radial-gradient(circle at 8% 4%, rgba(193, 139, 100, .08), transparent 24%),
    linear-gradient(180deg, #f3f5f7 0%, #f8f9fa 100%) !important;
}

.car-detail-page .car-detail-hero {
  padding: 12px 0 28px !important;
}

.car-detail-page .car-detail-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(380px, .82fr) minmax(0, 1.18fr) !important;
  gap: 30px !important;
  align-items: start !important;
  width: min(1280px, calc(100% - 48px)) !important;
  min-height: 0 !important;
  padding: 24px !important;
  overflow: hidden !important;
  background: radial-gradient(circle at 50% -24%, rgba(76,96,124,.22), transparent 45%), radial-gradient(circle at 88% 115%, rgba(193,139,100,.10), transparent 32%), linear-gradient(135deg,#111820 0%,#1a2532 52%,#111820 100%) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 26px !important;
  box-shadow: 0 24px 56px rgba(15, 28, 43, .10), inset 0 1px 0 #fff !important;
}

.car-detail-page .car-detail-grid::before {
  position: absolute !important;
  z-index: 0 !important;
  inset: auto -7% -29% 32% !important;
  height: 62% !important;
  content: "" !important;
  background: url('/assets/graphics/wise-route-signature.svg') center bottom / 100% 100% no-repeat !important;
  filter: brightness(2.25) saturate(.68) !important;
  opacity: .30 !important;
  pointer-events: none !important;
}

.car-detail-page .car-detail-gallery,
.car-detail-page .car-detail-copy {
  position: relative !important;
  z-index: 1 !important;
}

.car-detail-page .car-detail-gallery {
  display: grid !important;
  gap: 12px !important;
  padding: 12px !important;
  background: rgba(255,255,255,.065) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

.car-detail-page .car-detail-gallery-head {
  display: grid !important;
  gap: 8px !important;
  padding: 4px 4px 7px !important;
}

.car-detail-page .car-detail-gallery-head .car-detail-back {
  width: max-content !important;
  margin: 0 0 5px !important;
}

.car-detail-page .car-detail-gallery-head .car-detail-kicker {
  margin-bottom: 0 !important;
}

.car-detail-page .car-detail-gallery-head > div {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 9px !important;
}

.car-detail-page .car-detail-gallery-head h1 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(32px, 3.2vw, 46px) !important;
  font-weight: 820 !important;
  letter-spacing: -.055em !important;
  line-height: 1 !important;
  text-shadow: 0 4px 24px rgba(0,0,0,.24) !important;
}

.car-detail-page .car-detail-gallery-head small {
  color: rgba(255,255,255,.55) !important;
  font-size: 11px !important;
  font-weight: 720 !important;
}

.car-detail-page .car-detail-main-image {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 420px !important;
  aspect-ratio: 3 / 2 !important;
  object-fit: cover !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 26px rgba(20, 31, 45, .10) !important;
}

.car-detail-page .car-detail-thumbs {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  padding: 0 !important;
}

.car-detail-page .car-detail-thumbs button {
  flex: 0 0 72px !important;
  width: 72px !important;
  height: 52px !important;
  padding: 3px !important;
  overflow: hidden !important;
  background: #fff !important;
  border: 1px solid #d8dee5 !important;
  border-radius: 9px !important;
}

.car-detail-page .car-detail-thumbs button.is-active {
  border-color: #b77d51 !important;
  box-shadow: 0 0 0 2px rgba(183, 125, 81, .16) !important;
}

.car-detail-page .car-detail-thumbs img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 5px !important;
}

.car-detail-page .car-detail-gallery-info {
  display: grid !important;
  gap: 12px !important;
  padding: 6px 4px 2px !important;
}

.car-detail-page .car-detail-gallery-info > p {
  margin: 0 !important;
  color: rgba(239,243,247,.76) !important;
  font-size: 13px !important;
  font-weight: 560 !important;
  line-height: 1.55 !important;
}

.car-detail-page .car-detail-copy {
  align-self: start !important;
  display: grid !important;
  gap: 12px !important;
  max-width: none !important;
  padding: 12px 8px 8px !important;
  color: #172235 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.car-detail-page .car-detail-back {
  display: inline-flex !important;
  margin-bottom: 20px !important;
  color: rgba(255,255,255,.66) !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  text-decoration: none !important;
}

.car-detail-page .car-detail-kicker {
  display: block !important;
  width: max-content !important;
  min-height: 0 !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  color: #d0a17c !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
}

.car-detail-page .car-detail-copy h1 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(38px, 4vw, 54px) !important;
  font-weight: 820 !important;
  letter-spacing: -.055em !important;
  line-height: 1 !important;
  text-shadow: 0 4px 24px rgba(0,0,0,.24) !important;
}

.car-detail-page .car-detail-copy > small {
  display: block !important;
  margin-top: 7px !important;
  color: rgba(255,255,255,.58) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.car-detail-page .car-detail-copy > p {
  max-width: 700px !important;
  margin: 18px 0 !important;
  color: rgba(239,243,247,.78) !important;
  font-size: 15px !important;
  font-weight: 580 !important;
  line-height: 1.62 !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.24) !important;
}

.car-detail-page .car-detail-specs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.car-detail-page .car-detail-specs span {
  padding: 8px 11px !important;
  color: rgba(255,255,255,.84) !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 9px !important;
  font-size: 11px !important;
  font-weight: 760 !important;
}

.car-detail-page .car-detail-availability {
  display: grid !important;
  gap: 8px !important;
  margin-top: 0 !important;
  padding: 12px 13px !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 12px !important;
}

.car-detail-page .car-detail-availability > span {
  color: #d0a17c !important;
  font-size: 9px !important;
  font-weight: 850 !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}

.car-detail-page .car-detail-availability > div {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.car-detail-page .car-detail-availability strong {
  padding: 5px 7px !important;
  color: rgba(255,255,255,.82) !important;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(208,161,124,.30) !important;
  border-radius: 7px !important;
  font-size: 10px !important;
  font-weight: 760 !important;
}

.car-detail-page .car-detail-price-note {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 4px 14px !important;
  align-items: center !important;
  margin-top: 0 !important;
  padding: 13px 15px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

.car-detail-page .car-detail-quote {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 18px !important;
  color: #fff !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

.car-detail-page .car-detail-quote > strong {
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 820 !important;
  letter-spacing: -.02em !important;
}

.car-detail-page .car-detail-quote label {
  display: grid !important;
  gap: 6px !important;
  min-width: 0 !important;
}

.car-detail-page .car-detail-quote label > span {
  color: rgba(255,255,255,.66) !important;
  font-size: 9px !important;
  font-weight: 820 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

.car-detail-page .car-detail-quote select,
.car-detail-page .car-detail-quote input {
  width: 100% !important;
  height: 44px !important;
  min-width: 0 !important;
  padding: 0 11px !important;
  color: #fff !important;
  color-scheme: dark !important;
  background: rgba(255,255,255,.085) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 9px !important;
  outline: 0 !important;
  font-size: 12px !important;
  font-weight: 680 !important;
}

.car-detail-page .car-detail-quote option {
  color: #172235 !important;
  background: #fff !important;
}

.car-detail-page .car-detail-quote-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.car-detail-page .car-detail-quote button {
  min-height: 48px !important;
  color: #fff !important;
  background: linear-gradient(145deg,#ffb46f 0%,#fb8a31 28%,#f17118 58%,#cc5508 100%) !important;
  border: 1px solid rgba(210,84,5,.78) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 25px rgba(205,82,8,.28), inset 0 1px 0 rgba(255,255,255,.50) !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 820 !important;
}

.car-detail-page .car-detail-quote > small {
  color: rgba(255,255,255,.55) !important;
  font-size: 10px !important;
  text-align: center !important;
}

.car-detail-page .car-detail-seo {
  padding: 8px 0 30px !important;
}

.car-detail-page .car-detail-seo-grid {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr) !important;
  gap: 0 !important;
  width: min(1280px, calc(100% - 48px)) !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.96) !important;
  border: 1px solid #dfe5eb !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 42px rgba(15,28,43,.08) !important;
}

.car-detail-page .car-detail-seo-grid::before {
  position: absolute !important;
  z-index: 0 !important;
  inset: auto 30% -42% -10% !important;
  height: 74% !important;
  content: "" !important;
  background: url('/assets/graphics/wise-route-signature.svg') center bottom / 100% 100% no-repeat !important;
  opacity: .10 !important;
  pointer-events: none !important;
}

.car-detail-page .car-detail-seo-copy {
  position: relative !important;
  z-index: 1 !important;
  padding: 38px 42px !important;
}

.car-detail-page .car-detail-seo-copy > span {
  display: block !important;
  margin-bottom: 12px !important;
  color: #a56f48 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}

.car-detail-page .car-detail-seo-copy h2 {
  max-width: 670px !important;
  margin: 0 !important;
  color: #111c2d !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  font-weight: 820 !important;
  letter-spacing: -.05em !important;
  line-height: 1.08 !important;
}

.car-detail-page .car-detail-seo-copy p {
  max-width: 690px !important;
  margin: 16px 0 0 !important;
  color: #68768a !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
}

.car-detail-page .car-detail-seo-checks {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: center !important;
  gap: 18px !important;
  padding: 36px 38px !important;
  color: #fff !important;
  background: linear-gradient(145deg, rgba(17,24,32,.98), rgba(28,40,54,.98)) !important;
  border-left: 1px solid rgba(255,255,255,.08) !important;
}

.car-detail-page .car-detail-seo-checks::after {
  position: absolute !important;
  inset: 0 !important;
  content: "" !important;
  background: url('/assets/graphics/wise-route-signature.svg') center bottom / 130% 100% no-repeat !important;
  filter: brightness(2) saturate(.7) !important;
  opacity: .13 !important;
  pointer-events: none !important;
}

.car-detail-page .car-detail-seo-checks strong,
.car-detail-page .car-detail-seo-checks ul {
  position: relative !important;
  z-index: 1 !important;
}

.car-detail-page .car-detail-seo-checks strong {
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 820 !important;
}

.car-detail-page .car-detail-seo-checks ul {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.car-detail-page .car-detail-seo-checks li {
  display: grid !important;
  grid-template-columns: 22px 1fr !important;
  gap: 9px !important;
  align-items: start !important;
  color: rgba(239,243,247,.78) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.car-detail-page .car-detail-seo-checks li::before {
  display: grid !important;
  place-items: center !important;
  width: 20px !important;
  height: 20px !important;
  content: "✓" !important;
  color: #d0a17c !important;
  background: rgba(208,161,124,.10) !important;
  border: 1px solid rgba(208,161,124,.28) !important;
  border-radius: 50% !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

.car-detail-page .car-detail-price-note span {
  color: #d0a17c !important;
  font-size: 10px !important;
  font-weight: 820 !important;
}

.car-detail-page .car-detail-price-note strong {
  color: #fff !important;
  font-size: 19px !important;
  font-weight: 850 !important;
}

.car-detail-page .car-detail-price-note em {
  grid-column: 1 / -1 !important;
  color: rgba(255,255,255,.58) !important;
  font-size: 10px !important;
  font-style: normal !important;
}

@media (max-width: 900px) {
  .car-detail-page .car-detail-grid {
    grid-template-columns: 1fr !important;
    width: calc(100% - 32px) !important;
    gap: 18px !important;
  }

  .car-detail-page .car-detail-gallery {
    max-width: 680px !important;
    margin: 0 auto !important;
  }

  .car-detail-page .car-detail-seo-grid {
    grid-template-columns: 1fr !important;
    width: calc(100% - 32px) !important;
  }

  .car-detail-page .car-detail-seo-checks {
    border-top: 1px solid rgba(255,255,255,.08) !important;
    border-left: 0 !important;
  }
}

@media (max-width: 560px) {
  .car-detail-page .car-detail-hero {
    padding-top: 4px !important;
  }

  .car-detail-page .car-detail-grid {
    width: calc(100% - 20px) !important;
    padding: 12px !important;
    border-radius: 18px !important;
  }

  .car-detail-page .car-detail-main-image {
    max-height: 300px !important;
  }

  .car-detail-page .car-detail-copy {
    padding: 8px 4px 4px !important;
  }

  .car-detail-page .car-detail-quote-row {
    grid-template-columns: 1fr !important;
  }

  .car-detail-page .car-detail-seo-grid {
    width: calc(100% - 20px) !important;
    border-radius: 18px !important;
  }

  .car-detail-page .car-detail-seo-copy,
  .car-detail-page .car-detail-seo-checks {
    padding: 28px 22px !important;
  }
}
