/* Bookings: page styles (Figma 269:1361). Shared pieces live in /css/site.css. */
.booking { padding-top: 0; }
.booking .ghost-head { padding-top: clamp(56px, 5.73vw, 110px); margin-bottom: clamp(32px, 2.7vw, 52px); }
.booking .ghost-head::before { top: clamp(40px, 3.96vw, 76px); transform: translateX(-50%); opacity: 0.08; }
.booking .ghost-head__sub { margin-top: 0; }
.booking__form { max-width: 739px; margin-left: auto; margin-right: auto; }
.booking__spot-a { top: -228px; }
.booking__spot-b { top: 546px; }
.booking__swirl { left: max(-40px, calc(50% - 748px)); top: 384px; }
.booking input[type="date"].field__control { padding-right: 22px; }

.booking-cta { padding-top: clamp(48px, 4.2vw, 80px); }
.booking-cta .cta-band--boxed { padding-top: clamp(40px, 4.1vw, 78px); padding-bottom: clamp(40px, 4.1vw, 78px); }
.booking-cta .cta-band__inner { gap: clamp(24px, 3vw, 56px); }
.booking-cta .lead { display: block; color: var(--c-white); }
.booking-cta__bubble-a { left: -84px; bottom: -120px; }
.booking-cta__bubble-b { right: -70px; top: -110px; }

@media (max-width: 991px) {
  .booking__swirl { display: none; }
  .booking__spot-b { top: 40%; }
}

/* keep select and date controls at the shared field height */
.booking select.field__control, .booking input[type="date"].field__control { height: var(--field-h); }
