/**
 * Maps legacy --colorN / --fontN tokens to the current Top Paris Transfer theme.
 * Load after assets/css/styles.css (new site) or css/css.css (legacy pages).
 */
:root {
  --font-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font1: var(--font-display);
  --font2: var(--font-sans);
  --font-default: var(--font-sans);

  --color1: var(--muted-foreground, oklch(0.45 0.02 260));
  --color2: var(--secondary, oklch(0.96 0.01 80));
  --color3: var(--foreground, oklch(0.18 0.03 260));
  --color4: var(--gold, oklch(0.78 0.14 75));
  --color5: var(--gold, oklch(0.78 0.14 75));
  --color6: var(--muted-foreground, oklch(0.45 0.02 260));
  --color7: var(--primary, oklch(0.22 0.04 260));
  --color8: var(--gold, oklch(0.78 0.14 75));
  --color9: var(--ring, oklch(0.72 0.13 75));
}

/* Equal horizontal gutters on mobile (safe-area aware) */
.container-prose {
  width: 100%;
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: max(1rem, env(safe-area-inset-left, 0px));
  padding-right: max(1rem, env(safe-area-inset-right, 0px));
  box-sizing: border-box;
}

@media (min-width: 640px) {
  .container-prose {
    padding-left: max(1.5rem, env(safe-area-inset-left, 0px));
    padding-right: max(1.5rem, env(safe-area-inset-right, 0px));
  }
}

/* Keep grid content inside container gutters on small screens */
.container-prose > .grid {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.container-prose > .grid > * {
  min-width: 0;
  max-width: 100%;
}

/* Our Services: wrap long emails/links inside cards on mobile */
.ourservices-step-card {
  box-sizing: border-box;
  overflow: hidden;
}

.ourservices-prose,
.ourservices-prose a {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.home-booking-form {
  background-color: #ffffffaa;
}

@media (min-width: 1024px) {
  .hero-layout {
    column-gap: 5rem;
  }
}

@keyframes hero-bg-zoom {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

.hero-section__background img {
  transform: scale(1);
  transform-origin: center center;
  will-change: transform;
  animation: hero-bg-zoom 18s ease-in-out 1 forwards;
}

@media (prefers-reduced-motion: reduce) {
  .hero-section__background img {
    animation: none;
    will-change: auto;
  }
}

.hero-layout__content {
  order: 1;
}

.hero-layout__calculator {
  order: 2;
}

@media (min-width: 1024px) {
  .hero-layout__calculator {
    order: 1;
  }

  .hero-layout__content {
    order: 2;
  }
}

/* Smooth hover zoom — site-wide buttons & CTAs */
button:not([data-decrease-for]):not([data-increase-for]):not(.rates-filter-trigger):not(.rates-filter-option):not(.bf-counter-btn):not(.trip-btn),
a.bg-gold-gradient,
a.rates-filter-book,
a.rounded-full,
a.rounded-xl,
a.rounded-2xl,
a.rounded-3xl,
input[type="submit"] {
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  transform: scale(1);
}

button:not([data-decrease-for]):not([data-increase-for]):not(.rates-filter-trigger):not(.rates-filter-option):not(.bf-counter-btn):not(.trip-btn):hover,
a.bg-gold-gradient:hover,
a.rates-filter-book:hover,
a.rounded-full:hover,
a.rounded-xl:hover,
a.rounded-2xl:hover,
a.rounded-3xl:hover,
input[type="submit"]:hover {
  transform: scale(1.06);
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  button:not([data-decrease-for]):not([data-increase-for]):not(.rates-filter-trigger):not(.rates-filter-option):not(.bf-counter-btn):not(.trip-btn),
  a.bg-gold-gradient,
  a.rates-filter-book,
  a.rounded-full,
  a.rounded-xl,
  a.rounded-2xl,
  a.rounded-3xl,
  input[type="submit"] {
    transition: none;
  }

  button:not([data-decrease-for]):not([data-increase-for]):not(.rates-filter-trigger):not(.rates-filter-option):not(.bf-counter-btn):not(.trip-btn):hover,
  a.bg-gold-gradient:hover,
  a.rates-filter-book:hover,
  a.rounded-full:hover,
  a.rounded-xl:hover,
  a.rounded-2xl:hover,
  a.rounded-3xl:hover,
  input[type="submit"]:hover {
    transform: none;
  }
}

#reservation-card,
.reservation-calc-fields,
#booking-stepper {
  max-width: 100%;
}

#reservation-card {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

#reservation-card:has([data-w3-display]),
section.container-prose:has(#reservation-card [data-w3-display]),
#step-1-view:has([data-w3-display]),
.reservation-calc-fields:has([data-w3-display]) {
  overflow: visible;
}

#reservation-card form,
#step-1-view,
.booking-field-group,
.reservation-calc-fields {
  width: 100%;
  min-width: 0;
}

.reservation-calc-fields {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
  .reservation-calc-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.reservation-calc-fields > *,
.booking-field-group > .grid > *,
.booking-field,
.reservation-calc-fields label.block {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.booking-field-anchor {
  min-width: 0;
  max-width: 100%;
}

.booking-field-anchor input,
.booking-field-anchor textarea,
.reservation-calc-fields input,
.reservation-calc-fields textarea {
  min-width: 0;
  max-width: 100%;
}

.reservation-calc-fields input[type="date"],
.reservation-calc-fields input[type="time"],
.booking-field input[type="date"],
.booking-field input[type="time"] {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  cursor: pointer;
  min-height: 1.75rem;
  position: relative;
}

.booking-field-anchor:has(> input[type="date"]),
.booking-field-anchor:has(> input[type="time"]) {
  position: relative;
}

.reservation-calc-fields input[type="date"]::-webkit-calendar-picker-indicator,
.reservation-calc-fields input[type="time"]::-webkit-calendar-picker-indicator,
.booking-field input[type="date"]::-webkit-calendar-picker-indicator,
.booking-field input[type="time"]::-webkit-calendar-picker-indicator {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  opacity: 0;
  cursor: pointer;
}

.booking-field:has(input[type="date"]),
.booking-field:has(input[type="time"]) {
  cursor: pointer;
}

.pickup-time-note {
  color: color-mix(in oklab, var(--gold) 55%, var(--muted-foreground));
}

@media (max-width: 639px) {
  #reservation-card {
    padding: 1.25rem;
  }

  #reservation-card h2 {
    margin-bottom: 0.125rem;
  }

  #reservation-card .booking-field,
  #reservation-card .reservation-calc-fields label.block {
    padding: 0.65rem 0.875rem;
  }

  #reservation-card .reservation-calc-fields {
    gap: 0.75rem;
    margin-top: 0.375rem;
  }

  #reservation-card .booking-field-group > .grid {
    gap: 0.625rem;
  }

  #reservation-card .booking-field[data-zy1-toggle] textarea {
    min-height: 2.5rem;
    line-height: 1.4;
  }

  #reservation-card .trip-btn {
    padding: 0.7rem 0.875rem;
    min-height: 3rem;
  }

  #reservation-card .trip-type-layout .trip-btn-label {
    line-height: 1.35;
  }

  #reservation-card form > .flex.justify-end {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
  }
}

.trip-btn--centered {
  justify-content: center;
  text-align: center;
}

.trip-btn--centered .trip-btn-label {
  flex: 0 1 auto;
}

@media (max-width: 639px) {
  .trip-btn--centered {
    justify-content: flex-start;
    text-align: left;
  }

  .trip-btn--centered .trip-btn-label {
    flex: 1;
  }

  .trip-btn--centered .trip-btn-icon-wrap:last-of-type {
    display: none;
  }
}

.reservation-trip-type-block,
.reservation-trip-details-block {
  border-radius: 1rem;
  border: 1px solid var(--border);
}

.reservation-trip-type-block {
  padding: 1.125rem 1rem 1rem;
  background: linear-gradient(
    135deg,
    color-mix(in oklab, var(--gold) 11%, var(--card)) 0%,
    color-mix(in oklab, var(--gold) 4%, var(--secondary)) 100%
  );
  border-color: color-mix(in oklab, var(--gold) 28%, var(--border));
}

.reservation-trip-details-block {
  margin-top: 1.25rem;
  padding: 1.25rem 1rem 1rem;
  background: var(--card);
  border-color: color-mix(in oklab, var(--border) 88%, var(--gold) 12%);
}

.reservation-block-label {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0 0 0.875rem;
  font-family: var(--font-display);
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
}

.reservation-details-title {
  margin: 0 0 1.125rem;
  padding-bottom: 0.875rem;
  border-bottom: 1px solid color-mix(in oklab, var(--gold) 20%, var(--border));
}

.reservation-trip-type-block .trip-btn:not(.trip-btn--active) {
  background: var(--card);
  box-shadow: 0 1px 2px color-mix(in oklab, var(--foreground) 5%, transparent);
}

.reservation-trip-type-block .trip-btn:not(.trip-btn--active):hover {
  border-color: color-mix(in oklab, var(--gold) 50%, var(--border));
}

.reservation-trip-type-block .trip-btn--active {
  background: var(--primary);
  color: var(--gold);
  border-color: var(--primary);
  box-shadow: 0 6px 16px color-mix(in oklab, var(--primary) 16%, transparent);
}

.reservation-trip-type-block .trip-btn--active:hover {
  border-color: color-mix(in oklab, var(--gold) 45%, var(--primary));
}

@media (max-width: 639px) {
  .reservation-trip-type-block,
  .reservation-trip-details-block {
    padding: 1rem 0.875rem;
  }

  .reservation-trip-details-block {
    margin-top: 1rem;
  }
}

@media (max-width: 639px) {
  #booking-stepper {
    justify-content: center;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  #booking-stepper::-webkit-scrollbar {
    display: none;
  }

  #booking-stepper > li {
    flex: 0 0 auto !important;
  }

  #booking-stepper > li > .flex-1.h-px {
    flex: 0 0 1.25rem !important;
    width: 1.25rem;
    min-width: 1.25rem;
  }
}

/* Active selector field stacks above siblings when dropdown is open upward */
.home-booking-field:has([data-w3-display]),
.booking-field:has([data-w3-display]) {
  z-index: 100 !important;
}

/* Floating WhatsApp + back-to-top (site-wide) */
.floating-actions {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.5rem);
  transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
  pointer-events: none;
}

.floating-actions.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.floating-action-btn {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.2s ease;
}

.floating-action-btn:hover {
  transform: scale(1.06);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.24);
}

.floating-action-whatsapp {
  background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
  color: #fff;
}

.floating-action-top {
  background: var(--primary, oklch(0.22 0.04 260));
  color: var(--gold, oklch(0.78 0.14 75));
  border: 1px solid color-mix(in oklab, var(--gold, oklch(0.78 0.14 75)) 35%, transparent);
}

@media (min-width: 768px) {
  .floating-actions {
    right: 1.5rem;
    bottom: 1.5rem;
  }

  .floating-action-btn {
    width: 3.25rem;
    height: 3.25rem;
  }
}

.comfort-banner {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: 1.5rem;
  background-color: var(--primary);
}

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

.comfort-banner__image--primary {
  animation: comfort-banner-fade-primary 10s ease-in-out infinite;
}

.comfort-banner__image--secondary {
  animation: comfort-banner-fade-secondary 10s ease-in-out infinite;
}

@keyframes comfort-banner-fade-primary {
  0%,
  40%,
  100% {
    opacity: 1;
  }

  50%,
  90% {
    opacity: 0;
  }
}

@keyframes comfort-banner-fade-secondary {
  0%,
  40%,
  100% {
    opacity: 0;
  }

  50%,
  90% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .comfort-banner__image--primary,
  .comfort-banner__image--secondary {
    animation: none;
  }

  .comfort-banner__image--secondary {
    display: none;
  }
}

.comfort-banner__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    var(--primary) 0%,
    color-mix(in oklab, var(--primary) 55%, transparent) 45%,
    #ffae274d 100%
  );
}

.comfort-banner__content {
  z-index: 1;
  color: var(--primary-foreground);
}

@media (max-width: 767px) {
  .comfort-banner {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
  }
  
  .comfort-banner__image,
  .comfort-banner__overlay {
    position: relative;
    grid-area: 1 / 1;
    aspect-ratio: 16 / 9;
    height: auto;
    inset: auto;
  }

  .comfort-banner__content {
    position: relative;
    grid-area: 2 / 1;
    padding: 2rem 1.5rem;
  }
}

@media (min-width: 768px) {
  .comfort-banner {
    min-height: 320px;
    aspect-ratio: 9 / 4;
  }
  
  .comfort-banner__content {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    padding: 2.5rem;
  }
}

.review-platform-badges {
  max-width: 24rem;
}

.review-platform-badge {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.review-platform-badge a {
  display: inline-flex;
  transition: opacity 0.2s ease;
}

.review-platform-badge a:hover {
  opacity: 0.85;
}

.review-platform-badge__logo {
  flex: 0 0 auto;
  width: auto;
}

.review-platform-badge__logo--tripadvisor {
  height: 7.5rem;
}

.review-platform-badge__logo--google {
  height: 5rem;
}

@media (min-width: 768px) {
  .review-platform-badge__logo--google {
    height: 5.75rem;
  }
}

.review-platform-badge__stars {
  display: flex;
  align-items: center;
  gap: 0.125rem;
}

.reviews-section__header {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.reviews-section__meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.reviews-section__badges {
  flex-direction: row !important;
  align-items: center !important;
  gap: 1.25rem !important;
  max-width: none;
}

.reviews-section__badges .review-platform-badge__logo--tripadvisor {
  height: 4.5rem;
}

.reviews-section__badges .review-platform-badge__logo--google {
  height: 3.25rem;
  margin-top: 0 !important;
}

@media (min-width: 768px) {
  .reviews-section__header {
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2rem;
  }

  .reviews-section__meta {
    text-align: right;
  }
}

.reviews-carousel {
  width: 100%;
}

.reviews-carousel__main {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.reviews-carousel__viewport {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

.reviews-carousel__container {
  display: flex;
  align-items: stretch;
  transition: transform 0.45s ease;
  will-change: transform;
}

.reviews-carousel__slide {
  box-sizing: border-box;
  padding: 0 0.375rem;
  flex-shrink: 0;
  display: flex;
  align-items: stretch;
}

.reviews-carousel__card {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 17.5rem;
  height: 17.5rem;
}

.reviews-carousel__card blockquote {
  flex: 1 1 auto;
  min-height: 0;
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.reviews-carousel__card figcaption {
  margin-top: auto;
  flex-shrink: 0;
}

.reviews-carousel__btn {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  border: 1px solid var(--border, #e5e7eb);
  background: var(--card, #fff);
  color: var(--foreground, #1f1f1f);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 150ms ease,
    color 150ms ease,
    background-color 150ms ease;
}

.reviews-carousel__btn:hover:not(:disabled) {
  border-color: var(--gold, #e6940e);
  color: var(--gold, #e6940e);
}

.reviews-carousel__btn:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.reviews-carousel__counter {
  margin-top: 1rem;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted-foreground, #808080);
}

@media (min-width: 640px) {
  .reviews-carousel__card {
    min-height: 18rem;
    height: 18rem;
  }
}

@media (max-width: 639px) {
  .reviews-carousel__btn {
    width: 2.25rem;
    height: 2.25rem;
  }
}

@media screen and (max-width: 1023px) {
  .review-platform-badges {
    flex-direction: row !important;
    align-items: center !important;
    gap: 1.5rem !important;
  }

  .review-platform-badge__logo--google{margin-top: 20px;}
  
  .order-last-mobile {
    order: 9999 !important;
  }
}

.rates-filter-field.is-open {
  z-index: 100;
}

.rates-filter-field {
  padding: 0.5rem 0.75rem;
}

.rates-filter-field .rates-filter-control {
  margin-top: 0.25rem;
}

.rates-filter-trigger {
  color: inherit;
  line-height: 1.25;
}

.rates-filter-trigger:focus {
  outline: none;
}

.rates-filter-chevron {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid currentColor;
  opacity: 0.45;
  pointer-events: none;
  transition: transform 0.2s ease;
}

.rates-filter-field.is-open .rates-filter-chevron {
  transform: rotate(180deg);
}

.rates-filter-menu {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  overflow: auto;
  max-height: 390px;
  background: var(--card, #fff);
  color: var(--card-foreground, var(--foreground, #1f1f1f));
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 0.75rem;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
  z-index: 200;
}

.rates-filter-menu.open-down {
  top: calc(100% + 6px);
  bottom: auto;
}

.rates-filter-menu.open-up {
  top: auto;
  bottom: calc(100% + 6px);
}

.rates-filter-option {
  display: block;
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4;
  text-align: left;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border, #e5e7eb);
  cursor: pointer;
  transition: background-color 150ms ease, color 150ms ease;
}

.rates-filter-option:last-child {
  border-bottom: 0;
}

.rates-filter-option:hover,
.rates-filter-option.is-selected {
  color: var(--gold, #e6940e);
  background: var(--accent, #f4f4f5);
}

.rates-filter-book {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.625rem 1.25rem;
  line-height: 1.25;
}

.rates-filter-book__label {
  display: inline-flex;
  align-items: center;
  text-align: center;
}

@media screen and (max-width: 639px) {
  .rates-filter-book {
    width: 100%;
    max-width: 16rem;
  }
}

.rates-contact-card {
  max-width: 42rem;
  margin-inline: auto;
  padding: 1.75rem 1.5rem;
  text-align: center;
  border-radius: 1.5rem;
  border: 1px solid color-mix(in oklab, var(--gold, #e6940e) 28%, var(--border));
  background: linear-gradient(
    135deg,
    color-mix(in oklab, var(--gold, #e6940e) 8%, var(--card, #fff)) 0%,
    var(--secondary, #f8f8f8) 100%
  );
  box-shadow: var(--shadow-card, 0 8px 24px -12px oklch(0.18 0.04 260 / 0.18));
}

.rates-contact-card__icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  border-radius: 9999px;
  background: color-mix(in oklab, var(--gold, #e6940e) 14%, var(--card, #fff));
  color: var(--gold, #e6940e);
  box-shadow: 0 0 0 1px color-mix(in oklab, var(--gold, #e6940e) 22%, transparent);
}

.rates-contact-card__message {
  margin: 0;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--foreground);
}

.rates-contact-card__link {
  font-weight: 600;
  color: var(--gold, #e6940e);
  text-decoration: underline;
  text-underline-offset: 0.15em;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.rates-contact-card__link:hover {
  opacity: 0.85;
}

.rates-contact-card__details {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.rates-contact-card__detail {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1rem;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background: var(--card, #fff);
  color: var(--foreground);
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.rates-contact-card__detail:hover {
  border-color: color-mix(in oklab, var(--gold, #e6940e) 45%, var(--border));
  color: var(--gold, #e6940e);
  box-shadow: 0 4px 14px color-mix(in oklab, var(--gold, #e6940e) 12%, transparent);
}

@media screen and (max-width: 639px) {
  .rates-contact-card {
    padding: 1.5rem 1.125rem;
  }

  .rates-contact-card__details {
    flex-direction: column;
    align-items: stretch;
  }

  .rates-contact-card__detail {
    justify-content: center;
  }

  .rates-contact-card__detail span {
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

@media screen and (max-width: 600px) {
  .rates-table {
    font-size: 13px;
  }

  .rates-table thead {
    font-size: 11px;
  }

  .rates-table th:first-child,
  .rates-table td:first-child {
    position: sticky;
    left: 0;
    z-index: 10;
    background-color: var(--card, #fff);
    width: clamp(8rem, calc(100vw - 9rem - 2rem), 12rem) !important;
    min-width: 8rem !important;
    max-width: clamp(8rem, calc(100vw - 9rem - 2rem), 12rem) !important;
    white-space: normal !important;
    word-break: break-word;
    padding-left: 0.75rem !important;
    padding-right: 0.5rem !important;
    font-size: 13px !important;
    line-height: 1.35;
  }

  .rates-table th:first-child {
    background-color: var(--secondary, #f1f5f9);
  }

  .rates-table th:not(:first-child),
  .rates-table td:not(:first-child) {
    width: 4.5rem;
    min-width: 4.5rem;
    max-width: 4.5rem;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    font-size: 13px !important;
  }

  .rates-table td:first-child .size-2 {
    width: 0.375rem;
    height: 0.375rem;
  }
}
.overflow-x-auto {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
}

.min-w-max {
  min-width: max-content;
}

.break-all {
  word-break: break-all;
}

/* Scroll reveal — smooth fade-in as sections enter the viewport */
@media (prefers-reduced-motion: no-preference) {
  .scroll-reveal .reveal,
  .scroll-reveal .reveal-left,
  .scroll-reveal .reveal-right,
  .scroll-reveal .reveal-scale {
    /* opacity: 0; */
    transition:
      opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
      transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--reveal-delay, 0ms);
    will-change: opacity, transform;
  }

  .scroll-reveal .reveal {
    transform: translateY(2rem);
  }

  .scroll-reveal .reveal-left {
    transform: translateX(-2.5rem);
  }

  .scroll-reveal .reveal-right {
    transform: translateX(2.5rem);
  }

  .scroll-reveal .reveal-scale {
    transform: translateY(1.25rem) scale(0.97);
  }

  .scroll-reveal .reveal.active,
  .scroll-reveal .reveal-left.active,
  .scroll-reveal .reveal-right.active,
  .scroll-reveal .reveal-scale.active {
    opacity: 1;
    transform: none;
  }

  .scroll-reveal img[data-src] {
    opacity: 0;
    transition: opacity 0.5s ease;
  }

  .scroll-reveal img.reveal-loaded {
    opacity: 1;
  }
}

/* Header live availability indicator (phone link) */
.header-live-dot {
  position: relative;
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  margin-right: 10px;
}

.header-live-dot::before,
.header-live-dot::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #22c55e;
}

.header-live-dot::before {
  z-index: 1;
}

.header-live-dot::after {
  animation: header-live-pulse 1.8s ease-out infinite;
}

@keyframes header-live-pulse {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }
  70%,
  100% {
    transform: scale(2.4);
    opacity: 0;
  }
}

header.site-header,
header.disney-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  width: 100%;
  transition: background-color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

body > main {
  padding-top: var(--site-header-height, 4.5rem);
}

header.site-header {
  background-color: #0f1726eb;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

header.site-header.is-scrolled {
  background-color: #0f1726fa;
  border-bottom-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

header.disney-header.is-scrolled {
  box-shadow: 0 8px 24px rgba(190, 24, 93, 0.18);
}

header.site-header .site-mobile-menu {
  background-color: #0f1726;
  border-top-color: rgba(255, 255, 255, 0.08);
}

/* Header nav + phone hover effects */
header.site-header > .container-prose nav a,
header.disney-header > .container-prose nav a {
  position: relative;
  transition: color 0.2s ease, background-color 0.2s ease;
}

header.site-header > .container-prose nav a::after,
header.disney-header > .container-prose nav a::after {
  content: "";
  position: absolute;
  left: 0.75rem;
  right: 0.75rem;
  bottom: 0.25rem;
  height: 2px;
  border-radius: 1px;
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.25s ease;
}

header.site-header > .container-prose nav a::after {
  background: var(--gold, oklch(0.78 0.14 75));
}

header.disney-header > .container-prose nav a::after {
  background: #db2777;
}

header.site-header > .container-prose nav a:hover {
  color: var(--gold, oklch(0.78 0.14 75));
  background-color: rgba(255, 255, 255, 0.08);
}

header.disney-header > .container-prose nav a:hover {
  color: #be185d;
  background-color: rgba(244, 114, 182, 0.18);
}

header.site-header > .container-prose nav a:hover::after,
header.disney-header > .container-prose nav a:hover::after {
  transform: scaleX(1);
}

header.site-header > .container-prose a[href^="tel:"],
header.disney-header > .container-prose a[href^="tel:"] {
  border-radius: 9999px;
  padding: 0.375rem 0.875rem;
  margin-inline: -0.375rem;
  transition: color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

header.site-header > .container-prose a[href^="tel:"]:hover {
  color: var(--gold, oklch(0.78 0.14 75));
  background-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 0 0 1px color-mix(in oklab, var(--gold, oklch(0.78 0.14 75)) 35%, transparent);
}

header.disney-header > .container-prose a[href^="tel:"]:hover {
  color: #be185d;
  background-color: rgba(244, 114, 182, 0.2);
  box-shadow: 0 0 0 1px rgba(219, 39, 119, 0.35);
}

header.site-header .site-mobile-menu .container-prose > a:not(.bg-gold-gradient),
header.disney-header .disney-mobile-menu .container-prose > a:not(.bg-gold-gradient) {
  transition: color 0.2s ease, background-color 0.2s ease, padding-left 0.2s ease;
}

header.site-header .site-mobile-menu .container-prose > a:not(.bg-gold-gradient):hover {
  color: var(--gold, oklch(0.78 0.14 75));
  background-color: rgba(255, 255, 255, 0.12);
  padding-left: 1.25rem;
}

header.disney-header .disney-mobile-menu .container-prose > a:not(.bg-gold-gradient):hover {
  color: #be185d;
  background-color: rgba(244, 114, 182, 0.22);
  padding-left: 1.25rem;
}

@media (prefers-reduced-motion: reduce) {
  header.site-header > .container-prose nav a,
  header.disney-header > .container-prose nav a,
  header.site-header > .container-prose a[href^="tel:"],
  header.disney-header > .container-prose a[href^="tel:"],
  header.site-header .site-mobile-menu .container-prose > a:not(.bg-gold-gradient),
  header.disney-header .disney-mobile-menu .container-prose > a:not(.bg-gold-gradient) {
    transition: none;
  }

  header.site-header > .container-prose nav a::after,
  header.disney-header > .container-prose nav a::after {
    display: none;
  }
}

/* Fix header overlap and whitespace issues up to 1150px */
@media screen and (max-width: 1150px) {
  /* Hide desktop menu items that overflow */
  header nav.lg\:flex {
    display: none !important;
  }
  
  /* Show the mobile menu button */
  header button#mobile-menu-btn.lg\:hidden {
    display: block !important;
  }
  
  /* Ensure the mobile menu container can be shown when active */
  #mobile-menu.lg\:hidden:not(.hidden) {
    display: block !important;
  }
}

/* Prevent horizontal scroll globally to fix whitespace issues at specific breakpoints */
html {
  overflow-x: clip;
}

/* Missing utility classes not compiled in output.css */
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.pb-12 { padding-bottom: 3rem; }

/* Hero title brand — white text with gold color sweep (homepage) */
.hero-title-brand {
  display: inline-block;
  background-image: linear-gradient(
    105deg,
    var(--primary-foreground) 0%,
    var(--primary-foreground) 36%,
    var(--gold) 46%,
    oklch(0.88 0.16 80) 50%,
    var(--gold) 54%,
    var(--primary-foreground) 64%,
    var(--primary-foreground) 100%
  );
  background-size: 280% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  animation:
    hero-title-enter 1.1s cubic-bezier(0.22, 1, 0.36, 1) both,
    hero-title-color-sweep 4s linear 1.2s infinite;
}

@keyframes hero-title-enter {
  from {
    opacity: 0;
    transform: translateY(0.625rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes hero-title-color-sweep {
  0% {
    background-position: 100% center;
  }

  100% {
    background-position: 0% center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-title-brand {
    animation: none;
    color: inherit;
    -webkit-text-fill-color: inherit;
    background: none;
  }
}

/* Booking summary page */
.summary-page-title {
  padding-bottom: 0.25rem;
}

.summary-page-title__bar {
  box-shadow: 0 0 12px color-mix(in oklab, var(--gold, #e6940e) 35%, transparent);
}

.summary-wrap {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.summary-heading {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0 0 0.75rem;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--foreground);
}

.summary-heading::before {
  content: "";
  width: 0.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background: var(--gradient-gold);
  flex-shrink: 0;
}

.summary-card {
  border: 1px solid var(--border);
  border-radius: 1rem;
  overflow: hidden;
  background: var(--card);
}

.summary-row {
  display: flex;
  gap: 0.875rem;
  padding: 0.875rem 1rem;
  border-bottom: 1px solid color-mix(in oklab, var(--border) 65%, transparent);
}

.summary-row:last-child {
  border-bottom: none;
}

.summary-row:nth-child(odd) {
  background: color-mix(in oklab, var(--secondary) 45%, transparent);
}

.summary-row-icon {
  flex-shrink: 0;
}

.summary-icon-wrap {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.625rem;
  background: color-mix(in oklab, var(--gold) 14%, var(--secondary));
  color: var(--gold);
}

.summary-icon-lucide {
  width: 1rem;
  height: 1rem;
}

.summary-row-content {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: 0.25rem;
}

@media (min-width: 640px) {
  .summary-row-content {
    grid-template-columns: 34% 1fr;
    align-items: start;
    gap: 1rem;
  }
}

.summary-row-label {
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted-foreground);
}

.summary-row-value {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--foreground);
  word-break: break-word;
}

.summary-row-price {
  background: var(--secondary) !important;
  border-top: 1px solid var(--border);
}

.summary-row-price .summary-row-label {
  text-transform: none;
  letter-spacing: normal;
  font-size: 0.9375rem;
  color: var(--foreground);
}

.summary-row-price .summary-row-value {
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--foreground);
}

/* Hero typewriter (homepage) */
@keyframes hero-typewriter-blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

.hero-typewriter-cursor {
  animation: hero-typewriter-blink 0.9s step-end infinite;
  font-weight: 300;
  margin-left: 1px;
}

@media (prefers-reduced-motion: reduce) {
  .hero-typewriter-cursor {
    animation: none;
    opacity: 1;
  }
}



