/* Ledesma's Barber Shop · one-page site
   Reads the identity tokens (identity/tokens.css) as written; fonts are local copies in ./fonts.
   Phone first: everything below is the 390px column; the @media blocks at the end grow it. */

@font-face { font-family: "League Gothic"; src: url("fonts/LeagueGothic-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Lora"; src: url("fonts/Lora-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Lora"; src: url("fonts/Lora-Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Lora"; src: url("fonts/Lora-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  --window-black:  #1F1B18;
  --stucco:        #EDE3D1;
  --sheet:         #F7F1E6;
  --gold-leaf:     #C4933F;
  --clinker-brick: #8C3A24;
  --ash-shade:     #3E4A36;
  --monsoon-slate: #5F6E73;

  --ground: var(--stucco);
  --ink: var(--window-black);
  --accent: var(--gold-leaf);
  --offer: var(--clinker-brick);

  --font-display: "League Gothic", "Oswald", "Arial Narrow", sans-serif;
  --font-body: "Lora", "Georgia", serif;
  --display-tracking: 0.08em;
  --label-tracking: 0.22em;

  --step--1: 0.8125rem;
  --step-0: 1.0625rem;
  --step-1: 1.375rem;
  --step-2: clamp(1.75rem, 1.4rem + 1.6vw, 2.5rem);
  --step-3: clamp(2.5rem, 1.9rem + 2.8vw, 4.25rem);
  --leading-body: 1.55;
  --leading-display: 0.95;

  --space-1: 0.5rem; --space-2: 1rem; --space-3: 1.5rem; --space-4: 2.5rem; --space-5: 4rem;
  --radius-arch: 999px 999px 0 0;
  --radius: 2px;
  --gutter: 1.25rem;
  --measure: 34rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 4rem; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; } }
body {
  margin: 0; background: var(--ground); color: var(--ink);
  font-family: var(--font-body); font-size: var(--step-0); line-height: var(--leading-body);
}
img { display: block; max-width: 100%; height: auto; }
[hidden] { display: none !important; }
a { color: inherit; }
p { margin: 0 0 1em; }
.wrap { width: 100%; max-width: 72rem; margin: 0 auto; padding: 0 var(--gutter); }

/* ---- type voices ---------------------------------------------------- */
.display, h2, h3 {
  font-family: var(--font-display); font-weight: 400; text-transform: uppercase;
  letter-spacing: var(--display-tracking); line-height: var(--leading-display); margin: 0;
}
.label {
  font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking);
  font-size: 0.95rem; line-height: 1.2; margin: 0 0 var(--space-2);
}
h2 { font-size: var(--step-3); margin-bottom: var(--space-3); }
h3 { font-size: var(--step-2); }
.gilt { border: 0; height: 5px; border-top: 1px solid var(--gold-leaf); border-bottom: 1px solid var(--gold-leaf); margin: var(--space-3) 0; width: 4rem; }

/* ---- the one ask: Book a chair --------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 3rem; padding: .7rem 1.4rem; border: 0; border-radius: var(--radius);
  background: var(--gold-leaf); color: var(--window-black); text-decoration: none; cursor: pointer;
  font-family: var(--font-display); font-size: 1.35rem; letter-spacing: var(--display-tracking); text-transform: uppercase; line-height: 1;
}
.btn:hover { background: #d3a352; }
.btn:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible + span, select:focus-visible { outline: 2px solid var(--clinker-brick); outline-offset: 3px; }
.btn--brick { background: var(--clinker-brick); color: var(--sheet); }
.btn--brick:hover { background: #a1452c; }
.btn--small { min-height: 2.5rem; font-size: 1.1rem; padding: .5rem 1rem; }
.btn--ghost { background: transparent; color: inherit; box-shadow: inset 0 0 0 1px currentColor; }
.btn--ghost:hover { background: rgba(196,147,63,.15); }
.textlink { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: 1rem; text-underline-offset: .3em; text-decoration-thickness: 1px; }

/* ---- header ----------------------------------------------------------- */
.top {
  position: sticky; top: 0; z-index: 20; background: var(--window-black); color: var(--stucco);
  border-bottom: 1px solid rgba(196,147,63,.35);
}
.top .wrap { display: flex; align-items: center; justify-content: space-between; height: 3.5rem; gap: 1rem; }
.top__mark { display: flex; align-items: center; gap: .65rem; text-decoration: none; }
.top__mark img { height: 2.1rem; width: auto; }
.top__where { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .85rem; color: var(--stucco); opacity: .85; }
.top nav { display: none; }

/* ---- hero ------------------------------------------------------------- */
.hero { background: var(--window-black); color: var(--stucco); }
.hero__frame { position: relative; margin: 0; }
.hero__frame img { width: 100%; aspect-ratio: 900 / 896; object-fit: cover; }
.hero__body { padding: var(--space-3) var(--gutter) var(--space-4); }
.hero__kicker { color: var(--gold-leaf); }
.hero__line { font-size: clamp(2.6rem, 2rem + 3vw, 4.5rem); color: var(--sheet); margin: 0 0 var(--space-3); }
.hero__actions { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; }
.hero__facts { margin: var(--space-3) 0 0; padding: var(--space-2) 0 0; border-top: 1px solid rgba(237,227,209,.18); font-size: var(--step--1); color: rgba(237,227,209,.85); letter-spacing: .02em; }
.hero__facts b { font-weight: 600; color: var(--stucco); }

/* ---- declare: Ray's story -------------------------------------------- */
.declare { padding: var(--space-5) 0 var(--space-4); }
.declare .label { color: var(--clinker-brick); }
.pull {
  font-style: italic; font-size: 1.6rem; line-height: 1.3; margin: 0 0 var(--space-3); max-width: 30rem;
}
.pull__by { display: block; margin-top: .8rem; font-style: normal; font-family: var(--font-display); font-size: 1rem; letter-spacing: var(--label-tracking); text-transform: uppercase; color: var(--clinker-brick); }
.story { max-width: var(--measure); }
.promises { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--gold-leaf); }
.promises li { padding: var(--space-2) .75rem var(--space-2) 0; border-bottom: 1px solid rgba(31,27,24,.15); font-size: .95rem; line-height: 1.4; }
.promises li:nth-child(odd) { border-right: 1px solid rgba(31,27,24,.15); }
.promises li:nth-child(even) { padding-left: .9rem; }
.promises strong { display: block; font-family: var(--font-display); font-weight: 400; text-transform: uppercase; letter-spacing: var(--display-tracking); font-size: 1.3rem; line-height: 1; margin-bottom: .3rem; color: var(--clinker-brick); }

/* ---- the place --------------------------------------------------------- */
.place { background: var(--ash-shade); color: var(--stucco); padding: var(--space-5) 0; }
.place .label { color: var(--gold-leaf); }
.place h2 { color: var(--sheet); }
.place__lead { margin: 0; }
.place__lead img { width: 100%; aspect-ratio: 1600 / 1066; object-fit: cover; }
figcaption { font-size: var(--step--1); line-height: 1.45; padding-top: .6rem; color: rgba(237,227,209,.9); }
.place__row {
  display: grid; grid-auto-flow: column; grid-auto-columns: 78%; gap: .9rem;
  overflow-x: auto; scroll-snap-type: x mandatory; margin: var(--space-3) calc(-1 * var(--gutter)) 0; padding: 0 var(--gutter) .5rem;
  scrollbar-width: thin; scrollbar-color: rgba(196,147,63,.6) transparent; scroll-padding-inline: var(--gutter);
}
.place__grid { display: flex; flex-direction: column; }
.place__head { order: -1; margin-bottom: var(--space-3); }
.place__row figure { margin: 0; scroll-snap-align: start; }
.place__row img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-arch); }
.swipe-hint { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .8rem; color: var(--gold-leaf); margin: .75rem 0 0; }

/* ---- the menu ---------------------------------------------------------- */
.menu { padding: var(--space-5) 0; }
.menu .label { color: var(--clinker-brick); }
.menu__card { background: var(--sheet); padding: var(--space-4) var(--gutter); margin: 0 calc(-1 * var(--gutter)); border-top: 3px double var(--gold-leaf); border-bottom: 3px double var(--gold-leaf); }
.menu__note { font-style: italic; font-size: 1.1rem; line-height: 1.45; margin: 0 0 var(--space-4); max-width: var(--measure); }
.menu__note span { display: block; font-style: normal; font-size: var(--step--1); color: var(--monsoon-slate); margin-top: .4rem; }
.menu__group { margin: 0 0 var(--space-4); }
.menu__group:last-child { margin-bottom: 0; }
.menu__group h3 { font-size: 1.7rem; margin-bottom: .2rem; }
.menu__group .sub { font-size: var(--step--1); color: var(--monsoon-slate); margin: 0 0 var(--space-2); font-style: italic; }
.svc { list-style: none; margin: 0; padding: 0; }
.svc li { padding: .9rem 0; border-top: 1px solid rgba(31,27,24,.12); }
.svc__head { display: flex; align-items: baseline; gap: .5rem; }
.svc__name { font-weight: 600; }
.svc__dots { flex: 1; border-bottom: 1px dotted rgba(31,27,24,.4); transform: translateY(-.25em); min-width: 1rem; }
.svc__price { font-family: var(--font-display); font-size: 1.45rem; letter-spacing: .04em; line-height: 1; color: var(--clinker-brick); }
.svc__time { font-size: var(--step--1); color: var(--monsoon-slate); margin-left: .35rem; font-weight: 400; white-space: nowrap; }
.svc__line { font-size: .95rem; line-height: 1.45; margin: .3rem 0 0; }
.menu__card .note-sample { font-size: var(--step--1); color: var(--monsoon-slate); margin: var(--space-3) 0 0; }

/* ---- the chairs (barbers) --------------------------------------------- */
.chairs { background: var(--window-black); color: var(--stucco); padding: var(--space-5) 0; }
.chairs .label { color: var(--gold-leaf); }
.chairs h2 { color: var(--sheet); }
.chair-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }
.chair { display: grid; grid-template-columns: 5.5rem 1fr; gap: 1.1rem; align-items: start; }
.chair__arch {
  border-radius: var(--radius-arch); border: 2px solid var(--gold-leaf); outline: 1px solid var(--gold-leaf); outline-offset: 4px;
  aspect-ratio: 5 / 6; display: grid; place-items: center; margin: 5px; background: #2a2521;
}
.chair__arch span { font-family: var(--font-display); font-size: 3.4rem; color: var(--gold-leaf); line-height: 1; padding-top: .8rem; }
.chair__seat { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .85rem; color: var(--gold-leaf); margin: 0 0 .25rem; }
.chair h3 { color: var(--sheet); font-size: 2.1rem; margin-bottom: .5rem; }
.chair__ask { font-size: .98rem; margin: 0 0 .7rem; }
.chair__ask b { font-weight: 600; color: var(--sheet); }
.chair blockquote { margin: 0; padding-left: .9rem; border-left: 2px solid var(--clinker-brick); font-style: italic; color: rgba(237,227,209,.92); font-size: 1rem; }

/* ---- visit: hours & address ------------------------------------------ */
.visit { padding: var(--space-5) 0; }
.visit .label { color: var(--clinker-brick); }
.hours { width: 100%; border-collapse: collapse; margin: 0 0 var(--space-2); }
.hours th, .hours td { text-align: left; padding: .7rem 0; border-bottom: 1px solid rgba(31,27,24,.15); font-weight: 400; vertical-align: baseline; }
.hours th { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--display-tracking); font-size: 1.3rem; }
.hours td { text-align: right; }
.hours tr.closed td { color: var(--clinker-brick); }
.summer { font-size: .95rem; font-style: italic; margin: 0 0 var(--space-4); }
.address { font-style: normal; font-size: 1.15rem; line-height: 1.45; margin: 0 0 .6rem; }
.address strong { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; letter-spacing: var(--display-tracking); font-size: 1.8rem; display: block; line-height: 1; margin-bottom: .35rem; }
.rules { list-style: none; padding: 0; margin: var(--space-3) 0 0; }
.rules li { padding: .65rem 0; border-top: 1px solid rgba(31,27,24,.15); font-size: .98rem; line-height: 1.45; }
.rules b { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; letter-spacing: var(--display-tracking); font-size: 1.15rem; margin-right: .35rem; }
.phone-link { font-family: var(--font-display); font-size: 1.6rem; letter-spacing: .05em; text-decoration: none; color: var(--clinker-brick); }

/* ---- booking ----------------------------------------------------------- */
.book { background: var(--sheet); padding: var(--space-5) 0; border-top: 3px double var(--gold-leaf); }
.book .label { color: var(--clinker-brick); }
.book__honest { font-size: .92rem; line-height: 1.45; background: var(--stucco); border-left: 3px solid var(--clinker-brick); padding: .75rem .9rem; margin: 0 0 var(--space-4); max-width: var(--measure); }
.step { border: 0; padding: 0; margin: 0 0 var(--space-4); min-width: 0; }
.step legend { padding: 0; margin: 0 0 .8rem; display: flex; align-items: baseline; gap: .6rem; font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--display-tracking); font-size: 1.7rem; line-height: 1; }
.step legend i { font-style: normal; color: var(--sheet); background: var(--window-black); border-radius: var(--radius-arch); width: 1.6rem; height: 1.9rem; display: inline-grid; place-items: center; font-size: 1.15rem; padding-top: .2rem; }
.choices { display: grid; gap: .55rem; }
.choices--2 { grid-template-columns: 1fr 1fr; }
.choice { position: relative; display: block; }
.choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.choice span {
  display: block; padding: .75rem .85rem; border: 1px solid rgba(31,27,24,.3); border-radius: var(--radius); background: #fffaf1;
  line-height: 1.3; min-height: 3rem;
}
.choice span b { display: block; font-weight: 600; }
.choice span small { display: block; font-size: var(--step--1); color: var(--monsoon-slate); margin-top: .15rem; }
.choice input:checked + span { background: var(--window-black); color: var(--sheet); border-color: var(--window-black); box-shadow: inset 0 -3px 0 var(--gold-leaf); }
.choice input:checked + span small { color: rgba(247,241,230,.8); }
.choice input:disabled + span { opacity: .4; text-decoration: line-through; cursor: not-allowed; }
.choice input:focus-visible + span { outline: 2px solid var(--clinker-brick); outline-offset: 2px; }

.select { width: 100%; font: inherit; font-size: 1rem; padding: .8rem .85rem; border: 1px solid rgba(31,27,24,.35); border-radius: var(--radius); background: #fffaf1; color: var(--ink); min-height: 3rem; }
.extras { margin-top: .8rem; display: grid; gap: .5rem; }
.check { display: flex; gap: .6rem; align-items: flex-start; font-size: .95rem; line-height: 1.4; cursor: pointer; }
.check input { width: 1.25rem; height: 1.25rem; margin: .1rem 0 0; accent-color: var(--clinker-brick); flex: none; }
.check small { display: block; color: var(--monsoon-slate); font-size: var(--step--1); }

.days { display: grid; grid-auto-flow: column; grid-auto-columns: 5rem; gap: .5rem; overflow-x: auto; margin: 0 calc(-1 * var(--gutter)); padding: 0 var(--gutter) .4rem; scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); }
.days .choice { scroll-snap-align: start; }
.days .choice span { text-align: center; padding: .55rem .3rem; }
.days .choice span b { font-family: var(--font-display); font-weight: 400; font-size: 1.9rem; line-height: 1; letter-spacing: .03em; }
.days .choice span small { margin: 0; text-transform: uppercase; letter-spacing: .12em; }
.times { grid-template-columns: repeat(3, 1fr); }
.times .choice span { text-align: center; padding: .7rem .2rem; font-variant-numeric: tabular-nums; }
.hint { font-size: var(--step--1); color: var(--monsoon-slate); margin: .5rem 0 0; }
.field { display: grid; gap: .3rem; margin-bottom: .9rem; }
.field label { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .9rem; }
.field input { font: inherit; font-size: 1.05rem; padding: .8rem .85rem; border: 1px solid rgba(31,27,24,.35); border-radius: var(--radius); background: #fffaf1; color: var(--ink); min-height: 3rem; }
.field input[aria-invalid="true"] { border-color: var(--clinker-brick); box-shadow: inset 0 0 0 1px var(--clinker-brick); }
.err { color: var(--clinker-brick); font-size: var(--step--1); min-height: 1em; margin: 0; }

.tally { background: var(--window-black); color: var(--stucco); padding: var(--space-3) var(--gutter); margin: 0 calc(-1 * var(--gutter)); }
.tally__lines { list-style: none; margin: 0 0 var(--space-2); padding: 0; font-size: .95rem; }
.tally__lines li { display: flex; justify-content: space-between; gap: 1rem; padding: .25rem 0; }
.tally__lines li.minus { color: #e3b46a; }
.tally__total { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid rgba(196,147,63,.5); padding-top: .6rem; margin-bottom: var(--space-3); }
.tally__total span { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: 1rem; }
.tally__total b { font-family: var(--font-display); font-weight: 400; font-size: 2.4rem; line-height: 1; color: var(--gold-leaf); }
.tally .btn { width: 100%; }
.tally .err { color: #e8a58c; margin-top: .6rem; }

.confirm { max-width: 48rem; background: var(--window-black); color: var(--stucco); padding: var(--space-4) var(--gutter); margin: 0 calc(-1 * var(--gutter)); border-top: 3px solid var(--gold-leaf); }
.confirm .label { color: var(--gold-leaf); }
.confirm:focus { outline: none; }
.is-done { display: block !important; }
.is-done .book__steps, .is-done .tally { display: none; }
.is-done .book__aside { position: static; }
.is-done .mine { max-width: 48rem; }
.confirm h3 { color: var(--sheet); font-size: 2.6rem; margin-bottom: var(--space-2); }
.confirm dl { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; margin: 0 0 var(--space-3); }
.confirm dt { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .9rem; color: var(--gold-leaf); padding-top: .2rem; }
.confirm dd { margin: 0; }
.confirm__note { font-size: .92rem; font-style: italic; color: rgba(237,227,209,.88); }
.confirm__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: var(--space-3); }

.mine { margin-top: var(--space-4); }
.mine h3 { font-size: 1.7rem; margin-bottom: .6rem; }
.mine__list { list-style: none; margin: 0 0 var(--space-2); padding: 0; }
.mine__list li { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .75rem 0; border-top: 1px solid rgba(31,27,24,.15); font-size: .95rem; line-height: 1.4; }
.mine__list li:last-child { border-bottom: 1px solid rgba(31,27,24,.15); }
.mine__list button { background: none; border: 0; color: var(--clinker-brick); font: inherit; font-size: var(--step--1); text-decoration: underline; cursor: pointer; padding: .4rem 0; flex: none; }
.mine__empty { font-size: .95rem; color: var(--monsoon-slate); font-style: italic; }
.mine__tools { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; align-items: center; }
.mine__tools button { background: none; border: 0; padding: .4rem 0; font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .95rem; color: var(--ink); text-decoration: underline; text-underline-offset: .3em; cursor: pointer; }

/* ---- footer ------------------------------------------------------------ */
.foot { background: var(--window-black); color: var(--stucco); padding: var(--space-5) 0 calc(var(--space-4) + 4.75rem); /* room under the thumb bar on phone */ }
.foot .btn { color: var(--window-black); }
.foot__mark { width: 15rem; max-width: 80%; margin: 0 0 var(--space-3); }
.foot__cols { display: grid; gap: var(--space-3); font-size: .95rem; line-height: 1.5; }
.foot__cols p { margin: 0; }
.foot .label { color: var(--gold-leaf); margin-bottom: .4rem; font-size: .85rem; }
.foot a { color: var(--stucco); }
.foot__base { margin-top: var(--space-4); padding-top: var(--space-2); border-top: 1px solid rgba(196,147,63,.35); font-size: var(--step--1); color: rgba(237,227,209,.78); display: grid; gap: .4rem; }

/* ---- the thumb bar (phone) ------------------------------------------- */
.thumb {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; gap: .6rem; align-items: center;
  padding: .6rem var(--gutter) calc(.6rem + env(safe-area-inset-bottom)); background: rgba(31,27,24,.96);
  border-top: 1px solid rgba(196,147,63,.45); transition: transform .25s ease;
}
.thumb .btn { flex: 1; }
.thumb__call { color: var(--stucco); font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .95rem; text-decoration: none; padding: .7rem .4rem; }
.thumb.is-hidden { transform: translateY(110%); }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ===================== the desktop grows from the column ===================== */
@media (min-width: 720px) {
  :root { --gutter: 2rem; }
  .place__row { grid-auto-flow: row; grid-template-columns: repeat(3, 1fr); grid-auto-columns: auto; overflow: visible; margin: var(--space-3) 0 0; padding: 0; }
  .swipe-hint { display: none; }
  .menu__card { margin: 0; padding: var(--space-4) var(--space-4); }
  .chair-list { grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
  .chair { grid-template-columns: 1fr; }
  .chair__arch { width: 7rem; }
  .choices--svc { grid-template-columns: 1fr 1fr; }
  .times { grid-template-columns: repeat(6, 1fr); }
  .days { grid-auto-flow: row; grid-template-columns: repeat(7, 1fr); grid-auto-columns: auto; overflow: visible; margin: 0; padding: 0; }
  .tally, .confirm { margin: 0; padding: var(--space-3); }
  .foot__cols { grid-template-columns: 1.2fr 1fr 1fr; }
}

@media (min-width: 960px) {
  .foot { padding-bottom: var(--space-4); }
  .thumb { display: none; }
  .top .wrap { height: 4rem; }
  .top nav { display: flex; gap: 1.6rem; align-items: center; }
  .top nav a { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--label-tracking); font-size: .95rem; text-decoration: none; color: var(--stucco); }
  .top nav a:hover { color: var(--gold-leaf); }
  .top nav .btn { color: var(--window-black); }
  .top nav .btn:hover { color: var(--window-black); }
  .top__mark img { height: 2.5rem; }
  .hero__frame img { aspect-ratio: auto; height: min(60vh, 44rem); min-height: 24rem; object-position: 50% 62%; }
  .hero__body { max-width: 72rem; margin: 0 auto; padding: var(--space-4) var(--gutter); display: grid; grid-template-columns: 1.9fr 1fr; gap: var(--space-4); align-items: end; }
  .hero__line { margin: 0; font-size: clamp(3rem, 1.5rem + 2.6vw, 4.25rem); }
  .hero__side { padding-bottom: .4rem; }
  .hero__facts { margin-top: var(--space-2); }

  .declare .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); align-items: start; }
  .pull { font-size: 2.1rem; }
  .promises { grid-column: 1 / -1; grid-template-columns: repeat(4, 1fr); margin-top: 0; }
  .promises li, .promises li:nth-child(even) { padding: var(--space-2) var(--space-2); border-right: 1px solid rgba(31,27,24,.15); border-bottom: 0; }
  .promises li:first-child { padding-left: 0; }
  .promises li:last-child { border-right: 0; }

  .place__grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: var(--space-4); align-items: end; }
  .place__head { order: 0; margin: 0; padding-bottom: var(--space-2); }

  .menu__cols { columns: 2; column-gap: var(--space-5); }
  .menu__group { break-inside: avoid; }
  .menu__top { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); align-items: end; margin-bottom: var(--space-4); }
  .menu__top .menu__note { margin: 0; }

  .visit .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); }
  .visit h2 { grid-column: 1 / -1; margin-bottom: 0; }
  .visit .label { grid-column: 1 / -1; margin-bottom: -1.5rem; }

  .book__grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: var(--space-5); align-items: start; }
  .book__aside { position: sticky; top: 5.5rem; }
}