/* Complementary website palette — NOT official brand codes. Never recolour the logo. */
:root {
  --cream:#FFF4DE;
  --navy:#34475E;
  --gold:#E9C65B;
  --espresso:#29221D;
  --taupe:#A89B7D;
  --navy-deep:#2A3A4D;
  --on-dark:rgba(255,244,222,.82);
  --line:rgba(168,155,125,.5);
  --line-dark:rgba(233,198,91,.24);
  --soft:rgba(168,155,125,.14);
  --gold-ink:#6E5518;
  --font-heading:'Fraunces',serif;
  --font-label:'DM Sans',sans-serif;
  --font-body:'DM Sans',sans-serif;
  --container:1180px;
  --gutter:clamp(22px,5vw,72px);
}

*,*::before,*::after {
  box-sizing:border-box;
}

html {
  scroll-padding-top:150px;
  scroll-behavior:smooth;
}

body {
  margin:0;
  background:var(--cream);
  color:var(--espresso);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

button,input,textarea,select {
  font:inherit;
}

a {
  color:inherit;
  text-underline-offset:5px;
}

button,a {
  -webkit-tap-highlight-color:transparent;
}

a,button,summary {
  touch-action:manipulation;
}

button {
  cursor:pointer;
}

img,svg {
  display:block;
  max-width:100%;
}

img {
  height:auto;
}

figure {
  margin:0;
}

p {
  margin:0 0 1.1em;
}

h1,h2,h3 {
  color:var(--navy);
  font-family:var(--font-heading);
  font-weight:600;
  line-height:1.11;
  margin:0 0 .5em;
  letter-spacing:0;
  text-wrap:balance;
}

h1 {
  font-size:clamp(33px,3.8vw,53px);
}

h2 {
  font-size:clamp(25px,2.5vw,35px);
}

h3 {
  font-size:22px;
}

h1,h2,h3,p {
  overflow-wrap:break-word;
}

ul,ol {
  padding-left:1.3em;
}

::selection {
  background:var(--gold);
  color:var(--espresso);
}

:focus-visible {
  outline:3px solid var(--navy);
  outline-offset:5px;
  scroll-margin-block:150px 120px;
}

[hidden] {
  display:none!important;
}

main:focus {
  outline:none;
}

.container {
  width:min(100% - var(--gutter)*2,var(--container));
  margin-inline:auto;
}

.section {
  padding-block:clamp(64px,7.5vw,112px);
}

.eyebrow {
  font-size:16px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  line-height:1.5;
  color:var(--navy);
  margin-bottom:18px;
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:52px;
  padding:13px 26px;
  text-decoration:none;
  border:1px solid var(--navy);
  border-radius:2px;
  line-height:1.3;
  font-size:16px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-family:var(--font-label);
  background:transparent;
  color:var(--navy);
}

.button.primary {
  background:var(--navy);
  color:var(--cream);
}

.button.secondary {
  background:transparent;
  color:var(--navy);
}

.button:hover {
  box-shadow:inset 0 0 0 1px currentColor;
}

.button svg {
  width:20px;
  height:22px;
}

.button span[aria-hidden] {
  font-size:19px;
  line-height:1;
}

.text-link,.inline-link,.footer-link {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-weight:500;
}

.text-link {
  color:var(--navy);
  text-decoration:underline;
  text-decoration-color:var(--gold);
  text-decoration-thickness:2px;
}

.text-link:hover,.inline-link:hover {
  text-decoration-color:currentColor;
}

.inline-link {
  display:inline;
  font-weight:600;
  text-decoration-thickness:1px;
}

.skip-link {
  position:fixed;
  top:-200px;
  left:16px;
  z-index:100;
  background:var(--navy);
  color:var(--cream);
  padding:14px 22px;
  border:2px solid var(--cream);
  border-radius:4px;
}

.skip-link:focus {
  top:12px;
}

.topline {
  border-bottom:1px solid rgba(233,198,91,.18);
  background:var(--espresso);
  font-size:16px;
  color:var(--cream);
  letter-spacing:.03em;
}

.topline :focus-visible {
  outline-color:var(--gold);
}

.topline .container {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:44px;
  gap:20px;
}

.topline-link {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
}

.site-header {
  background:var(--navy);
  border-bottom:1px solid var(--line-dark);
  position:sticky;
  top:0;
  z-index:20;
}

.site-header :focus-visible {
  outline-color:var(--gold);
}

.header-inner {
  display:flex;
  align-items:center;
  gap:30px;
  min-height:106px;
  padding-block:13px;
}

.brand {
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  flex-shrink:0;
  min-height:52px;
}

.original-logo {
  object-fit:contain;
  aspect-ratio:1;
  filter:none;
  transform:none;
  border-radius:0;
  width:68px;
  height:68px;
}

.brand-text {
  line-height:1.2;
  color:var(--cream);
  font-family:var(--font-heading);
  font-size:21px;
  font-weight:600;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.brand-text small {
  display:block;
  font-family:var(--font-body);
  font-size:16px;
  font-weight:400;
  letter-spacing:.1em;
  text-transform:none;
  color:var(--on-dark);
  margin-top:3px;
}

#main-nav {
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:26px;
}

#main-nav>a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-size:16px;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--on-dark);
  text-decoration:none;
  white-space:nowrap;
  position:relative;
}

#main-nav>a::after {
  content:'';
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  height:2px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:left;
}

#main-nav>a[aria-current],#main-nav>a:hover {
  color:var(--cream);
}

#main-nav>a[aria-current]::after,#main-nav>a:hover::after {
  transform:scaleX(1);
}

.header-action {
  flex-shrink:0;
}

.header-action .button {
  font-size:16px;
  gap:10px;
  padding-inline:22px;
  min-height:48px;
  background:var(--gold);
  border-color:var(--gold);
  color:var(--espresso);
}

.header-action .button:hover {
  box-shadow:inset 0 0 0 2px rgba(41,34,29,.45);
}

.nav-toggle {
  display:none;
}

.hero {
  display:grid;
  grid-template-columns:1.26fr .82fr;
  gap:clamp(35px,6vw,96px);
  align-items:center;
  padding-block:clamp(66px,7vw,102px);
}

.hero-copy .eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:16px;
}

.gold-line {
  height:2px;
  width:26px;
  background:var(--gold);
  flex-shrink:0;
}

.hero h1 {
  margin-bottom:30px;
  letter-spacing:-.025em;
  font-size:clamp(60px,7.1vw,102px);
  line-height:.98;
}

.handline {
  display:inline-block;
  position:relative;
  z-index:0;
}

.handline::after {
  content:'';
  position:absolute;
  left:1%;
  right:-1%;
  bottom:1px;
  height:8px;
  background:var(--gold);
  z-index:-1;
  border-radius:55% 40% 45% 35%;
  transform:rotate(-1deg);
}

.hero-description {
  font-size:20px;
  line-height:1.6;
  max-width:510px;
  margin-bottom:30px;
}

.hero-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:30px;
}

.hero-detail {
  font-size:16px;
  line-height:1.7;
  color:var(--navy);
  margin:0;
  max-width:450px;
}

.hero-detail>span {
  color:var(--navy);
  padding-inline:7px;
}

.identity-panel {
  align-self:center;
  text-align:center;
  border:1px solid var(--line);
  border-radius:8px;
  padding:24px 24px 30px;
  background:var(--soft);
}

.identity-art {
  position:relative;
  aspect-ratio:1;
  width:100%;
  background:var(--navy);
  display:flex;
  align-items:center;
  justify-content:center;
}

.hero-logo {
  width:100%;
  height:100%;
  object-fit:contain;
}

.identity-rule {
  position:absolute;
  width:56px;
  bottom:-1px;
  height:3px;
  background:var(--gold);
}

.identity-panel p {
  font-size:17px;
  line-height:1.5;
  margin:24px 0 10px;
}

.identity-location {
  display:block;
  font-size:16px;
  letter-spacing:.06em;
  color:var(--navy);
}

.identity-location span {
  padding:0 8px;
}

.photo {
  overflow:hidden;
  border-radius:7px;
  background:var(--soft);
}

.photo img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.hero-photo {
  aspect-ratio:4/5;
}

.featured-section {
  border-top:1px solid var(--line);
}

.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:32px;
  margin-bottom:38px;
}

.section-heading h2 {
  margin-bottom:0;
  max-width:720px;
}

.section-heading .button {
  flex-shrink:0;
  margin-bottom:4px;
}

.section-heading .eyebrow {
  margin-bottom:13px;
}

.dish-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}

.dish-card {
  border:1px solid var(--line);
  border-radius:7px;
  overflow:hidden;
  background:transparent;
}

.dish-copy {
  padding:28px 26px 30px;
}

.dish-number {
  font-size:16px;
  line-height:1.5;
  letter-spacing:.06em;
  color:var(--navy);
  display:block;
  margin-bottom:24px;
}

.dish-number span {
  color:var(--navy);
  margin-inline:7px;
}

.dish-title {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:15px;
}

.dish-title h3 {
  font-size:40px;
}

.dish-copy p {
  font-size:18px;
  line-height:1.65;
  margin-bottom:0;
}

.dish-photo {
  aspect-ratio:4/3;
  border-radius:0;
}

.price {
  font:600 20px/1.4 var(--font-body);
  white-space:nowrap;
  color:var(--espresso);
}

.dietary-label {
  display:inline-block;
  background:var(--gold);
  color:var(--espresso);
  padding:4px 10px;
  border-radius:3px;
  font-size:16px;
  margin-top:16px;
}

.section-note {
  font-size:16px;
  line-height:1.65;
  margin-top:24px;
  margin-bottom:0;
}

.market-section {
  background:var(--soft);
  border-block:1px solid var(--line);
}

.market-layout {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:clamp(35px,7vw,108px);
  align-items:center;
}

.market-heading p:not(.eyebrow) {
  max-width:430px;
}

.market-heading h2 {
  font-size:clamp(48px,5.5vw,78px);
}

.market-card {
  border:1px solid var(--line);
  border-radius:7px;
  padding:36px;
  background:var(--cream);
}

.market-card-title {
  display:flex;
  align-items:center;
  gap:18px;
  margin-bottom:22px;
}

.market-card-title h3 {
  font-size:34px;
  margin:0;
}

.pin-icon {
  display:block;
  width:30px;
  height:34px;
  color:var(--navy);
  flex-shrink:0;
}

.pin-icon svg {
  width:100%;
  height:100%;
}

.market-facts {
  margin:0;
}

.market-facts>div {
  padding:20px 0;
  border-top:1px solid var(--line);
}

.market-facts dt {
  font-size:16px;
  color:var(--navy);
  margin-bottom:6px;
}

.market-facts dd {
  margin:0;
  font-size:20px;
  font-weight:600;
  line-height:1.45;
}

.market-facts .market-sub {
  font-weight:400;
  display:block;
  font-size:16px;
  margin-top:7px;
  line-height:1.65;
}

.market-note {
  font-size:16px;
  line-height:1.65;
  margin-block:10px 24px;
}

.market-card .button {
  width:100%;
  justify-content:space-between;
}

.story-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:clamp(38px,8vw,125px);
}

.story-statement {
  border-left:4px solid var(--gold);
  padding:50px 0 50px 40px;
}

.story-statement p {
  font-family:var(--font-heading);
  font-size:clamp(48px,5.5vw,80px);
  font-weight:600;
  line-height:1.04;
  color:var(--navy);
  margin-top:20px;
  margin-bottom:25px;
}

.fine-rule {
  display:block;
  width:88px;
  height:2px;
  background:var(--gold);
}

.story-photo {
  aspect-ratio:4/5;
}

.story-copy p:not(.eyebrow) {
  max-width:495px;
}

.story-copy .button {
  margin-top:10px;
}

.faq-section {
  border-top:1px solid var(--line);
}

.faq-layout {
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:clamp(36px,7vw,95px);
}

.faqs {
  border-top:1px solid var(--line);
}

.faqs details {
  border-bottom:1px solid var(--line);
}

.faqs summary {
  font-size:18px;
  font-weight:500;
  color:var(--navy);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:24px 0;
  min-height:68px;
  cursor:pointer;
  list-style:none;
  line-height:1.55;
}

/* The FAQ question is an h3 so crawlers and extractors see a real heading, but it must keep the
   approved 18px DM Sans toggle styling rather than inherit the serif display h3 rule. */
.faqs summary h3 {
  font:inherit;
  color:inherit;
  letter-spacing:inherit;
  text-wrap:inherit;
  margin:0;
}
.faqs summary::-webkit-details-marker {
  display:none;
}

.faqs summary::after {
  content:'+';
  content:'+' / '';
  font-size:26px;
  font-weight:400;
  flex-shrink:0;
  width:30px;
  text-align:center;
}

.faqs details[open] summary::after {
  transform:rotate(45deg);
}

.faq-answer {
  padding:0 44px 24px 0;
  font-size:18px;
}

.faq-answer p {
  margin:0;
}

.contact-band {
  background:var(--soft);
  border-top:1px solid var(--line);
  padding-block:55px;
}

.contact-band>.container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
}

.contact-band h2 {
  font-size:54px;
  margin-bottom:8px;
}

.contact-band p {
  margin:0;
}

.contact-band .eyebrow {
  margin-bottom:10px;
}

.site-footer {
  background:var(--navy);
  color:var(--cream);
  padding-top:60px;
}

.site-footer :focus-visible {
  outline-color:var(--cream);
}

.footer-main {
  display:grid;
  grid-template-columns:1.2fr .65fr .85fr 1.1fr;
  gap:35px;
  padding-bottom:44px;
}

.footer-brand {
  display:flex;
  align-items:flex-start;
  gap:16px;
}

.footer-logo {
  width:78px;
  height:78px;
  flex-shrink:0;
}

.footer-name {
  font-family:var(--font-heading);
  font-size:36px;
  font-weight:600;
  line-height:1.2;
  margin-bottom:18px;
}

.footer-name span {
  font-family:var(--font-body);
  font-size:16px;
  font-weight:400;
  display:block;
  margin-top:3px;
}

.footer-brand>div>p:not(.footer-name) {
  font-size:16px;
}

.footer-column h3 {
  font-family:var(--font-body);
  font-size:18px;
  font-weight:600;
  color:var(--cream);
  margin-block:5px 16px;
  line-height:1.5;
}

.footer-link {
  display:flex;
  width:fit-content;
  font-size:16px;
  text-decoration:none;
  font-weight:400;
}

.footer-link:hover {
  text-decoration:underline;
}

.footer-column p {
  font-size:16px;
  line-height:1.65;
}

.footer-column .footer-note {
  font-size:16px;
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:16px;
  padding-block:25px;
  border-top:1px solid rgba(255,244,222,.28);
}

.mobile-actions {
  display:none;
}

.page-intro {
  padding-block:clamp(44px,5.2vw,72px) clamp(40px,4.6vw,64px);
}

.page-intro h1 {
  max-width:1040px;
}

.page-description {
  max-width:720px;
  font-size:20px;
  margin-top:26px;
  margin-bottom:0;
}

.page-intro .eyebrow {
  margin-bottom:22px;
}

.menu-layout {
  display:grid;
  grid-template-columns:260px 1fr;
  gap:70px;
  align-items:start;
}

.menu-aside {
  position:sticky;
  top:145px;
}

.filters {
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:24px;
}

.filters button {
  min-height:52px;
  display:flex;
  justify-content:space-between;
  gap:25px;
  align-items:center;
  border-radius:4px;
  border:1px solid var(--line);
  background:transparent;
  padding:12px 16px;
  color:var(--navy);
  font-size:18px;
}

.filters button.active {
  background:var(--navy);
  color:var(--cream);
  border-color:var(--navy);
}

.filters button:not(.active):hover {
  background:var(--soft);
}

.filters button span {
  font-size:16px;
}

.menu-aside-note,.filter-result {
  font-size:16px;
}

.filter-result {
  margin-top:24px;
}

.menu-list .dish-card {
  border:0;
  border-radius:0;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr;
}

.menu-list .dish-copy {
  padding:28px 0;
}

.menu-list .dish-number {
  margin-bottom:12px;
}

.menu-list .dish-title h2 {
  font-size:44px;
}

.menu-list .dish-copy p {
  max-width:630px;
}

.menu-list .dish-card:first-child .dish-copy {
  padding-top:0;
}

.menu-list .dish-card:has(.photo) {
  grid-template-columns:160px 1fr;
  gap:24px;
  padding-block:24px;
}

.menu-list .dish-photo {
  aspect-ratio:1;
  height:auto;
  align-self:start;
  border-radius:5px;
}

.menu-list .dish-card:has(.photo) .dish-copy {
  padding:0;
}

.menu-section {
  padding-top:52px;
}

.visit-layout {
  display:grid;
  grid-template-columns:1.1fr .8fr;
  gap:80px;
}

.visit-card {
  border:1px solid var(--line);
  border-radius:7px;
  padding:44px;
}

.visit-card h2 {
  margin-bottom:36px;
}

.visit-actions {
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap;
}

.visit-aside {
  display:flex;
  flex-direction:column;
  gap:40px;
}

.location-note {
  padding:36px;
  background:var(--soft);
  border-left:3px solid var(--gold);
}

.location-note .pin-icon {
  margin-bottom:25px;
}

.location-note h2 {
  font-size:44px;
}

.location-note .eyebrow {
  margin-bottom:18px;
}

.travel-note h3 {
  font-size:36px;
}

.about-layout {
  display:grid;
  grid-template-columns:.9fr 1fr;
  gap:100px;
  align-items:center;
}

.about-identity {
  border:1px solid var(--line);
  padding:32px;
  border-radius:7px;
  background:var(--soft);
  text-align:center;
}

.story-logo {
  width:100%;
  height:auto;
  aspect-ratio:1;
}

.about-identity>p {
  margin:28px 0 0;
  font-weight:600;
  font-size:18px;
}

.about-identity>p span {
  font-size:16px;
  font-weight:400;
}

.about-copy h2 {
  font-size:68px;
}

.about-copy .button {
  margin-top:18px;
}

.contact-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
}

.contact-primary {
  border-left:3px solid var(--gold);
  padding-left:34px;
}

.contact-primary h2 {
  font-size:clamp(38px,4.5vw,64px);
}

.contact-social h2 {
  font-size:48px;
}

.social-links {
  border-top:1px solid var(--line);
  margin-top:24px;
}

.social-link {
  display:flex;
  justify-content:space-between;
  text-decoration:none;
  min-height:60px;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding-block:12px;
  color:var(--navy);
}

.social-link:hover {
  text-decoration:underline;
}

.contact-location {
  border-top:1px solid var(--line);
  padding-top:50px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
}

.contact-location h2 {
  font-size:48px;
}

.contact-location .button {
  flex-shrink:0;
}

.contact-location p {
  margin:0;
}

.contact-location .section-note {
  margin-top:16px;
}

.ordering-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px;
}

.ordering-layout>aside {
  border-left:3px solid var(--gold);
  padding-left:36px;
}

.ordering-layout h2 {
  font-size:48px;
}

.gallery {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.gallery-photo {
  aspect-ratio:1;
}

.reviews {
  display:grid;
  gap:25px;
  grid-template-columns:repeat(2,1fr);
}

.reviews figure {
  padding:30px;
  border:1px solid var(--line);
  border-radius:5px;
}

.reviews blockquote {
  margin:0;
}

.reviews figcaption {
  font-size:16px;
}

.schedule-exceptions {
  margin-top:40px;
}

.schedule-exceptions h2 {
  font-size:40px;
}

@media(min-width:1500px) {
  .hero h1 {
    font-size:108px;
  }
}

@media(max-width:1150px) {
  .header-inner {
    gap:22px;
  }
  #main-nav {
    gap:20px;
  }
  .header-action {
    display:none;
  }
  .hero {
    grid-template-columns:1.15fr .85fr;
    gap:38px;
  }
  .hero h1 {
    font-size:clamp(62px,7.2vw,94px);
  }
  .identity-panel {
    padding:20px;
  }
  .identity-location {
    letter-spacing:0;
  }
  .dish-grid {
    gap:20px;
  }
  .dish-copy {
    padding:24px 20px;
  }
  .section-heading {
    align-items:flex-start;
  }
  .section-heading .button {
    margin-top:38px;
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
  }
  .footer-brand {
    grid-row:auto;
  }
  .menu-layout {
    grid-template-columns:220px 1fr;
    gap:48px;
  }
  .visit-layout,.about-layout {
    gap:48px;
  }
  .visit-card {
    padding:32px;
  }
  .contact-layout {
    gap:48px;
  }
  .hero-detail span {
    padding-inline:4px;
  }
}

@media(max-width:800px) {
  :root {
    --gutter:26px;
  }
  .topline .container>span {
    display:none;
  }
  .topline .container {
    justify-content:center;
  }
  .header-inner {
    min-height:88px;
    flex-wrap:wrap;
    gap:0;
    padding-block:12px;
  }
  .original-logo {
    width:58px;
    height:58px;
  }
  .brand-text {
    font-size:18px;
  }
  .brand-text small {
    font-size:16px;
  }
  .js .nav-toggle {
    display:flex;
    align-items:center;
    gap:9px;
    justify-content:center;
    margin-left:auto;
    min-height:48px;
    min-width:88px;
    border:1px solid rgba(255,244,222,.42);
    border-radius:2px;
    background:transparent;
    color:var(--cream);
    font-size:16px;
    letter-spacing:.1em;
    text-transform:uppercase;
    padding:9px 11px;
  }
  .menu-icon {
    width:18px;
    height:16px;
    display:flex;
    flex-direction:column;
    justify-content:space-around;
  }
  .menu-icon i {
    display:block;
    height:2px;
    background:var(--cream);
    width:100%;
  }
  .js #main-nav {
    display:none;
  }
  .js #main-nav.is-open {
    display:flex;
  }
  .site-header:has(#main-nav.is-open) {
    position:relative;
  }
  #main-nav {
    width:100%;
    margin:14px 0 0;
    flex-wrap:wrap;
    padding-block:12px;
    border-top:1px solid var(--line-dark);
    gap:4px 25px;
  }
  #main-nav>a {
    font-size:18px;
    padding:8px 0;
  }
  .hero {
    grid-template-columns:1fr 1fr;
    gap:30px;
    padding-block:60px;
  }
  .hero h1 {
    font-size:60px;
  }
  .hero-copy .eyebrow {
    font-size:16px;
    display:block;
  }
  .hero-copy .gold-line {
    display:none;
  }
  .hero-description {
    font-size:18px;
  }
  .hero-actions {
    gap:10px;
  }
  .hero-actions .button {
    padding-inline:16px;
    gap:14px;
  }
  .hero-detail {
    font-size:16px;
  }
  .identity-panel {
    padding:16px 16px 22px;
  }
  .identity-panel p {
    font-size:16px;
    margin-top:22px;
  }
  .identity-location {
    font-size:16px;
  }
  .hero-logo {
    width:100%;
    height:100%;
  }
  .section {
    padding-block:64px;
  }
  .section-heading h2 {
    font-size:44px;
  }
  .section-heading .button {
    font-size:16px;
    padding-inline:18px;
    gap:14px;
  }
  .dish-grid {
    grid-template-columns:1fr;
  }
  .dish-copy {
    padding:26px 28px;
  }
  .dish-number {
    margin-bottom:14px;
  }
  .dish-title h3 {
    font-size:40px;
  }
  .dish-grid .dish-card:has(.photo) {
    display:grid;
    grid-template-columns:180px 1fr;
  }
  .dish-grid .dish-photo {
    height:100%;
    aspect-ratio:auto;
  }
  .market-layout,.story-layout,.faq-layout {
    gap:36px;
  }
  .market-heading h2 {
    font-size:48px;
  }
  .market-card {
    padding:26px;
  }
  .market-card-title h3 {
    font-size:30px;
  }
  .story-statement {
    padding:35px 0 35px 25px;
  }
  .story-statement p {
    font-size:52px;
  }
  .story-copy h2 {
    font-size:44px;
  }
  .faq-layout {
    grid-template-columns:.8fr 1.2fr;
  }
  .faq-layout h2 {
    font-size:42px;
  }
  .footer-main {
    gap:40px;
  }
  .footer-logo {
    width:76px;
    height:76px;
  }
  .page-intro {
    padding-block:56px 46px;
  }
  .page-intro h1 {
    font-size:44px;
  }
  .page-description {
    font-size:20px;
  }
  .menu-layout {
    grid-template-columns:1fr;
    gap:25px;
  }
  .menu-aside {
    position:static;
  }
  .filters {
    flex-direction:row;
    flex-wrap:wrap;
    gap:10px;
  }
  .filters button {
    min-width:125px;
    gap:25px;
  }
  .menu-aside .eyebrow {
    margin-bottom:18px;
  }
  .menu-aside-note {
    margin-bottom:8px;
  }
  .filter-result {
    margin-top:18px;
  }
  .menu-list {
    border-top:1px solid var(--line);
  }
  .menu-list .dish-card:first-child .dish-copy {
    padding-top:28px;
  }
  .visit-layout,.about-layout,.contact-layout,.ordering-layout {
    grid-template-columns:1fr;
    gap:44px;
  }
  .visit-aside {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:26px;
    align-items:start;
  }
  .visit-card {
    padding:36px;
  }
  .location-note {
    padding:25px;
  }
  .location-note h2 {
    font-size:36px;
  }
  .about-layout {
    grid-template-columns:.8fr 1fr;
    gap:32px;
  }
  .about-identity {
    padding:20px;
  }
  .story-logo {
    width:100%;
    height:auto;
  }
  .about-copy h2 {
    font-size:48px;
  }
  .contact-layout {
    grid-template-columns:1fr 1fr;
    gap:36px;
  }
  .contact-primary {
    padding-left:25px;
  }
  .contact-primary h2 {
    font-size:42px;
  }
  .contact-social h2 {
    font-size:38px;
  }
  .contact-location {
    align-items:flex-start;
  }
  .contact-location h2 {
    font-size:40px;
  }
  .ordering-layout {
    grid-template-columns:1fr 1fr;
    gap:32px;
  }
  .ordering-layout h2 {
    font-size:40px;
  }
  .ordering-layout>aside {
    padding-left:26px;
  }
  .mobile-actions {
    display:flex;
    position:fixed;
    inset:auto 0 0;
    z-index:30;
    gap:12px;
    padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));
    background:var(--cream);
    border-top:1px solid var(--line);
  }
  .mobile-actions .button {
    flex:1;
    min-height:48px;
    font-size:17px;
    padding:11px 14px;
    gap:10px;
    /* The footer's bottom padding clears a single-line bar. Keep it single-line so a longer
       label can never grow the bar and cover the last line of the footer. */
    white-space:nowrap;
  }
  .mobile-actions .button>span[aria-hidden] {
    display:none;
  }
  .site-footer {
    padding-bottom:calc(88px + env(safe-area-inset-bottom));
  }
  html {
    scroll-padding-top:125px;
  }
  body {
    scroll-padding-bottom:110px;
  }
  .footer-bottom {
    flex-direction:column;
    gap:8px;
  }
  .contact-band h2 {
    font-size:46px;
  }
  .hero-photo {
    aspect-ratio:4/5;
  }
}

@media(max-width:600px) {
  :root {
    --gutter:22px;
  }
  .topline {
    font-size:16px;
  }
  .topline .container {
    width:calc(100% - 28px);
  }
  .brand {
    gap:11px;
  }
  .original-logo {
    width:54px;
    height:54px;
  }
  .brand-text {
    font-size:17px;
  }
  .brand-text small {
    font-size:16px;
  }
  .header-inner {
    min-height:83px;
  }
  .js .nav-toggle {
    min-width:80px;
    padding-inline:10px;
  }
  .nav-toggle .menu-icon {
    width:16px;
  }
  .hero {
    grid-template-columns:1fr;
    padding-block:48px;
    gap:36px;
  }
  .hero h1 {
    font-size:clamp(54px,13.7vw,78px);
    line-height:1.02;
    margin-bottom:24px;
  }
  .hero-copy .eyebrow {
    font-size:16px;
    letter-spacing:.05em;
    margin-bottom:25px;
  }
  .hero-description {
    font-size:18px;
    max-width:480px;
  }
  .hero-actions {
    gap:10px;
    display:grid;
    grid-template-columns:1fr 1fr;
    margin-bottom:22px;
  }
  .hero-actions .button {
    font-size:17px;
    padding:13px 16px;
    justify-content:space-between;
    gap:9px;
  }
  .hero-detail {
    font-size:16px;
  }
  .hero-detail>span {
    padding-inline:5px;
  }
  .identity-panel {
    display:grid;
    grid-template-columns:124px 1fr;
    gap:0 24px;
    align-items:center;
    padding:20px;
    text-align:left;
    border-radius:6px;
  }
  .identity-art {
    width:124px;
    grid-row:1/3;
  }
  .identity-panel p {
    margin:0 0 12px;
    font-size:18px;
    line-height:1.45;
    align-self:end;
  }
  .identity-location {
    font-size:16px;
    line-height:1.6;
    align-self:start;
    letter-spacing:0;
  }
  .identity-location span {
    display:none;
  }
  .identity-rule {
    display:none;
  }
  .hero-logo {
    width:100%;
    height:100%;
  }
  .hero-photo {
    aspect-ratio:4/3;
  }
  .section {
    padding-block:55px;
  }
  .section-heading {
    flex-direction:column;
    align-items:flex-start;
    gap:22px;
    margin-bottom:28px;
  }
  .section-heading h2 {
    font-size:42px;
    max-width:400px;
  }
  .section-heading .button {
    margin-top:0;
    font-size:18px;
    min-height:50px;
  }
  .dish-grid {
    gap:18px;
  }
  .dish-grid .dish-card:has(.photo) {
    display:block;
  }
  .dish-grid .dish-photo {
    aspect-ratio:4/3;
  }
  .dish-copy {
    padding:25px;
  }
  .dish-title h3 {
    font-size:40px;
  }
  .dish-number {
    font-size:16px;
  }
  .market-layout,.story-layout,.faq-layout {
    grid-template-columns:1fr;
    gap:32px;
  }
  .market-heading h2 {
    font-size:52px;
  }
  .market-heading p:not(.eyebrow) {
    max-width:450px;
  }
  .market-card {
    padding:24px;
  }
  .market-card-title {
    gap:12px;
  }
  .market-card-title h3 {
    font-size:32px;
  }
  .market-facts dd {
    font-size:19px;
  }
  .market-card .button {
    font-size:18px;
  }
  .story-statement {
    padding:25px 0 25px 26px;
  }
  .story-statement p {
    font-size:60px;
  }
  .story-copy h2 {
    font-size:48px;
  }
  .faq-layout h2 {
    font-size:46px;
  }
  .faq-answer {
    padding-right:20px;
  }
  .faqs summary {
    gap:14px;
    padding-block:22px;
  }
  .contact-band {
    padding-block:42px;
  }
  .contact-band>.container {
    flex-direction:column;
    align-items:flex-start;
    gap:25px;
  }
  .site-footer {
    padding-top:42px;
  }
  .footer-main {
    grid-template-columns:1fr 1fr;
    gap:36px 22px;
  }
  .footer-brand {
    grid-column:1/-1;
    gap:18px;
  }
  .footer-logo {
    width:88px;
    height:88px;
  }
  .footer-name {
    font-size:36px;
  }
  .footer-market {
    grid-column:1/-1;
    border-top:1px solid rgba(255,244,222,.28);
    padding-top:28px;
  }
  .footer-column h3 {
    font-size:18px;
  }
  .footer-link {
    overflow-wrap:anywhere;
    gap:8px;
  }
  .page-intro h1 {
    font-size:clamp(32px,8vw,42px);
  }
  .page-intro {
    padding-block:48px 40px;
  }
  .page-description {
    font-size:18px;
    margin-top:24px;
  }
  .page-intro .eyebrow {
    font-size:16px;
  }
  .filters {
    gap:8px;
  }
  .filters button {
    min-width:0;
    flex:1;
    gap:10px;
    font-size:16px;
    padding:12px;
  }
  .filters button>span {
    font-size:16px;
  }
  .menu-list .dish-title h2 {
    font-size:40px;
  }
  .menu-list .dish-card:has(.photo) {
    grid-template-columns:100px 1fr;
    gap:18px;
  }
  .menu-list .dish-card:has(.photo) .dish-title {
    flex-wrap:wrap;
    gap:5px;
  }
  .menu-list .dish-card:has(.photo) h2 {
    font-size:32px;
  }
  .visit-layout,.about-layout,.contact-layout,.ordering-layout {
    grid-template-columns:1fr;
    gap:36px;
  }
  .visit-card {
    padding:25px;
  }
  .visit-card h2 {
    font-size:48px;
  }
  .visit-aside {
    grid-template-columns:1fr;
    gap:28px;
  }
  .location-note {
    padding:28px;
  }
  .location-note h2 {
    font-size:42px;
  }
  .travel-note {
    padding-inline:6px;
  }
  .about-identity {
    display:none;
  }
  .about-copy h2 {
    font-size:50px;
  }
  .contact-primary {
    padding-left:24px;
  }
  .contact-primary h2 {
    font-size:48px;
  }
  .contact-social {
    border-top:1px solid var(--line);
    padding-top:34px;
  }
  .contact-social h2 {
    font-size:44px;
  }
  .contact-location {
    flex-direction:column;
    gap:25px;
    padding-top:36px;
  }
  .contact-location h2 {
    font-size:40px;
  }
  .contact-section {
    padding-bottom:0;
  }
  .ordering-layout>aside {
    padding-left:24px;
  }
  .ordering-layout h2 {
    font-size:44px;
  }
  .gallery,.reviews {
    grid-template-columns:1fr;
  }
  .gallery-photo {
    aspect-ratio:4/3;
  }
}

@media(max-width:359px) {
  :root {
    --gutter:18px;
  }
  .brand-text {
    font-size:16px;
  }
  .brand-text small {
    font-size:16px;
  }
  .original-logo {
    width:44px;
    height:44px;
  }
  .brand {
    gap:8px;
  }
  .js .nav-toggle {
    min-width:72px;
  }
  .hero h1 {
    font-size:51px;
  }
  .hero-actions .button {
    font-size:16px;
    padding-inline:12px;
  }
  .hero-detail>span {
    padding-inline:1px;
  }
  .identity-panel {
    grid-template-columns:86px 1fr;
    gap:0 16px;
    padding:16px;
  }
  .identity-art {
    width:86px;
  }
  .identity-panel p {
    font-size:16px;
  }
  .identity-location {
    font-size:16px;
  }
  .footer-logo {
    width:68px;
    height:68px;
  }
  .mobile-actions {
    gap:10px;
  }
  .mobile-actions .button {
    padding-inline:10px;
    font-size:16px;
  }
  .filters button {
    padding-inline:10px;
    gap:6px;
  }
  .contact-primary h2 {
    font-size:43px;
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
  }
}

@media print {
  .site-header,.topline,.mobile-actions,.hero-actions,.button,.nav-toggle {
    display:none!important;
  }
  .section {
    padding-block:22px;
  }
  .site-footer {
    background:none;
    color:var(--espresso);
    padding-bottom:0;
  }
  .site-footer h3 {
    color:var(--espresso);
  }
  .container {
    width:100%;
  }
  .hero {
    padding:20px 0;
  }
  .faqs details .faq-answer {
    display:block;
  }
  .page-intro {
    padding:20px 0;
  }
}

/* Network-error fallback is readable business copy, never an imitation logo. */
.identity-message {
  display:none;
}

.identity-art.logo-unavailable {
  background:transparent;
  border-block:1px solid var(--line);
  text-align:left;
}

.logo-unavailable .identity-message {
  display:block;
  padding:clamp(16px,3vw,38px);
}

.identity-message .eyebrow {
  font-size:16px;
}

.identity-message p {
  font-family:var(--font-heading);
  font-size:clamp(35px,4vw,56px);
  font-weight:700;
  color:var(--navy);
  line-height:1.07;
  margin:20px 0;
}

.identity-art.logo-unavailable .identity-rule {
  display:none;
}

@media(max-width:600px) {
  .identity-panel:has(.logo-unavailable) {
    display:block;
  }
  .identity-art.logo-unavailable {
    aspect-ratio:auto;
    width:100%;
    border-block:0;
  }
  .logo-unavailable .identity-message {
    padding:0;
  }
  .identity-message p {
    font-size:34px;
    margin:8px 0 18px;
  }
  .identity-message .eyebrow {
    display:none;
  }
}

/* Allow grid items to shrink without forcing horizontal overflow on narrow phones. */
.hero>* {
  min-width:0;
}

.story-layout>* {
  min-width:0;
}

.market-layout>* {
  min-width:0;
}

.footer-main>* {
  min-width:0;
}

@media(max-width:359px) {
  .story-statement p {
    font-size:44px;
  }
  .story-copy h2 {
    font-size:43px;
  }
}

/* ---- Profile-style home, events, menu tiles, contact block (2026-09-09) ---- */
.phone-link {
  color:inherit;
  text-decoration:none;
}

.phone-link:hover,.phone-link:focus-visible {
  text-decoration:underline;
  text-decoration-color:var(--gold);
  text-decoration-thickness:3px;
}

.contact-address {
  border-left:3px solid var(--gold);
  padding-left:34px;
}

.contact-address h2 {
  font-size:clamp(34px,4vw,52px);
}

.profile {
  padding-block:clamp(44px,5.4vw,74px);
}

.profile-head {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:clamp(20px,4vw,44px);
  align-items:start;
}

.profile-head>* {
  min-width:0;
}

.profile-logo {
  width:clamp(96px,16vw,168px);
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  background:var(--navy);
  border-radius:50%;
  padding:10px;
}

.profile-copy h1 {
  font-size:clamp(31px,3.7vw,53px);
  line-height:1.11;
  margin:.05em 0 .5em;
  letter-spacing:0;
}

.profile-bio {
  font-size:clamp(17px,1.6vw,20px);
  line-height:1.6;
  max-width:66ch;
  margin-bottom:18px;
}

.profile-facts {
  display:flex;
  flex-wrap:wrap;
  gap:8px 22px;
  list-style:none;
  padding:0;
  margin:0 0 22px;
  font-family:var(--font-label);
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:16px;
  color:var(--navy);
}

.profile-facts li::before {
  content:'';
  display:inline-block;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gold);
  margin-right:9px;
  vertical-align:middle;
}

.profile-actions {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.profile-actions .button {
  gap:14px;
  padding-inline:18px;
  min-height:48px;
  font-size:17px;
}

.events-section {
  background:var(--soft);
  border-block:1px solid var(--line);
}

.event-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:18px;
}

.event-card {
  border:1px solid var(--line);
  border-radius:8px;
  padding:24px;
  background:var(--cream);
  display:flex;
  flex-direction:column;
  min-width:0;
}

.event-label {
  font-size:16px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--navy);
  margin:0 0 10px;
}

.event-card h3 {
  font-size:clamp(26px,2.6vw,34px);
  margin:0 0 6px;
  line-height:1.05;
}

.event-when {
  font-weight:600;
  margin:0 0 6px;
}

.event-where {
  font-size:16px;
  margin:0 0 14px;
  line-height:1.5;
}

.event-card .text-link {
  margin-top:auto;
}

.tile-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}

.menu-tile {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  aspect-ratio:1;
  padding:18px;
  border:1px solid var(--line);
  border-radius:8px;
  text-decoration:none;
  color:var(--navy);
  background:var(--cream);
  min-width:0;
}

.menu-tile:hover,.menu-tile:focus-visible {
  border-color:var(--gold);
  background:var(--soft);
}

.menu-tile .dish-number {
  margin:0;
}

.tile-name {
  font-family:var(--font-heading);
  font-weight:700;
  font-size:clamp(24px,3vw,34px);
  line-height:1;
  letter-spacing:-.01em;
  overflow-wrap:break-word;
  hyphens:auto;
}

.tile-group {
  font-size:16px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.contact-block {
  border-top:1px solid var(--line);
}

.contact-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}

.contact-item {
  border:1px solid var(--line);
  border-radius:8px;
  padding:22px;
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

.contact-item .eyebrow {
  margin-bottom:4px;
}

.contact-item strong {
  font-family:var(--font-heading);
  font-size:clamp(22px,2.2vw,28px);
  font-weight:600;
  color:var(--navy);
  line-height:1.15;
  overflow-wrap:anywhere;
}

.contact-item p {
  margin:0;
  font-size:16px;
}

.contact-item .text-link {
  margin-top:auto;
}

@media(max-width:800px) {
  .tile-grid {
    gap:10px;
  }
  .event-card {
    padding:20px;
  }
  .profile-actions .button {
    flex:1 1 calc(50% - 5px);
  }
}

@media(max-width:600px) {
  .profile-head {
    grid-template-columns:1fr;
  }
  .profile-logo {
    width:120px;
  }
  .tile-grid {
    grid-template-columns:repeat(2,1fr);
  }
  .menu-tile {
    padding:14px;
  }
  .tile-name {
    font-size:26px;
  }
  .contact-address {
    padding-left:24px;
  }
}

.band-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px 22px;
}

/* Menu tiles become an image grid the moment an owner-approved photo exists; typographic until then. */
.tile-copy {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  flex:1;
  min-width:0;
}

.menu-tile.has-photo {
  padding:0;
  position:relative;
  overflow:hidden;
}

.tile-photo {
  position:absolute;
  inset:0;
  border-radius:0;
}

.tile-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.menu-tile.has-photo .tile-copy {
  position:relative;
  z-index:1;
  padding:14px;
  background:linear-gradient(180deg,rgba(41,34,29,0) 35%,rgba(41,34,29,.78));
}

.menu-tile.has-photo .dish-number,.menu-tile.has-photo .tile-name,.menu-tile.has-photo .tile-group,.menu-tile.has-photo .price {
  color:var(--cream);
}

/* Profile logo reuses the identity-art container so the readable no-logo fallback keeps working. */
.profile-art {
  width:clamp(96px,16vw,168px);
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;
}

.profile-art .profile-logo {
  width:100%;
  height:100%;
  padding:10px;
  background:transparent;
  border-radius:0;
}

.profile-art.logo-unavailable {
  width:auto;
  max-width:420px;
  border-radius:0;
  aspect-ratio:auto;
  border-block:0;
  border-left:4px solid var(--gold);
}

.profile-art.logo-unavailable .identity-message {
  padding:0 0 0 22px;
}

.profile-art.logo-unavailable .identity-message p {
  font-size:clamp(28px,3.4vw,44px);
  margin:10px 0 0;
}

@media(max-width:600px) {
  .profile-art {
    width:120px;
  }
}

@media(max-width:600px) {
  .tile-name {
    font-size:clamp(20px,6.2vw,24px);
  }
  .contact-item strong {
    font-size:18px;
  }
}

/* Review fixes: tap target, anchor offset under the sticky header, closing-band title, events venue line. */
.contact-item .phone-link {
  display:inline-block;
  padding-block:12px;
  margin-block:-12px;
}

.dish-card {
  scroll-margin-top:calc(106px + 24px);
}

.event-venue {
  margin:-16px 0 26px;
  font-size:17px;
}

.contact-band .band-title {
  font-family:var(--font-heading);
  font-weight:700;
  color:var(--navy);
  font-size:54px;
  line-height:1.03;
  letter-spacing:-.015em;
  margin:0 0 8px;
}

@media(max-width:800px) {
  .dish-card {
    scroll-margin-top:calc(88px + 24px);
  }
  .contact-band .band-title {
    font-size:46px;
  }
}

@media(max-width:600px) {
  .dish-card {
    scroll-margin-top:calc(83px + 24px);
  }
}

/* ---- Palette 2 "Brand Aligned": dark masthead, restrained type, taupe hairlines (2026-09-10) ---- */
/* The four brand hexes were already correct; what was missing was a dark field to set them against. */
.profile-band,.intro-band,.order-band {
  background:var(--navy);
  background-image:linear-gradient(178deg,var(--navy-deep) 0%,var(--navy) 58%);
  border-bottom:1px solid var(--line-dark);
  color:var(--cream);
}

.profile-band h1,.intro-band h1,
.profile-band h2,.intro-band h2,
.order-band .band-title,.order-band h2 {
  color:var(--cream);
}

.profile-band p,.intro-band p,.order-band p {
  color:var(--on-dark);
}

.profile-band .eyebrow,.intro-band .eyebrow,.order-band .eyebrow {
  color:var(--gold);
}

.profile-band .eyebrow::after,.intro-band .eyebrow::after,.order-band .eyebrow::after {
  content:'';
  display:block;
  width:52px;
  height:2px;
  background:var(--gold);
  margin-top:16px;
}

.profile-band :focus-visible,.intro-band :focus-visible,.order-band :focus-visible {
  outline-color:var(--gold);
}

.profile-band .button.primary,.intro-band .button.primary,.order-band .button.primary {
  background:var(--gold);
  border-color:var(--gold);
  color:var(--espresso);
}

.profile-band .button.secondary,.intro-band .button.secondary,.order-band .button.secondary {
  background:transparent;
  border-color:rgba(255,244,222,.45);
  color:var(--cream);
}

.profile-band .button.secondary:hover {
  box-shadow:inset 0 0 0 1px var(--gold);
}

.profile-band .text-link,.intro-band .text-link,
.profile-band .inline-link,.intro-band .inline-link,
.order-band .text-link,.order-band .inline-link {
  color:var(--cream);
}

/* The supplied master keeps its own artwork and background; a hairline frames it, nothing recolours it. */
.profile-art {
  width:clamp(92px,13vw,148px);
  border-radius:2px;
  border:1px solid var(--line-dark);
}

.profile-art .profile-logo {
  padding:0;
}

.profile-logo {
  background:transparent;
  border-radius:2px;
  padding:0;
}

.brand .original-logo {
  border:1px solid var(--line-dark);
  border-radius:2px;
}

.profile-band .profile-art.logo-unavailable {
  border:0;
  border-left:3px solid var(--gold);
}

.profile-band .identity-message p {
  color:var(--cream);
}

.profile-bio {
  font-size:clamp(17px,1.5vw,19px);
  max-width:62ch;
}

/* Trust strip: the mockup's row of proof points, set as ruled small caps rather than icons. */
.trust-strip {
  background:var(--cream);
  border-bottom:1px solid var(--line);
}

.profile-facts {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  list-style:none;
  margin:0;
  padding:0;
  font-family:var(--font-label);
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:16px;
  color:var(--navy);
}

.profile-facts li {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
  min-height:44px;
  padding:22px 14px;
  border-left:1px solid var(--line);
}

.profile-facts li:first-child {
  border-left:0;
}

.profile-facts li::before {
  content:'';
  display:block;
  width:7px;
  height:7px;
  margin:0;
  border-radius:0;
  background:var(--gold);
  transform:rotate(45deg);
  flex-shrink:0;
}

/* Squared corners and taupe hairlines throughout; no heavy shadows. */
.event-card,.menu-tile,.market-card,.visit-card,.filters button {
  border-radius:2px;
}

.section-heading .eyebrow {
  margin-bottom:14px;
}

.contact-band .band-title,.contact-band h2 {
  font-size:clamp(28px,3vw,40px);
}

@media(max-width:800px) {
  .profile-facts {
    grid-template-columns:repeat(2,1fr);
  }
  .profile-facts li {
    padding:18px 12px;
  }
  .profile-facts li:nth-child(odd) {
    border-left:0;
  }
  .profile-facts li:nth-child(-n+2) {
    border-bottom:1px solid var(--line);
  }
}

@media(max-width:600px) {
  .profile-band .eyebrow::after,.intro-band .eyebrow::after,.order-band .eyebrow::after {
    width:44px;
    margin-top:13px;
  }
  .profile-art {
    width:104px;
  }
  .profile-facts {
    font-size:16px;
    letter-spacing:.12em;
  }
}

/* Wide inner-page heroes read as an editorial spread rather than a column with a void beside it. */
@media(min-width:1024px) {
  .page-intro {
    display:grid;
    grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
    column-gap:clamp(40px,5vw,80px);
    align-items:end;
  }
  .page-intro .eyebrow {
    grid-column:1/-1;
  }
  .page-intro h1 {
    margin-bottom:0;
    max-width:none;
  }
  .page-intro .page-description {
    margin-top:0;
    max-width:46ch;
    padding-bottom:.35em;
  }
}

/* One radius across the whole surface; mixed 3-8px corners were part of the unfinished look. */
.about-identity,.visit-aside .location-note,.travel-note,.reviews figure,.faqs details,
.contact-item,.dish-card,.market-card,.event-card,.menu-tile,.filters button,
.nav-toggle,.skip-link,.button,.gallery-photo,.dish-photo,.tile-photo,.story-photo,.profile-photo {
  border-radius:2px;
}

/* The supplied master is 400px; upscaling it past that is what made the mark look soft. */
.story-logo {
  max-width:400px;
  margin-inline:auto;
}

/* When the remote master cannot load, show the business copy alone - not a broken-image icon. */
.logo-unavailable .original-logo {
  display:none;
}

/* The identity panel centres the logo; its text fallback should still start at the rule. */
.identity-art.logo-unavailable {
  justify-content:flex-start;
}

.logo-unavailable .identity-message {
  flex:1 1 auto;
}

/* ---- Hero photography under a navy scrim, so the mark and headline blend out of the image ---- */
.profile-band {
  position:relative;
  overflow:hidden;
}

.profile-band>.profile {
  position:relative;
  z-index:2;
}

.hero-media {
  position:absolute;
  inset:0;
}

.hero-media .photo {
  width:100%;
  height:100%;
  margin:0;
}

.hero-media img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:74% 44%;
}

/* Solid navy where the logo and headline sit, dissolving into the image towards the right edge. */
.profile-band.has-media::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(96deg,var(--navy) 0%,var(--navy) 25%,rgba(52,71,94,.9) 41%,rgba(52,71,94,.52) 60%,rgba(52,71,94,.14) 84%,rgba(52,71,94,.06) 100%),
    linear-gradient(180deg,rgba(41,34,29,.5) 0%,rgba(41,34,29,0) 44%);
}

/* Stand-in art is always labelled; the label disappears with the placeholder itself. */
.media-note {
  position:absolute;
  z-index:3;
  right:clamp(12px,1.8vw,20px);
  bottom:clamp(12px,1.8vw,20px);
  background:var(--espresso);
  color:var(--cream);
  font-family:var(--font-label);
  font-size:16px;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1;
  padding:8px 13px;
  border-radius:2px;
}

.photo.is-placeholder {
  position:relative;
}

.story-photo img,.profile-photo img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.story-photo {
  aspect-ratio:4/3;
}

@media(max-width:800px) {
  /* On phones the photograph becomes a band above the copy rather than a backdrop behind it. */
  .hero-media {
    position:relative;
    inset:auto;
    height:clamp(168px,44vw,240px);
  }
  .profile-band.has-media::before {
    bottom:auto;
    height:clamp(168px,44vw,240px);
    background:linear-gradient(180deg,rgba(42,58,77,.3) 0%,rgba(52,71,94,.55) 58%,var(--navy) 92%);
  }
  .hero-media img {
    object-position:70% 46%;
  }
}

/* ---- Carry the palette below the hero: gold accents, taupe grounds, compact cards ---- */
/* Tiles were square, so a one-word dish name sat in ~380px of empty cream. */
.menu-tile {
  aspect-ratio:auto;
  min-height:0;
  padding:22px 22px 20px;
  gap:34px;
  background:var(--soft);
  border-color:var(--line);
  position:relative;
}

.menu-tile::before {
  content:'';
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--gold);
  transform:scaleY(0);
  transform-origin:bottom;
}

.menu-tile:hover::before,.menu-tile:focus-visible::before {
  transform:scaleY(1);
}

.menu-tile .dish-number {
  margin:0 0 22px;
  color:var(--gold-ink);
  font-weight:600;
  letter-spacing:.14em;
}

.tile-name {
  font-size:clamp(23px,2.4vw,31px);
  font-weight:600;
  letter-spacing:0;
  line-height:1.1;
}

.tile-group {
  margin-top:14px;
  letter-spacing:.16em;
  color:var(--navy);
}

/* Event and contact cards sit on a taupe ground with a gold rule, not bare cream. */
.event-card,.contact-item {
  background:var(--cream);
  border-color:var(--line);
  border-top:3px solid var(--gold);
  padding-top:22px;
}

.event-label,.contact-item .eyebrow {
  color:var(--gold-ink);
  letter-spacing:.16em;
  margin-bottom:12px;
}

.contact-item strong {
  line-height:1.15;
}

/* The hero band's gold rule under the eyebrow, repeated for every section heading. */
.section-heading .eyebrow::after,.faq-layout .eyebrow::after,
.market-heading .eyebrow::after,.story-copy .eyebrow::after {
  content:'';
  display:block;
  width:44px;
  height:2px;
  background:var(--gold);
  margin-top:13px;
}

@media(max-width:600px) {
  .menu-tile {
    padding:16px 16px 15px;
    gap:22px;
  }
  .menu-tile .dish-number {
    margin-bottom:14px;
  }
}
/* ---- Ordering (2026-09-10) ---- */
/* The ordering band inherits the Palette 2 dark-band rules above; only its layout lives here. */
.order-band {
  padding-block:58px;
  border-top:1px solid var(--line-dark);
}

.order-band>.container {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:34px;
}

.order-band-copy {
  max-width:56ch;
}

.order-band .band-title {
  font-family:var(--font-heading);
  font-weight:700;
  font-size:clamp(30px,3.4vw,46px);
  line-height:1.05;
  letter-spacing:-.015em;
  margin:0 0 10px;
}

.order-band p:last-child {
  margin-bottom:0;
}

/* Ways to order: one card per channel, ruled rather than boxed, in keeping with the cream body. */
.order-channels {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
  gap:0 40px;
}

.order-channel {
  border-top:1px solid var(--line);
  padding:24px 0 6px;
}

.order-channel h3 {
  font-size:26px;
  margin:0 0 10px;
}

.order-channel p {
  font-size:17px;
}

.order-explainer .ordering-layout h2 {
  font-size:clamp(28px,3vw,40px);
}

.order-steps,.order-status {
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:order-step;
}

.order-steps li,.order-status li {
  border-top:1px solid var(--line);
  padding:18px 0 18px 46px;
  position:relative;
  font-size:17px;
}

.order-steps li::before {
  counter-increment:order-step;
  content:counter(order-step,decimal-leading-zero);
  position:absolute;
  left:0;
  top:18px;
  font-family:var(--font-heading);
  font-weight:700;
  letter-spacing:.08em;
  color:var(--taupe);
}

.order-status li::before {
  content:'';
  position:absolute;
  left:0;
  top:29px;
  width:26px;
  height:2px;
  background:var(--gold);
}

/* Per-dish ordering link, rendered only once that dish has a verified Square item page. */
.dish-order {
  margin-top:6px;
}

/* The menu aside's ordering control spans the column so it reads as that section's action. */
.menu-aside .button {
  width:100%;
  margin-bottom:22px;
}

@media(max-width:800px) {
  .order-band {
    padding-block:42px;
  }
  .order-band>.container {
    flex-direction:column;
    align-items:flex-start;
    gap:25px;
  }
  .order-channels {
    gap:0 30px;
  }
}

/* ---- Option 2, as drawn on the palette sheet: one dark field, the mark set into it (2026-09-10) ----
   The sheet's option 2 does not put the mark on a flat panel. The masthead, the band under it and the
   dark side of the photograph are one continuous dark mass, and the mark - which carries its own dark
   navy square - dissolves into it. What was shipped instead was a lighter navy strip with a gold
   hairline drawn around the mark, so the master's square read as a pasted-on tile. Three things fix it:
   a field that matches the master's own background, no rule around the mark, and a feathered surround
   so any residual difference has no hard edge to show up on. */
:root {
  /* The tone of the master's own square, which every dark surface behind the mark is matched to:
     masthead, hero, footer and story plaque all derive from this one value. It is an ESTIMATE, not
     a measurement - media.marketspread.com is blocked by this environment's network policy, so the
     file could not be read here. site.js corrects it in the browser from the master itself where the
     image host permits the read; this value is what stands when it does not, so re-measure it
     against the full-resolution master when that arrives. Never recolour the mark to fit the field;
     move the field to the mark. */
  --navy-ink:#1F2B3A;
  --ink-clear:rgba(31,43,58,0);
  /* The tone the pool behind the mark is painted in. Defaults to the estimate above; site.js
     replaces it with the master's own sampled ground when the image host permits it, which is what
     makes the join disappear whatever tone the master turns out to carry. */
  --mark-field:var(--navy-ink);
}

/* Masthead and band become the same colour, so the seam between them disappears. The hairline that
   used to divide them is what made the page read as stacked panels rather than one field. */
.site-header {
  background:var(--navy-ink);
  border-bottom:0;
  box-shadow:0 12px 26px -22px rgba(41,34,29,.5);
}

.profile-band,.intro-band {
  background-color:var(--navy);
  background-image:
    linear-gradient(90deg,var(--navy-ink) 0%,var(--navy-ink) 24%,rgba(31,43,58,.55) 46%,var(--ink-clear) 78%),
    linear-gradient(180deg,var(--navy-ink) 0%,var(--navy-deep) 34%,var(--navy) 100%);
  border-bottom:0;
}

/* The band's top edge is flat ink across its full width, so it meets the masthead with no visible join. */
.profile-band>.profile,.intro-band>.page-intro {
  position:relative;
  z-index:2;
}

/* ---- Nothing is drawn around the mark, and it sits in a pool of its own ground colour ----
   A tile edge can only appear where two differently coloured surfaces butt together. The vendor
   master is a square with an opaque dark ground baked in, so the mark is laid on a soft pool of that
   same ground, blurred out to nothing: the mark meets an exact colour match, and the pool meets the
   band through a feather with no edge of its own. Nothing here touches the artwork itself - no
   filter on the mark, no crop, no recolour, no substitute, no traced replacement. */
.brand .original-logo {
  border:0;
  border-radius:0;
}

.brand,.footer-brand {
  position:relative;
}

.brand::before,.footer-brand::before,.profile-art::before {
  content:'';
  position:absolute;
  background:var(--mark-field);
  filter:blur(13px);
  pointer-events:none;
  z-index:0;
}

.brand>*,.footer-brand>*,.profile-art>* {
  position:relative;
  z-index:1;
}

.brand::before {
  top:50%;
  left:calc(var(--mark)/2);
  width:calc(var(--mark) + 17px);
  height:calc(var(--mark) + 17px);
  transform:translate(-50%,-50%);
}

.footer-brand::before {
  top:39px;
  left:39px;
  width:95px;
  height:95px;
  transform:translate(-50%,-50%);
}

.brand {
  --mark:68px;
}

.profile-art {
  border:0;
  border-radius:0;
  background:transparent;
  overflow:visible;
}

.profile-art::before {
  inset:-11px;
}

.profile-logo {
  background:transparent;
}

/* When the master cannot load the pool has nothing to sit behind, so it goes with it and the
   readable business copy takes over, exactly as before. */
.profile-art.logo-unavailable::before,
.brand:has(.original-logo[hidden])::before,
.footer-brand:has(.original-logo[hidden])::before {
  display:none;
}

/* ---- The photograph emerges out of that same ink, rather than out of a lighter navy panel ---- */
.profile-band.has-media::before {
  background:
    linear-gradient(90deg,var(--navy-ink) 0%,var(--navy-ink) 26%,rgba(31,43,58,.74) 42%,rgba(42,58,77,.34) 62%,var(--ink-clear) 84%),
    linear-gradient(180deg,var(--navy-ink) 0%,rgba(31,43,58,.55) 14%,var(--ink-clear) 44%);
}

/* ---- Dark chrome closes at the foot, so the cream body sits between two matched fields ---- */
.site-footer {
  background:var(--navy-ink);
}

/* On the cream body there is no dark field to blend into, so the mark gets a deliberate plaque in
   the same matched tone instead of a tile that happens to end. Only reached when no story photo
   is approved; an approved photograph replaces the mark here entirely. */
.story-logo {
  background:var(--navy-ink);
  padding:clamp(18px,3.2vw,32px);
  border-radius:2px;
}

@media(max-width:800px) {
  .brand {
    --mark:58px;
  }
  /* The photograph is a band above the copy at this width, so its scrim resolves downward into the
     same ink the masthead and the top of the band already use. */
  .profile-band.has-media::before {
    background:linear-gradient(180deg,rgba(31,43,58,.62) 0%,rgba(42,58,77,.5) 46%,rgba(31,43,58,.86) 84%,var(--navy-ink) 100%);
  }
}

@media(max-width:600px) {
  .brand {
    --mark:54px;
  }
  .footer-brand::before {
    top:34px;
    left:34px;
    width:85px;
    height:85px;
  }
}

@media(max-width:359px) {
  .brand {
    --mark:44px;
  }
}

/* ---- Homepage hero, set to the proportions on palette sheet option 2 (2026-09-10) ----
   A wide band the photograph fills, the copy held in the darkened left half, and the rhythm the
   sheet draws: headline, small-caps line, one short statement, one gold call to action. */
.profile-band .profile {
  display:flex;
  align-items:center;
  min-height:clamp(360px,41vw,520px);
  padding-block:clamp(46px,5vw,72px);
}

.profile-copy {
  max-width:min(620px,58%);
}

.profile-copy h1 {
  line-height:1.06;
  margin:0 0 18px;
}

.hero-tagline {
  font-family:var(--font-body);
  font-size:17px;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--cream);
  margin:0 0 20px;
}

.profile-band .profile-bio {
  margin:0 0 30px;
  max-width:46ch;
}

/* The masthead carries the mark once, at the compact scale the sheet draws it. */
.header-inner {
  min-height:88px;
}

.original-logo {
  width:56px;
  height:56px;
}

.brand {
  --mark:56px;
}


/* More of the photograph, with the scrim only as deep as the copy needs. */
.profile-band.has-media::before {
  background:
    linear-gradient(90deg,var(--navy-ink) 0%,var(--navy-ink) 20%,rgba(31,43,58,.76) 38%,rgba(42,58,77,.34) 58%,var(--ink-clear) 78%),
    linear-gradient(180deg,var(--navy-ink) 0%,rgba(31,43,58,.5) 13%,var(--ink-clear) 40%);
}

@media(max-width:800px) {
  .profile-copy {
    max-width:none;
  }
  .header-inner {
    min-height:80px;
  }
  .original-logo {
    width:50px;
    height:50px;
  }
  .brand {
    --mark:50px;
  }
  .profile-band .profile {
    min-height:0;
  }
}

@media(max-width:600px) {
  .original-logo {
    width:48px;
    height:48px;
  }
  .brand {
    --mark:48px;
  }
  .brand-text {
    font-size:18px;
  }
}

@media(max-width:359px) {
  .original-logo {
    width:42px;
    height:42px;
  }
  .brand {
    --mark:42px;
  }
}