:root {
  --soft-tan-bg: rgba(210, 180, 140, 0.15);
  --soft-tan-solid: #f8f4ee;
}

html {
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  min-width: 320px;
  overflow-x: hidden;
  background-color: var(--soft-tan-bg);
}

.bg-white,
.bg-stone-50 {
  background-color: var(--soft-tan-bg) !important;
}

.compact-package.is-selected {
  background-color: var(--soft-tan-bg) !important;
}

.site-nav {
  background-color: var(--soft-tan-solid);
  border-bottom: 1px solid rgba(107, 71, 54, 0.14);
}

.brand-logo {
  flex-shrink: 0;
  object-fit: cover;
  border-radius: 999px;
}

.brand-logo-header,
.brand-logo-footer,
.brand-logo-on-dark {
  width: 2.5rem;
  height: 2.5rem;
}

.brand-logo-package {
  width: 3rem;
  height: 3rem;
}

#site-header,
main,
section,
footer {
  max-width: 100vw;
  overflow-x: clip;
}

.hero-bg h1 {
  overflow-wrap: break-word;
}

.section-bg {
  background-image: var(--section-bg-image);
  background-position: center;
  background-size: cover;
}

.section-bg-blur {
  background-image: var(--section-bg-image);
  background-position: center;
  background-size: cover;
  filter: blur(5px);
  transform: scale(1.04);
}

.testimonial-slider {
  cursor: grab;
  overflow: hidden;
  touch-action: none;
}

.testimonial-slider.is-dragging {
  cursor: grabbing;
}

.testimonial-track {
  display: flex;
  gap: 2rem;
  transition: transform 520ms ease;
  will-change: transform;
}

.testimonial-card {
  flex: 0 0 calc((100% - 4rem) / 3);
  user-select: none;
}

.hero-bg {
  background-image:
    linear-gradient(rgba(43, 27, 19, 0.74), rgba(43, 27, 19, 0.74)),
    var(--hero-image);
  background-position: center;
  background-size: cover;
}

.section-shell {
  width: min(calc(100% - 2rem), 80rem);
  margin-inline: auto;
  max-width: 80rem;
}

.focus-ring:focus-visible {
  outline: 3px solid rgba(140, 96, 75, 0.45);
  outline-offset: 3px;
}

.mobile-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 220ms ease;
}

.mobile-menu.is-open {
  max-height: 24rem;
}

.booking-package.is-selected {
  border-color: #8c604b;
  box-shadow: 0 20px 55px rgba(74, 48, 35, 0.16);
}

.compact-package.is-selected {
  background: #fff;
  border-color: #8c604b;
  box-shadow: 0 14px 34px rgba(74, 48, 35, 0.12);
}

.booking-status:empty {
  display: none;
}

.field-error:empty {
  display: none;
}

.booking-select {
  min-height: 3.25rem;
  padding-right: 3rem !important;
  background-image:
    linear-gradient(45deg, transparent 50%, #8c604b 50%),
    linear-gradient(135deg, #8c604b 50%, transparent 50%);
  background-position:
    calc(100% - 1.35rem) 50%,
    calc(100% - 1rem) 50%;
  background-repeat: no-repeat;
  background-size: 0.38rem 0.38rem, 0.38rem 0.38rem;
  color: #57534e;
  line-height: 1.35;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.booking-select::-ms-expand {
  display: none;
}

.back-to-top {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 60;
  display: inline-flex;
  width: 3.25rem;
  height: 3.25rem;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(234, 221, 215, 0.5);
  border-radius: 999px;
  background: #6b4736;
  color: #fff;
  box-shadow: 0 18px 35px rgba(43, 27, 19, 0.28);
  opacity: 1;
  transform: translateY(0);
  transition: opacity 180ms ease, transform 180ms ease, background 180ms ease;
}

.back-to-top:hover {
  background: #8c604b;
}

.back-to-top.is-hidden {
  pointer-events: none;
  opacity: 0;
  transform: translateY(0.75rem);
}

.map-frame {
  min-height: 24rem;
}

.history-item summary::-webkit-details-marker {
  display: none;
}

.history-item[open] .history-chevron {
  transform: rotate(180deg);
}

.history-chevron {
  transition: transform 180ms ease;
}

@media (min-width: 901px) and (max-width: 1199px) {
  .desktop-nav [data-nav-collapsible] {
    display: none !important;
  }

  .desktop-nav {
    gap: 2rem;
  }
}

@media (max-width: 900px) {
  .desktop-nav {
    display: none !important;
  }

  .mobile-nav-toggle {
    display: inline-flex !important;
  }

  .responsive-mobile-menu {
    display: block !important;
  }
}

.contact-input {
  width: 100%;
  background: transparent;
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  color: #fff;
  padding: 0 0 0.75rem;
  outline: none;
  scrollbar-color: #d2bab0 rgba(255, 255, 255, 0.08);
  scrollbar-width: thin;
}

.contact-input::placeholder {
  color: rgba(231, 229, 228, 0.65);
}

.contact-input:focus {
  border-bottom-color: #e0cec7;
}

.contact-input::-webkit-scrollbar {
  width: 6px;
}

.contact-input::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
  border-radius: 999px;
}

.contact-input::-webkit-scrollbar-thumb {
  background: #d2bab0;
  border-radius: 999px;
}

.contact-input::-webkit-scrollbar-thumb:hover {
  background: #e0cec7;
}

@media (max-width: 640px) {
  .section-shell {
    width: min(calc(100% - 1.5rem), 80rem);
  }

  #site-header .section-shell {
    width: min(calc(100% - 2rem), 80rem);
  }

  #site-header span {
    font-size: 1.35rem;
    white-space: nowrap;
  }

  [data-aos="fade-left"],
  [data-aos="fade-right"] {
    transform: translate3d(0, 30px, 0);
  }

  [data-aos="flip-up"] {
    transform: perspective(2500px) rotateX(12deg);
  }

  .map-frame {
    min-height: 19rem;
  }

  .back-to-top {
    right: 1rem;
    bottom: 1rem;
    width: 3rem;
    height: 3rem;
  }

  .testimonial-slider {
    height: calc((13rem * 2) + 1rem);
    max-width: 100%;
  }

  .testimonial-track {
    flex-direction: column !important;
    gap: 1rem;
    width: 100%;
  }

  .testimonial-card {
    flex: 0 0 13rem;
    width: 100%;
    min-height: 13rem;
    height: 13rem;
    overflow: hidden;
    padding: 1.25rem !important;
  }
}