/* ===== Bookna / Genesis Design System ===== */
:root {
  --color-bg: #f5fbff;
  --color-primary: #194185;
  --color-gold: #bf9b3a;
  --color-text: #181d27;
  --color-muted: #535862;
  --color-border: #a4a7ae;
  --color-white: #ffffff;
  --font-heading: 'Poppins', sans-serif;
  --font-ui: 'Inter', sans-serif;
  --shadow-lg: 0 12px 16px -4px rgba(10, 13, 18, 0.08), 0 4px 6px -2px rgba(10, 13, 18, 0.03);
  --shadow-nav: 0 12px 8px rgba(10, 13, 18, 0.08), 0 4px 3px rgba(10, 13, 18, 0.03);

  /* Fluid scale tokens — gentle resize, capped so mid/large screens stay compact */
  --page-padding: clamp(16px, 3.5vw, 56px);
  --content-max: min(1200px, 100%);
  --section-pad-y: clamp(48px, 6vw, 80px);
  --section-gap: clamp(16px, 2vw, 28px);
  --text-label: clamp(12px, 1.1vw, 14px);
  --text-body: clamp(14px, 1.2vw, 16px);
  --text-small: clamp(12px, 1.05vw, 13px);
  --heading-main: clamp(1.5rem, 3vw, 2.25rem);
  --heading-sub: clamp(1.15rem, 2vw, 1.5rem);
  --header-height: clamp(60px, 7vw, 80px);
  --logo-height: clamp(32px, 4vw, 44px);
  --nav-font: clamp(13px, 1.15vw, 15px);
  --radius-md: clamp(8px, 1.1vw, 14px);
  --radius-lg: clamp(10px, 1.5vw, 18px);
  --control-pad-y: clamp(8px, 1.1vw, 12px);
  --control-pad-x: clamp(10px, 1.4vw, 16px);

  --booking-card-max: 1008px;
  --booking-card-padding: clamp(14px, 2.2vw, 20px);
  --booking-card-gap: clamp(12px, 2vw, 20px);
  --booking-field-height: clamp(44px, 8vw, 52px);
  --booking-field-font: clamp(13px, 2.5vw, 15px);
  --booking-field-icon-left: clamp(14px, 3vw, 20px);
  --booking-field-padding-left: clamp(36px, 8vw, 46px);
  --booking-field-padding-right: clamp(12px, 2.2vw, 18px);
  --booking-btn-height: clamp(44px, 8vw, 50px);
  --booking-btn-font: clamp(14px, 2.5vw, 15px);
  --booking-swap-size: clamp(40px, 7vw, 52px);
}

*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: var(--font-heading);
  background: var(--color-bg);
  color: var(--color-text);
  margin: 0;
  overflow-x: hidden;
}

.bookna-page-section,
#hero,
#booking {
  scroll-margin-top: calc(var(--header-height) + 12px);
}

#hero {
  scroll-margin-top: 0;
}

/* Header */
.bookna-header {
  background: var(--color-white);
  border-bottom: 1px solid #ededed;
  box-shadow: var(--shadow-nav);
  position: sticky;
  top: 0;
  z-index: 1000;
}

.bookna-header__inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(8px, 1.2vw, 12px) var(--page-padding);
  height: var(--header-height);
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.bookna-header__logo img {
  height: var(--logo-height);
  width: auto;
}

.bookna-header__nav {
  display: flex;
  align-items: center;
  gap: clamp(16px, 2.5vw, 32px);
}

.bookna-header__links {
  display: flex;
  gap: clamp(10px, 1.4vw, 16px);
  align-items: center;
}

.bookna-nav-item--dropdown {
  display: inline-flex;
  align-items: center;
  align-self: center;
}

.bookna-nav-link {
  display: inline-flex;
  align-items: center;
  font-size: var(--nav-font);
  line-height: 1.5;
  font-weight: 500;
  color: #000;
  text-decoration: none;
  padding: clamp(6px, 1vw, 8px) 0;
  position: relative;
  white-space: nowrap;
  transition: color 0.2s;
}

.bookna-nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--color-gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.35s ease;
}

.bookna-nav-link:hover {
  color: var(--color-gold);
}

.bookna-nav-link:hover::after {
  transform: scaleX(1);
}

.bookna-nav-link--active {
  color: var(--color-gold);
  font-weight: 600;
}

.bookna-nav-link--active::after {
  transform: scaleX(1);
}

.bookna-nav-item--active > .bookna-nav-link {
  color: var(--color-gold);
  font-weight: 600;
}

.bookna-nav-item--active > .bookna-nav-link::after {
  transform: scaleX(1);
}

.bookna-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--control-pad-y) clamp(14px, 2vw, 20px);
  border-radius: clamp(6px, 1vw, 8px);
  font-family: var(--font-ui);
  font-size: clamp(14px, 1.5vw, 16px);
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: all 0.2s;
}

.bookna-btn--outline {
  background: var(--color-white);
  border: 1px solid #d5d7da;
  color: #414651;
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
}

.bookna-btn--outline:hover {
  background: #f9fafb;
}

.bookna-btn--primary {
  background: var(--color-primary);
  border: 1px solid var(--color-primary);
  color: var(--color-white);
  box-shadow: 0 1px 2px rgba(10, 13, 18, 0.05);
  width: 100%;
  gap: 8px;
}

.bookna-btn--primary:hover {
  background: #153670;
}

.bookna-btn--inline {
  width: auto !important;
  max-width: none;
  padding: 12px 20px;
}

.bookna-btn--after-copy {
  margin-top: 16px;
}

.bookna-header__cta {
  white-space: nowrap;
  flex-shrink: 0;
}

.bookna-header__toggle {
  display: none;
  background: none;
  border: none;
  font-size: 24px;
  color: var(--color-primary);
  cursor: pointer;
}

/* Hero */
.bookna-hero-wrap {
  position: relative;
  background: var(--color-white);
}

.bookna-hero {
  position: relative;
  height: calc(100vh - 96px);
  min-height: 760px;
  overflow: hidden;
}

.bookna-hero__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bookna-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,0.45) 0%, rgba(0,0,0,0.15) 55%, transparent 100%);
}

.bookna-hero__campaign {
  position: absolute;
  left: var(--page-padding);
  top: 34%;
  transform: translateY(-50%);
  z-index: 3;
  max-width: 520px;
}

.bookna-hero__hashtag {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 700;
  line-height: 1.05;
  margin: 0;
  color: var(--color-white);
  animation: heroFadeIn 0.8s ease both;
}

.bookna-hero__hashtag span {
  color: var(--color-gold);
  display: block;
}

.bookna-hero__tagline {
  margin: 16px 0 0;
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: rgba(255,255,255,0.95);
  font-style: italic;
  animation: heroSlideUp 1s ease 0.3s both;
}

@keyframes heroFadeIn {
  from { opacity: 0; transform: translateY(-16px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes heroSlideUp {
  from { opacity: 0; transform: translateY(20px); letter-spacing: 0.15em; }
  to { opacity: 1; transform: translateY(0); letter-spacing: 0.02em; }
}

/* Booking card */
.bookna-booking {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(var(--booking-card-max), calc(100% - (var(--page-padding) * 2)));
  max-width: 100%;
  padding: 0;
}

.bookna-booking__card {
  width: 100%;
  max-width: var(--booking-card-max);
  margin: 0;
  background: var(--color-white);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 12px;
  box-shadow: var(--shadow-lg);
  padding: var(--booking-card-padding);
  display: flex;
  flex-direction: column;
  gap: var(--booking-card-gap);
  overflow: hidden;
}

.bookna-booking__title {
  font-size: clamp(1.375rem, 4vw, 1.875rem);
  font-weight: 600;
  line-height: 1.3;
  margin: 0;
  color: var(--color-text);
}

.bookna-booking__trip-type {
  display: flex;
  gap: clamp(24px, 5vw, 48px);
  align-items: center;
}

.bookna-booking__trip-type label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: clamp(14px, 3.5vw, 16px);
  font-weight: 500;
  color: var(--color-muted);
  cursor: pointer;
}

.bookna-booking__trip-type input[type="radio"] {
  width: clamp(20px, 5vw, 24px);
  height: clamp(20px, 5vw, 24px);
  accent-color: var(--color-primary);
}

.bookna-booking__row {
  display: flex;
  gap: 16px;
  align-items: center;
}

.bookna-booking__field {
  flex: 1;
  min-width: 0;
  position: relative;
}

.bookna-booking__field i {
  position: absolute;
  left: var(--booking-field-icon-left);
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-muted);
  font-size: clamp(16px, 3.5vw, 18px);
  pointer-events: none;
  z-index: 1;
}

.bookna-booking__field select,
.bookna-booking__field input[type="date"] {
  width: 100%;
  max-width: 100%;
  height: var(--booking-field-height);
  padding: 0 var(--booking-field-padding-right) 0 var(--booking-field-padding-left);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  font-family: var(--font-heading);
  font-size: var(--booking-field-font);
  font-weight: 500;
  color: var(--color-muted);
  background: var(--color-white);
  appearance: none;
}

.bookna-booking__field select:focus,
.bookna-booking__field input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(25, 65, 133, 0.12);
}

.bookna-booking__card .bookna-btn--primary {
  width: 100%;
  max-width: 100%;
  min-height: var(--booking-btn-height);
  padding: clamp(10px, 2.5vw, 14px) clamp(16px, 4vw, 20px);
  font-size: var(--booking-btn-font);
  border-radius: clamp(8px, 2vw, 12px);
}

.bookna-booking__swap {
  flex-shrink: 0;
  width: var(--booking-swap-size);
  height: var(--booking-swap-size);
  border-radius: 50%;
  background: var(--color-primary);
  border: none;
  color: var(--color-white);
  font-size: clamp(16px, 3vw, 20px);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s, background 0.2s;
}

.bookna-booking__swap:hover {
  background: #153670;
}

.bookna-booking__row--dates.is-oneway .bookna-booking__field:first-child {
  flex: 1 1 100%;
}

.bookna-booking__field--passengers {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(10px, 2vw, 14px);
  min-height: var(--booking-field-height);
  padding: 0 var(--booking-field-padding-right) 0 var(--booking-field-padding-left);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-white);
}

.bookna-booking__field--passengers > i {
  position: absolute;
  left: var(--booking-field-icon-left);
  top: 50%;
  transform: translateY(-50%);
  flex-shrink: 0;
}

.bookna-booking__passenger-label {
  flex: 1;
  min-width: 0;
  font-family: var(--font-heading);
  font-size: var(--booking-field-font);
  font-weight: 500;
  color: var(--color-muted);
}

.bookna-booking__stepper {
  display: inline-flex;
  align-items: center;
  gap: clamp(6px, 1.5vw, 10px);
  flex-shrink: 0;
}

.bookna-booking__stepper-btn {
  width: clamp(32px, 7vw, 36px);
  height: clamp(32px, 7vw, 36px);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-white);
  color: var(--color-text);
  font-size: clamp(16px, 3vw, 18px);
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s, background 0.2s;
}

.bookna-booking__stepper-btn:hover:not(:disabled) {
  border-color: var(--color-primary);
  background: rgba(25, 65, 133, 0.04);
}

.bookna-booking__stepper-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.bookna-booking__stepper-value {
  min-width: 1.25rem;
  text-align: center;
  font-family: var(--font-heading);
  font-size: var(--booking-field-font);
  font-weight: 600;
  color: var(--color-text);
}

@media (hover: hover) {
  .bookna-booking__swap:hover {
    transform: rotate(180deg);
  }
}

.bookna-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/* Trust band — milestone strip */
.bookna-trust {
  background: var(--color-white);
  padding: 48px var(--page-padding) 40px;
  border-top: 2px solid rgba(191, 155, 58, 0.45);
  border-bottom: 2px solid rgba(191, 155, 58, 0.45);
}

.bookna-trust__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 28px;
  margin: 0 auto 32px;
  max-width: var(--content-max);
  color: var(--color-text);
  text-align: center;
}

.bookna-trust__stats {
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.bookna-trust__stat {
  text-align: center;
  padding: 20px 16px;
  border: 1px solid #e8ebf0;
  border-radius: 12px;
  background: linear-gradient(180deg, #f5faff 0%, #fff 100%);
}

.bookna-trust__stat strong {
  display: block;
  color: var(--color-primary);
  font-size: clamp(1.25rem, 2.5vw, 1.75rem);
  line-height: 1.2;
  margin-bottom: 6px;
}

.bookna-trust__stat span {
  display: block;
  color: var(--color-muted);
  font-size: 13px;
  line-height: 1.4;
}

/* Section utilities */
.bookna-section {
  padding: var(--section-pad-y) var(--page-padding);
  position: relative;
}

.bookna-section--white { background: var(--color-white); }
.bookna-section--gradient {
  background: linear-gradient(180deg, #f5faff 0%, var(--color-white) 100%);
}

.bookna-section__inner {
  max-width: var(--content-max);
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

/* Travel-themed soft backgrounds */
.bookna-section--bus,
.bookna-section--gradient,
.bookna-section--white.bookna-page-section,
.bookna-section--white,
.bookna-footer {
  isolation: isolate;
  overflow: hidden;
}

/* Default sections: travel motifs only (no bus) */
.bookna-section--gradient:not(.bookna-section--bus)::before,
.bookna-section--white.bookna-page-section:not(.bookna-section--bus)::after,
.bookna-section--white:not(.bookna-contact):not(.bookna-page-section)::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/images/bg-travel-motif.svg");
  background-repeat: no-repeat;
  background-position: right 4% center;
  background-size: min(46vw, 500px) auto;
  opacity: 0.14;
  pointer-events: none;
  z-index: 0;
}

.bookna-section--gradient.bookna-service-detail:not(.bookna-section--bus):nth-of-type(odd)::before {
  background-position: left 4% center;
  opacity: 0.12;
}

.bookna-section--white.bookna-page-section:nth-of-type(even)::after {
  background-position: left 6% center;
}

/* Bus sketch ONLY on: Our Journey, Terminals & Routes */
.bookna-section--bus::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    url("/images/bg-bus-sketch.jpg"),
    url("/images/bg-travel-motif.svg");
  background-repeat: no-repeat, no-repeat;
  background-position: left center, right 4% top 12%;
  background-size: min(48vw, 560px) auto, min(42vw, 460px) auto;
  opacity: 0.22;
  pointer-events: none;
  z-index: 0;
}

.bookna-trust {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.bookna-trust::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/images/bg-travel-motif.svg");
  background-repeat: no-repeat;
  background-position: right 8% center;
  background-size: min(40vw, 420px) auto;
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
}

.bookna-trust > * {
  position: relative;
  z-index: 1;
}

.bookna-contact.bookna-section--white {
  border-top: 1px solid rgba(25, 65, 133, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  background:
    linear-gradient(180deg, #f8fbff 0%, var(--color-white) 28%, var(--color-white) 100%);
}

.bookna-contact.bookna-section--white::before {
  content: "";
  position: absolute;
  left: var(--page-padding);
  right: var(--page-padding);
  top: clamp(18px, 2.5vw, 28px);
  bottom: clamp(18px, 2.5vw, 28px);
  max-width: var(--content-max);
  margin: 0 auto;
  border: 1px solid rgba(25, 65, 133, 0.16);
  border-radius: var(--radius-lg);
  box-shadow: 0 10px 28px rgba(25, 65, 133, 0.05);
  pointer-events: none;
  z-index: 0;
  background: rgba(255, 255, 255, 0.55);
}

.bookna-contact.bookna-section--white::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/images/bg-travel-motif.svg");
  background-repeat: no-repeat;
  background-position: right 4% center;
  background-size: min(40vw, 420px) auto;
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
}

/* Footer keeps the bus sketch */
.bookna-footer {
  position: relative;
}

.bookna-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    url("/images/bg-bus-sketch.jpg"),
    url("/images/bg-travel-motif.svg");
  background-repeat: no-repeat, no-repeat;
  background-position: left center, right 6% center;
  background-size: min(42vw, 480px) auto, min(36vw, 380px) auto;
  opacity: 0.2;
  pointer-events: none;
  z-index: 0;
}

.bookna-footer > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 768px) {
  .bookna-section--gradient:not(.bookna-section--bus)::before,
  .bookna-section--white.bookna-page-section:not(.bookna-section--bus)::after,
  .bookna-section--white:not(.bookna-contact):not(.bookna-page-section)::after,
  .bookna-contact.bookna-section--white::after,
  .bookna-trust::before {
    background-position: right -4% center;
    background-size: min(70vw, 300px) auto;
    opacity: 0.1;
  }

  .bookna-section--bus::before,
  .bookna-footer::before {
    background-position: left center, right -6% top 10%;
    background-size: min(72vw, 340px) auto, min(60vw, 280px) auto;
    opacity: 0.18;
  }

  .bookna-contact.bookna-section--white::before {
    left: calc(var(--page-padding) - 4px);
    right: calc(var(--page-padding) - 4px);
    top: 12px;
    bottom: 12px;
  }

  .bookna-footer::before {
    opacity: 0.11;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bookna-section--bus::before,
  .bookna-section--gradient:not(.bookna-section--bus)::before,
  .bookna-section--white.bookna-page-section::after,
  .bookna-trust::before,
  .bookna-footer::before {
    opacity: 0.08;
  }
}

.bookna-label {
  font-size: var(--text-label);
  font-weight: 500;
  color: var(--color-muted);
  margin: 0 0 clamp(10px, 1.5vw, 16px);
}

.bookna-heading {
  display: inline-block;
  max-width: 100%;
  font-size: var(--heading-main);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--color-primary);
  margin: 0 0 clamp(14px, 1.8vw, 20px);
}

.bookna-heading::after {
  content: "";
  display: block;
  width: 100%;
  height: clamp(5px, 0.7vw, 8px);
  margin-top: clamp(6px, 0.8vw, 8px);
  background: var(--color-gold);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

.bookna-heading.is-inview::after {
  transform: scaleX(1);
}

.bookna-heading--sub {
  font-size: var(--heading-sub);
  margin-bottom: clamp(10px, 1.5vw, 16px);
}

.bookna-heading--sub::after {
  height: clamp(4px, 0.7vw, 6px);
}

.bookna-routes__header--spaced {
  margin-top: clamp(40px, 6vw, 64px);
}

.bookna-service-detail {
  padding-top: clamp(48px, 7vw, 80px);
  padding-bottom: clamp(48px, 7vw, 80px);
}

.bookna-service-detail .bookna-about__text {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.bookna-service-detail .bookna-label {
  margin-bottom: clamp(8px, 1.2vw, 12px);
}

.bookna-service-detail .bookna-heading {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-bottom: clamp(12px, 1.6vw, 18px);
}

.bookna-service-detail .bookna-about__text > p:not(.bookna-label) {
  width: 100%;
  max-width: 100%;
}

.bookna-service-detail .bookna-list {
  width: 100%;
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 4px;
}

.bookna-service-detail .bookna-btn--after-copy {
  margin-top: clamp(12px, 2vw, 20px);
  align-self: flex-start;
  width: auto;
}

.bookna-service-detail .bookna-about__image {
  height: clamp(220px, 50vw, 360px);
  width: 100%;
  min-width: 0;
}

@media (min-width: 1025px) {
  .bookna-service-detail .bookna-about__grid {
    align-items: center;
    gap: clamp(28px, 4vw, 56px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .bookna-service-detail .bookna-about__text {
    justify-content: center;
  }

  .bookna-service-detail .bookna-about__image {
    height: clamp(320px, 42vw, 560px);
  }
}

/* Legacy divider elements kept in markup; underline now lives on headings */
.bookna-divider,
.bookna-divider--sub {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .bookna-heading::after {
    transform: none;
    transition: none;
  }
}

.bookna-subtext {
  font-size: var(--text-body);
  line-height: 1.55;
  color: var(--color-muted);
  margin: 0;
}

/* About */
.bookna-about__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

/* Zig-zag: image left, text right */
.bookna-about__grid--flip .bookna-about__image {
  grid-column: 1;
  grid-row: 1;
}

.bookna-about__grid--flip .bookna-about__text {
  grid-column: 2;
  grid-row: 1;
}

.bookna-about__text > p:not(.bookna-label) {
  font-size: 16px;
  line-height: 24px;
  color: var(--color-muted);
  margin: 0 0 16px;
}

.bookna-about__image {
  border-radius: 12px;
  overflow: hidden;
  height: 640px;
}

.bookna-about__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Services */
.bookna-services__header {
  max-width: 808px;
  margin-bottom: 64px;
}

.bookna-services__track-wrap {
  position: relative;
}

.bookna-services__track {
  display: flex;
  gap: 48px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 8px;
}

.bookna-services__track::-webkit-scrollbar { display: none; }

.bookna-service-card {
  flex: 0 0 calc(33.333% - 32px);
  min-width: 320px;
  scroll-snap-align: start;
  background: var(--color-white);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 32px;
  box-shadow: var(--shadow-lg);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.bookna-service-card img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  border-radius: 8px;
}

.bookna-service-card h3 {
  font-size: 24px;
  font-weight: 600;
  margin: 0;
  color: var(--color-text);
}

.bookna-service-card p {
  font-size: 16px;
  line-height: 24px;
  color: var(--color-muted);
  margin: 0;
}

.bookna-services__nav {
  display: flex;
  gap: 24px;
  margin-top: 48px;
}

.bookna-services__nav button {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--color-border);
  background: var(--color-white);
  color: var(--color-primary);
  cursor: pointer;
  font-size: 18px;
  transition: background 0.2s;
}

.bookna-services__nav button:hover {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}

/* Terminals */
.bookna-terminals__grid {
  display: grid;
  grid-template-columns: minmax(280px, 420px) 1fr;
  gap: 48px;
  align-items: start;
}

.bookna-terminal-tab {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  border-left: 3px solid transparent;
  padding: 4px 0 4px 24px;
  margin-bottom: 28px;
  cursor: pointer;
  font-family: inherit;
  transition: border-color .2s ease, background .2s ease;
  border-radius: 0 8px 8px 0;
}

.bookna-terminal-tab:hover {
  background: rgba(25, 65, 133, 0.04);
}

.bookna-terminal-tab--active {
  border-left-color: var(--color-primary);
}

.bookna-terminal-tab h3 {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 10px;
  color: var(--color-text);
}

.bookna-terminal-tab p {
  font-size: 15px;
  line-height: 22px;
  color: var(--color-muted);
  margin: 0 0 12px;
}

.bookna-terminal-tab span {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-primary);
}

.bookna-terminals__map-wrap {
  display: grid;
  gap: 16px;
  justify-items: start;
}

.bookna-terminals__tabs {
  max-height: 440px;
  overflow-y: auto;
  padding-right: 8px;
  scrollbar-width: thin;
}

.bookna-terminals__map {
  border-radius: 12px;
  overflow: hidden;
  height: 440px;
  width: 100%;
  border: 1px solid #e8ebf0;
  background: #eef3f8;
}

.bookna-terminals__map iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}

.bookna-terminals__map #terminals-map {
  width: 100%;
  height: 100%;
  min-height: 440px;
  z-index: 1;
}

.bookna-map-pin {
  background: transparent;
  border: 0;
}

.bookna-map-pin span {
  display: block;
  width: 24px;
  height: 24px;
  margin: 0 auto;
  background: #ea4335;
  border: 2px solid #fff;
  border-radius: 50% 50% 50% 0;
  transform: rotate(-45deg);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}

.bookna-map-pin--active span {
  width: 28px;
  height: 28px;
  background: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(191, 155, 58, 0.45), 0 4px 12px rgba(0, 0, 0, 0.3);
}

.bookna-map-popup strong {
  display: block;
  color: #202124;
  font-size: 14px;
  margin-bottom: 8px;
}

.bookna-map-popup a {
  color: #1a73e8;
  font-size: 13px;
  text-decoration: none;
}

.bookna-map-popup a:hover {
  text-decoration: underline;
}

.leaflet-popup-content-wrapper {
  border-radius: 8px;
  font-family: var(--font-heading);
}

.leaflet-popup-content {
  margin: 12px 14px;
  line-height: 1.4;
}

/* Contact */
.bookna-contact .bookna-subtext--spaced {
  margin-bottom: clamp(20px, 3vw, 28px);
}

.bookna-contact > .bookna-section__inner {
  padding: clamp(20px, 3vw, 36px) clamp(16px, 2.5vw, 28px);
}

.bookna-contact__layout {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: clamp(16px, 2.5vw, 28px);
  align-items: start;
}

.bookna-contact__aside {
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: clamp(16px, 2.2vw, 20px);
}

.bookna-contact__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: clamp(12px, 2vw, 16px);
}

.bookna-contact__item {
  display: grid;
  grid-template-columns: clamp(32px, 4vw, 36px) 1fr;
  gap: clamp(10px, 1.5vw, 12px);
  align-items: start;
}

.bookna-contact__item > i {
  width: clamp(32px, 4vw, 36px);
  height: clamp(32px, 4vw, 36px);
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: rgba(26, 54, 93, 0.08);
  color: var(--color-primary);
  font-size: clamp(12px, 1.4vw, 14px);
}

.bookna-contact__item h3 {
  margin: 0 0 4px;
  font-size: var(--text-small);
  font-weight: 700;
  color: var(--color-primary);
}

.bookna-contact__item p {
  margin: 0;
  font-size: clamp(12px, 1.3vw, 13px);
  line-height: 1.45;
  color: var(--color-muted);
  word-break: break-word;
}

.bookna-contact__item span {
  display: block;
  margin-top: 2px;
  font-size: clamp(11px, 1.2vw, 12px);
  color: var(--color-muted);
}

.bookna-contact__item a {
  color: var(--color-primary);
  text-decoration: none;
}

.bookna-contact__item a:hover {
  text-decoration: underline;
}

.bookna-contact__form {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.8vw, 14px);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  padding: clamp(16px, 2.4vw, 22px);
}

.bookna-contact__form-title {
  margin: 0 0 2px;
  font-size: clamp(16px, 2vw, 18px);
  font-weight: 700;
  color: var(--color-primary);
}

.bookna-contact__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(10px, 1.5vw, 12px);
}

.bookna-form-group label {
  display: block;
  font-size: var(--text-small);
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--color-text);
}

.bookna-form-group input,
.bookna-form-group textarea {
  width: 100%;
  border: 1px solid var(--color-border);
  border-radius: clamp(8px, 1.2vw, 10px);
  padding: var(--control-pad-y) var(--control-pad-x);
  font-family: var(--font-heading);
  font-size: var(--text-small);
}

.bookna-form-group textarea {
  min-height: clamp(88px, 16vw, 120px);
  resize: vertical;
}

.bookna-form-group input:focus,
.bookna-form-group textarea:focus {
  outline: none;
  border-color: var(--color-primary);
}

.bookna-form-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: clamp(11px, 1.25vw, 12px);
  line-height: 1.4;
  color: var(--color-muted);
}

.bookna-form-check input {
  margin-top: 2px;
}

.bookna-form-check a {
  color: var(--color-text);
  text-decoration: underline;
}

.bookna-btn--submit {
  width: auto;
  align-self: flex-start;
  margin-top: 2px;
}

/* Info bar */
.bookna-info-bar {
  background: var(--color-primary);
  padding: clamp(18px, 2.4vw, 28px) var(--page-padding);
}

.bookna-info-bar__inner {
  max-width: var(--content-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 0;
}

.bookna-info-bar__item {
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.4vw, 14px);
  min-width: 0;
  padding: clamp(4px, 0.8vw, 8px) clamp(14px, 2vw, 24px);
  color: var(--color-white);
  text-decoration: none;
  border-right: 1px solid rgba(255, 255, 255, 0.35);
}

.bookna-info-bar__item:first-child {
  padding-left: 0;
}

.bookna-info-bar__item:last-child {
  border-right: 0;
  padding-right: 0;
}

.bookna-info-bar__item i {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  border-radius: 0;
  display: block;
  place-items: unset;
  background: transparent;
  color: var(--color-white);
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1;
}

.bookna-info-bar__item span {
  display: grid;
  gap: 2px;
  min-width: 0;
  font-size: clamp(12px, 1.1vw, 13px);
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.92);
}

.bookna-info-bar__detail {
  font-style: normal;
  display: block;
  color: inherit;
  font-weight: 400;
}

.bookna-info-bar__detail--nowrap {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bookna-info-bar__item--email .bookna-info-bar__detail--nowrap {
  font-size: clamp(11px, 1.05vw, 13px);
  letter-spacing: -0.01em;
}

.bookna-info-bar__item strong {
  display: block;
  font-size: clamp(14px, 1.35vw, 16px);
  font-weight: 700;
  color: var(--color-white);
  line-height: 1.25;
}

.bookna-info-bar__item:hover span {
  text-decoration: underline;
}

.bookna-info-bar__divider {
  display: none;
}

/* Footer */
.bookna-footer {
  background: var(--color-bg);
  padding: clamp(40px, 6vw, 64px) var(--page-padding) clamp(20px, 3vw, 32px);
}

.bookna-footer__top {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}

.bookna-footer__logo img {
  height: clamp(40px, 5.5vw, 56px);
  width: auto;
}

.bookna-footer__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 32px;
}

.bookna-footer__nav a {
  color: var(--color-text);
  text-decoration: none;
  font-weight: 600;
  font-size: 16px;
}

.bookna-footer__nav a:hover {
  color: var(--color-primary);
}

.bookna-footer__social {
  display: flex;
  gap: 12px;
}

.bookna-footer__social a {
  color: var(--color-text);
  font-size: 20px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bookna-footer__divider {
  border: none;
  border-top: 1px solid #e0e0e0;
  max-width: var(--content-max);
  margin: 48px auto 32px;
}

.bookna-footer__bottom {
  max-width: var(--content-max);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
  font-size: 14px;
  color: var(--color-muted);
}

.bookna-footer__legal {
  display: flex;
  gap: 24px;
}

.bookna-footer__legal a {
  color: var(--color-muted);
  text-decoration: underline;
}

/* Responsive */
@media (max-width: 1024px) {
  .bookna-booking {
    width: calc(100% - (var(--page-padding) * 2));
  }

  .bookna-booking__card {
    max-width: min(100%, 720px);
    margin-left: auto;
    margin-right: auto;
  }

  .bookna-about__grid,
  .bookna-terminals__grid,
  .bookna-contact__layout {
    grid-template-columns: 1fr;
  }

  .bookna-service-detail .bookna-about__grid {
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(20px, 5vw, 32px);
  }

  /* Stack text above image on mobile for all service layouts */
  .bookna-about__grid--flip .bookna-about__text,
  .bookna-about__grid--flip .bookna-about__image {
    grid-column: 1;
    grid-row: auto;
  }

  .bookna-about__grid--flip .bookna-about__text {
    order: -1;
  }

  .bookna-about__grid--flip .bookna-about__image {
    order: 0;
  }

  .bookna-service-detail .bookna-about__image {
    height: clamp(220px, 52vw, 340px);
  }

  .bookna-about__image { height: clamp(280px, 40vw, 400px); }
  .bookna-info-bar__inner { grid-template-columns: 1fr 1fr; }
  .bookna-info-bar__item {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.28);
    padding: clamp(12px, 2vw, 16px) clamp(8px, 1.5vw, 12px);
  }
  .bookna-info-bar__item:nth-child(odd) {
    border-right: 1px solid rgba(255, 255, 255, 0.28);
  }
  .bookna-info-bar__item:nth-last-child(-n+2) {
    border-bottom: 0;
  }
  .bookna-info-bar__item:first-child,
  .bookna-info-bar__item:last-child {
    padding-left: clamp(8px, 1.5vw, 12px);
    padding-right: clamp(8px, 1.5vw, 12px);
  }
  .bookna-service-card { flex: 0 0 80%; }
}

.bookna-nav-item {
  position: relative;
}

.bookna-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  min-width: 220px;
  padding: 10px 0;
  background: rgba(191, 155, 58, 0.95);
  border-radius: 8px;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
  z-index: 1100;
}

.bookna-dropdown a {
  display: block;
  padding: 10px 18px;
  color: #181d27;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.bookna-dropdown a:hover {
  background: rgba(255, 255, 255, 0.28);
}

.bookna-nav-item--dropdown:hover .bookna-dropdown,
.bookna-nav-item--dropdown:focus-within .bookna-dropdown,
.bookna-nav-item--open .bookna-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.bookna-page-hero {
  background: linear-gradient(180deg, #f5faff 0%, #fff 100%);
  padding: 56px var(--page-padding) 24px;
}

.bookna-page-hero__inner {
  max-width: 1120px;
  margin: 0 auto;
}

.bookna-page-hero .bookna-heading {
  font-size: clamp(28px, 4vw, 40px);
}

.bookna-home-cta {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

.bookna-home-cta__actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.bookna-subtext--spaced {
  margin-bottom: 40px;
}

.bookna-subtext--flush {
  margin: 0;
}

.bookna-services-grid--spaced {
  margin-top: 32px;
}

.bookna-routes__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 32px;
}

.bookna-routes__header .bookna-subtext {
  margin-bottom: 0;
}

.bookna-routes__search {
  position: relative;
  min-width: min(320px, 100%);
  flex: 1 1 240px;
  max-width: 360px;
}

.bookna-routes__search i {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-muted);
  font-size: 14px;
  pointer-events: none;
}

.bookna-routes__search input {
  width: 100%;
  height: 48px;
  padding: 0 16px 0 40px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  font-family: inherit;
  font-size: 15px;
  color: var(--color-text);
  background: #fff;
}

.bookna-routes__search input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(25, 65, 133, 0.12);
}

.bookna-routes__empty {
  margin: 0 0 24px;
  color: var(--color-muted);
}

.bookna-routes__cta {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}

.bookna-route-card.is-dimmed {
  opacity: 0.35;
}

.bookna-route-card li.is-hidden {
  display: none;
}

.bookna-milestones {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: 40px;
}

.bookna-milestone {
  background: #fff;
  border: 1px solid #e8ebf0;
  border-radius: 12px;
  padding: 24px 20px;
  display: grid;
  gap: 8px;
}

.bookna-milestone strong {
  color: var(--color-primary);
  font-size: 28px;
  line-height: 1.1;
}

.bookna-milestone span {
  color: var(--color-muted);
  font-size: 14px;
  line-height: 1.4;
}

.bookna-services-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.bookna-service-card--link {
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #e8ebf0;
  border-radius: 16px;
  background: #fff;
  transition: transform .18s ease, box-shadow .18s ease;
}

.bookna-service-card--link:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(25, 65, 133, .12);
}

.bookna-service-card--link img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.bookna-service-card--link > div {
  padding: 20px;
}

.bookna-list {
  margin: 16px 0 0;
  padding-left: 18px;
  color: var(--color-muted);
  display: grid;
  gap: 8px;
}

.bookna-routes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.bookna-route-card {
  background: #fff;
  border: 1px solid #e8ebf0;
  border-radius: 12px;
  padding: 20px;
}

.bookna-route-card h3 {
  margin: 0 0 12px;
  color: var(--color-primary);
  font-size: 18px;
}

.bookna-route-card ul {
  margin: 0;
  padding-left: 18px;
  color: var(--color-muted);
  display: grid;
  gap: 6px;
  font-size: 14px;
}

@media (max-width: 900px) {
  .bookna-milestones,
  .bookna-routes {
    grid-template-columns: 1fr 1fr;
  }

  .bookna-services-grid {
    grid-template-columns: 1fr;
  }

  .bookna-info-bar__inner {
    grid-template-columns: 1fr 1fr;
    gap: 0;
  }
}

@media (max-width: 768px) {
  .bookna-header__inner {
    height: var(--header-height);
    padding: clamp(8px, 2vw, 12px) var(--page-padding);
  }

  .bookna-header__logo img {
    height: var(--logo-height);
  }

  .bookna-header__toggle { display: block; }

  .bookna-header__nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--color-white);
    flex-direction: column;
    align-items: stretch;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s;
    box-shadow: var(--shadow-lg);
    padding: 0;
  }

  .bookna-header__nav.active {
    max-height: 80vh;
    overflow: auto;
    padding: 16px 20px;
  }

  .bookna-header__links {
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }

  .bookna-nav-link {
    display: flex;
    width: 100%;
    padding: 12px 0;
    border-bottom: 1px solid #eee;
  }

  .bookna-nav-link::after {
    bottom: 10px;
    left: 0;
    right: auto;
    width: 48px;
  }

  .bookna-nav-item {
    width: 100%;
  }

  .bookna-dropdown {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
    margin: 0 0 8px;
    box-shadow: none;
  }

  .bookna-nav-item--open .bookna-dropdown {
    display: block;
  }

  .bookna-milestones,
  .bookna-services-grid,
  .bookna-routes {
    grid-template-columns: 1fr;
  }

  .bookna-home-cta__actions {
    width: 100%;
  }

  .bookna-home-cta__actions .bookna-btn {
    flex: 1 1 auto;
  }

  .bookna-header__nav .bookna-btn--outline,
  .bookna-header__nav .bookna-header__cta {
    width: 100%;
    margin-top: 12px;
  }

  .bookna-hero {
    height: auto;
    min-height: 280px;
    padding: 24px 0 20px;
  }

  .bookna-hero__campaign {
    position: relative;
    top: auto;
    left: 0;
    transform: none;
    text-align: center;
    max-width: 100%;
    padding: 0 20px;
    margin-bottom: 20px;
  }

  .bookna-booking {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    width: 100%;
    max-width: 100%;
    padding: 0 20px 80px;
  }

  .bookna-booking__card {
    max-width: 100%;
    width: 100%;
  }

  .bookna-booking__trip-type {
    gap: 24px;
    flex-wrap: wrap;
  }

  .bookna-booking__trip-type label {
    min-height: 44px;
    padding: 4px 8px 4px 0;
  }

  .bookna-booking__row {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    gap: 12px;
  }

  .bookna-booking__field {
    width: 100%;
    flex: 1 1 100%;
  }

  .bookna-booking__field select,
  .bookna-booking__field input[type="date"] {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    display: block;
  }

  .bookna-booking__field input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
  }

  .bookna-booking__row--locations {
    position: relative;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .bookna-booking__swap {
    position: absolute;
    right: 10px;
    top: calc(50% - 0px);
    transform: translateY(-50%);
    z-index: 2;
    width: 40px;
    height: 40px;
    box-shadow: 0 4px 12px rgba(25, 65, 133, 0.25);
  }

  .bookna-booking__row--locations .bookna-booking__field {
    width: 100%;
  }

  .bookna-booking__row--locations .bookna-booking__field select {
    padding-right: 56px;
  }

  .bookna-booking__field--passengers {
    width: 100%;
    padding-right: clamp(10px, 2.5vw, 14px);
  }

  .bookna-booking__passenger-label {
    font-size: clamp(12px, 3.2vw, 14px);
  }

  .bookna-terminals__map {
    height: 300px;
  }

  .bookna-terminals__map #terminals-map {
    min-height: 300px;
  }

  .bookna-terminals__tabs {
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  .bookna-routes__header {
    align-items: stretch;
  }

  .bookna-routes__search {
    max-width: none;
  }

  .bookna-trust {
    padding: 36px var(--page-padding) 32px;
  }

  .bookna-trust__title {
    font-size: 16px;
    margin-bottom: 20px;
  }

  .bookna-trust__stats {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .bookna-trust__stat {
    padding: 16px 12px;
  }

  .bookna-about__image { height: 260px; }

  .bookna-service-detail {
    padding-top: clamp(32px, 8vw, 48px);
    padding-bottom: clamp(32px, 8vw, 48px);
  }

  .bookna-service-detail .bookna-about__grid {
    gap: clamp(16px, 4vw, 24px);
  }

  .bookna-service-detail .bookna-about__image {
    height: clamp(200px, 56vw, 280px);
  }

  .bookna-service-detail .bookna-heading {
    font-size: clamp(1.35rem, 6vw, 1.75rem);
  }

  .bookna-service-detail .bookna-about__text > p:not(.bookna-label),
  .bookna-service-detail .bookna-list {
    font-size: clamp(14px, 3.8vw, 16px);
    line-height: 1.55;
  }

  .bookna-service-detail .bookna-btn--after-copy {
    width: 100%;
    text-align: center;
    justify-content: center;
  }

  .bookna-services-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .bookna-service-card--link img {
    height: clamp(160px, 42vw, 200px);
  }

  .bookna-services__header { margin-bottom: 32px; }

  .bookna-service-card {
    flex: 0 0 min(100%, calc(100vw - 40px));
    min-width: 0;
  }

  .bookna-contact__layout { gap: clamp(14px, 3vw, 16px); }

  .bookna-contact__fields {
    grid-template-columns: 1fr;
  }

  .bookna-btn--submit {
    width: 100%;
    align-self: stretch;
  }

  .bookna-info-bar__inner { grid-template-columns: 1fr; gap: 0; }
  .bookna-info-bar__item,
  .bookna-info-bar__item:nth-child(odd),
  .bookna-info-bar__item:nth-last-child(-n+2) {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.28);
    padding: 14px 0;
  }
  .bookna-info-bar__item:last-child {
    border-bottom: 0;
  }

  .bookna-footer {
    padding: clamp(40px, 8vw, 48px) var(--page-padding) clamp(20px, 4vw, 24px);
  }

  .bookna-footer__top { flex-direction: column; text-align: center; }
  .bookna-footer__nav { justify-content: center; }
  .bookna-footer__social { justify-content: center; }
  .bookna-footer__bottom { flex-direction: column; text-align: center; }
  .bookna-footer__legal { justify-content: center; flex-wrap: wrap; }
}

@media (max-width: 480px) {
  .bookna-booking {
    padding: 0 16px 72px;
  }
}