/*
 * mobile.css: phones only (up to 767px). Loaded with media="(max-width: 767px)".
 * Same range as Tailwind's default (below md).
 */

/* === Hero === */
/* Stronger overlay (text covers the whole photo on phones), tighter form padding. */
.hero__overlay {
  background: linear-gradient(180deg, rgba(0, 0, 0, .7) 0%, rgba(0, 0, 0, .85) 100%);
}
:is(.hero, .booking-panel) .taxi-booking-wrapper .taxi-header,
:is(.hero, .booking-panel) .taxi-booking-wrapper .taxi-form {
  padding-inline: 18px !important;
}
:is(.hero, .booking-panel) .taxi-booking-wrapper .taxi-grid-2 {
  grid-template-columns: 1fr !important;
}

/* === CTA Banner === */
/* Text covers the whole photo on phones: darker overlay. */
.cta-banner__overlay {
  background: rgba(0, 0, 0, .7);
}

/* === Header: language switcher stays visible next to the menu button === */
.site-header__actions { margin-left: auto; }

/* === Booking Wizard === */
/* Step bar: numbers only on phones. */
.booking-steps__item { justify-content: center; font-size: 0; gap: 0; }
.booking-steps__item span { font-size: .8rem; }