/* Restaurant page. Loaded by restaurant.php only. */

/* Introduction: heading top left, a large serif sentence and the copy to its
   right; below, a wide photograph with a small upright one tucked under its
   left edge. */
.rest-intro__grid {
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--gutter); row-gap: clamp(2rem, 4vw, 3rem);
}
.rest-intro__head { grid-column: 1 / span 4; }
.rest-intro__copy { grid-column: 6 / span 6; padding-top: .4rem; }
.rest-intro__lead {
  font-family: var(--serif); font-weight: 300;
  font-size: clamp(1.6rem, 2.6vw, 2.35rem); line-height: 1.22; letter-spacing: -.01em;
  color: var(--forest); max-width: 24ch;
}
.rest-intro__text { margin-top: 2rem; columns: 2; column-gap: clamp(1.5rem, 3vw, 3rem); }
.rest-intro__text p { color: var(--ink-soft); font-size: .95rem; line-height: 1.85; break-inside: avoid; }
.rest-intro__text p + p { margin-top: 1rem; }
.rest-intro__copy .link-line { margin-top: 2.4rem; }
.rest-intro__main { grid-column: 4 / -1; grid-row: 3; }
.rest-intro__small { grid-column: 1 / span 3; grid-row: 3; align-self: end; margin-bottom: clamp(-6rem, -6vw, -2rem); position: relative; z-index: 1; }
.rest-intro__small figcaption, .rest-menu__photo figcaption { margin-top: .8rem; font-size: .74rem; letter-spacing: .06em; color: var(--ink-soft); }
.rest-intro { padding-bottom: calc(var(--section) + clamp(1.5rem, 4vw, 4rem)); }
@media (max-width: 900px) {
  .rest-intro__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 2.5rem; }
  .rest-intro__head, .rest-intro__copy { grid-column: 1 / -1; }
  .rest-intro__head h2 { margin-bottom: 0; }
  .rest-intro__text { columns: 1; }
  .rest-intro__main { grid-column: 1 / -1; grid-row: auto; }
  .rest-intro__small { grid-column: 4 / -1; grid-row: auto; margin: -3.5rem 0 0; }
  .rest-intro { padding-bottom: var(--section); }
}

/* Evening: the shared forest feature, run edge to edge on the right. */
.rest-evening .feature--reverse .feature__panel { padding-right: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); }
.rest-evening .feature__inset { width: 24%; right: -9%; bottom: -10%; }
@media (max-width: 900px) { .rest-evening .feature--reverse .feature__panel { padding-right: var(--gutter); } }

/* Menu: heading and an upright photograph on the left, the highlights set
   like a printed menu card on the right. */
.rest-menu__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2.5rem, 7vw, 7rem); align-items: start; }
.rest-menu__head { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.rest-menu__head p { max-width: 36ch; }
.rest-menu__photo { width: min(100%, 22rem); }
.rest-menu__card {
  position: sticky; top: calc(var(--header-h) + 2rem);
  background: var(--paper);
  padding: clamp(2rem, 5vw, 4.5rem) clamp(1.5rem, 5vw, 4.5rem);
  margin-top: clamp(0rem, 8vw, 8rem);
}
.rest-menu__card::before {
  content: ""; position: absolute; inset: .9rem; border: 1px solid var(--line); pointer-events: none;
}
.rest-menu__list { list-style: none; border-top: 1px solid var(--line); position: relative; }
.rest-menu__item {
  display: grid; grid-template-columns: 3rem minmax(0, 1fr) auto; gap: .4rem 1.2rem; align-items: baseline;
  padding: 1.5rem 0; border-bottom: 1px solid var(--line);
}
.rest-menu__n { font-size: .68rem; letter-spacing: .2em; color: var(--sage); }
.rest-menu__body { display: grid; gap: .45rem; }
.rest-menu__tag { font-size: .64rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--moss); }
.rest-menu__name { font-family: var(--serif); font-weight: 300; font-size: clamp(1.4rem, 2.2vw, 1.95rem); line-height: 1.15; color: var(--forest); }
.rest-menu__price { font-size: .86rem; color: var(--ink-soft); white-space: nowrap; }
.rest-menu__note {
  position: relative; margin-top: 2rem; padding-left: 3rem;
  font-family: var(--serif); font-style: italic; font-size: 1.12rem; line-height: 1.5; color: var(--moss); max-width: 40ch;
}
.rest-menu__note::before { content: ""; position: absolute; left: 0; top: .8em; width: 1.8rem; height: 1px; background: var(--sage); }
.rest-menu__card .btn { margin-top: 2.4rem; position: relative; }
@media (max-width: 900px) {
  .rest-menu__grid { grid-template-columns: 1fr; }
  .rest-menu__card { position: relative; top: auto; margin-top: 0; }
  .rest-menu__photo { width: 70%; }
}
@media (max-width: 520px) {
  .rest-menu__item { grid-template-columns: 2.2rem minmax(0, 1fr); }
  .rest-menu__price { grid-column: 2; }
  .rest-menu__note { padding-left: 0; }
  .rest-menu__note::before { display: none; }
}

/* Food photographs: a rail of mixed upright and landscape frames at one height. */
.rest-plates .rail__track { grid-auto-columns: max-content; align-items: start; }
.rest-plate { --h: clamp(240px, 26vw, 380px); height: var(--h); width: calc(var(--h) * var(--r, 1.5)); overflow: hidden; background: var(--mist); }
.rest-plate img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease-out); }
.rest-plate:hover img { transform: scale(1.03); }
@media (max-width: 640px) { .rest-plate { --h: 230px; } }

/* Booking: the words and a photograph on the left, the form on the right. */
.rest-book__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(3rem, 7vw, 7rem); align-items: start; }
.rest-book__intro h2 { margin-bottom: 1.8rem; }
.rest-book__text p { color: var(--on-dark-soft); max-width: 40ch; }
.rest-book__text p + p { margin-top: 1rem; }
.rest-book__photo { margin-top: clamp(2.5rem, 5vw, 4rem); }
.rest-book__form { padding-top: .4rem; }
.rest-book__form .alert { margin-bottom: 1.6rem; }
.rest-book__submit { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 2rem; margin-top: .8rem; }
.rest-book__submit .hint { font-size: .84rem; margin: 0; }
.rest-book .field .err { color: #F2B8A8; }
.rest-book .field.has-error input, .rest-book .field.has-error select { border-color: #F2B8A8; }
/* Native pickers (the calendar icon, the option list) drawn for a dark field. */
.rest-book .field input, .rest-book .field select, .rest-book .field textarea { color-scheme: dark; }
.rest-book .field select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23C7D0C1' stroke-width='1.2' fill='none'/%3E%3C/svg%3E"); }
.rest-book .field textarea::placeholder { color: rgba(246,245,240,.4); }
@media (max-width: 900px) {
  .rest-book__grid { grid-template-columns: 1fr; }
  .rest-book__photo { display: none; }
}