main {
  background-color: var(--color-background);
}

.hero--contact {
  background-color: #ffffff;
}

.hero__inner--contact {
  border-bottom: 1px solid var(--color-border-subtle);
}

.hero__cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-12);
  margin-top: var(--space-24);
}

.hero-media--contact {
  background: linear-gradient(135deg, #ffffff 0%, #f4f5f6 100%);
}

.section--contact-intro,
.section--location,
.section--reservation,
.section--groups,
.section--accessibility,
.section--social,
.section--lounge {
  background-color: #ffffff;
}

.contact-intro__grid,
.location__grid,
.reservation__grid,
.groups__grid,
.accessibility__grid,
.social__grid,
.lounge__grid {
  align-items: flex-start;
  gap: var(--space-40);
}

.contact-intro__card {
  align-self: center;
}

.card--location {
  background: linear-gradient(135deg, #ffffff 0%, #f7f8f9 100%);
}

.location-list,
.groups-list,
.accessibility-list,
.social-list,
.lounge-list,
.hours-list {
  display: grid;
  row-gap: var(--space-8);
  font-size: var(--font-size-sm);
  color: var(--color-text);
}

.location-list li::before,
.groups-list li::before,
.accessibility-list li::before,
.lounge-list li::before {
  content: "";
}

.hours-list {
  row-gap: var(--space-4);
  margin-top: var(--space-12);
}

.hours-list li {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--color-border-subtle);
  padding-block: 0.25rem;
}

.hours-list li span:first-child {
  color: var(--color-text-muted);
}

.reservation__card {
  align-self: stretch;
}

.reservation-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-20);
}

.form-field {
  display: flex;
  flex-direction: column;
}

.reservation-form__footer {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
  margin-top: var(--space-12);
}

.reservation-form__note {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.reservation__aside {
  display: flex;
  flex-direction: column;
}

.reservation__info-card + .reservation__info-card {
  margin-top: var(--space-20);
}

.groups__card,
.social__card,
.lounge__card {
  align-self: stretch;
}

.social-list li {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid var(--color-border-subtle);
  padding-block: 0.35rem;
}

.social-list li span:first-child {
  font-weight: 500;
}

.lounge__button {
  margin-top: var(--space-16);
}

.accessibility__card {
  align-self: center;
}

@media (max-width: 960px) {
  .reservation__grid,
  .contact-intro__grid,
  .location__grid,
  .groups__grid,
  .accessibility__grid,
  .social__grid,
  .lounge__grid {
    gap: var(--space-32);
  }

  .reservation__aside {
    margin-top: var(--space-16);
  }
}

@media (max-width: 640px) {
  .hero__cta-row {
    flex-direction: column;
    align-items: flex-start;
  }

  .hours-list li,
  .social-list li {
    column-gap: var(--space-12);
  }
}

ul {
  list-style: none !important;
}

.nav-toggle {
  flex-direction: column;
}