/* Final composition layer for the configurator landing area. */
body {
  background: radial-gradient(circle at 50% 10%, rgba(221, 235, 227, .42), transparent 29rem),
    linear-gradient(180deg, #fff 0, #fbfcfb 48rem, #eef3f0 100%);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.car-configurator { width: min(1440px, 100%); padding: 24px 40px 72px; }
.configurator-head { padding: 9px 4px 24px; }
.configurator-intro { padding: 54px 20px 30px; }
.configurator-intro .eyebrow { font-size: 10px; letter-spacing: .2em; }
.configurator-intro h1 {
  max-width: 1120px;
  margin: 13px auto 10px;
  font-size: clamp(36px, 3.35vw, 52px);
  line-height: 1.04;
  letter-spacing: -.047em;
  text-wrap: balance;
}
.is-partner-landing-page .configurator-intro h1 {
  max-width: 1280px;
  font-size: clamp(36px, 2.7vw, 44px);
  line-height: 1.08;
  letter-spacing: -.04em;
}
.configurator-intro p { max-width: 720px; font-size: 14px; line-height: 1.45; text-wrap: balance; }

.vehicle-selector-panel { position: relative; z-index: 30; width: min(900px, calc(100% - 56px)); margin-bottom: -39px; }
.desktop-vehicle-picker {
  grid-template-columns: minmax(190px, .72fr) repeat(2, minmax(220px, 1fr));
  gap: 14px;
  padding: 17px 18px;
  border-color: rgba(25, 63, 46, .12);
  border-radius: 19px;
  box-shadow: 0 20px 55px rgba(23, 53, 40, .12), 0 2px 6px rgba(23, 53, 40, .04);
}
.selector-number { background: #edf5f0; }
.search-select input { background: #f5f7f6; border-color: #dce3df; }
.missing-car-request { position: relative; z-index: 8; width: min(620px, calc(100% - 56px)); height: 0; margin: 0 auto; color: var(--muted); }
.missing-car-request > summary { position: absolute; top: 48px; left: 50%; width: max-content; max-width: 100%; min-height: 28px; display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; transform: translateX(-50%); }
.missing-car-request > summary::-webkit-details-marker { display: none; }
.missing-car-request > summary span { color: var(--ink); font-weight: 750; }
.missing-car-request > summary strong { color: var(--brand); font-weight: 850; text-decoration: underline; text-decoration-color: color-mix(in srgb,var(--brand) 34%,transparent); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.missing-car-request > summary:hover strong { text-decoration-color: currentColor; }
.missing-car-form { position: absolute; z-index: 2; top: 81px; right: 0; left: 0; padding: 20px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 18px 48px rgba(23,53,40,.13); }
.missing-car-close { position: absolute; top: 13px; right: 13px; width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 1px solid #dce5e0; border-radius: 50%; background: #f7faf8; color: #466056; cursor: pointer; }
.missing-car-close svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; }
.missing-car-close:hover { border-color: #b9cec2; background: #edf6f1; color: var(--brand); }
.missing-car-close:focus-visible { outline: 3px solid rgba(23,107,75,.18); outline-offset: 2px; }
.missing-car-intro,.missing-car-consent,.missing-car-form .primary-action,.missing-car-status { grid-column: 1 / -1; }
.missing-car-intro { padding-right: 42px; }
.missing-car-intro strong { color: var(--ink); font-size: 16px; }
.missing-car-intro p { margin: 5px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.missing-car-form label > span:first-child { display: block; margin: 0 0 6px 2px; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.missing-car-form input[type="text"],.missing-car-form input[type="tel"] { width: 100%; height: 46px; padding: 0 12px; border: 1px solid var(--line); border-radius: 11px; background: #f5f7f6; color: var(--ink); outline: none; }
.missing-car-form input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(23,107,75,.09); }
.missing-car-phone { height: 46px; border-color: var(--line); border-radius: 11px; background: #f5f7f6; }
.missing-car-phone > b { padding: 0 12px; color: var(--brand); font-size: 13px; }
.missing-car-phone input[type="tel"] { height: 44px; border: 0; border-radius: 0; box-shadow: none; font-size: 13px; }
.missing-car-consent { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 11px; line-height: 1.45; }
.missing-car-consent input { margin-top: 2px; accent-color: var(--brand); }.missing-car-consent a { color: var(--brand); }
.missing-car-form .primary-action { width: 100%; border-radius: 999px; }
.missing-car-status { min-height: 17px; margin: 0; font-size: 11px; }.missing-car-status.is-error { color: #a43f31; }.missing-car-status.is-success { color: var(--brand); font-weight: 700; }
.missing-car-trap { position: absolute; left: -10000px; }

.preview-card { border-color: #dbe3de; border-radius: 22px; box-shadow: 0 28px 80px rgba(24, 55, 42, .07); }
.box-carousel-head { padding: 68px 30px 14px; }
.box-carousel-head strong { font-size: 18px; letter-spacing: -.015em; }
.box-carousel-arrows button { width: 40px; height: 40px; }
.box-rail { padding: 5px 30px 20px; }

.is-configurator-domain .partner-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 4px 8px;
  color: #738078;
  font-size: 11px;
}
.is-configurator-domain .partner-breadcrumbs a { color: #526259; text-decoration: none; }
.is-configurator-domain .partner-breadcrumbs i { color: #aeb8b2; font-style: normal; }
.is-configurator-domain .configurator-head { align-items: center; }
.is-configurator-domain .brand-lockup { display: flex; min-width: 260px; align-items: flex-start; flex-direction: column; gap: 5px; }
.is-configurator-domain .brand-lockup-row { display: flex; align-items: center; }
.is-configurator-domain .enroad-logo { color: var(--ink); text-decoration: none; }
.is-configurator-domain .enroad-logo strong { font-size: 25px; letter-spacing: .08em; }
.is-configurator-domain .brand-subline { max-width: 310px; padding-left: 0; border-left: 0; }
.is-configurator-domain .missing-car-request,
.is-configurator-domain .purchase-panel,
.is-configurator-domain .product-card-footer { display: none; }

@media (min-width: 761px) {
  .preview-stage { min-height: 0; aspect-ratio: 16 / 5.1; }
  .preview-layer {
    inset: auto 0 clamp(-112px, -6.6vw, -54px);
    height: auto;
    aspect-ratio: 16 / 9;
  }
}

@media (min-width: 1200px) {
  .is-partner-landing-page .configurator-intro h1 { max-width: none; white-space: nowrap; }
}

@media (max-width: 900px) and (min-width: 761px) {
  .car-configurator { padding-right: 24px; padding-left: 24px; }
  .desktop-vehicle-picker { grid-template-columns: 170px repeat(2, minmax(0, 1fr)); }
  .configurator-intro h1 { font-size: clamp(36px, 5.3vw, 48px); }
}

@media (max-width: 760px) {
  .car-configurator { padding: 14px 12px 44px; }
  .configurator-head { padding: 7px 2px 18px; }
  .configurator-intro { padding: 34px 8px 24px; }
  .configurator-intro .eyebrow { font-size: 9px; }
  .configurator-intro h1 { margin-top: 11px; font-size: clamp(31px, 9.4vw, 40px); line-height: 1.02; }
  .is-partner-landing-page .configurator-intro h1 { max-width: 100%; font-size: clamp(31px, 9.4vw, 40px); line-height: 1.02; }
  .configurator-intro p { max-width: 34rem; font-size: 13px; line-height: 1.45; }
  .vehicle-selector-panel.vehicle-selector-panel { width: calc(100% - 4px); margin-bottom: -26px; }
  .desktop-vehicle-picker.desktop-vehicle-picker { padding: 15px; border-radius: 17px; box-shadow: 0 15px 38px rgba(23, 53, 40, .12); }
  .missing-car-request { width: calc(100% - 12px); }
  .missing-car-request > summary { top: 32px; min-height: 26px; flex-wrap: wrap; text-align: center; }
  .missing-car-form { top: 63px; grid-template-columns: 1fr; padding: 16px; border-radius: 16px; }
  .missing-car-form input[type="text"], .missing-car-form input[type="tel"] { font-size: 16px; }
  .preview-card { border-radius: 18px; }
  .preview-card .box-carousel-head { padding: 31px 17px 11px; }
  .box-carousel-head strong { font-size: 17px; }
  .box-carousel-arrows button { width: 38px; height: 38px; }
  .box-rail { padding: 5px 17px 16px; }
  .is-configurator-domain .configurator-head { gap: 12px; }
  .is-configurator-domain .brand-lockup { min-width: 0; }
  .is-configurator-domain .brand-subline { display: none; }
  .is-configurator-domain .head-title { display: none; }
}