.reservation-hero {
  padding-bottom: 0;
}

.reservation-hero__head {
  max-width: 56rem;
  margin: 0 auto;
}

.reservation-config {
  padding-top: 2rem;
}

.reservation-switcher {
  display: grid;
  gap: 2rem;
}

.reservation-switcher__controls {
  display: flex;
  justify-content: center;
  gap: 0.9rem;
  flex-wrap: wrap;
}

.reservation-switcher__tab {
  min-width: 12rem;
  padding: 0.95rem 1.5rem;
  border-radius: 999px;
  border: 1px solid rgba(241, 171, 126, 0.5);
  background: rgba(255, 255, 255, 0.88);
  color: var(--color-ink);
  font: 700 1rem/1 var(--font-display);
  cursor: pointer;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
}

.reservation-switcher__tab:hover,
.reservation-switcher__tab:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 16px 28px rgba(255, 138, 90, 0.14);
  border-color: rgba(255, 138, 90, 0.5);
}

.reservation-switcher__tab.is-active {
  background: linear-gradient(135deg, #ff6f1f, #ff8d6b);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 18px 30px rgba(255, 138, 90, 0.22);
}

.reservation-switcher__panel[hidden] {
  display: none;
}

.reservation-config__embed .section-head {
  margin-bottom: 2.25rem;
}

.reservation-config__embed .section-head h2 {
  max-width: 18ch;
  margin-inline: auto;
}

.reservation-config__embed {
  padding-top: 16px;
}

@media (max-width: 767px) {
  .reservation-switcher__controls {
    justify-content: stretch;
  }

  .reservation-switcher__tab {
    width: 100%;
  }
}