/* Destination starting fare: supplied by Pricing.php, never inferred in CSS/JS. */
.commercial-hero-inner { position: relative; }
.destination-starting-price {
  position: absolute; top: 84px; right: 0; z-index: 2;
  display: grid; gap: 7px; min-width: 240px; max-width: 300px;
  padding: 20px 24px; border: 1px solid #ffffffcf; border-radius: 16px;
  background: #f6faf8; color: #002c3e; text-decoration: none;
  box-shadow: inset 0 1px 0 #fff, 0 12px 32px #002c3e24;
}
.destination-starting-price > span { font-size: 14px; font-weight: 600; }
.destination-starting-price strong { font-size: 34px; font-weight: 750; letter-spacing: -.035em; line-height: 1.15; }
.destination-starting-price small { display: flex; justify-content: space-between; gap: 20px; font-size: 12px; line-height: 1.5; color: #355365; }
.destination-starting-price:focus-visible { outline: 3px solid #00bc71; outline-offset: 4px; }
/* One glass surface for the form, selected-fare notice and starting fare. */
#quote .quote-composer-surface, #quote .home-fare-notice, .destination-starting-price {
  background: #f6f9f8; border-color: #ffffffb3;
  -webkit-backdrop-filter: none; backdrop-filter: none;
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  #quote .quote-composer-surface, #quote .home-fare-notice, .destination-starting-price {
    background: linear-gradient(125deg, #ffffff55, #ffffff0d 45%, #e1f9f426), #ffffff80;
    -webkit-backdrop-filter: blur(14px) saturate(135%);
    backdrop-filter: blur(14px) saturate(135%);
  }
}

@media (max-width: 832px) {
  /* Flatten presentational wrappers only. There is still one form and one set
     of input IDs; overlay mounting and form listeners are unchanged. */
  #quote .hero-inner, #quote .commercial-hero-inner {
    display: flex; flex-direction: column; min-height: 0; padding-block: 24px;
  }
  #quote .hero-copy, #quote .commercial-hero-layout, #quote .commercial-hero-copy { display: contents; }
  #quote .commercial-breadcrumb { order: 0; margin-bottom: 16px; color: #fff; }
  #quote .commercial-breadcrumb a { color: inherit; }
  #quote .commercial-hero-copy > .eyebrow { order: 1; margin: 0 0 10px; color: #c5f5dc; }
  #quote #hero-title { order: 2; max-width: 100%; margin: 0; color: #fff; text-wrap: balance; }
  #quote .quote-console { order: 3; margin: 20px 0 24px; padding: 0; }
  #quote .hero-tagline, #quote .commercial-hero-copy > p:not(.eyebrow) { order: 4; margin: 0; max-width: 100%; color: #fff; font-size: 17px; line-height: 1.55; }
  #quote .hero-description { order: 5; margin-top: 10px; max-width: 100%; color: #eef8fa; font-size: 15px; line-height: 1.6; }
  #quote .hero-assurances, #quote .commercial-assurances { order: 6; margin-top: 20px; color: #fff; gap: 16px; font-size: 12px; }
  #quote .commercial-assurances span { background: none; padding: 0; }
  #quote .commercial-assurances img { filter: brightness(0) invert(1); }
  .destination-starting-price { display: none; }

  /* The photograph continues behind the form and following text. A separate
     scrim protects white headings without changing any control's opacity. */
  #quote.approved-hero, #quote.commercial-hero { position: relative; isolation: isolate; background: #06394b; padding: 0; }
  #quote .hero-image, #quote .commercial-panorama { height: 100%; width: 100%; object-fit: cover; object-position: center center; z-index: -2; }
  #quote.approved-hero::before, #quote.commercial-hero::before {
    content: ""; position: absolute; inset: 0; height: 100%; z-index: -1;
    background: linear-gradient(180deg, #003147a6, #00314733 28%, #00314740 66%, #002e42e6);
  }
  #quote .commercial-hero-layout > figure { position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); width: 100vw; z-index: -2; margin: 0; }
  #quote .commercial-hero-layout > figure > img { width: 100%; height: 100%; border-radius: 0; object-fit: cover; padding: 0; opacity: .65; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  #quote .quote-composer-surface, #quote .home-fare-notice, .destination-starting-price { background: #f6f9f8; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (forced-colors: active) {
  #quote .quote-composer-surface, #quote .home-fare-notice, .destination-starting-price { background: Canvas; color: CanvasText; border-color: CanvasText; -webkit-backdrop-filter: none; backdrop-filter: none; }
}