/*
 * styles.css — O'Maddy's Bar & Grille
 * Built from design-direction.md (Stage 13). One stylesheet, no frameworks.
 * Signature: the waterline system. Every horizon-bearing photo window is
 * cropped by measured numbers so the bay's horizon lands on --wl (38%).
 */

/* ============================================================
   Design Tokens
   ============================================================ */
:root {
  --color-primary: #00a8f0;          /* Gulf Cyan — marks only */
  --color-primary-dark: #006a96;     /* Channel Blue — link text */
  --color-bay-wash: #e2f2f9;         /* drawer + small pills */
  --color-secondary: #d4a96a;        /* Deck Sand */
  --color-tertiary: #a8a8d8;         /* Dusk Lavender */
  --color-accent: #e8835a;           /* Sunset Coral */
  --color-bg: #f6f1e7;               /* Shell Linen */
  --color-surface: #fffcf6;          /* Napkin White */
  --color-night: #1b1a31;            /* Ten O'Clock */
  --color-text: #000000;
  --color-text-secondary: #4f473d;   /* Driftwood */
  --color-text-on-night: #f6f1e7;
  --color-border: #e4d8c4;           /* Sand Hairline — form fields only */

  --font-primary: 'Young Serif', Georgia, serif;
  --font-secondary: 'Instrument Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-size-base: 17px;
  --spacing-base: 8px;

  --motion-duration: 280ms;
  --motion-duration-slow: 900ms;
  --motion-ease: cubic-bezier(0.25, 0.6, 0.3, 1);

  --wl: 38%;                          /* the waterline */
  --gap: 6px;                         /* linen gaps between photo windows */
  --shadow-sheet: 0 24px 48px -28px rgba(27, 26, 49, .45);
  --shadow-nav: 0 6px 18px -12px rgba(27, 26, 49, .35);

  --nav-strip-h: 32px;
  --nav-bar-h: 84px;
  --nav-condensed-h: 64px;

  --fs-display: clamp(3.25rem, 2rem + 4.6vw, 6.25rem);
  --fs-h1: clamp(2.75rem, 1.6rem + 3.6vw, 5rem);
  --fs-h2: clamp(2rem, 1.35rem + 2.2vw, 3.25rem);
  --fs-h3: 1.5rem;
  --fs-h4: 1.125rem;
  --fs-lead: clamp(1.1875rem, 1rem + 0.5vw, 1.375rem);
  --fs-small: 0.9375rem;
  --fs-caption: 0.8125rem;

  --lcrm-cart-accent: #e8835a;
}

/* ============================================================
   Base Reset
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: var(--font-size-base, 16px);
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--nav-condensed-h) + 64px);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

body {
  font-family: var(--font-secondary);
  font-size: 1.0625rem;
  background-color: var(--color-bg);
  color: var(--color-text);
  line-height: 1.62;
  padding-top: calc(var(--nav-strip-h) + var(--nav-bar-h));
  padding-bottom: 42px; /* required */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body.drawer-open { overflow: hidden; }

img, video {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: var(--color-primary-dark);
  text-decoration-color: var(--color-primary);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  transition: text-decoration-thickness var(--motion-duration) var(--motion-ease), color var(--motion-duration) var(--motion-ease);
}
a:hover { text-decoration-thickness: 2px; }

/* Focus states — WCAG AA required. Gulf Cyan ring. */
:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
}

/* Skip navigation link — WCAG 2.4.1 (managed by fix_ada_safe.py) */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  padding: 0.75rem 1.25rem;
  background: var(--color-surface, #ffffff);
  color: var(--color-text);
  font-weight: 600;
  text-decoration: none;
  border: 2px solid var(--color-primary);
  border-radius: 0 0 4px 0;
}
.skip-link:focus {
  left: 0;
}

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

/* Reveal-gating floor. This site's motion signature is deliberate stillness:
   nothing uses .reveal, but the gated pattern is kept so any future use is safe. */
.reveal { opacity: 1; transform: none; }
html.js .reveal { opacity: 0; transform: translateY(24px); transition: opacity .6s, transform .6s; }
html.js .reveal.is-in { opacity: 1; transform: none; }

/* ============================================================
   Type
   ============================================================ */
h1, h2, h3 {
  font-family: var(--font-primary);
  font-weight: 400;
  color: inherit;
}
h2 { font-size: var(--fs-h2); line-height: 1.04; letter-spacing: -0.006em; }
h3 { font-size: var(--fs-h3); line-height: 1.15; }
h4 { font-family: var(--font-secondary); font-weight: 600; font-size: var(--fs-h4); line-height: 1.3; }
p { max-width: 66ch; }

.lead { font-size: var(--fs-lead); line-height: 1.5; max-width: 34ch; }
.small { font-size: var(--fs-small); line-height: 1.5; font-weight: 500; }
.caption {
  font-size: var(--fs-caption);
  line-height: 1.4;
  letter-spacing: 0.01em;
  font-weight: 500;
  color: var(--color-text-secondary);
}
.driftwood { color: var(--color-text-secondary); }

/* Clock-time rubric: Young Serif H3 hung in the left margin (one of the
   site's three opener grammars; used on exactly three sections). */
.rubric {
  font-family: var(--font-primary);
  font-size: var(--fs-h3);
  line-height: 1.15;
  color: var(--color-text-secondary);
  margin-bottom: .5rem;
}
.rubric-head { display: grid; grid-template-columns: 1fr; }
@media (min-width: 1100px) {
  .rubric-head { grid-template-columns: 5.5rem minmax(0, 1fr); align-items: baseline; }
  .rubric-head .rubric { margin: 0; }
}

.textlink {
  font-weight: 600;
  color: var(--color-primary-dark);
  text-decoration: underline;
  text-decoration-color: var(--color-primary);
}
.is-night .textlink { color: var(--color-text-on-night); }

.spec { color: var(--color-accent); font-family: 'Segoe UI Symbol', 'DejaVu Sans', 'Apple Symbols', sans-serif; font-weight: 400; }

/* ============================================================
   Buttons — one restrained coral button per view
   ============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--font-secondary);
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.2;
  padding: .85rem 1.4rem;
  border-radius: 999px;
  border: 0;
  cursor: pointer;
  text-decoration: none;
  transition: background-color var(--motion-duration) var(--motion-ease);
}
.btn--coral { background: var(--color-accent); color: var(--color-text); }
.btn--coral:hover { background: color-mix(in srgb, var(--color-accent) 88%, black); }

.pill {
  display: inline-block;
  font: 600 .8125rem/1 var(--font-secondary);
  color: var(--color-text);
  background: var(--color-bay-wash);
  padding: .4rem .65rem;
  border-radius: 999px;
  vertical-align: middle;
}

/* ============================================================
   Masthead — centered neon logo between split links,
   utility strip that folds on scroll
   ============================================================ */
.masthead {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 200;
  background: var(--color-bg);
  overflow: visible;
  transition: box-shadow var(--motion-duration) var(--motion-ease);
}
.masthead.is-condensed { box-shadow: var(--shadow-nav); }

.utility {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  max-height: var(--nav-strip-h);
  height: var(--nav-strip-h);
  padding: 0 2.5rem;
  background: color-mix(in srgb, var(--color-bg) 97%, black);
  font-size: .875rem;
  font-weight: 500;
  color: var(--color-text-secondary);
  transition: max-height var(--motion-duration) var(--motion-ease), opacity var(--motion-duration) var(--motion-ease);
}
.utility p, .utility a { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; max-width: none; }
.utility a { color: var(--color-text-secondary); text-decoration: none; }
.utility a:hover { color: var(--color-text); text-decoration: underline; text-decoration-color: var(--color-primary); }
.utility i { color: var(--color-primary-dark); font-size: 1rem; }
.masthead.is-condensed .utility { max-height: 0; opacity: 0; overflow: clip; pointer-events: none; }

.bar {
  height: var(--nav-bar-h);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 2.5rem;
  transition: height var(--motion-duration) var(--motion-ease);
}
.masthead.is-condensed .bar { height: var(--nav-condensed-h); }

.bar__links {
  list-style: none;
  display: flex;
  gap: 2.25rem;
  min-width: 0;
}
.bar__links--left { justify-content: flex-end; padding-right: 3rem; }
.bar__links--right { justify-content: flex-start; padding-left: 3rem; }
.bar__links a {
  font: 500 1rem/1.2 var(--font-secondary);   /* 16px — logo arithmetic uses this */
  color: var(--color-text);
  text-decoration: none;
  padding: .5rem 0;
  white-space: nowrap;
  text-underline-offset: 6px;
}
.bar__links a:hover { text-decoration: underline; text-decoration-color: var(--color-primary); text-decoration-thickness: 2px; text-underline-offset: 0.08em; }
.bar__links a[aria-current="page"] {
  text-decoration: underline;
  text-decoration-color: var(--color-primary);
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

.brand { display: block; line-height: 0; }
.brand img {
  height: 52px;            /* logo_nav_height_px: 52 — resolution cap, never larger */
  width: auto;
  max-width: 200px;
  transition: height var(--motion-duration) var(--motion-ease);
}
.masthead.is-condensed .brand img { height: 44px; }

.bar__tel, .bar__toggle { display: none; }

@media (prefers-reduced-motion: reduce) {
  .utility, .bar, .brand img, .masthead { transition: none; }
}

/* Mobile drawer — full screen on Bay Wash */
.drawer {
  position: fixed;
  top: var(--nav-condensed-h);
  left: 0; right: 0; bottom: 0;
  z-index: 190;
  background: var(--color-bay-wash);
  padding: 2rem 1.5rem 3rem;
  overflow-y: auto;
}
.drawer[hidden] { display: none; }
.drawer__links { list-style: none; display: grid; gap: .35rem; margin-bottom: 2rem; }
.drawer__links a {
  font: 400 2rem/1.25 var(--font-primary);
  color: var(--color-text);
  text-decoration: none;
}
.drawer__links a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--color-primary); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.drawer__facts { list-style: none; display: grid; gap: .8rem; font-weight: 500; }
.drawer__facts li { display: flex; gap: .6rem; align-items: center; }
.drawer__facts i { color: var(--color-primary-dark); font-size: 1.25rem; }
.drawer__facts a { color: var(--color-text); }

@media (max-width: 959px) {
  body { padding-top: var(--nav-condensed-h); }
  .utility { display: none; }
  .bar, .masthead.is-condensed .bar { height: var(--nav-condensed-h); padding: 0 1rem; }
  .bar__links { display: none; }
  .brand img, .masthead.is-condensed .brand img { height: 44px; }
  .bar__tel, .bar__toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 44px;
    font: 600 1rem/1 var(--font-secondary);
    color: var(--color-text);
    background: none;
    border: 0;
    cursor: pointer;
    text-decoration: none;
  }
  .bar__tel { justify-self: start; width: 44px; justify-content: center; font-size: 1.4rem; }
  .bar__tel i { color: var(--color-primary-dark); }
  .bar__toggle { justify-self: end; padding: 0 .25rem; }
  .bar__toggle i { font-size: 1.35rem; }
}
@media (min-width: 960px) {
  .drawer { display: none !important; }
}
@media (min-width: 960px) and (max-width: 1180px) {
  .bar { padding: 0 1.25rem; }
  .bar__links { gap: 1.5rem; }
  .bar__links--left { padding-right: 2rem; }
  .bar__links--right { padding-left: 2rem; }
  .utility { padding: 0 1.25rem; }
}

/* ============================================================
   THE WATERLINE SYSTEM (signature)
   Each window is a size container. Its <img> is absolutely placed so the
   image's own horizon pixel (--hf of its height) lands on --wl of the
   window, at every width:
     top: var(--wl); translate Y by -hf × own height.
   Height = max(--s × window height, the height needed to also cover the
   window's width around the focus point --fx), so nothing ever shows a gap
   and the image is never stretched (width stays auto).
   ============================================================ */
.wl-row {
  --row-h: clamp(30rem, 64vh, 44rem);
  display: grid;
  grid-template-columns: var(--cols, 31fr 20fr 15fr 17fr 17fr);
  gap: var(--gap);
  height: var(--row-h);
  padding: 0 var(--gap);
  background: var(--color-bg);
  position: relative;
}
.wl-row--4 { --cols: 34fr 22fr 22fr 22fr; --row-h: clamp(26rem, 54vh, 36rem); }

.wl-win {
  --hf: .38; --s: 1.05; --fx: .5; --ar: .75; --drift: 0px;
  position: relative;
  overflow: hidden;           /* photo window: image only, never text */
  margin: 0;
  container-type: size;
  min-width: 0;
  background: var(--color-surface);
}
.wl-win img {
  position: absolute;
  top: var(--wl);
  left: 50%;
  max-width: none;
  width: auto;
  height: max(
    calc(var(--s) * 100cqh),
    calc(100cqw / (2 * min(var(--fx), 1 - var(--fx))) / var(--ar) * 1.02)
  );
  transform: translate(calc(var(--fx) * -100%), calc(var(--hf) * -100%));
  animation: wl-level var(--motion-duration-slow) var(--motion-ease) both;
  transition: filter var(--motion-duration) var(--motion-ease);
}
.wl-win:hover img { filter: brightness(1.04); }

/* the-waterline-levels-once: each photo starts a few px off level and
   settles once. Uses `translate` so it composes with the transform above.
   No opacity change, nothing hidden, nothing JS-gated. */
@keyframes wl-level { from { translate: 0 var(--drift); } to { translate: 0 0; } }
.wl-row > :nth-child(2) img { --drift: 7px;  animation-delay: 0ms; }
.wl-row > :nth-child(3) img { --drift: -5px; animation-delay: 60ms; }
.wl-row > :nth-child(4) img { --drift: 4px;  animation-delay: 120ms; }
.wl-row > :nth-child(5) img { --drift: -6px; animation-delay: 180ms; }
@media (prefers-reduced-motion: reduce) {
  .wl-win img { animation: none; }
}

/* Type window: row 1 is exactly the waterline. The H1 sits at the bottom
   of row 1, its descender space pulled below the line so the BASELINE
   lands on the horizon. */
.wl-type {
  background: var(--color-surface);
  display: grid;
  grid-template-rows: var(--wl) 1fr;
  padding: 0 clamp(1.25rem, 2.6vw, 2.5rem);
  min-width: 0;
  container-type: inline-size;
}
.wl-type__h {
  align-self: safe end;
  margin: 0 0 -0.2em;
  font-family: var(--font-primary);
  font-weight: 400;
  line-height: .98;
  letter-spacing: -0.01em;
  /* smallest of: the type scale, the room above the waterline, the window width */
  font-size: min(
    var(--h-size, var(--fs-h1)),
    calc(var(--row-h) * .38 / (var(--h-lines, 2) * .98 + .3)),
    calc(100cqi / (var(--fit, 5) * 1.05))
  );
}
.wl-line { display: block; white-space: nowrap; }
.wl-type__h--display { --h-size: var(--fs-display); line-height: .96; letter-spacing: -0.012em; }
.wl-type__h--h2 { --h-size: var(--fs-h2); }
.wl-type__below {
  padding-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: .85rem;
  align-items: flex-start;
  min-width: 0;
}
.wl-type__below .lead { max-width: 34ch; }
.wl-facts { font-size: var(--fs-small); font-weight: 500; color: var(--color-text-secondary); }
.wl-facts a { color: var(--color-text-secondary); }

.wl-caption { padding: .6rem 1.25rem 0; text-align: right; }

/* Tablet: never stack — a horizontal scroll-snap strip */
@media (max-width: 1099px) {
  .wl-row, .wl-row--4 {
    display: flex;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    --row-h: clamp(30rem, 64vh, 44rem);
  }
  .wl-row::-webkit-scrollbar { display: none; }
  .wl-row > * { flex: 0 0 34vw; scroll-snap-align: start; }
  .wl-row > .wl-type { flex-basis: 46vw; }
}
/* Mobile: the type window is the first window at 86vw, the next photo peeks */
@media (max-width: 759px) {
  .wl-row, .wl-row--4 { --row-h: clamp(34rem, 78svh, 44rem); }
  .wl-row > .wl-type { flex-basis: 86vw; }
  .wl-row > .wl-win { flex-basis: 64vw; }
}

/* ============================================================
   Section scaffolding + grounds
   ============================================================ */
.ground-light { background: var(--color-bg); }
.ground-dark  { background: var(--color-night); color: var(--color-text-on-night); }
.ground-texture-bay {
  background-color: #cfe6ea;
  background-image:
    linear-gradient(rgb(246 241 231 / .25), rgb(246 241 231 / .25)),
    url("/images/shallow-gulf-bay-water-sun-glints-green_20261021_182243.webp?v=67aa9b83");
  background-size: cover;
  background-position: center;
}
.ground-texture-dock {
  background-color: #ece3d4;
  background-image:
    linear-gradient(rgb(246 241 231 / .55), rgb(246 241 231 / .55)),
    url("/images/sun-bleached-florida-dock-planks-salt-we_20261021_182252.webp?v=5d313c4d");
  background-size: cover;
  background-position: center;
}

.shell { width: min(100% - 2.5rem, 80rem); margin-inline: auto; }

.sheet {
  background: var(--color-surface);
  border-radius: 6px;
  box-shadow: var(--shadow-sheet);
  padding: clamp(1.5rem, 4vw, 3.5rem);
  position: relative;
}

.ph-figure { margin: 0; }
.ph-figure img { width: 100%; height: auto; }
.ratio-45 img, img.ratio-45 { aspect-ratio: 4 / 5; object-fit: cover; object-position: center 45%; width: 100%; height: auto; }
.ratio-11 img { aspect-ratio: 1 / 1; object-fit: cover; object-position: center 50%; width: 100%; height: auto; }
figcaption.caption { margin-top: .5rem; }
.is-night figcaption.caption, .is-night .caption { color: var(--color-tertiary); }

/* ============================================================
   Home — Welcome: the crowd runs off the right edge
   ============================================================ */
.welcome {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 2rem;
  padding: 7rem 0 6rem;
  align-items: start;
}
.welcome__text { grid-column: 2 / 7; min-width: 0; }
.welcome__text h2 { margin-bottom: 1.5rem; font-size: clamp(1.75rem, 1.15rem + 1.5vw, 2.6rem); line-height: 1.1; text-wrap: balance; }
.welcome__text p + p { margin-top: 1rem; }
.welcome__facts { font-size: var(--fs-small); font-weight: 500; color: var(--color-text-secondary); margin-top: 1.5rem !important; }
.welcome__facts .sep { color: #9a7440; padding: 0 .35rem; }
.welcome__photo { grid-column: 7 / -1; margin: 0; padding-top: .35rem; }
.welcome__photo img { width: 100%; max-width: 1940px; aspect-ratio: 5 / 2; object-fit: cover; }
.welcome__photo figcaption { padding-left: 0; }

/* Travelers' Choice seal — pressed across the seam between the hero's type
   window and its first photo. It lives in .wl-type (lifted above the photo
   windows) so it rides with that seam in the tablet/phone swipe strip. */
.wl-type:has(> .tc-seal) { position: relative; z-index: 1; }
.tc-seal {
  --seal: 9.25rem;
  position: absolute;
  right: calc(var(--seal) / -2 - var(--gap) / 2);
  bottom: calc(var(--seal) * -.4);   /* desktop: rides the hero's bottom edge */
  width: var(--seal);
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--color-surface);
  box-shadow: var(--shadow-sheet);
  color: var(--color-text);
  text-decoration: none;
  transform: rotate(6deg);
  transition: transform var(--motion-duration) var(--motion-ease);
}
.tc-seal:hover { transform: rotate(3deg); }
.tc-seal:focus-visible { outline: 2px solid var(--color-primary-dark); outline-offset: 4px; }
.tc-laurel { fill: rgba(212, 169, 106, .22); stroke: #9a7440; stroke-width: 1.4; stroke-linejoin: round; transition: stroke var(--motion-duration) var(--motion-ease); }
.tc-laurel .tc-stem { fill: none; }
.tc-seal .tc-laurel { position: absolute; inset: 4%; width: 92%; height: 92%; }
.tc-seal:hover .tc-laurel { stroke: var(--color-accent); }
.tc-seal__text { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding-bottom: .35rem; }
.tc-seal__by { font: 600 .625rem/1 var(--font-secondary); letter-spacing: .14em; text-transform: uppercase; color: var(--color-text-secondary); }
.tc-seal__name { font: 400 1.0625rem/1.02 var(--font-primary); max-width: 5.5em; margin: .4rem 0 .35rem; }
.tc-seal__year { font: 600 .75rem/1 var(--font-secondary); letter-spacing: .2em; color: var(--color-text-secondary); }

/* ============================================================
   Home — Favorites: the menu sheet floats on the bay
   ============================================================ */
.favorites { padding: 7rem 1.25rem; }
.favorites .sheet { max-width: 76rem; margin-inline: auto; }
.favorites__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 4vw, 4rem);
  margin-top: 2.25rem;
}
.feature-panel h3 { margin-bottom: .75rem; display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.feature-panel figure { margin-bottom: 1.1rem; }
.feature-panel p { font-size: var(--fs-small); color: var(--color-text-secondary); font-weight: 500; }
.favorites__right h3 { margin-bottom: 1.25rem; }
.strip3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--gap);
  margin: 2.25rem 0 1.5rem;
}
.strip3 figure { margin: 0; }

/* ============================================================
   Price lists — leader dots (section-menu-price-list-leader-dots)
   ============================================================ */
.carte { list-style: none; display: grid; gap: 1.4rem; }
.carte__item {
  display: grid;
  grid-template-columns: auto minmax(1.5rem, 1fr) auto;
  align-items: baseline;
  column-gap: .6rem;
}
.carte__name { font: 600 var(--fs-h4)/1.3 var(--font-secondary); min-width: 0; }
.carte__leader { min-width: 1.5rem; border-bottom: 2px dotted var(--color-secondary); transform: translateY(-.3em); }
.carte__price { font: 600 1.0625rem/1.3 var(--font-secondary); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.carte__price sup { font-size: .7em; color: var(--color-text-secondary); }
.carte__desc {
  grid-column: 1 / -1;
  font: 500 var(--fs-small)/1.5 var(--font-secondary);
  color: var(--color-text-secondary);
  max-width: 58ch;
  margin-top: .2rem;
}
.carte__item--lead .carte__name { font: 400 1.5rem/1.15 var(--font-primary); }
.carte__item--h3 .carte__name { font: 400 var(--fs-h3)/1.15 var(--font-primary); }
.carte__note { font-size: var(--fs-small); color: var(--color-text-secondary); font-weight: 500; max-width: 60ch; }
.carte__note strong { color: var(--color-text); font-weight: 600; }
.is-night .carte__name, .is-night .carte__price { color: var(--color-text-on-night); }
.is-night .carte__desc, .is-night .carte__note { color: color-mix(in srgb, #f6f1e7 80%, #a8a8d8); }
.is-night .carte__note strong { color: var(--color-text-on-night); }
.is-night .carte__leader { border-color: color-mix(in srgb, #d4a96a 60%, transparent); }
.cat-head { font-family: var(--font-primary); font-size: var(--fs-h3); line-height: 1.15; margin-bottom: 1.4rem; }
.cat-sub { font-family: var(--font-secondary); font-weight: 500; font-size: var(--fs-small); color: var(--color-text-secondary); margin: -1rem 0 1.4rem; }

/* ============================================================
   Home — Golden-hour bay band (wordless)
   ============================================================ */
.bayband { display: block; height: clamp(18rem, 42vw, 34rem); }
.bayband .wl-win { height: 100%; }

/* ============================================================
   Music — This Week: the tide table
   ============================================================ */
.thisweek { padding: 7rem clamp(1.25rem, 4vw, 3rem); }
.thisweek__grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 2rem;
  max-width: 84rem;
  margin-inline: auto;
}
.thisweek__side { grid-column: 1 / 5; align-self: start; position: sticky; top: calc(var(--nav-condensed-h) + 2rem); min-width: 0; }
.thisweek__side .rubric { color: var(--color-tertiary); }
.thisweek__date {
  font-family: var(--font-primary);
  font-size: var(--fs-h1);
  line-height: .98;
  letter-spacing: -0.01em;
  color: var(--color-text-on-night);
  margin-bottom: 1rem;
}
.thisweek__side > p { color: color-mix(in srgb, #f6f1e7 85%, #a8a8d8); margin-bottom: 2rem; max-width: 30ch; }
.dusk { aspect-ratio: 3 / 4; width: 100%; }
.thisweek__list { grid-column: 6 / -1; min-width: 0; }

.week { list-style: none; display: grid; gap: 1.1rem; }
.week__day {
  display: grid;
  grid-template-columns: 9.25rem minmax(0, 1fr) auto;
  column-gap: 1.5rem;
  align-items: baseline;
  padding: .55rem 0;
}
.week__name { font: 400 var(--fs-h3)/1.15 var(--font-primary); color: var(--color-secondary); white-space: nowrap; }
.week__acts { display: grid; gap: .45rem; min-width: 0; }
.week__slot {
  display: grid;
  grid-template-columns: 6rem minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: baseline;
  margin: 0;
  max-width: none;
}
.week__time { font: 500 1rem/1.3 var(--font-secondary); font-variant-numeric: tabular-nums; color: var(--color-tertiary); white-space: nowrap; }
.week__act { font: 600 1.25rem/1.25 var(--font-secondary); font-stretch: 87%; font-variation-settings: "wdth" 87; color: var(--color-text-on-night); }
.week__pour { font: 600 1rem/1.35 var(--font-secondary); color: var(--color-accent); text-align: right; max-width: 15rem; }
.week__label { display: block; color: var(--color-secondary); font-weight: 600; }
.tag { font: 600 .8125rem/1 var(--font-secondary); color: #000; padding: .35rem .6rem; border-radius: 999px; white-space: nowrap; }
.tag--down { background: var(--color-secondary); }
.tag--up { background: var(--color-tertiary); }
.week__day.is-tonight .week__name::before {
  content: "";
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--color-primary);
  margin-right: .5rem;
  vertical-align: middle;
}
.week__day.is-tonight .week__slot:first-child .week__act::before {
  content: "Tonight";
  display: inline-block;
  margin-right: .55rem;
  vertical-align: .12em;
  font-stretch: 100%;
  font-variation-settings: "wdth" 100;
  font: 600 .8125rem/1 var(--font-secondary);
  background: var(--color-accent);
  color: #000;
  padding: .35rem .6rem;
  border-radius: 999px;
}
.thisweek__foot { margin-top: 2.5rem; color: color-mix(in srgb, #f6f1e7 85%, #a8a8d8); }
.thisweek__foot a { color: var(--color-text-on-night); font-weight: 600; text-decoration-color: var(--color-primary); }

/* Home — the lineup lives on /music/; one night-ground line points there */
.music-teaser { padding: 3.5rem clamp(1.25rem, 4vw, 3rem); }
.music-teaser__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 1rem 2.5rem;
  max-width: 84rem;
  margin-inline: auto;
}
.music-teaser__head { color: var(--color-text-on-night); margin: 0; }
.music-teaser__line { color: color-mix(in srgb, #f6f1e7 85%, #a8a8d8); max-width: 34ch; margin: 0; }
.music-teaser .btn { margin-left: auto; align-self: center; }

/* ============================================================
   Music — the stage key and game days & holidays
   ============================================================ */
.stage-key { display: flex; gap: .6rem; margin: 1.5rem 0 2rem; }
.music-events { padding: 6rem clamp(1rem, 4vw, 3rem); }
.music-events__sheet {
  display: grid;
  grid-template-columns: minmax(0, 6fr) minmax(0, 5fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  max-width: 76rem;
  margin-inline: auto;
}
.music-events__text h2 { margin-bottom: 1.25rem; }
.music-events__text p { margin-bottom: 1rem; }
.music-events__text .actions { margin-top: 1.75rem; }
.music-events__photo img { width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; object-position: center 40%; }

/* ============================================================
   Split with an edge-bleeding photo (Home Visit, Story Upstairs,
   Find Us Map) — the photo goes to the viewport edge, no overlay
   ============================================================ */
.split {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  min-height: 34rem;
}
.split--8-4 { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); min-height: 36rem; }
.split__photo { margin: 0; display: flex; flex-direction: column; }
.split__photo img { width: 100%; aspect-ratio: 4 / 3; height: auto; min-height: 34rem; object-fit: cover; object-position: center 55%; }
.split__photo figcaption { padding: .6rem 1.25rem .9rem; background: var(--color-bg); }
.split__text { padding: 5rem 2.5rem; align-self: center; min-width: 0; }
.split__text h2 { margin-bottom: 1.25rem; }
.addr-head { font-size: clamp(2.25rem, 1.4rem + 2.6vw, 3.5rem); line-height: 1.02; text-wrap: balance; }

.particulars { display: grid; gap: 1.1rem; margin: 1.75rem 0 2rem; }
.particulars > div { display: grid; grid-template-columns: 1.75rem minmax(0, 1fr); column-gap: .6rem; }
.particulars i { color: var(--color-primary-dark); font-size: 1.3rem; grid-row: span 2; padding-top: .1rem; }
.particulars dt { font: 600 var(--fs-h4)/1.3 var(--font-secondary); }
.particulars dd { color: var(--color-text); }
.particulars dd a { color: var(--color-text); }
.actions { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; }

/* ============================================================
   Footer — standing on the dock
   ============================================================ */
.site-footer { padding: 5rem 2.5rem 2.5rem; color: var(--color-text); }
.site-footer__grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1fr;
  gap: 3rem;
  max-width: 80rem;
  margin-inline: auto;
}
.site-footer__brand img { height: 48px; width: auto; max-width: 160px; margin-bottom: 1.25rem; }
.site-footer__tag { font: 400 1.5rem/1.2 var(--font-primary); margin-bottom: 1rem; }
.site-footer address { font-style: normal; display: grid; gap: .35rem; font-size: var(--fs-small); }
.site-footer address p { display: flex; gap: .5rem; align-items: baseline; }
.site-footer address i { color: var(--color-primary-dark); }
.site-footer a { color: var(--color-text); text-decoration-color: var(--color-primary); }
.site-footer h2 { font: 600 var(--fs-small)/1.3 var(--font-secondary); margin-bottom: .9rem; color: var(--color-text-secondary); }
.site-footer__links { list-style: none; display: grid; gap: .45rem; font-size: var(--fs-small); }
.site-footer__links a { text-decoration: none; }
.site-footer__links a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.social { list-style: none; display: grid; gap: 1.25rem; font-size: var(--fs-small); }
.social a { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; font-weight: 500; }
.social a:hover span { text-decoration: underline; text-decoration-color: var(--color-primary); }
.social i { font-size: 20px; color: var(--color-text); }
.sister { display: grid; gap: .35rem; text-decoration: none; }
.sister__name { font: 400 1.3rem/1.2 var(--font-primary); }
.sister__name i { font-size: .9rem; color: var(--color-primary-dark); vertical-align: .1em; }
.sister:hover .sister__name { text-decoration: underline; text-decoration-color: var(--color-secondary); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.sister__desc { font-size: var(--fs-small); color: var(--color-text-secondary); max-width: 24ch; }
.site-footer__base { max-width: 80rem; margin: 3.5rem auto 0; font-size: .875rem; color: var(--color-text-secondary); }

/* ============================================================
   Menu — sticky category index (adapted sticky particulars rail)
   ============================================================ */
.menu-index {
  position: sticky;
  top: var(--nav-condensed-h);
  z-index: 50;
  background: var(--color-surface);
  height: 52px;
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 0 clamp(1rem, 3vw, 2.5rem);
  overflow-x: auto;
  scrollbar-width: none;
  transition: box-shadow var(--motion-duration) var(--motion-ease);
}
.menu-index::-webkit-scrollbar { display: none; }
.menu-index.is-stuck { box-shadow: var(--shadow-nav); }
.menu-index ul { list-style: none; display: flex; gap: 1.6rem; flex: 0 0 auto; }
.menu-index a {
  display: inline-block;
  padding: .9rem 0 .8rem;
  font: 500 1rem/1 var(--font-secondary);
  color: var(--color-text);
  text-decoration: none;
  white-space: nowrap;
}
.menu-index a:hover, .menu-index a.is-active { box-shadow: inset 0 -2px 0 var(--color-secondary); }
.tag--flag { display: inline-block; margin-left: .35rem; padding: .25rem .5rem; font-size: .6875rem; letter-spacing: .04em; text-transform: uppercase; vertical-align: .12em; }
.menu-index__facts { margin-left: auto; flex: 0 0 auto; font-size: .875rem; font-weight: 500; color: var(--color-text-secondary); white-space: nowrap; max-width: none; }
.menu-index__facts a { color: var(--color-text-secondary); padding: 0; font-size: .875rem; }
/* scroll hint: pinned to the bar's right edge, shown only while more categories are off-screen */
.menu-index::after {
  content: "";
  position: sticky;
  right: calc(clamp(1rem, 3vw, 2.5rem) * -1);   /* past the bar's side padding, to the true edge */
  align-self: stretch;
  flex: 0 0 3.5rem;
  margin-left: -5.5rem;          /* cancel its own width + the 2rem flex gap: takes no room */
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--motion-duration) var(--motion-ease);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3l5 5-5 5' fill='none' stroke='%23006a96' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right .6rem center / 14px,
    linear-gradient(to right, rgba(255, 252, 246, 0), var(--color-surface) 60%);
}
.menu-index.has-more::after { opacity: 1; pointer-events: auto; cursor: pointer; }

.menu-features { padding: 5rem 1.25rem; }
.menu-features .sheet { max-width: 72rem; margin-inline: auto; display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 2.5rem; align-items: start; }
.menu-features__photos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
.menu-features__photos h3 { font: 600 var(--fs-h4)/1.3 var(--font-secondary); margin-top: .5rem; }
.menu-features__text h2 { margin-bottom: 1rem; font-size: clamp(1.75rem, 1.2rem + 1.2vw, 2.4rem); line-height: 1.08; }
.menu-features__text p { color: var(--color-text-secondary); font-weight: 500; }
.menu-features__text .pill { margin-bottom: 1rem; }

.menu-starters { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.menu-starters__grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 1fr) minmax(0, 4fr);
  grid-template-rows: auto auto auto;
  max-width: 80rem;
  margin-inline: auto;
}
.menu-starters__head { grid-column: 1; grid-row: 1; }
.menu-starters__a { grid-column: 1; grid-row: 2; }
.menu-starters__b { grid-column: 1; grid-row: 3; margin-top: 1.4rem; }
.menu-starters__photos {
  grid-column: 3; grid-row: 1 / span 3;
  align-self: start;
  position: sticky; top: calc(var(--nav-condensed-h) + 52px + 1.5rem);
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap);
}
.menu-starters__photos figcaption { font-weight: 600; font-size: var(--fs-small); color: var(--color-text); margin-top: .35rem; }
.carte__note--sauce { margin-top: 1.75rem; }

.menu-band { display: block; }
.menu-band .wl-row { --cols: 1fr 1fr 1fr; --row-h: clamp(16rem, 38vh, 26rem); }

.menu-pizza { padding: 6rem 1.25rem; }
.menu-pizza .sheet { max-width: 76rem; margin-inline: auto; }
.menu-pizza__cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); }
.addons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 2rem;
  row-gap: .3rem;
  margin-top: .9rem;
  font-size: var(--fs-small);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.addons div { display: flex; justify-content: space-between; gap: .75rem; }
.addons dt { color: var(--color-text-secondary); }
.addons dd { font-weight: 600; }
.addons-wrap { margin-top: 2rem; }
.addons-wrap h4 { margin-bottom: .2rem; }
.menu-pizza__trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); margin-top: 3rem; }

.menu-hand { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.menu-hand__inner { max-width: 84rem; margin-inline: auto; }
.offset3 { display: flex; gap: var(--gap); align-items: flex-start; margin-bottom: 4rem; }
.offset3 figure { margin: 0; }
.offset3 figure:nth-child(1), .offset3 figure:nth-child(2) { flex: 0 0 30%; }
.offset3 figure:nth-child(3) { flex: 0 0 22%; margin-top: 3rem; }
.menu-hand__cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 3.5rem; }
.sandwich-list { columns: 2; column-gap: 3rem; display: block; }
.sandwich-list .carte__item { break-inside: avoid; margin-bottom: 1.4rem; }
.sides-note { margin-top: 2.5rem; max-width: 66ch; }
.sides-note h4 { display: inline; margin-right: .35rem; }

.menu-dinner { padding: 7rem clamp(1.25rem, 4vw, 3rem); }
.menu-dinner__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 84rem; margin-inline: auto; }
.menu-dinner__photos { grid-column: 1 / 6; display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); align-content: start; }
.menu-dinner__photos .span2 { grid-column: 1 / -1; }
.menu-dinner__gulf-note { grid-column: 1 / -1; color: var(--color-tertiary); font-size: var(--fs-small); font-weight: 500; margin-top: .5rem; }
.menu-dinner__list { grid-column: 7 / -1; min-width: 0; }
.menu-dinner .rubric { color: var(--color-tertiary); }
.menu-dinner h2 { margin-bottom: 2.25rem; }
.is-night .cat-head { color: var(--color-text-on-night); }

.menu-sweet { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.menu-sweet__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 80rem; margin-inline: auto; }
.menu-sweet__desserts { grid-column: 1 / 7; }
.dessert-lines { list-style: none; display: grid; gap: .8rem; }
.dessert-lines li { font: 400 clamp(1.5rem, 1.1rem + 1.2vw, 2.125rem)/1.15 var(--font-primary); }
.menu-sweet__dog { grid-column: 8 / -1; }
.menu-sweet__dog .cat-head { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
.menu-sweet__dog figure { margin-bottom: 1.25rem; max-width: 26rem; }
.advisory { grid-column: 1 / -1; margin-top: 4rem; max-width: 70ch; }

/* ============================================================
   Menu — upstairs deck: its own card, tagged in the stage-key lavender
   ============================================================ */
.menu-upstairs { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.menu-upstairs__sheet {
  max-width: 80rem;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: 2.5rem;
  row-gap: 3rem;
  align-items: start;
}
.menu-upstairs__head { grid-column: 1 / 5; grid-row: 1 / span 2; }
.menu-upstairs__head h2 { margin: 1rem 0; font-size: clamp(1.75rem, 1.2rem + 1.2vw, 2.4rem); line-height: 1.08; }
.menu-upstairs__head p { color: var(--color-text-secondary); font-weight: 500; margin-bottom: 1.5rem; }
.menu-upstairs__raw { grid-column: 5 / -1; }
.menu-upstairs__raw .carte { display: block; columns: 2; column-gap: 2.5rem; }
.menu-upstairs__raw .carte__item { break-inside: avoid; margin-bottom: 1.4rem; }
.menu-upstairs__head .tag { display: inline-block; }
.menu-upstairs__plates { grid-column: 5 / 9; }
.menu-upstairs__bites { grid-column: 9 / -1; }
.menu-upstairs .advisory { margin-top: 0; }
.upstairs-links { display: flex; flex-wrap: wrap; gap: .75rem 1.5rem; }

/* ============================================================
   Story
   ============================================================ */
.founding { padding: 7rem clamp(1.25rem, 4vw, 3rem) 6rem; }
.founding__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 86rem; margin-inline: auto; }
.founding__text { grid-column: 2 / 10; min-width: 0; }
.founding__text h2 { margin-bottom: 2rem; }
.broadsheet { columns: 2; column-gap: 2.5rem; }
.broadsheet p { margin-bottom: 1rem; break-inside: avoid-column; }
.dropcap::first-letter {
  float: left;
  font-family: var(--font-primary);
  font-size: 5.1em;
  line-height: .8;
  padding: .08em .1em 0 0;
}
.founding__quote { margin: 1.5rem 0 2.25rem; max-width: none; }
.founding__quote p { font: 400 1.75rem/1.25 var(--font-primary); max-width: 40ch; }
.founding__quote footer { margin-top: .75rem; }
.archive-print { grid-column: 10 / -1; margin: 4rem 0 0; align-self: start; }
.archive-print .mount { background: var(--color-secondary); padding: 14px; }
.archive-print img { width: 100%; aspect-ratio: 5 / 2; object-fit: cover; }

.upstairs .split__text { padding: 4rem 2.5rem; }

.regulars { padding: 7rem clamp(1.25rem, 4vw, 3rem); }
.regulars__quotes { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 80rem; margin-inline: auto; }
.quote-sheet { padding: 2.75rem 2.5rem 2.25rem; }
.quote-sheet:nth-child(1) { grid-column: 2 / 8; grid-row: 1; }
.quote-sheet:nth-child(2) { grid-column: 6 / 12; grid-row: 2; margin-top: -3rem; z-index: 1; }
.quote-sheet blockquote p { font: 400 1.5rem/1.3 var(--font-primary); max-width: 40ch; }
.quote-mark { display: block; font: 400 4rem/.6 var(--font-primary); color: var(--color-secondary); height: 2rem; }
.quote-sheet footer { margin-top: 1rem; }
.contact-sheet { max-width: 80rem; margin: 4.5rem auto 0; text-align: center; }
.contact-sheet ul { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap); }
.contact-sheet img { width: 150px; height: 100px; max-width: 150px; object-fit: cover; }
.contact-sheet p { margin: 1rem auto 0; }

.regulars__award { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: .35rem .6rem; max-width: 80rem; margin: 3.5rem auto 0; font-size: var(--fs-small); font-weight: 500; }
.tc-mini { position: relative; display: inline-grid; place-items: center; }
.tc-mini > * { grid-area: 1 / 1; }
.tc-laurel--glyph { width: 3.25rem; height: 3.25rem; stroke-width: 2.4; fill: rgba(212, 169, 106, .35); }
.tc-mini__year { font: 600 .6875rem/1 var(--font-secondary); letter-spacing: .08em; padding-bottom: .2rem; }
.around__sister { font-size: var(--fs-small); color: var(--color-text-secondary); max-width: 38ch; }
.around__sister .textlink { font-size: inherit; }

.around .wl-row { --cols: 28fr 24fr 24fr 24fr; --row-h: clamp(24rem, 52vh, 34rem); }

/* ============================================================
   Photos
   ============================================================ */
.plates { padding: 6rem 0; }
.plates__head { padding: 0 clamp(1.25rem, 4vw, 3rem); max-width: 86rem; margin: 0 auto 2.5rem; }
.band-label { font-family: var(--font-primary); font-size: var(--fs-h3); margin: 0 auto 1.1rem; padding: 0 clamp(1.25rem, 4vw, 3rem); max-width: 86rem; }
.plates__water { display: grid; gap: var(--gap); margin-bottom: 4.5rem; }
.plates__water .wl-row { --cols: 1fr 1fr 1fr 1fr; --row-h: clamp(16rem, 30vw, 24rem); }
.plates__table {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--gap);
  padding: 0 var(--gap);
}
.plates__table figure { margin: 0; }

.building { padding: 6rem clamp(.75rem, 2vw, 1.5rem); }
.building h2 { max-width: 86rem; margin: 0 auto 2.5rem; padding: 0 clamp(.5rem, 2vw, 1.5rem); }
.mosaic { container-type: inline-size; max-width: 90rem; margin-inline: auto; display: grid; gap: 1.75rem var(--gap); }
.mosaic__row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--gap); }
.mosaic figure { margin: 0; min-width: 0; }
.mosaic img { width: 100%; object-fit: cover; }
.mosaic__row--a img { height: 42cqw; }
.mosaic__row--b img { height: 26cqw; }
.mosaic__row--c img { height: 19.5cqw; }
.m-b1 { grid-column: 1 / 8; } .m-b46 { grid-column: 8 / -1; }
.m-slide { grid-column: 1 / 9; } .m-b47 { grid-column: 9 / -1; }
.m-b45 { grid-column: 1 / 5; } .m-old { grid-column: 5 / 11; } .m-b8 { grid-column: 11 / -1; }
.m-b46 img { object-position: center 60%; }
.m-b47 img { object-position: 46% 30%; }
.m-b8 img { object-position: 50% 55%; }

/* ============================================================
   Find Us
   ============================================================ */
.findus { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.findus__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 80rem; margin-inline: auto; }
.findus__facts { grid-column: 1 / 6; min-width: 0; }
.findus__facts h2 { margin-bottom: .5rem; }
.findus__facts figure { max-width: 300px; margin-top: 2rem; }
.findus__form { grid-column: 7 / -1; min-width: 0; }
.map-split { min-height: 32rem; }
.map-split iframe { width: 100%; height: 100%; min-height: 32rem; border: 0; display: block; filter: saturate(.85); }

/* ============================================================
   Forms (.contact-form — partner.js owns submission)
   ============================================================ */
.form-sheet { padding: 2.5rem; }
.form-sheet h2 { margin-bottom: .4rem; }
.form-sheet > .caption { margin-bottom: 1.75rem; }
.contact-form { display: grid; gap: 1.25rem; }
.pair { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.pair--21 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.field { display: grid; gap: .4rem; min-width: 0; align-content: start; }
.field label, .contact-form legend { font: 600 var(--fs-h4)/1.3 var(--font-secondary); color: var(--color-text); }
.field .opt { font-weight: 500; font-size: var(--fs-small); color: var(--color-text-secondary); }
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form input[type="tel"],
.contact-form select,
.contact-form textarea {
  width: 100%;
  font: 400 1.0625rem/1.4 var(--font-secondary);
  color: var(--color-text);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: .75rem .9rem;
  min-height: 48px;
}
.contact-form input:hover, .contact-form select:hover, .contact-form textarea:hover { border-color: #c9b796; }
.contact-form textarea { min-height: 9rem; resize: vertical; }
.contact-form input:focus-visible, .contact-form select:focus-visible, .contact-form textarea:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.contact-form select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #4f473d 50%), linear-gradient(135deg, #4f473d 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; padding-right: 2.5rem; }
.contact-form fieldset { border: 0; min-width: 0; display: grid; gap: .6rem; }
.amounts { display: flex; flex-wrap: wrap; gap: .5rem; }
.amounts label { position: relative; }
.amounts input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.amounts span {
  display: inline-block;
  font: 600 1rem/1 var(--font-secondary);
  padding: .8rem 1.1rem;
  border-radius: 999px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  cursor: pointer;
}
.amounts input:checked + span { background: var(--color-secondary); border-color: var(--color-secondary); }
.amounts input:focus-visible + span { outline: 3px solid var(--color-primary); outline-offset: 2px; }
.contact-form .btn { justify-self: start; margin-top: .25rem; }
.form-hint { margin-top: -.25rem; }
.lcrm-success-card, .lcrm-form-error { font-family: var(--font-secondary); border-radius: 6px; }

/* ============================================================
   Gift cards
   ============================================================ */
.order { padding: 6rem clamp(1.25rem, 4vw, 3rem); }
.order__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 2rem; max-width: 80rem; margin-inline: auto; align-items: start; }
.order__card { grid-column: 1 / 6; min-width: 0; position: sticky; top: calc(var(--nav-condensed-h) + 2rem); }
.order__form { grid-column: 7 / -1; min-width: 0; }
.giftcard {
  aspect-ratio: 85.6 / 54;
  width: 100%;
  max-width: 30rem;
  background: var(--color-accent);
  border-radius: 14px;
  box-shadow: 0 30px 50px -30px rgba(27, 26, 49, .55);
  padding: clamp(1.1rem, 3.5%, 1.6rem);
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto 1fr auto;
  color: #000;
}
.giftcard img { height: 52px; width: auto; max-width: 160px; grid-column: 1 / -1; }
.giftcard__title { grid-row: 3; align-self: end; font: 400 clamp(1.5rem, 1rem + 1.6vw, 2rem)/1 var(--font-primary); }
.giftcard__addr { grid-row: 3; grid-column: 2; align-self: end; font-size: var(--fs-caption); font-weight: 600; text-align: right; }
.order__notes { margin-top: 1.5rem; display: grid; gap: .2rem; font-weight: 500; color: var(--color-text-secondary); }

.goodfor { padding: 6rem clamp(1.25rem, 4vw, 3rem) 7rem; }
.goodfor__inner { max-width: 80rem; margin-inline: auto; }
.goodfor h2 { margin-bottom: 3rem; max-width: 22ch; }
.offset-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 1.5rem; }
.offset-row figure { flex: 0 0 28%; margin: 0; }
.offset-row figure:nth-child(2) { margin-top: 2.5rem; }
.offset-row figcaption { font: 600 var(--fs-h4)/1.3 var(--font-secondary); margin-top: .75rem; color: var(--color-text); }
.goodfor .textlink { display: inline-block; margin-top: 3rem; }

/* ============================================================
   404
   ============================================================ */
.lost { padding: 7rem clamp(1.25rem, 4vw, 3rem); }
.lost__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3rem; max-width: 76rem; margin-inline: auto; align-items: center; }
.lost h1 { font-size: var(--fs-h1); line-height: .98; margin-bottom: 1.25rem; }
.lost ul { list-style: none; display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; margin-top: 1.5rem; }
.lost__photo { height: 30rem; }

/* ============================================================
   Gallery lightbox — scaffolded shared mechanism (binding default)
   Inert until a data-lightbox group container exists on the page.
   Restyle this chrome freely to match the brand; do not remove
   the mechanism. (frontend-design.md § "Gallery lightbox")
   ============================================================ */
.lightbox-zoomable {
  cursor: zoom-in;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 320;
  display: none;
  align-items: center;
  justify-content: center;
  padding: clamp(1rem, 3vw, 2.5rem);
}
.lightbox.is-open {
  display: flex;
  animation: lightbox-in var(--motion-duration) var(--motion-ease);
}
@keyframes lightbox-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .lightbox.is-open { animation: none; }
}
.lightbox__scrim {
  position: absolute;
  inset: 0;
  background: color-mix(in srgb, var(--color-text) 85%, transparent);
}
.lightbox__frame {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: min(1200px, 92vw);
  max-height: 86vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.6rem;
}
.lightbox__img {
  max-width: 100%;
  max-height: 80vh;
  width: auto;
  height: auto;
  object-fit: contain;
  box-shadow: 0 24px 80px -16px color-mix(in srgb, var(--color-text) 60%, transparent);
}
.lightbox__caption {
  font-family: var(--font-secondary, inherit);
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--color-bg);
  text-align: center;
  max-width: 60ch;
}
.lightbox__counter {
  position: absolute;
  bottom: 1.1rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  font-family: var(--font-secondary, inherit);
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  color: var(--color-bg);
}
.lightbox__close,
.lightbox__prev,
.lightbox__next {
  position: absolute;
  z-index: 2;
  width: 2.6rem;
  height: 2.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  background: var(--color-bg);
  color: var(--color-text);
  box-shadow: 0 2px 10px color-mix(in srgb, var(--color-text) 25%, transparent);
  font-size: 1.15rem;
  line-height: 1;
}
.lightbox__close:hover,
.lightbox__close:focus-visible,
.lightbox__prev:hover,
.lightbox__prev:focus-visible,
.lightbox__next:hover,
.lightbox__next:focus-visible {
  color: var(--color-accent);
}
.lightbox__close { top: 1rem; right: 1rem; }
.lightbox__prev  { left: 1rem;  top: 50%; transform: translateY(-50%); }
.lightbox__next  { right: 1rem; top: 50%; transform: translateY(-50%); }
.lightbox__caption[hidden],
.lightbox__counter[hidden],
.lightbox__prev[hidden],
.lightbox__next[hidden] {
  display: none;
}

/* Lightbox chrome restyled to the night ground */
.lightbox__scrim { background: color-mix(in srgb, var(--color-night) 92%, transparent); }
.lightbox__img { box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.lightbox__close, .lightbox__prev, .lightbox__next { border-radius: 999px; background: var(--color-bg); }
.lightbox__close:hover, .lightbox__close:focus-visible, .lightbox__prev:hover, .lightbox__prev:focus-visible, .lightbox__next:hover, .lightbox__next:focus-visible { color: var(--color-text); background: var(--color-bay-wash); }
.lightbox__counter { letter-spacing: 0; font-variant-numeric: tabular-nums; }


/* ============================================================
   Responsive — the editorial feel survives at tablet and mobile
   1. The waterline row never stacks (swipe strip, above).
   2. The tide table keeps its columns (two lines per day on phones).
   3. Menu photos clip tighter, inserted mid-list, never dropped.
   ============================================================ */
@media (max-width: 1099px) {
  .tc-seal { bottom: 2.25rem; }   /* the hero strip clips vertically, so the seal stays inside */
  .welcome { column-gap: 1.5rem; padding: 5.5rem 0 5rem; }
  .welcome__text { grid-column: 2 / 12; order: 2; margin-top: 2.5rem; }
  .welcome__photo { grid-column: 2 / -1; order: 1; }

  .favorites__grid { grid-template-columns: minmax(0, 1fr); }
  .feature-panel { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 1.5rem; align-items: start; }
  .feature-panel h3 { grid-column: 1 / -1; }

  .thisweek__grid { grid-template-columns: minmax(0, 1fr); }
  .thisweek__side { position: static; grid-column: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 2rem; margin-bottom: 3rem; }
  .thisweek__side .dusk { grid-column: 2; grid-row: 1 / span 4; aspect-ratio: 16 / 9; align-self: end; }
  .thisweek__list { grid-column: 1; }

  .split, .split--8-4 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .split__text { padding: 4rem 2rem; }

  .menu-features .sheet { grid-template-columns: minmax(0, 1fr); }
  .menu-starters__grid { grid-template-columns: minmax(0, 3fr) 2rem minmax(0, 2fr); }
  .menu-hand__cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .sandwich-list { columns: 1; }
  .menu-dinner__photos { grid-column: 1 / 6; }
  .menu-dinner__list { grid-column: 6 / -1; }

  .founding__text { grid-column: 1 / 9; }
  .archive-print { grid-column: 9 / -1; }
  .quote-sheet:nth-child(1) { grid-column: 1 / 9; }
  .quote-sheet:nth-child(2) { grid-column: 4 / -1; }

  .plates__table { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .plates__water .wl-row { display: grid; --row-h: clamp(16rem, 34vw, 22rem); overflow: visible; }
  .plates__water .wl-row > * { flex: none; }

  .findus__facts { grid-column: 1 / -1; order: 2; margin-top: 4rem; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 2rem; }
  .findus__facts figure { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; width: 240px; }
  .findus__form { grid-column: 1 / -1; order: 1; }

  .order__card { grid-column: 1 / -1; position: static; margin-bottom: 3rem; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem; align-items: end; }
  .order__form { grid-column: 1 / -1; }

  .menu-upstairs__head { grid-column: 1 / -1; grid-row: auto; display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); grid-template-rows: auto auto 1fr; column-gap: 2rem; }
  .menu-upstairs__head .tag { justify-self: start; }
  .menu-upstairs__head figure { grid-column: 2; grid-row: 1 / span 3; }
  .menu-upstairs__head > :not(figure) { grid-column: 1; }
  .menu-upstairs__raw { grid-column: 1 / -1; }
  .menu-upstairs__plates { grid-column: 1 / 7; }
  .menu-upstairs__bites { grid-column: 7 / -1; }

  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .site-footer__grid > :first-child { grid-column: 1 / -1; }
}

@media (max-width: 759px) {
  h2 { font-size: clamp(1.9rem, 1.4rem + 2.6vw, 2.4rem); }

  .welcome { padding: 4rem 0; }
  .welcome__photo { grid-column: 1 / -1; padding-left: 1.25rem; }
  .welcome__photo figcaption { padding-right: 1.25rem; }
  .tc-seal { --seal: 6.25rem; right: calc(var(--seal) * -.32); bottom: 1.5rem; }
  .tc-seal__by { font-size: .5rem; }
  .tc-seal__name { font-size: .75rem; margin: .2rem 0; }
  .tc-seal__year { font-size: .625rem; }
  .welcome__text { grid-column: 1 / -1; padding: 0 1.25rem; }

  .favorites { padding: 4rem 1rem; }
  .favorites .sheet { padding: 1.75rem 1.25rem; }
  .feature-panel { display: block; }
  .strip3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .strip3 figcaption { font-size: .75rem; }

  .bayband { height: 60vw; }

  .thisweek { padding: 4.5rem 1.25rem; }
  .music-teaser { padding: 3rem 1.25rem; }
  .music-teaser__inner { flex-direction: column; align-items: flex-start; }
  .music-teaser .btn { margin-left: 0; }
  .music-events { padding: 4rem 1rem; }
  .music-events__sheet { grid-template-columns: minmax(0, 1fr); padding: 1.75rem 1.25rem; }
  .thisweek__side { display: block; }
  .thisweek__side .dusk { aspect-ratio: 16 / 9; }
  /* tide table keeps its columns: line 1 = day + time + tag, line 2 = act, pour beneath */
  .week { gap: 1.4rem; }
  .week__day { grid-template-columns: minmax(0, 1fr); row-gap: .35rem; }
  .week__name { font-size: 1.75rem; }
  .week__slot { grid-template-columns: 4.75rem auto 1fr; grid-template-areas: "time tag ." "act act act"; row-gap: .2rem; column-gap: .75rem; }
  .week__time { grid-area: time; }
  .week__slot .tag { grid-area: tag; justify-self: start; }
  .week__act { grid-area: act; }
  .week__pour { text-align: left; max-width: none; }

  .split, .split--8-4 { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .split__photo img { aspect-ratio: 4 / 3; height: auto; min-height: 0; }
  .split__text { padding: 3rem 1.25rem 4rem; }

  .menu-features { padding: 3.5rem 1rem; }
  .menu-features .sheet { padding: 1.5rem 1.1rem; }
  .menu-starters { padding: 4rem 1.25rem; }
  .menu-starters__grid { grid-template-columns: minmax(0, 1fr); }
  .menu-starters__head, .menu-starters__a, .menu-starters__b, .menu-starters__photos { grid-column: 1; grid-row: auto; }
  .menu-starters__photos { position: static; margin-top: 1.75rem; }
  .menu-band .wl-row { display: flex; }
  .menu-band .wl-row > .wl-win { flex-basis: 72vw; }
  .menu-pizza { padding: 4rem 1rem; }
  .menu-pizza .sheet { padding: 1.75rem 1.25rem; }
  .menu-pizza__cols { grid-template-columns: minmax(0, 1fr); }
  .addons { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 1.25rem; }
  .menu-hand { padding: 4rem 1.25rem; }
  .offset3 figure:nth-child(1), .offset3 figure:nth-child(2) { flex-basis: 36%; }
  .offset3 figure:nth-child(3) { flex-basis: 26%; margin-top: 2rem; }
  .menu-hand__cols { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
  .menu-dinner { padding: 4.5rem 1.25rem; }
  .menu-dinner__grid { grid-template-columns: minmax(0, 1fr); }
  .menu-dinner__list { grid-column: 1; order: 1; }
  .menu-dinner__photos {
    grid-column: 1; order: 2; margin-top: 2.5rem;
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: var(--gap);
    margin-inline: -1.25rem; padding-inline: 1.25rem; flex-wrap: nowrap;
  }
  .menu-dinner__photos > figure { flex: 0 0 46vw; scroll-snap-align: start; }
  .menu-dinner__photos > figure img { aspect-ratio: 4 / 5; object-fit: cover; }
  .menu-dinner__gulf-note { flex: 0 0 60vw; align-self: end; }
  .menu-sweet { padding: 4rem 1.25rem; }
  .menu-sweet__grid { grid-template-columns: minmax(0, 1fr); row-gap: 3rem; }
  .menu-sweet__desserts, .menu-sweet__dog, .advisory { grid-column: 1; }
  .advisory { margin-top: 0; }

  .founding { padding: 4.5rem 1.25rem; }
  .founding__grid { grid-template-columns: minmax(0, 1fr); }
  .founding__text, .archive-print { grid-column: 1; }
  .broadsheet { columns: 1; }
  .archive-print { margin-top: 1rem; }
  .founding__quote p { font-size: 1.5rem; }
  .regulars { padding: 4.5rem 1rem; }
  .regulars__quotes { grid-template-columns: minmax(0, 1fr); }
  .quote-sheet:nth-child(1), .quote-sheet:nth-child(2) { grid-column: 1; }
  .quote-sheet:nth-child(1) { margin-right: 1.5rem; }
  .quote-sheet:nth-child(2) { margin-left: 1.5rem; margin-top: -1.25rem; }
  .quote-sheet { padding: 2rem 1.5rem 1.75rem; }
  .quote-sheet blockquote p { font-size: 1.3rem; }
  .contact-sheet img { width: 100px; height: 67px; }

  .plates { padding: 4rem 0; }
  .plates__water .wl-row { --cols: 1fr 1fr; grid-template-columns: 1fr 1fr; height: auto; grid-auto-rows: clamp(14rem, 62vw, 20rem); }
  .plates__water .wl-row > * { height: auto; }
  .plates__table { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .building { padding: 4rem .75rem; }
  .mosaic__row { grid-template-columns: minmax(0, 1fr); row-gap: 1.25rem; }
  .mosaic__row > figure { grid-column: 1; }
  .mosaic__row--a img, .mosaic__row--b img, .mosaic__row--c img { height: auto; }

  .findus { padding: 4rem 1.25rem; }
  .findus__grid { grid-template-columns: minmax(0, 1fr); }
  .findus__facts { grid-column: 1; display: block; }
  .findus__facts figure { width: auto; max-width: 300px; margin-top: 2rem; }
  .findus__form { grid-column: 1; }
  .form-sheet { padding: 1.75rem 1.25rem; }
  .map-split iframe { aspect-ratio: 1 / 1; min-height: 0; height: auto; }

  .order { padding: 4rem 1.25rem; }
  .order__grid { grid-template-columns: minmax(0, 1fr); }
  .order__card { display: block; }
  .giftcard { width: 88vw; max-width: 100%; }
  .giftcard img { height: 44px; }

  .goodfor { padding: 4.5rem 1.25rem; }
  .offset-row { gap: var(--gap); }
  .offset-row figure { flex: 0 0 32%; }
  .offset-row figcaption { font-size: .9375rem; }

  .lost__grid { grid-template-columns: minmax(0, 1fr); }
  .lost__photo { height: 20rem; }

  .menu-upstairs { padding: 4rem 1rem; }
  .menu-upstairs__sheet { grid-template-columns: minmax(0, 1fr); row-gap: 2.5rem; padding: 1.75rem 1.25rem; }
  .menu-upstairs__head { display: block; }
  .menu-upstairs__head, .menu-upstairs__raw, .menu-upstairs__plates, .menu-upstairs__bites { grid-column: 1; }
  .menu-upstairs__head figure { max-width: 22rem; }
  .menu-upstairs__raw .carte { columns: 1; }

  .site-footer { padding: 4rem 1.25rem 2rem; }
  .site-footer__grid { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
}

@media (max-width: 640px) {
  .pair, .pair--21 { grid-template-columns: minmax(0, 1fr); }
  .addons { grid-template-columns: minmax(0, 1fr); }
}

/* Features sheet: text column is first in the DOM (heading order), photos sit left on desktop */
@media (min-width: 1100px) {
  .menu-features__photos { order: -1; }
}
a[href^="tel:"] { white-space: nowrap; }
.giftcard__title { white-space: nowrap; } @media (max-width: 759px) { .giftcard__addr { font-size: .6875rem; } }

/* ============================================================
   Self-hosted Google Fonts (localized by 20_performance_sweep)
   ============================================================ */
/* latin-ext */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url('/fonts/pxicypc9vsFDm051Uf6KVwgkfoSbQWlBgGygpspO.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Instrument Sans';
  font-style: normal;
  font-weight: 400 700;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url('/fonts/pxicypc9vsFDm051Uf6KVwgkfoSbT2lBgGygpg.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Young Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/3qTpojO2nS2VtkB3KtkQZ1tz3kY6ah7ECjE.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Young Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/3qTpojO2nS2VtkB3KtkQZ1t93kY6ah7E.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* lt-perf:begin — generated by performance-sweep.py (rev 90): keeps sweep-added <picture>
   wrappers layout-transparent and reserves the box of content-sized hero images.
   Do not edit; re-run the sweep. */
picture[data-lt-picture] { display: contents; }
/* lt-perf:end */