/* =========================================================
   Axis Specialty Coffee — website styles
   Source of truth: Axis Brand Guideline (Super Ellipse Studio)
   Colours: #EFEEE8 #CCBCAD #B49577 #9E7658 #6A4C33 (+ #7E5B3E logo wordmark)
   Type: Newsreader Regular (headings, sentence case, 0 tracking)
         Inter Medium (sub-headings, UPPERCASE, 5% tracking)
         SN Pro Light (body, 0 tracking)
   ========================================================= */

/* ---------- Fonts (self-hosted, SIL OFL) ---------- */
@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-latin-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter"; src: url("../fonts/inter-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "SN Pro"; src: url("../fonts/sn-pro-latin-300-normal.woff2") format("woff2"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "SN Pro"; src: url("../fonts/sn-pro-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

/* ---------- Tokens ---------- */
:root {
  --cream: #EFEEE8;
  --stone: #CCBCAD;
  --sand: #B49577;
  --caramel: #9E7658;
  --espresso: #6A4C33;
  --wordmark: #7E5B3E;
  /* Tint of Stone (#CCBCAD) mixed with Off-white so espresso text passes WCAG AA (assumption) */
  --stone-tint: color-mix(in srgb, #CCBCAD 60%, #EFEEE8);
  --ink: var(--espresso);
  --line: rgba(106, 76, 51, .28);
  --line-light: rgba(239, 238, 232, .32);

  --f-head: "Newsreader", Georgia, "Times New Roman", serif;
  --f-sub: "Inter", "Helvetica Neue", Arial, sans-serif;
  --f-body: "SN Pro", "Helvetica Neue", Arial, sans-serif;

  /* 8px spacing scale (assumption: guidelines don't define web spacing) */
  --s1: .5rem; --s2: 1rem; --s3: 1.5rem; --s4: 2rem; --s5: 3rem; --s6: 4rem; --s7: 6rem; --s8: 8rem;
  --gutter: clamp(1.25rem, 5vw, 3rem);
  --max: 76rem;
  --radius-arch: 999px 999px 0 0;
  --header-h: 4.25rem;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body {
  margin: 0; background: var(--cream); color: var(--ink);
  font-family: var(--f-body); font-weight: 300; font-size: 1.0625rem; line-height: 1.65;
  text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--espresso); outline-offset: 3px; border-radius: 2px; }
.on-dark :focus-visible, .site-header.is-over-hero :focus-visible, .hero :focus-visible { outline-color: var(--cream); }
h1, h2, h3, h4 { font-family: var(--f-head); font-weight: 400; letter-spacing: 0; line-height: 1.12; margin: 0; }
p { margin: 0 0 1em; }
ul { margin: 0; padding: 0; list-style: none; }
strong { font-weight: 400; }

.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; }
.skip-link { position: absolute; left: var(--s2); top: -4rem; z-index: 100; background: var(--espresso); color: var(--cream); padding: .75rem 1rem; font-family: var(--f-sub); font-weight: 500; font-size: .8125rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; }
.skip-link:focus { top: var(--s2); }

.wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(4rem, 10vw, 8rem); position: relative; }

/* Sub-heading style: Inter Medium, uppercase, 5% tracking */
.eyebrow { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 var(--s2); display: flex; align-items: center; gap: .75rem; }
.eyebrow::after { content: ""; flex: 0 0 2.5rem; height: 1px; background: currentColor; opacity: .5; }
.h-display { font-size: clamp(2.5rem, 7vw, 4.75rem); }
.h-section { font-size: clamp(2.125rem, 5.2vw, 3.5rem); margin-bottom: var(--s3); }
.lead { font-size: clamp(1.125rem, 2.1vw, 1.3125rem); line-height: 1.6; max-width: 34em; }
.micro { font-family: var(--f-body); font-weight: 400; font-size: .8125rem; letter-spacing: 0; text-transform: uppercase; }

/* Paper / wall texture overlay (brand Key Art 5.1) */
.textured { position: relative; isolation: isolate; }
.textured::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../images/texture-paper.webp") repeat; background-size: 480px; mix-blend-mode: multiply; opacity: .16; pointer-events: none; }
.on-dark.textured::before { background-image: url("../images/texture-wall.webp"); mix-blend-mode: soft-light; opacity: .35; }

/* ---------- Buttons (assumption: not covered by guidelines) ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 3rem; padding: .85rem 1.6rem; border: 1px solid var(--espresso); border-radius: 0; background: var(--espresso); color: var(--cream); font-family: var(--f-sub); font-weight: 500; font-size: .8125rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.btn:hover { background: #5A3F2A; border-color: #5A3F2A; }
.btn--ghost { background: transparent; color: var(--espresso); }
.btn--ghost:hover { background: var(--espresso); color: var(--cream); }
.btn--light { background: var(--cream); border-color: var(--cream); color: var(--espresso); }
.btn--light:hover { background: #fff; border-color: #fff; }
.btn--ghost-light { background: transparent; border-color: var(--cream); color: var(--cream); }
.btn--ghost-light:hover { background: var(--cream); color: var(--espresso); }
.btn .arrow { font-family: var(--f-body); font-size: 1rem; line-height: 1; }
.btn-row { display: flex; flex-wrap: wrap; gap: .75rem; }

/* [TO CONFIRM] marker — easy to find before launch */
.tbc { font-family: var(--f-sub); font-weight: 500; font-size: .6875rem; letter-spacing: .05em; text-transform: uppercase; padding: .15em .5em; border: 1px dashed currentColor; white-space: nowrap; vertical-align: middle; }

/* ---------- Header ---------- */
.site-header { position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--header-h); background: rgba(239, 238, 232, .96); border-bottom: 1px solid var(--line); transition: background-color .3s ease, border-color .3s ease; }
@supports (backdrop-filter: blur(8px)) { .site-header { background: rgba(239, 238, 232, .86); backdrop-filter: blur(10px); } }
.site-header .wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--s2); }
.brand { display: block; width: 6.25rem; flex: none; transition: opacity .3s ease; }
.brand img { width: 100%; height: auto; }
.site-header.is-over-hero { background: transparent; border-color: transparent; backdrop-filter: none; }
.site-header.is-over-hero .brand { opacity: 0; pointer-events: none; }
.site-header.is-over-hero .nav-toggle, .site-header.is-over-hero .nav a { color: var(--cream); }

.nav-toggle { display: inline-flex; align-items: center; gap: .6rem; background: none; border: 0; padding: .75rem 0 .75rem .75rem; margin-left: auto; color: var(--espresso); font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; cursor: pointer; }
.nav-toggle .bars { width: 22px; height: 10px; position: relative; }
.nav-toggle .bars::before, .nav-toggle .bars::after { content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .25s ease, top .25s ease; }
.nav-toggle .bars::before { top: 0; } .nav-toggle .bars::after { top: 8px; }
.nav-toggle[aria-expanded="true"] .bars::before { top: 4px; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] .bars::after { top: 4px; transform: rotate(-45deg); }

.nav ul { display: flex; gap: clamp(1.25rem, 2.4vw, 2.25rem); }
.nav a { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; padding: .5rem 0; color: var(--espresso); }
.nav a:hover { text-decoration: underline; }

@media (max-width: 899px) {
  .js .nav { position: fixed; inset: var(--header-h) 0 auto 0; background: var(--cream); border-bottom: 1px solid var(--line); padding: var(--s2) var(--gutter) var(--s4); display: none; }
  .js .nav.is-open { display: block; }
  .js .nav ul { flex-direction: column; gap: 0; }
  .js .nav li + li { border-top: 1px solid var(--line); }
  .js .site-header .nav a { display: block; padding: 1rem 0; font-size: .875rem; color: var(--espresso); }
  .js .site-header.is-over-hero:has(.nav.is-open) { background: var(--cream); }
  .js .site-header.is-over-hero:has(.nav.is-open) .nav-toggle { color: var(--espresso); }
  /* Without JS: show links in a scrollable row */
  html:not(.js) .nav-toggle { display: none; }
  html:not(.js) .nav { overflow-x: auto; }
  html:not(.js) .nav ul { gap: 1rem; }
}
@media (min-width: 900px) { .nav-toggle { display: none; } }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 100vh; min-height: 100svh; max-height: 64rem; display: grid; place-items: center; color: var(--cream); overflow: hidden; isolation: isolate; }
.hero picture, .hero picture img { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -2; }
.hero picture img { object-fit: cover; object-position: 50% 55%; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 90% 58% at 50% 55%, rgba(42, 28, 17, .70) 0%, rgba(42, 28, 17, .50) 60%, rgba(42, 28, 17, .28) 100%), linear-gradient(180deg, rgba(42, 28, 17, .35) 0%, rgba(42, 28, 17, 0) 22%, rgba(42, 28, 17, 0) 75%, rgba(42, 28, 17, .4) 100%); }
.hero__inner { text-align: center; padding: calc(var(--header-h) + 2rem) var(--gutter) 4rem; display: flex; flex-direction: column; align-items: center; }
.hero h1 { margin: 0 0 var(--s4); }
.hero h1 img { width: clamp(13rem, 42vw, 22rem); height: auto; }
.hero__tagline { font-family: var(--f-head); font-size: clamp(1.75rem, 4.6vw, 2.75rem); line-height: 1.15; margin: 0 0 var(--s2); }
.hero__sub { font-weight: 400; font-size: clamp(1rem, 1.8vw, 1.125rem); max-width: 30em; margin: 0 auto var(--s4); }
.hero .btn-row { justify-content: center; }
.hero__scroll { position: absolute; bottom: 1.5rem; left: 50%; transform: translateX(-50%); font-family: var(--f-sub); font-weight: 500; font-size: .6875rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; display: flex; flex-direction: column; align-items: center; gap: .5rem; }
.hero__scroll::after { content: ""; width: 1px; height: 2rem; background: currentColor; opacity: .7; }
@media (max-height: 640px) { .hero__scroll { display: none; } }

/* ---------- About ---------- */
.about__grid { display: grid; gap: var(--s5); align-items: center; }
.arch { border-radius: var(--radius-arch); overflow: hidden; background: var(--stone); }
.arch img { width: 100%; height: 100%; object-fit: cover; }
.arch--framed { position: relative; }
.about__media { position: relative; max-width: 26rem; margin-inline: auto; width: 100%; }
.about__media .arch { aspect-ratio: 2 / 3; }
.about__media .accent { position: absolute; width: 4.5rem; right: -.5rem; bottom: -1.5rem; }
.values { margin-top: var(--s5); border-top: 1px solid var(--line); }
.values li { display: grid; grid-template-columns: 8.5rem 1fr; gap: var(--s2); padding: var(--s3) 0; border-bottom: 1px solid var(--line); }
.values h3 { font-size: 1.375rem; }
.values p { margin: 0; font-size: 1rem; }
@media (max-width: 479px) { .values li { grid-template-columns: 1fr; gap: .25rem; } }
@media (min-width: 900px) { .about__grid { grid-template-columns: 5fr 6fr; gap: var(--s7); } .about__media { margin: 0; } }

/* ---------- Menu ---------- */
.menu { background: #DCD2C7; background: var(--stone-tint); }
.menu__head { display: grid; gap: var(--s3); margin-bottom: var(--s5); }
.menu__jump { display: flex; flex-wrap: wrap; gap: .5rem; }
.menu__jump a { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; text-decoration: none; border: 1px solid var(--espresso); padding: .65rem 1rem; min-height: 2.75rem; display: inline-flex; align-items: center; }
.menu__jump a:hover { background: var(--espresso); color: var(--cream); }
.menu-group + .menu-group { margin-top: clamp(4rem, 9vw, 7rem); }
.menu-group__title { display: flex; align-items: center; gap: var(--s3); font-size: clamp(2.75rem, 8vw, 5rem); margin-bottom: var(--s4); }
.menu-group__title img { width: clamp(2.5rem, 6vw, 3.5rem); height: auto; }
.menu-cat { border-top: 1px solid var(--line); }
.menu-cat:last-of-type { border-bottom: 1px solid var(--line); }
#menu-drinks .menu-cat:last-of-type { border-bottom: 0; }
.menu-cat > summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: var(--s3); padding-block: var(--s3); }
.menu-cat > summary::-webkit-details-marker { display: none; }
.menu-cat > summary::after { content: ""; grid-column: 2; grid-row: 1 / span 2; width: 2.5rem; height: 2.5rem; border: 1px solid var(--espresso); border-radius: 50%; background: linear-gradient(var(--espresso), var(--espresso)) center / .75rem 1px no-repeat, linear-gradient(var(--espresso), var(--espresso)) center / 1px .75rem no-repeat; transition: background-color .2s ease; }
.menu-cat[open] > summary::after { background: linear-gradient(var(--espresso), var(--espresso)) center / .75rem 1px no-repeat; }
.menu-cat > summary:hover::after { background-color: rgba(239, 238, 232, .6); }
.menu-cat > summary:focus-visible { outline: 2px solid var(--espresso); outline-offset: 4px; }
.menu-cat__head h4 { grid-column: 1; }
.menu-cat__head .menu-cat__note { grid-column: 1; }
.menu-cat__body { display: grid; gap: var(--s4); padding-bottom: var(--s5); }
.menu-cat:first-of-type { border-top-color: var(--espresso); }
.menu-cat__head h4 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
.menu-cat__note { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; margin: .4rem 0 0; }
.menu-cat__media { display: none; }
@media (min-width: 900px) {
  .menu-cat--media .menu-cat__body { grid-template-columns: 1fr 12rem; column-gap: var(--s6); }
  .menu-cat__media { display: block; }
  .menu-cat__media .arch { aspect-ratio: 2 / 3; border: 1px solid var(--caramel); padding: 4px; background: transparent; }
  .menu-cat__media .arch img { border-radius: var(--radius-arch); }
}
.menu-list { display: grid; gap: 0; }
.menu-list--two { display: block; column-gap: var(--s5); }
.menu-list--two .menu-item { break-inside: avoid; }
@media (min-width: 640px) { .menu-list--two { columns: 2; } }
.menu-item { display: grid; grid-template-columns: 1fr auto; column-gap: var(--s2); padding: .85rem 0; border-bottom: 1px dotted var(--line); }
.menu-item__name { font-family: var(--f-sub); font-weight: 500; font-size: .875rem; letter-spacing: .05em; text-transform: uppercase; line-height: 1.4; }
.menu-item__price { font-family: var(--f-sub); font-weight: 500; font-size: .875rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.menu-item__desc { grid-column: 1 / -1; margin: .2rem 0 0; font-size: 1rem; line-height: 1.5; }
.menu-addons { margin-top: var(--s3); padding: var(--s2) var(--s3); background: rgba(239, 238, 232, .55); }
.menu-addons__title { font-family: var(--f-sub); font-weight: 500; font-size: .6875rem; letter-spacing: .05em; text-transform: uppercase; margin: 0 0 .5rem; }
.menu-addons ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); column-gap: var(--s4); }
.menu-addons li { display: flex; justify-content: space-between; gap: var(--s2); padding: .35rem 0; font-size: 1rem; font-style: normal; }
.menu-addons li span:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; }
.menu-addons--solo { margin-top: 0; }
.tea-list { display: flex; flex-wrap: wrap; gap: .4rem .5rem; margin-top: .5rem; grid-column: 1 / -1; }
.tea-list li { font-size: .9375rem; padding: .2rem .7rem; border: 1px solid var(--line); border-radius: 999px; }
.choice + .choice { margin-top: var(--s3); }
.choice__head { display: flex; justify-content: space-between; gap: var(--s2); }
.choice .tea-list { margin-top: .6rem; }
.menu-addons .tea-list { display: flex; }
.menu__foot { margin-top: var(--s5); padding-top: var(--s3); border-top: 1px solid var(--espresso); display: grid; gap: var(--s2); font-size: .9375rem; }
@media (min-width: 900px) { .menu__foot { grid-template-columns: 1fr auto; align-items: center; } }

/* ---------- Gallery ---------- */
.gallery__head { display: grid; gap: var(--s2); margin-bottom: var(--s5); }
@media (min-width: 900px) { .gallery__head { grid-template-columns: 1fr auto; align-items: end; } }
.gallery__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(.5rem, 1.5vw, 1rem); }
@media (min-width: 900px) { .gallery__grid { grid-template-columns: repeat(3, 1fr); } }
.gallery__grid figure { margin: 0; aspect-ratio: 4 / 5; overflow: hidden; background: var(--stone); }
.gallery__grid img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.gallery__grid figure:hover img { transform: scale(1.03); }

/* ---------- Visit ---------- */
.visit { background: var(--cream); }
.visit__grid { display: grid; gap: var(--s5); }
@media (min-width: 900px) { .visit__grid { grid-template-columns: 6fr 5fr; gap: var(--s7); align-items: start; } }
.visit address { font-style: normal; font-family: var(--f-head); font-size: clamp(1.5rem, 3.4vw, 2.125rem); line-height: 1.25; margin-bottom: var(--s2); }
.visit__detail { display: grid; gap: var(--s4); margin-top: var(--s4); }
@media (min-width: 640px) { .visit__detail { grid-template-columns: 1fr 1fr; } }
.hours { width: 100%; border-collapse: collapse; font-size: 1rem; }
.hours caption { text-align: left; }
.hours th, .hours td { padding: .55rem 0; border-bottom: 1px solid var(--line); text-align: left; font-weight: 300; }
.hours td { text-align: right; font-variant-numeric: tabular-nums; }
.hours tr.is-today th, .hours tr.is-today td { font-weight: 400; }
.hours tr.is-today th::after { content: "Today"; margin-left: .6rem; font-family: var(--f-sub); font-weight: 500; font-size: .625rem; letter-spacing: .05em; text-transform: uppercase; padding: .15rem .45rem; background: var(--espresso); color: var(--cream); vertical-align: middle; }
.visit__note { font-size: .9375rem; margin-top: var(--s2); }
.contact-list li { padding: .55rem 0; border-bottom: 1px solid var(--line); }
.contact-list a { text-decoration: none; }
.contact-list a:hover { text-decoration: underline; }
.visit__media { position: relative; }
.visit__media .arch { aspect-ratio: 2 / 3; max-width: 26rem; margin-inline: auto; }
.visit .btn-row { margin-top: var(--s4); }

/* ---------- Order ---------- */
.on-dark { background: var(--espresso); color: var(--cream); }
.on-dark a { color: var(--cream); }
.on-dark .btn--light { color: var(--espresso); }
.on-dark .btn--ghost-light:hover { color: var(--espresso); }
.order__inner { display: grid; gap: var(--s4); justify-items: center; text-align: center; max-width: 44rem; margin-inline: auto; }
.order__mark { width: 3.5rem; height: auto; }
.order .eyebrow { justify-content: center; }
.order .eyebrow::before { content: ""; flex: 0 0 2.5rem; height: 1px; background: currentColor; opacity: .5; }
.order .btn-row { justify-content: center; }
.order__small { font-size: .9375rem; opacity: .9; margin: 0; }

/* ---------- Careers ---------- */
.careers__grid { display: grid; gap: var(--s5); align-items: center; }
@media (min-width: 900px) { .careers__grid { grid-template-columns: 6fr 5fr; gap: var(--s7); } }
.careers__media img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.apply-list { padding: 0; list-style: none; counter-reset: apply; border-top: 1px solid var(--line); margin: var(--s3) 0 var(--s4); }
.apply-list li { counter-increment: apply; display: grid; grid-template-columns: 2.25rem 1fr; padding: .7rem 0; border-bottom: 1px solid var(--line); }
.apply-list li::before { content: counter(apply, decimal-leading-zero); font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; padding-top: .2rem; }
.apply-list .opt { font-size: .875rem; opacity: .85; }
.careers__email { font-size: 1rem; margin-top: var(--s2); }
.careers__privacy { font-size: .9375rem; margin-top: var(--s3); }

/* ---------- Footer ---------- */
.site-footer { padding-block: var(--s6) var(--s4); }
.footer__grid { display: grid; gap: var(--s5); }
@media (min-width: 900px) { .footer__grid { grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: var(--s4); } }
.footer__logo { width: 9rem; }
.footer__tag { font-family: var(--f-head); font-size: 1.375rem; margin-top: var(--s3); }
.site-footer h2 { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; margin-bottom: var(--s2); }
.site-footer address { font-style: normal; }
.site-footer li { padding: .2rem 0; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.footer__base { margin-top: var(--s6); padding-top: var(--s3); border-top: 1px solid var(--line-light); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s2); font-size: .875rem; }
.footer__credit { margin: var(--s2) 0 0; font-size: .8125rem; opacity: .8; }

/* ---------- Privacy page ---------- */
.page-top { padding-top: calc(var(--header-h) + clamp(3rem, 8vw, 6rem)); }
.prose { max-width: 42rem; }
.prose h2 { font-size: clamp(1.5rem, 3.4vw, 2rem); margin: var(--s5) 0 var(--s2); }
.prose ul { list-style: disc; padding-left: 1.25rem; margin: 0 0 1em; }
.prose li { margin: .35rem 0; }
.prose table { border-collapse: collapse; width: 100%; margin: var(--s2) 0; font-size: 1rem; }
.prose th, .prose td { border-bottom: 1px solid var(--line); padding: .6rem .5rem .6rem 0; text-align: left; vertical-align: top; font-weight: 300; }
.prose th { font-family: var(--f-sub); font-weight: 500; font-size: .75rem; letter-spacing: .05em; text-transform: uppercase; }

@media print { .site-header, .hero__scroll, .nav-toggle { display: none; } .hero { min-height: auto; color: var(--espresso); } .hero::after, .hero picture { display: none; } }

/* Mobile: menu section links as one swipeable row */
@media (max-width: 639px) {
  .menu__jump { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gutter) * -1); padding: 0 var(--gutter) .5rem; scroll-snap-type: x proximity; scrollbar-width: thin; }
  .menu__jump a { flex: none; scroll-snap-align: start; }
}
@media (max-width: 899px) { .gallery__grid figure:nth-child(9) { display: none; } }