/* Restaurant & Bar page-owned styles */

.restaurant-page {
  background-color: var(--color-ivory-linen);
}

/* Section base adjustments */
.restaurant-page .section {
  padding-block: var(--space-4xl);
}

.restaurant-page .section--alt {
  background-color: var(--color-alabaster-pearl);
  border-top: 1px solid var(--color-soft-champagne);
  border-bottom: 1px solid var(--color-soft-champagne);
}

.restaurant-page .section--dark {
  background-color: var(--color-sovereign-green);
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark h2 {
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark p {
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark .feature-list li {
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark .feature-list__check {
  color: var(--color-bright-gold);
}

.restaurant-page .section--dark-green {
  background-color: var(--color-sovereign-green);
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark-green h2 {
  color: var(--color-ivory-linen);
}

.restaurant-page .section--dark-green p {
  color: var(--color-ivory-linen);
}

/* Hero */
.restaurant-hero {
  padding-block: var(--space-4xl) var(--space-3xl);
  background-color: var(--color-ivory-linen);
}

.restaurant-hero__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-lg);
  max-width: 800px;
}

.restaurant-hero__kicker {
  margin-block-end: 0;
}

.restaurant-hero__title {
  max-width: 800px;
  margin-block-end: 0;
}

.restaurant-hero__lead {
  max-width: 600px;
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  margin-block-start: var(--space-lg);
}

/* Philosophy */
.restaurant-philosophy__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
}

.restaurant-philosophy__text {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-philosophy__text h2 {
  margin-block-end: var(--space-md);
}

.restaurant-philosophy__text p {
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-philosophy__features {
  grid-column: span 6;
  grid-column-start: 7;
  min-width: 0;
}

.restaurant-philosophy__list {
  margin-block-end: 0;
}

.restaurant-philosophy__list li {
  margin-block-end: var(--space-sm);
}

/* Menu */
.restaurant-menu__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  margin-block-end: var(--space-2xl);
}

.restaurant-menu__header h2 {
  margin-block-end: 0;
}

.restaurant-menu__intro {
  max-width: 600px;
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-menu__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.restaurant-menu-card {
  background-color: var(--color-ceramic-white);
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
  transition: border-color var(--transition-color);
}

.restaurant-menu-card:hover {
  border-color: var(--color-brushed-gold);
}

.restaurant-menu-card h3 {
  margin-block-end: 0;
}

.restaurant-menu-card p {
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-menu-card .divider {
  margin-block: 0;
}

.restaurant-menu-card__note {
  font-size: var(--text-small);
  line-height: var(--leading-small);
  color: var(--color-warm-slate);
}

/* Spirits */
.restaurant-spirits__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
}

.restaurant-spirits__text {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-spirits__text h2 {
  margin-block-end: var(--space-md);
}

.restaurant-spirits__text p {
  margin-block-end: 0;
  color: var(--color-ivory-linen);
}

.restaurant-spirits__features {
  grid-column: span 6;
  grid-column-start: 7;
  min-width: 0;
}

.restaurant-spirits__list {
  margin-block-end: 0;
}

.restaurant-spirits__list li {
  margin-block-end: var(--space-sm);
  color: var(--color-ivory-linen);
}

/* Dining Space */
.restaurant-dining-space__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
  align-items: start;
}

.restaurant-dining-space__text {
  grid-column: span 7;
  min-width: 0;
}

.restaurant-dining-space__text h2 {
  margin-block-end: var(--space-md);
}

.restaurant-dining-space__text p {
  margin-block-end: var(--space-md);
  color: var(--color-warm-slate);
}

.restaurant-dining-space__text p:last-child {
  margin-block-end: 0;
}

.restaurant-dining-space__media {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-dining-space__figure {
  margin-block-end: 0;
  position: relative;
}

.restaurant-dining-space__figure .media-frame {
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  overflow: hidden;
  transition: border-color var(--transition-color);
}

.restaurant-dining-space__figure .media-frame:hover {
  border-color: var(--color-brushed-gold);
}

.restaurant-dining-space__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.restaurant-dining-space__caption {
  position: absolute;
  bottom: -24px;
  left: -24px;
  width: calc(33.333% + 24px);
  max-width: 260px;
  background-color: var(--color-ceramic-white);
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  padding: var(--space-md);
  font-size: var(--text-small);
  line-height: var(--leading-small);
  color: var(--color-warm-slate);
  margin-block-start: 0;
  box-shadow: var(--shadow-elevated);
}

/* Service */
.restaurant-service__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-md);
  max-width: 800px;
}

.restaurant-service__inner h2 {
  margin-block-end: 0;
}

.restaurant-service__inner p {
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-service__list {
  margin-block-end: 0;
  padding-inline-start: var(--space-lg);
}

.restaurant-service__list li {
  margin-block-end: var(--space-sm);
}

/* Signature */
.restaurant-signature__header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-sm);
  margin-block-end: var(--space-2xl);
}

.restaurant-signature__header h2 {
  margin-block-end: 0;
}

.restaurant-signature__intro {
  max-width: 600px;
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-signature__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-lg);
}

.restaurant-signature-card {
  background-color: var(--color-ceramic-white);
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  padding: var(--space-lg);
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  min-width: 0;
  transition: border-color var(--transition-color);
}

.restaurant-signature-card:hover {
  border-color: var(--color-brushed-gold);
}

.restaurant-signature-card h3 {
  margin-block-end: 0;
}

.restaurant-signature-card p {
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-signature-card .divider {
  margin-block: 0;
}

.restaurant-signature-card__note {
  font-size: var(--text-small);
  line-height: var(--leading-small);
  color: var(--color-warm-slate);
}

/* Private */
.restaurant-private__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
}

.restaurant-private__text {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-private__text h2 {
  margin-block-end: var(--space-md);
}

.restaurant-private__text p {
  margin-block-end: 0;
  color: var(--color-warm-slate);
}

.restaurant-private__features {
  grid-column: span 6;
  grid-column-start: 7;
  min-width: 0;
}

.restaurant-private__list {
  margin-block-end: 0;
}

.restaurant-private__list li {
  margin-block-end: var(--space-sm);
}

/* Bar */
.restaurant-bar__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: var(--space-lg);
  align-items: start;
}

.restaurant-bar__media {
  grid-column: span 5;
  min-width: 0;
}

.restaurant-bar__figure {
  margin-block-end: 0;
  position: relative;
}

.restaurant-bar__figure .media-frame {
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  overflow: hidden;
  transition: border-color var(--transition-color);
}

.restaurant-bar__figure .media-frame:hover {
  border-color: var(--color-brushed-gold);
}

.restaurant-bar__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.restaurant-bar__caption {
  position: absolute;
  bottom: -24px;
  right: -24px;
  width: calc(33.333% + 24px);
  max-width: 260px;
  background-color: var(--color-ceramic-white);
  border: 1px solid var(--color-soft-champagne);
  border-radius: var(--radius-default);
  padding: var(--space-md);
  font-size: var(--text-small);
  line-height: var(--leading-small);
  color: var(--color-warm-slate);
  margin-block-start: 0;
  box-shadow: var(--shadow-elevated);
}

.restaurant-bar__text {
  grid-column: span 7;
  min-width: 0;
}

.restaurant-bar__text h2 {
  margin-block-end: var(--space-md);
}

.restaurant-bar__text p {
  margin-block-end: var(--space-md);
  color: var(--color-warm-slate);
}

.restaurant-bar__text p:last-child {
  margin-block-end: 0;
}

/* Reserve */
.restaurant-reserve__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: var(--space-lg);
  max-width: 700px;
  margin-inline: auto;
}

.restaurant-reserve__inner h2 {
  margin-block-end: 0;
  color: var(--color-ivory-linen);
}

.restaurant-reserve__inner p {
  margin-block-end: 0;
  color: var(--color-ivory-linen);
}

.restaurant-reserve__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: var(--space-md);
  margin-block-start: var(--space-lg);
}

.restaurant-reserve__btn {
  background-color: var(--color-ceramic-white);
  color: var(--color-sovereign-green);
  border-color: var(--color-ceramic-white);
}

.restaurant-reserve__btn:hover {
  background-color: var(--color-ivory-linen);
  border-color: var(--color-bright-gold);
  color: var(--color-sovereign-green);
}

.restaurant-reserve__link {
  color: var(--color-ivory-linen);
}

.restaurant-reserve__link:hover {
  color: var(--color-bright-gold);
}

.restaurant-reserve__contact {
  font-size: var(--text-small);
  line-height: var(--leading-small);
  color: var(--color-ivory-linen);
  opacity: 0.8;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .restaurant-philosophy__text,
  .restaurant-spirits__text,
  .restaurant-private__text {
    grid-column: span 6;
  }

  .restaurant-philosophy__features,
  .restaurant-spirits__features,
  .restaurant-private__features {
    grid-column: span 6;
    grid-column-start: 7;
  }

  .restaurant-menu__grid,
  .restaurant-signature__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .restaurant-menu-card:last-child,
  .restaurant-signature-card:last-child {
    grid-column: span 2;
  }

  .restaurant-dining-space__text,
  .restaurant-bar__text {
    grid-column: span 7;
  }

  .restaurant-dining-space__media,
  .restaurant-bar__media {
    grid-column: span 5;
  }

  .restaurant-dining-space__caption,
  .restaurant-bar__caption {
    position: static;
    width: 100%;
    max-width: 100%;
    margin-block-start: var(--space-md);
    border-top: 1px solid var(--color-soft-champagne);
    border-radius: 0;
    box-shadow: none;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .restaurant-page .section {
    padding-block: var(--space-3xl);
  }

  .restaurant-hero {
    padding-block: var(--space-3xl) var(--space-2xl);
  }

  .restaurant-hero__inner {
    max-width: 100%;
    gap: var(--space-md);
  }

  .restaurant-hero__title {
    max-width: 100%;
  }

  .restaurant-hero__lead {
    max-width: 100%;
  }

  .restaurant-hero__actions {
    flex-direction: column;
    width: 100%;
  }

  .restaurant-hero__actions .btn {
    width: 100%;
  }

  .restaurant-philosophy__grid,
  .restaurant-spirits__grid,
  .restaurant-private__grid {
    grid-template-columns: 1fr;
    gap: var(--space-md);
  }

  .restaurant-philosophy__text,
  .restaurant-philosophy__features,
  .restaurant-spirits__text,
  .restaurant-spirits__features,
  .restaurant-private__text,
  .restaurant-private__features {
    grid-column: span 1;
    grid-column-start: auto;
  }

  .restaurant-menu__grid,
  .restaurant-signature__grid {
    grid-template-columns: 1fr;
    gap: var(--space-md);
  }

  .restaurant-menu-card,
  .restaurant-signature-card {
    padding: var(--space-md);
  }

  .restaurant-dining-space__grid,
  .restaurant-bar__grid {
    grid-template-columns: 1fr;
    gap: var(--space-md);
  }

  .restaurant-dining-space__text,
  .restaurant-dining-space__media,
  .restaurant-bar__media,
  .restaurant-bar__text {
    grid-column: span 1;
  }

  .restaurant-dining-space__caption,
  .restaurant-bar__caption {
    position: static;
    width: 100%;
    max-width: 100%;
    margin-block-start: var(--space-md);
    border-top: 1px solid var(--color-soft-champagne);
    border-radius: 0;
    box-shadow: none;
  }

  .restaurant-service__inner {
    max-width: 100%;
  }

  .restaurant-service__list {
    padding-inline-start: 0;
  }

  .restaurant-reserve__inner {
    max-width: 100%;
  }

  .restaurant-reserve__actions {
    flex-direction: column;
    width: 100%;
  }

  .restaurant-reserve__btn {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .restaurant-page .container {
    padding-inline: var(--space-md);
  }

  .restaurant-page .section {
    padding-block: var(--space-2xl);
  }

  .restaurant-hero__title {
    font-size: clamp(2rem, 8vw, 2.5rem);
  }
}