/*
  OSTERIA VERMIGLIA — concept demo stylesheet.
  Design language: warm editorial. Paper canvas, terracotta accent, light
  Garamond display over a geometric sans, hairline rules instead of cards,
  asymmetric image blocks and slow mask reveals.
*/

.ov {
  --ink: #191012;
  --ink-2: #4a3c3a;
  --ink-3: #8a7a74;
  --paper: #f7f2ea;
  --paper-2: #efe7db;
  --terra: #b8552e;
  --olive: #6b7053;
  --rule: rgba(25, 16, 18, .14);
  --rule-soft: rgba(25, 16, 18, .08);
  --serif: "Cormorant Garamond", "Iowan Old Style", Georgia, serif;
  --sans: "Jost", "Futura", "Century Gothic", system-ui, sans-serif;
  --shell: 1320px;
  --gut: clamp(20px, 5vw, 72px);

  margin: var(--appv-bar-h) 0 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--sans);
  font-size: 17px;
  font-weight: 300;
  line-height: 1.72;
  -webkit-font-smoothing: antialiased;
}
.ov *, .ov *::before, .ov *::after { box-sizing: border-box; }
:where(.ov) img { display: block; max-width: 100%; height: auto; }
/* :where() keeps the reset at element specificity so button and link classes
   below can still set their own colour. */
:where(.ov) a { color: inherit; text-decoration: none; }
:where(.ov) p { margin: 0 0 1.1em; }
.ov :focus-visible { outline: 2px solid var(--terra); outline-offset: 3px; }

.ov .skip { position: fixed; left: 12px; top: -80px; z-index: 200; padding: 10px 16px; color: var(--paper); background: var(--ink); transition: top .18s; }
.ov .skip:focus { top: calc(var(--appv-bar-h) + 10px); }

.ov-shell { width: min(100% - var(--gut) * 2, var(--shell)); margin-inline: auto; }

.ov h1, .ov h2, .ov h3 { margin: 0; font-family: var(--serif); font-weight: 400; line-height: 1.03; letter-spacing: -.012em; }
.ov h1 { font-size: clamp(2.9rem, 6.6vw, 5.6rem); }
.ov h2 { font-size: clamp(2.1rem, 4.2vw, 3.5rem); }
.ov h3 { font-size: clamp(1.18rem, 1.7vw, 1.45rem); }
.ov h1 em, .ov h2 em { font-style: italic; color: var(--terra); }

.ov-eyebrow {
  margin: 0 0 20px; font-family: var(--sans); font-size: .74rem; font-weight: 400;
  letter-spacing: .32em; text-transform: uppercase; color: var(--ink-3);
}
.ov-lede { font-family: var(--serif); font-size: clamp(1.5rem, 2.6vw, 2.15rem); line-height: 1.34; font-style: italic; }
.ov-hint { color: var(--ink-3); font-size: .85rem; line-height: 1.6; }

/* ---------------------------------------------------------------- buttons */

.ov-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 13px 30px; border: 1px solid var(--ink); border-radius: 999px;
  color: var(--paper); background: var(--ink); cursor: pointer;
  font-family: var(--sans); font-size: .82rem; font-weight: 400; letter-spacing: .16em; text-transform: uppercase;
  transition: background .22s ease, color .22s ease, border-color .22s ease;
}
.ov-btn:hover { background: var(--terra); border-color: var(--terra); }
.ov-btn--lg { min-height: 58px; padding: 16px 38px; }
.ov-btn--quiet { color: var(--ink); background: transparent; border-color: var(--rule); }
.ov-btn--quiet:hover { color: var(--paper); }
.ov-btn--light { color: var(--ink); background: var(--paper); border-color: var(--paper); }
.ov-btn--light:hover { color: var(--paper); background: var(--terra); border-color: var(--terra); }
.ov-btn--block { display: flex; width: 100%; }

.ov-link {
  display: inline-flex; align-items: center; gap: 10px; padding-bottom: 3px;
  border-bottom: 1px solid var(--rule);
  font-size: .84rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink);
  transition: border-color .22s ease, color .22s ease;
}
.ov-link:hover { color: var(--terra); border-color: var(--terra); }
.ov-link i { font-style: normal; transition: transform .22s ease; }
.ov-link:hover i { transform: translateX(6px); }
.ov-link--light { color: var(--paper); border-color: rgba(247, 242, 234, .38); }
.ov-link--light:hover { color: #fff; border-color: #fff; }
.ov-link--lg { margin-top: 40px; }

/* ----------------------------------------------------------------- header */

.ov-head { position: sticky; top: var(--appv-bar-h); z-index: 90; background: rgba(247, 242, 234, .93); border-bottom: 1px solid var(--rule-soft); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.ov-head__inner { display: flex; align-items: center; gap: 34px; height: 82px; }
.ov-logo { flex: 0 0 auto; display: flex; flex-direction: column; line-height: 1; }
.ov-logo__name { font-family: var(--serif); font-size: 1.85rem; font-style: italic; letter-spacing: -.02em; }
.ov-logo__sub { font-size: .62rem; letter-spacing: .34em; text-transform: uppercase; color: var(--ink-3); }
.ov-nav { display: flex; gap: 30px; margin: 0 auto; }
.ov-nav a { position: relative; font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-2); transition: color .2s; }
.ov-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 1px; background: var(--terra); transition: right .3s ease; }
.ov-nav a:hover { color: var(--ink); }
.ov-nav a:hover::after, .ov-nav a[aria-current]::after { right: 0; }
.ov-nav a[aria-current] { color: var(--terra); }
.ov-head__actions { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; }

.ov-burger { display: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--rule); border-radius: 999px; background: none; cursor: pointer; }
.ov-burger span { display: block; width: 16px; height: 1px; margin: 4px auto; background: var(--ink); transition: transform .22s, opacity .22s; }
.ov-burger[aria-expanded="true"] span:first-child { transform: translateY(2.5px) rotate(45deg); }
.ov-burger[aria-expanded="true"] span:last-child { transform: translateY(-2.5px) rotate(-45deg); }
.ov-mobile { display: none; }

/* ------------------------------------------------------------------- hero */

.ov-hero { position: relative; display: flex; align-items: flex-end; min-height: min(88vh, 860px); padding: 130px 0 74px; overflow: hidden; color: var(--paper); }
.ov-hero__media { position: absolute; inset: -6% 0; }
.ov-hero__media picture, .ov-hero__img { width: 100%; height: 100%; object-fit: cover; }
.ov-hero__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(25, 16, 18, .62) 0%, rgba(25, 16, 18, .3) 40%, rgba(25, 16, 18, .86) 100%); }
.ov-hero__inner { position: relative; z-index: 2; }
.ov-hero .ov-eyebrow { color: rgba(247, 242, 234, .72); }
.ov-hero h1 { max-width: 15ch; }
.ov-hero h1 em { color: #edb08c; }
.ov-hero__lead { max-width: 48ch; margin-top: 26px; color: rgba(247, 242, 234, .84); font-size: 1.08rem; }
.ov-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 34px; }
.ov-hero__actions .ov-btn { color: var(--ink); background: var(--paper); border-color: var(--paper); }
.ov-hero__actions .ov-btn:hover { color: var(--paper); background: var(--terra); border-color: var(--terra); }
.ov-hero__caption { position: absolute; right: var(--gut); bottom: 26px; z-index: 2; margin: 0; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(247, 242, 234, .5); }

/* --------------------------------------------------------------- sections */

.ov-section { padding: clamp(70px, 9vw, 140px) 0; }
.ov-section--tight { padding: clamp(40px, 5vw, 70px) 0 clamp(70px, 9vw, 120px); }
.ov-headline { max-width: 48ch; margin-bottom: 56px; }

.ov-pagehead { padding: clamp(110px, 13vw, 180px) 0 clamp(46px, 6vw, 78px); border-bottom: 1px solid var(--rule-soft); }
.ov-pagehead--tight { padding-bottom: clamp(26px, 3vw, 40px); }
.ov-pagehead__lead { max-width: 56ch; margin-top: 26px; color: var(--ink-2); font-size: 1.06rem; }

.ov-intro__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr); gap: clamp(34px, 6vw, 96px); align-items: start; }
.ov-intro__side { padding-top: 10px; color: var(--ink-2); }

/* ------------------------------------------------------------------ dishes */

.ov-dishrow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 34px); }
.ov-dish { margin: 0; }
.ov-dish__media { display: block; overflow: hidden; }
.ov-dish__media img { transition: transform .8s cubic-bezier(.2, .7, .3, 1); }
.ov-dish:hover .ov-dish__media img { transform: scale(1.05); }
.ov-dish figcaption { padding-top: 20px; }
.ov-dish h3 { margin-bottom: 8px; }
.ov-dish p { margin: 0 0 12px; color: var(--ink-2); font-size: .92rem; line-height: 1.62; }
.ov-dish__price { font-size: .8rem; letter-spacing: .18em; color: var(--terra); }
.ov-dish:nth-child(even) { margin-top: 48px; }

/* --------------------------------------------------------------- feature */

.ov-feature__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(34px, 6vw, 90px); align-items: center; }
.ov-feature__copy h2 { margin-bottom: 22px; }
.ov-feature__copy p { color: var(--ink-2); }
.ov-list { margin: 26px 0 30px; padding: 0; list-style: none; }
.ov-list li { padding: 13px 0; border-top: 1px solid var(--rule-soft); color: var(--ink-2); font-size: .95rem; }
.ov-list li b { font-weight: 500; color: var(--ink); }

/* ----------------------------------------------------------- dark section */

.ov-dark { color: var(--paper); background: var(--ink); }
.ov-dark .ov-eyebrow { color: rgba(247, 242, 234, .55); }
.ov-dark__text { max-width: 46ch; margin-bottom: 30px; color: rgba(247, 242, 234, .78); }
.ov-areas__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr); gap: clamp(34px, 6vw, 88px); align-items: start; }
.ov-areas { border-top: 1px solid rgba(247, 242, 234, .2); }
.ov-area { padding: 28px 0; border-bottom: 1px solid rgba(247, 242, 234, .2); }
.ov-area h3 { color: #edb08c; }
.ov-area__seats { margin: 6px 0 10px; font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(247, 242, 234, .55); }
.ov-area p:last-child { margin: 0; color: rgba(247, 242, 234, .82); font-size: .95rem; }

/* ------------------------------------------------------------------ split */

.ov-split__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(34px, 6vw, 90px); align-items: center; }
.ov-split__copy p { color: var(--ink-2); }
.ov-eventlist { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--rule); }
.ov-eventlist li { display: grid; grid-template-columns: 140px minmax(0, 1fr) auto; gap: 18px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--rule); }
.ov-eventlist__date { font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); }
.ov-eventlist__title { font-family: var(--serif); font-size: 1.4rem; }
.ov-eventlist__price { font-size: .82rem; letter-spacing: .12em; color: var(--terra); }

/* ------------------------------------------------------------------- menu */

.ov-menu__grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.ov-menu__rail { position: sticky; top: calc(var(--appv-bar-h) + 104px); }
.ov-menu__rail nav { display: flex; flex-direction: column; border-top: 1px solid var(--rule); margin-bottom: 30px; }
.ov-menu__rail nav a { padding: 12px 0; border-bottom: 1px solid var(--rule); font-family: var(--serif); font-size: 1.28rem; transition: color .2s, padding-left .2s; }
.ov-menu__rail nav a:hover, .ov-menu__rail nav a.is-active { padding-left: 10px; color: var(--terra); }
.ov-menu__filters { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 20px; }
.ov-chip { padding: 8px 15px; border: 1px solid var(--rule); border-radius: 999px; background: none; cursor: pointer; font: inherit; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); transition: .2s; }
.ov-chip:hover { border-color: var(--terra); color: var(--terra); }
.ov-chip.is-active { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.ov-menu__legend { font-size: .8rem; line-height: 1.6; color: var(--ink-3); }
.ov-menu__legend b { font-weight: 500; color: var(--terra); }

.ov-course { margin-bottom: clamp(46px, 6vw, 78px); scroll-margin-top: calc(var(--appv-bar-h) + 110px); }
.ov-course.is-hidden { display: none; }
.ov-course header { margin-bottom: 26px; padding-bottom: 14px; border-bottom: 1px solid var(--ink); }
.ov-course header p { margin: 6px 0 0; font-size: .84rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.ov-course ul { margin: 0; padding: 0; list-style: none; }
.ov-item { padding: 20px 0; border-bottom: 1px solid var(--rule-soft); }
.ov-item.is-hidden { display: none; }
.ov-item__head { display: flex; align-items: baseline; gap: 12px; }
.ov-item__head h3 { flex: 0 0 auto; }
.ov-item__dots { flex: 1; height: 1px; background-image: radial-gradient(circle, var(--ink-3) .7px, transparent .8px); background-size: 6px 1px; background-position: 0 100%; opacity: .5; }
.ov-item__price { flex: 0 0 auto; font-family: var(--serif); font-size: 1.32rem; color: var(--terra); }
.ov-item p { margin: 8px 0 0; max-width: 62ch; color: var(--ink-2); font-size: .95rem; }
.ov-item__tags { display: inline-flex; gap: 5px; margin-left: 4px; }
.ov-item__tags i { display: inline-grid; place-items: center; width: 19px; height: 19px; border: 1px solid var(--rule); border-radius: 50%; font-size: .66rem; font-style: normal; color: var(--olive); }
.ov-menu__empty { padding: 34px 0; color: var(--ink-3); }

/* ------------------------------------------------------------ reservation */

.ov-reserve { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr); gap: clamp(30px, 5vw, 76px); align-items: start; }
.ov-steps { display: flex; gap: 0; margin: 0 0 40px; padding: 0; list-style: none; border-bottom: 1px solid var(--rule); }
.ov-steps li { display: flex; align-items: center; gap: 9px; padding: 0 22px 16px 0; color: var(--ink-3); font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; }
.ov-steps b { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--rule); border-radius: 50%; font-family: var(--serif); font-size: .95rem; font-weight: 400; }
.ov-steps li.is-active { color: var(--terra); }
.ov-steps li.is-active b { color: var(--paper); background: var(--terra); border-color: var(--terra); }
.ov-steps li.is-done b { color: var(--paper); background: var(--ink); border-color: var(--ink); }

.ov-step { display: none; margin: 0; padding: 0; border: 0; }
.ov-step.is-active { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.ov-step legend { grid-column: 1 / -1; float: left; width: 100%; margin-bottom: 12px; padding: 0; font-family: var(--serif); font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.06; }

.ov-field { display: flex; flex-direction: column; gap: 8px; }
.ov-field > span { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); }
.ov-field input, .ov-field select, .ov-field textarea {
  width: 100%; padding: 13px 0; border: 0; border-bottom: 1px solid var(--rule);
  color: var(--ink); background: transparent; font: inherit; font-size: 1rem;
}
.ov-field textarea { resize: vertical; }
.ov-field input:focus, .ov-field select:focus, .ov-field textarea:focus { outline: 0; border-color: var(--terra); }
.ov-field--wide { grid-column: 1 / -1; }

.ov-times { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; }
.ov-time input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ov-time span { display: block; padding: 11px 20px; border: 1px solid var(--rule); border-radius: 999px; cursor: pointer; font-size: .9rem; transition: .2s; }
.ov-time input:checked + span { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.ov-time input:focus-visible + span { outline: 2px solid var(--terra); outline-offset: 2px; }

.ov-counter { grid-column: 1 / -1; display: inline-flex; align-items: center; gap: 24px; }
.ov-counter__btn { width: 52px; height: 52px; border: 1px solid var(--rule); border-radius: 50%; background: none; cursor: pointer; font-size: 1.4rem; color: var(--ink); transition: .2s; }
.ov-counter__btn:hover { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.ov-counter__value { min-width: 64px; font-family: var(--serif); font-size: 3rem; text-align: center; }

.ov-areas__choice { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ov-areachoice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ov-areachoice span { display: block; height: 100%; padding: 20px; border: 1px solid var(--rule); cursor: pointer; transition: .2s; }
.ov-areachoice b { display: block; font-family: var(--serif); font-size: 1.35rem; font-weight: 400; }
.ov-areachoice i { display: block; margin: 4px 0 10px; font-size: .7rem; font-style: normal; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }
.ov-areachoice em { font-style: normal; font-size: .88rem; color: var(--ink-2); }
.ov-areachoice input:checked + span { border-color: var(--terra); background: rgba(184, 85, 46, .06); }
.ov-areachoice input:focus-visible + span { outline: 2px solid var(--terra); outline-offset: 2px; }

.ov-reserve__nav { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 40px; padding-top: 26px; border-top: 1px solid var(--rule); }
.ov-reserve__side { padding: 30px; background: var(--paper-2); }
.ov-reserve__side h2 { margin-bottom: 18px; font-size: 1.6rem; }
.ov-recap { margin: 0 0 24px; }
.ov-recap > div { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--rule-soft); }
.ov-recap dt { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-3); }
.ov-recap dd { margin: 0; text-align: right; font-size: .95rem; }
.ov-reserve__media { margin-bottom: 18px; }

/* -------------------------------------------------------------- editorial */

.ov-editorial { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(28px, 4vw, 60px) clamp(20px, 3vw, 48px); align-items: start; }
.ov-editorial__figure { grid-column: span 5; margin: 0; }
.ov-editorial__figure--wide { grid-column: span 7; }
.ov-editorial__figure figcaption { padding-top: 12px; font-size: .78rem; letter-spacing: .1em; color: var(--ink-3); }
.ov-editorial__text { grid-column: span 5; }
.ov-editorial__figure--wide + .ov-editorial__text { grid-column: span 5; }
.ov-editorial__text h2 { margin-bottom: 14px; font-size: clamp(1.7rem, 2.6vw, 2.3rem); }
.ov-editorial__text h2 + p { margin-top: 0; }
.ov-editorial__text p { color: var(--ink-2); }
.ov-editorial__text h2:not(:first-child) { margin-top: 34px; }

/* ----------------------------------------------------------------- events */

.ov-events { border-top: 1px solid var(--rule); }
.ov-event { display: grid; grid-template-columns: 130px minmax(0, 1fr) auto; gap: clamp(20px, 3vw, 46px); align-items: center; padding: 34px 0; border-bottom: 1px solid var(--rule); }
.ov-event__date { display: flex; flex-direction: column; }
.ov-event__date span { font-family: var(--serif); font-size: 3rem; line-height: 1; color: var(--terra); }
.ov-event__date i { font-size: .74rem; font-style: normal; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-3); }
.ov-event__body h2 { margin-bottom: 8px; font-size: clamp(1.5rem, 2.3vw, 2rem); }
.ov-event__body p { margin: 0 0 8px; max-width: 62ch; color: var(--ink-2); font-size: .95rem; }
.ov-event__meta { font-size: .82rem !important; letter-spacing: .06em; color: var(--ink-3) !important; }
.ov-event__meta b { color: var(--terra); font-weight: 500; }

.ov-private { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(34px, 6vw, 84px); align-items: start; }
.ov-private__form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.ov-private__form .ov-field > span { color: rgba(247, 242, 234, .6); }
.ov-private__form .ov-field input, .ov-private__form .ov-field textarea { color: var(--paper); border-color: rgba(247, 242, 234, .28); }
.ov-private__form .ov-btn { grid-column: 1 / -1; justify-self: start; }

/* ---------------------------------------------------------------- contact */

.ov-contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(34px, 6vw, 90px); align-items: start; }
.ov-contact h2 { margin-bottom: 16px; font-size: 1.9rem; }
.ov-contact h2:not(:first-child) { margin-top: 40px; }
.ov-contact address { font-style: normal; color: var(--ink-2); line-height: 1.9; }
.ov-hours > div { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-bottom: 1px solid var(--rule-soft); }
.ov-hours dt { color: var(--ink-2); font-size: .95rem; }
.ov-hours dd { margin: 0; font-size: .95rem; }
.ov-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-content: start; padding: clamp(26px, 3vw, 40px); background: var(--paper-2); }
.ov-form h2 { grid-column: 1 / -1; }
.ov-form .ov-btn { grid-column: 1 / -1; justify-self: start; }

/* -------------------------------------------------------------------- CTA */

.ov-cta { padding: clamp(70px, 9vw, 130px) 0; text-align: center; color: var(--paper); background: var(--ink); }
.ov-cta .ov-eyebrow { color: rgba(247, 242, 234, .55); }
.ov-cta h2 { margin-bottom: 34px; }
.ov-cta .ov-btn { color: var(--ink); background: var(--paper); border-color: var(--paper); }
.ov-cta .ov-btn:hover { color: var(--paper); background: var(--terra); border-color: var(--terra); }
.ov-cta--soft { color: var(--ink); background: var(--paper-2); }
.ov-cta--soft .ov-btn { color: var(--paper); background: var(--ink); border-color: var(--ink); }

/* ----------------------------------------------------------------- footer */

.ov-foot { padding: clamp(56px, 7vw, 92px) 0 36px; border-top: 1px solid var(--rule); }
.ov-foot__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: clamp(28px, 4vw, 64px); padding-bottom: 40px; }
.ov-foot h2 { margin-bottom: 16px; font-size: 1.25rem; }
.ov-foot__brand p { max-width: 34ch; margin-top: 14px; color: var(--ink-2); font-size: .92rem; }
.ov-foot address { font-style: normal; margin-bottom: 18px; color: var(--ink-2); font-size: .92rem; line-height: 1.9; }
.ov-foot__hours > div { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; font-size: .88rem; }
.ov-foot__hours dt { color: var(--ink-3); }
.ov-foot__hours dd { margin: 0; }
.ov-note { padding-top: 26px; border-top: 1px solid var(--rule-soft); color: var(--ink-3); font-size: .78rem; line-height: 1.7; }
.ov-note a { color: var(--ink-2); text-decoration: underline; text-underline-offset: 3px; }
.ov-note a:hover { color: var(--terra); }

/* ------------------------------------------------------------------ motion */

/* Scoped to html.appv-demo, which the demo kit sets once its script runs, so
   the content is never hidden when JavaScript is unavailable. */
@media (prefers-reduced-motion: no-preference) {
  html.appv-demo [data-reveal] { opacity: 0; clip-path: inset(0 0 14% 0); transform: translateY(16px); transition: opacity .9s ease, clip-path 1s cubic-bezier(.2, .7, .25, 1), transform .9s cubic-bezier(.2, .7, .25, 1); }
  html.appv-demo [data-reveal].is-in { opacity: 1; clip-path: inset(0 0 0 0); transform: none; }
}

/* ------------------------------------------------------------- responsive */

@media (max-width: 1080px) {
  .ov-nav { display: none; }
  .ov-burger { display: block; }
  .ov-mobile { display: block; max-height: 0; overflow: hidden; background: var(--paper-2); transition: max-height .28s ease; }
  .ov-mobile.is-open { max-height: 420px; }
  .ov-mobile a { display: block; padding: 15px var(--gut); border-top: 1px solid var(--rule-soft); font-family: var(--serif); font-size: 1.35rem; }
  .ov-mobile .ov-btn--block { width: auto; margin: 18px var(--gut) 24px; }
  .ov-dishrow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ov-menu__grid { grid-template-columns: minmax(0, 1fr); }
  .ov-menu__rail { position: static; }
  .ov-menu__rail nav { flex-direction: row; flex-wrap: wrap; gap: 8px; border: 0; }
  .ov-menu__rail nav a { padding: 9px 16px; border: 1px solid var(--rule); border-radius: 999px; font-size: 1rem; }
  .ov-menu__rail nav a:hover, .ov-menu__rail nav a.is-active { padding-left: 16px; }
  .ov-reserve { grid-template-columns: minmax(0, 1fr); }
  .ov-editorial__figure, .ov-editorial__figure--wide, .ov-editorial__text { grid-column: span 12; }
}

@media (max-width: 900px) {
  .ov-intro__grid, .ov-feature__grid, .ov-areas__grid, .ov-split__grid, .ov-private, .ov-contact { grid-template-columns: minmax(0, 1fr); }
  .ov-foot__grid { grid-template-columns: minmax(0, 1fr); }
  .ov-event { grid-template-columns: 96px minmax(0, 1fr); }
  .ov-event__action { grid-column: 2; }
  .ov-eventlist li { grid-template-columns: minmax(0, 1fr) auto; }
  .ov-eventlist__date { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
  .ov-head__inner { height: 68px; gap: 14px; }
  .ov-head__actions > .ov-btn { display: none; }
  .ov-logo__name { font-size: 1.5rem; }
  .ov-dishrow { grid-template-columns: minmax(0, 1fr); }
  .ov-dish:nth-child(even) { margin-top: 0; }
  .ov-step.is-active, .ov-form, .ov-private__form { grid-template-columns: minmax(0, 1fr); }
  .ov-areas__choice { grid-template-columns: minmax(0, 1fr); }
  .ov-steps { flex-wrap: wrap; gap: 4px 0; }
  .ov-steps li { padding-right: 14px; font-size: .68rem; }
  .ov-hero { min-height: auto; padding: 104px 0 56px; }
  .ov-hero__caption { display: none; }
}
