/* =========================================================================
   Corner Cut - design system
   Same editable restaurant structure; a deliberately different composition.
   Direction: asymmetric rails, clipped corners, offset grids and compact
   grotesk typography. Customer colours stay in accents, never in the neutral
   header or footer.
   ========================================================================= */

/* ---------- 1. tokens ---------------------------------------------------- */
:root{
  --cream:   #F7F5EF;
  --oat:     #E9ECE5;
  --sand:    var(--sb-secondary-pale, #DDE5D7);
  --clay:    var(--sb-accent);   /* carries text: checked against cream and oat */
  --clay-hi: var(--sb-accent-quiet);   /* decorative only - focus ring, mark, hairlines */
  --teal:    var(--sb-deep);          /* painted bands */
  --teal-lo: var(--sb-deep-darker);
  --ink:     #151A17;
  --ink-dim: #5B645F;
  --rule:    rgba(21,26,23,.14);
  --edge:    rgba(21,26,23,.42);   /* interactive boundaries, clears 3:1 */

  --display: 'Rubik', 'Arial Black', 'Segoe UI', sans-serif;
  --body:    'Schibsted Grotesk', 'Segoe UI', system-ui, -apple-system, sans-serif;

  --gutter: clamp(18px, 4.5vw, 44px);
  --max:    1240px;
  --max-narrow: 720px;
  --sec-y:  clamp(60px, 8vw, 116px);
  --r:      0;
  --r-sm:   0;
  --r-pill: 999px;

  --ease: cubic-bezier(.3,.7,.4,1);
  --fast: 140ms;
  --med:  250ms;

  /* --- the engine's roles ------------------------------------------
     Fixed names, identical in every template, so one piece of code can
     re-skin any of them. The engine writes only the accent three, and
     only after checking them against --sb-scheme: this palette sits on
     a light ground, so a colour that reads here may vanish elsewhere.
     The rest are exposed so contrast can be checked, not overwritten. */
  --sb-scheme: light;
  --sb-accent:       #9E3C22;
  --sb-accent-quiet: #C9542F;
  --sb-ground:       var(--cream);
  --sb-surface:      var(--oat);
  --sb-surface-alt:  var(--sand);
  --sb-ink:          var(--ink);
  --sb-ink-dim:      var(--ink-dim);
  --sb-deep:         #123F3C;
  --sb-deep-darker:  #0C2C2A;
  --sb-deep-ink:     var(--cream);
  --sb-accent-ink:   var(--cream);
  --sb-rule:         var(--rule);
  --sb-edge:         var(--edge);

}

/* ---------- 2. reset ----------------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; border-top:var(--sb-secondary-width,0) solid var(--sb-secondary,transparent); background:var(--cream); color:var(--ink);
  font-family:var(--body); font-size:clamp(16px,.5vw + 15px,17px);
  line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img,svg,video{ display:block; max-width:100%; }
img{ height:auto; background:var(--oat); }
[hidden]{ display:none !important; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ color:inherit; }
h1,h2,h3,h4{ margin:0; font-family:var(--display); font-weight:700; line-height:1.04; letter-spacing:-.015em; }
p{ margin:0; }
ul,ol{ margin:0; padding:0; list-style:none; }
table{ border-collapse:collapse; width:100%; }
:target{ scroll-margin-top:110px; }

:focus-visible{ outline:3px solid var(--clay-hi); outline-offset:2px; }
:is(:is(.on-sand,.tone-soft-alt),:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.basin--filled,.site-foot) :focus-visible{ outline-color:var(--sand); }

.skip{ position:absolute; left:12px; top:-70px; z-index:200; background:var(--teal); color:var(--cream); padding:12px 20px; font-weight:600; text-decoration:none; transition:top var(--fast) var(--ease); }
.skip:focus{ top:12px; }
.vh{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }

/* ---------- 3. type: tall condensed poster ------------------------------- */
.d1{ font-family:var(--display); font-weight:700; font-size:clamp(2.7rem,7.4vw,5.4rem); line-height:1.02; letter-spacing:-.02em; }
.d2{ font-family:var(--display); font-weight:700; font-size:clamp(1.95rem,3.9vw,3.1rem); line-height:1.06; letter-spacing:-.016em; }
.d3{ font-family:var(--display); font-weight:700; font-size:clamp(1.4rem,2.2vw,1.95rem); line-height:1.14; letter-spacing:-.01em; }
.d4{ font-family:var(--display); font-weight:700; font-size:clamp(1.2rem,1.6vw,1.5rem); line-height:1.02; }

.lede{ font-size:clamp(1.02rem,1.1vw,1.14rem); line-height:1.6; color:var(--ink-dim); }
.fine{ font-size:.84rem; line-height:1.5; color:var(--ink-dim); }
.fr{ font-style:italic; color:var(--ink-dim); }

/* colour-blocked sections are the signature */
:is(.on-oat,.tone-soft){ background:var(--oat); }
:is(.on-sand,.tone-soft-alt){ background:var(--sand); color:var(--teal); }
:is(.on-teal,.tone-deep){ background:var(--teal); color:var(--cream); }
:is(.on-clay,.tone-accent){ background:var(--clay); color:var(--cream); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.site-foot,.basin--filled,.hero) .lede,
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.site-foot,.basin--filled,.hero) .fine,
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.site-foot,.basin--filled,.hero) .fr{ color:rgba(255,251,242,.92); }
:is(.on-sand,.tone-soft-alt) .lede, :is(.on-sand,.tone-soft-alt) .fine{ color:rgba(59,30,63,.82); }

/* ---------- 4. layout ---------------------------------------------------- */
.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--gutter); }
.wrap--narrow{ max-width:var(--max-narrow); }
.wrap--full{ max-width:none; }
.section{ padding-block:var(--sec-y); }
.section--tight{ padding-block:clamp(40px,5.5vw,72px); }
.stack > * + *{ margin-top:var(--gap,18px); }

/* section heads: heading left, supporting line beneath, thick rule over */
.sec-head{ margin-bottom:clamp(26px,3.4vw,44px); padding-top:20px; border-top:1.5px solid var(--clay); }
.sec-head p{ max-width:56ch; margin-top:14px; }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .sec-head{ border-top-color:var(--sand); }
:is(.on-sand,.tone-soft-alt) .sec-head{ border-top-color:var(--teal); }

.duo{ display:grid; gap:clamp(24px,3.4vw,52px); grid-template-columns:1fr; align-items:center; }
@media (min-width:900px){
  .duo{ grid-template-columns:1fr 1fr; }
  .duo--wide-left{ grid-template-columns:1.2fr .8fr; }
  .duo--wide-right{ grid-template-columns:.8fr 1.2fr; }
}
/* the room: a filmstrip, three frames edge to edge with no gaps */
.trio{ display:grid; gap:0; grid-template-columns:1fr; }
@media (min-width:760px){ .trio{ grid-template-columns:repeat(3,1fr); } }
.grid{ display:grid; gap:clamp(14px,1.8vw,20px); grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr)); }
.split{ display:grid; gap:clamp(24px,3.2vw,44px); grid-template-columns:1fr; align-items:start; }
@media (min-width:960px){ .split{ grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); } }

/* ---------- 5. surfaces -------------------------------------------------- */
.basin{ position:relative; background:var(--cream); border:1.5px solid var(--rule); border-radius:var(--r); padding:clamp(24px,3.2vw,40px); }
.basin__label{ display:inline-block; margin-bottom:14px; background:var(--ink); color:var(--cream); font-family:var(--display); font-weight:700; font-size:1rem; letter-spacing:.08em; text-transform:uppercase; padding:3px 10px; }
.basin--clay{ border-color:var(--clay); }
.basin--clay .basin__label{ background:var(--clay); }
.basin--oat{ border-color:var(--rule); background:var(--oat); }
.basin--oat .basin__label{ background:var(--teal); }
.basin--sand{ border-color:var(--sand); background:var(--sand); color:var(--teal); --ink-dim:#123F3C; }
.basin--sand .basin__label{ background:var(--teal); color:var(--sand); }
.basin--filled{ background:var(--fill,var(--clay)); border-color:var(--fill,var(--clay)); color:var(--cream); }
.basin--filled.basin--clay{ --fill:var(--clay); }
.basin--filled.basin--teal{ --fill:var(--teal); }
.basin--filled .basin__label{ background:var(--cream); color:var(--ink); }

.plate{ position:relative; width:100%; aspect-ratio:1/1; overflow:hidden; background:var(--oat); }
.plate img{ width:100%; height:100%; object-fit:cover; transition:transform 600ms var(--ease); }
.pan{ border-radius:var(--r); overflow:hidden; position:relative; overflow:hidden; background:var(--oat); }
.pan img{ width:100%; height:100%; object-fit:cover; }
.pan--tall{ aspect-ratio:4/5; }
.pan--wide{ aspect-ratio:2/1; }
.pan--sq{ aspect-ratio:1/1; }
.pan--fill{ height:100%; }
/* when the duo stacks, a portrait figure goes full width - reframe it wide
   rather than let it fill the screen (object-fit:cover handles the crop) */
@media (max-width:899px){
  .duo > .pan--tall,
  .duo .pan--tall{ aspect-ratio:3/2; }
}
.pan figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:30px 16px 12px; color:#fff;
  font-size:.8rem; letter-spacing:.02em; text-shadow:0 1px 3px rgba(0,0,0,.7);
  background:linear-gradient(180deg,transparent,rgba(20,12,16,.60) 45%,rgba(20,12,16,.94));
}

/* ---------- 6. buttons: square, thick, poster-like ----------------------- */
.btn{
  --bg:var(--clay); --fg:#fff; --bd:var(--clay);
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:52px; padding:13px 26px; background:var(--bg); color:var(--fg);
  border:1.5px solid var(--bd);
  font-family:var(--display); font-weight:700; font-size:1.12rem;
  letter-spacing:.02em; text-decoration:none; cursor:pointer; border-radius:var(--r-pill);
  transition:transform var(--fast) var(--ease), background var(--fast), color var(--fast);
}
.btn:hover{ transform:translate(-2px,-2px); box-shadow:4px 4px 0 var(--ink); }
.btn:active{ transform:none; box-shadow:none; }
.btn[disabled],.btn[aria-disabled='true']{ opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
.btn--sand{ --bg:var(--teal); --bd:var(--teal); }
.btn--pepper{ --bg:var(--clay); --bd:var(--clay); }
.btn--cream{ --bg:var(--cream); --fg:var(--clay); --bd:var(--cream); }
.btn--ghost{ --bg:transparent; --fg:var(--ink); --bd:var(--ink); }
.btn--ghost:hover{ --bg:var(--ink); --fg:var(--cream); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.basin--filled,.hero) .btn--ghost{ --fg:var(--cream); --bd:var(--cream); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent),.basin--filled,.hero) .btn--ghost:hover{ --bg:var(--cream); --fg:var(--ink); }
.btn--block{ width:100%; }
.btn--sm{ min-height:42px; padding:8px 16px; font-size:.96rem; border-width:2px; }

.tlink{ display:inline-flex; align-items:center; gap:8px; font-family:var(--body); font-weight:700; font-size:.98rem; letter-spacing:.01em; color:var(--clay); text-decoration:none; border-bottom:1.5px solid currentColor; padding-bottom:2px; transition:gap var(--fast) var(--ease); }
.tlink:hover{ gap:14px; }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .tlink{ color:var(--sand); }
:is(.on-sand,.tone-soft-alt) .tlink{ color:var(--teal); }

/* ---------- 7. announcement + header ------------------------------------- */
.announce{ background:var(--teal); color:var(--cream); font-family:var(--display); font-weight:700; font-size:1rem; letter-spacing:.06em; text-transform:uppercase; }
.announce__row{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:4px 20px; padding-block:8px; }
.announce__mid{ text-align:center; color:var(--sand); }
.announce__end{ text-align:right; }
@media (max-width:760px){ .announce{ font-size:.9rem; } .announce__row{ grid-template-columns:1fr auto; } .announce__end{ display:none; } }
@media (max-width:430px){ .announce__row{ grid-template-columns:1fr; text-align:center; } .announce__mid{ display:none; } }

.site-head{ position:sticky; top:0; z-index:60; background:var(--cream); border-bottom:1.5px solid var(--edge); }
.site-head__bar{ display:flex; align-items:center; gap:clamp(12px,3vw,32px); min-height:74px; padding-block:10px; }
.brand{ display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); margin-right:auto; }
.site-head .brand--lockup{ flex-direction:column; align-items:flex-start; gap:2px; }
.site-head .brand--lockup .brand__sub{ margin-top:0; line-height:1.2; }
.brand__mark{ height:42px; width:auto; max-width:150px; flex:none; object-fit:contain; object-position:left center; background:transparent; }  /* height is fixed, width is whatever the merchant's logo is */
.brand__name{ font-family:var(--display); font-weight:700; font-size:1.62rem; line-height:1; letter-spacing:-.015em; }
.brand__sub{ display:block; font-family:var(--body); font-weight:500; font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--clay); margin-top:4px; }

.nav{ display:flex; align-items:center; gap:clamp(10px,1.8vw,26px); }
.nav a{ font-family:var(--body); font-weight:600; font-size:.98rem; letter-spacing:.005em; text-decoration:none; color:var(--ink-dim); padding:4px 0; border-bottom:1.5px solid transparent; transition:color var(--fast), border-color var(--fast); }
.nav a:hover{ color:var(--ink); }
.nav a[aria-current='page']{ color:var(--ink); border-bottom-color:var(--clay); }

.head-actions{ display:flex; align-items:center; gap:9px; }
.cart-btn{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 16px; background:transparent; color:var(--ink); border:1.5px solid var(--edge); font-family:var(--body); font-weight:700; font-size:.92rem; letter-spacing:.02em; cursor:pointer; text-decoration:none; transition:background var(--fast), color var(--fast); }
.cart-btn:hover{ background:var(--ink); color:var(--cream); }
.cart-btn[data-filled='1']{ background:var(--clay); border-color:var(--clay); color:#fff; }
.cart-btn__count{ font-variant-numeric:tabular-nums; }
.cart-btn.is-bumped{ animation:bump 420ms var(--ease); }
@keyframes bump{ 0%,100%{transform:scale(1)} 32%{transform:scale(1.13)} }

.burger{ display:none; width:44px; height:44px; place-items:center; background:transparent; border:1.5px solid var(--edge); color:var(--ink); cursor:pointer; }
.burger span{ position:relative; display:block; width:18px; height:2.5px; background:currentColor; box-shadow:0 -6px 0 currentColor, 0 6px 0 currentColor; }

@media (max-width:900px){
  .burger{ display:grid; }
  .nav{ position:fixed; inset:0 0 0 auto; z-index:70; width:min(80vw,320px); flex-direction:column; align-items:flex-start; gap:0; padding:104px 26px 26px; background:var(--sand); border-left:1.5px solid var(--edge); transform:translateX(103%); transition:transform var(--med) var(--ease); overflow-y:auto; overscroll-behavior:contain; }
  .nav[data-open='1']{ transform:translateX(0); }
  .nav a{ width:100%; font-size:1.9rem; padding:14px 0; color:var(--teal); border-bottom:2px solid rgba(59,30,63,.2); }
  .head-actions{ position:relative; z-index:80; }
  .burger[aria-expanded='true']{ background:var(--clay); border-color:var(--clay); color:#fff; }
  .burger[aria-expanded='true'] span{ box-shadow:none; transform:rotate(45deg); }
  .burger[aria-expanded='true'] span::after{ content:''; position:absolute; left:0; top:0; width:18px; height:2.5px; background:currentColor; transform:rotate(-90deg); }
  .nav-scrim{ position:fixed; inset:0; z-index:65; background:rgba(36,28,33,.6); opacity:0; pointer-events:none; transition:opacity var(--med) var(--ease); }
  .nav-scrim[data-open='1']{ opacity:1; pointer-events:auto; }
}
.nav-scrim{ display:none; }
@media (max-width:900px){ .nav-scrim{ display:block; } }
@media (max-width:460px){ .site-head .brand__sub{ display:none; } .site-head__bar{ gap:10px; } }

/* ---------- 8. hero: FULL-WIDTH BANNER (locked across the set) ----------- */
/* The banner form is fixed for every restaurant: photo edge to edge, scrim
   over it, copy on top. Only the arrangement inside moves. One anchors the
   copy left and centred, two centres it, three sits it low. This one puts it
   high-left, so the banner reads top-down. */
.hero{
  position:relative; isolation:isolate; overflow:hidden;
  display:grid; align-items:start;
  min-height:min(82vh,700px);
  background:var(--teal-lo); color:var(--cream);
}
.hero__img{ position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; object-position:center 45%; }
.hero__scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(8,10,14,.90) 0%, rgba(8,10,14,.80) 34%, rgba(8,10,14,.44) 62%, rgba(8,10,14,.30) 100%),
    linear-gradient(90deg, rgba(8,10,14,.78) 0%, rgba(8,10,14,.40) 54%, rgba(8,10,14,.12) 100%);
}
.hero__inner{ position:relative; z-index:2; width:100%; padding-block:clamp(40px,5.5vw,72px); }
.hero__body{ max-width:720px; }
.hero__title{ margin-bottom:20px; color:var(--cream); }
.hero__title em{ font-style:italic; color:var(--sand); }
.hero__lede{ max-width:44ch; margin-bottom:28px; color:rgba(253,248,240,.94); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; padding-top:22px; border-top:1.5px solid rgba(253,248,240,.30); }
@media (max-width:640px){ .hero{ min-height:auto; } }

/* a stacked, numbered list - restaurant three uses a row of three cards */
.steps--stack{ grid-template-columns:1fr !important; counter-reset:step; }
.steps--stack .step{ display:grid; grid-template-columns:auto 1fr; gap:0 clamp(16px,2.4vw,28px); align-items:start; padding:24px 0; background:none; border:0; border-top:1.5px solid rgba(253,248,240,.22); }
.steps--stack .step:first-child{ border-top:0; }
.steps--stack .step::before{
  content:counter(step,decimal-leading-zero);
  font-family:var(--display); font-weight:700; font-size:2.1rem; line-height:1.1;
  color:var(--sand); font-variant-numeric:tabular-nums; margin-bottom:0;
}
.steps--stack .step h3{ grid-column:2; margin-bottom:8px; }
.steps--stack .step p{ grid-column:2; }

/* closing band: copy left, action right - three stacks it centred */
.cta-row{ display:grid; gap:clamp(20px,3vw,44px); grid-template-columns:1fr; align-items:center; }
@media (min-width:800px){ .cta-row{ grid-template-columns:1fr auto; } }

/* ---------- 9. the dish pairs (grid in one, rows in two, mosaic in three) -- */
/* Two up, large, picture beside the words. Legible across a room, which is
   the point of a counter you order at. */
.menu-rows{ display:grid; gap:clamp(16px,2vw,26px); grid-template-columns:1fr; }
@media (min-width:820px){ .menu-rows{ grid-template-columns:repeat(2,1fr); } }
.card{
  border-radius:var(--r); overflow:hidden; display:grid; grid-template-columns:1fr;
  background:var(--cream); border:1.5px solid var(--rule);
  transition:border-color var(--med) var(--ease), box-shadow var(--med) var(--ease);
}
@media (min-width:560px){
  /* three children in two columns wraps the foot under the picture; place all
     three explicitly so the photo spans and price sits under its own copy */
  .card{ grid-template-columns:minmax(150px,38%) 1fr; grid-template-rows:1fr auto; }
  .card__plate{ grid-column:1; grid-row:1 / -1; }
  .card__body { grid-column:2; grid-row:1; }
  .card__foot { grid-column:2; grid-row:2; }
}
.card:hover{ border-color:var(--clay); box-shadow:0 10px 26px rgba(42,33,28,.10); }
.card:hover .plate img{ transform:scale(1.05); }
.card__body{ padding:18px 18px 0; }
.card__foot{ padding:12px 18px 18px; }
@media (min-width:560px){
  .card__plate{ height:100%; }
  .card__plate .plate{ height:100%; aspect-ratio:auto; min-height:190px; }
}
.card__plate{ position:relative; }
.card__flag{ position:absolute; top:0; left:0; z-index:2; background:var(--clay); color:#fff; font-family:var(--display); font-weight:700; font-size:.9rem; letter-spacing:.06em; text-transform:uppercase; padding:2px 9px; }
.card__heat{ position:absolute; right:0; bottom:0; z-index:2; display:flex; gap:3px; padding:5px 8px; background:var(--teal); }
.card__heat i{ width:6px; height:6px; border-radius:50%; background:var(--sand); }

.card__name{ font-family:var(--display); font-weight:700; font-size:1.32rem; line-height:1.12; letter-spacing:-.012em; }
.linkish{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; text-align:left; transition:color var(--fast); }
.linkish:hover{ color:var(--clay); }
.card__fr{ font-size:.8rem; font-style:italic; color:var(--ink-dim); margin-top:5px; }
.card__blurb{ font-size:.88rem; line-height:1.5; color:var(--ink-dim); margin-top:10px; }
.card__tags{ display:flex; flex-wrap:wrap; gap:5px; margin-top:12px; }
.tag{ font-size:.66rem; letter-spacing:.07em; text-transform:uppercase; font-weight:500; color:var(--ink-dim); border:1px solid var(--rule); padding:2px 7px; }

.pricetag{ display:inline-block; font-family:var(--display); font-weight:700; font-size:1.5rem; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums; }
.pricetag small{ font-family:var(--body); font-size:.4em; font-weight:500; color:var(--ink-dim); margin-left:4px; letter-spacing:.06em; }
.card__unit{ display:block; font-size:.74rem; color:var(--ink-dim); margin-top:4px; }
.buy{ display:flex; gap:7px; margin-top:14px; }
.stepper{ display:flex; align-items:center; border:1.5px solid var(--edge); border-radius:var(--r-pill); flex:none; overflow:hidden; }
.stepper button{ width:34px; height:40px; background:transparent; border:0; cursor:pointer; font-family:var(--display); font-weight:700; font-size:1.2rem; transition:background var(--fast); }
.stepper button:hover{ background:var(--sand); }
.stepper output{ min-width:28px; text-align:center; font-variant-numeric:tabular-nums; font-weight:600; }
.buy .btn{ flex:1; }

/* ---------- 10. dish sheet ----------------------------------------------- */
.sheet{ width:min(900px,94vw); max-height:88vh; padding:0; border:1.5px solid var(--edge); background:var(--cream); color:var(--ink); overflow:hidden; }
.sheet::backdrop{ background:rgba(36,28,33,.66); }
.sheet__body{ max-height:88vh; overflow-y:auto; padding:clamp(20px,3vw,38px); }
.sheet__grid{ display:grid; gap:clamp(20px,3vw,36px); grid-template-columns:1fr; }
@media (min-width:720px){ .sheet__grid{ grid-template-columns:.85fr 1.15fr; align-items:start; } }
.sheet__close{ position:absolute; top:12px; right:12px; z-index:3; width:42px; height:42px; display:grid; place-items:center; background:var(--cream); color:var(--ink); border:1.5px solid var(--edge); cursor:pointer; font-size:1.1rem; }
.sheet__close:hover{ background:var(--clay); color:#fff; border-color:var(--clay); }
.sheet-cat{ display:inline-block; background:var(--ink); color:var(--cream); font-family:var(--display); font-weight:700; font-size:1rem; letter-spacing:.07em; text-transform:uppercase; padding:2px 9px; margin:0 0 10px; }
.facts{ display:grid; border-top:1.5px solid var(--edge); margin-top:20px; }
.facts div{ display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--rule); font-size:.9rem; }
.facts dt{ color:var(--ink-dim); }
.facts dd{ margin:0; font-weight:600; text-align:right; }
.opts{ display:flex; flex-wrap:wrap; gap:8px; }
.opt{ flex:1 1 130px; min-height:62px; padding:9px 13px; text-align:left; background:var(--cream); border:2px solid var(--edge); cursor:pointer; transition:border-color var(--fast), background var(--fast); }
.opt:hover{ border-color:var(--ink); }
.opt[aria-pressed='true']{ border-color:var(--ink); background:var(--sand); }
.opt b{ display:block; font-family:var(--display); font-weight:700; font-size:1.2rem; }
.opt span{ display:block; font-size:.76rem; color:var(--ink-dim); }

/* ---------- 11. menu filters --------------------------------------------- */
.filterbar{ position:sticky; top:74px; z-index:40; background:var(--sand); border-bottom:1.5px solid var(--edge); padding-block:12px; }
.filterbar__row{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.chips{ display:flex; flex-wrap:wrap; gap:6px; margin-right:auto; }
.chip{ min-height:40px; padding:7px 16px; background:transparent; color:var(--teal); border:1.5px solid var(--edge); font-family:var(--body); font-weight:600; font-size:.9rem; letter-spacing:.01em; cursor:pointer; transition:background var(--fast), color var(--fast); }
.chip:hover{ background:rgba(59,30,63,.12); }
.chip[aria-pressed='true']{ background:var(--teal); color:var(--sand); }
.search input{ min-height:40px; width:min(220px,52vw); padding:8px 14px; background:var(--cream); border:2px solid var(--teal); color:var(--ink); }
.search input:focus{ border-color:var(--clay); }
.count{ font-size:.84rem; color:rgba(59,30,63,.8); }
.menu-group{ padding-top:clamp(36px,4.6vw,58px); }
.menu-group__head{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 14px; margin-bottom:20px; padding-top:14px; border-top:1.5px solid var(--edge); }
.menu-group__head h2{ font-size:clamp(2rem,4vw,3rem); }
.empty{ padding:54px 24px; text-align:center; border:3px dashed var(--rule); }

/* ---------- 12. steps: three painted panels ------------------------------ */
.steps{ counter-reset:step; display:grid; gap:clamp(14px,1.8vw,20px); grid-template-columns:1fr; }
@media (min-width:760px){ .steps{ grid-template-columns:repeat(3,1fr); } }
.step{ counter-increment:step; position:relative; background:var(--cream); border:1.5px solid var(--edge); padding:22px 20px 24px; }
.step::before{ content:counter(step,decimal-leading-zero); display:block; font-family:var(--display); font-weight:700; font-size:3.4rem; line-height:.8; color:var(--clay); margin-bottom:12px; }
.step h3{ font-size:1.5rem; margin-bottom:10px; }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .step{ background:transparent; border-color:var(--sand); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .step::before{ color:var(--sand); }

/* ---------- 13. order page ----------------------------------------------- */
.rail-steps{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:28px; }
.rail-steps li{ font-family:var(--body); font-weight:600; font-size:.94rem; letter-spacing:.01em; padding:8px 16px; border:1.5px solid var(--edge); border-radius:var(--r-pill); color:var(--ink-dim); }
.rail-steps li[aria-current='step']{ background:var(--ink); color:var(--cream); }
.rail-steps li[data-done='1']{ border-color:var(--teal-lo); color:var(--teal-lo); }
.panel{ background:var(--cream); border:1.5px solid var(--edge); padding:clamp(20px,2.6vw,30px); }
.panel + .panel{ margin-top:18px; }
.panel__head{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:18px; padding-bottom:12px; border-bottom:1.5px solid var(--edge); }
.panel__head h2{ font-size:1.8rem; }
.summary{ position:sticky; top:100px; }
@media (max-width:959px){ .summary{ position:static; } }
.lines{ display:grid; }
.line{ display:grid; grid-template-columns:60px 1fr auto; gap:14px; align-items:start; padding:16px 0; border-bottom:1px solid var(--rule); }
.line:first-child{ padding-top:0; }
.line__img{ width:60px; height:60px; object-fit:cover; border:2px solid var(--ink); background:var(--oat); }
.line__name{ font-family:var(--display); font-weight:700; font-size:1.28rem; line-height:.96; }
.line__meta{ font-size:.8rem; color:var(--ink-dim); margin-top:4px; }
.line__ctrl{ display:flex; align-items:center; gap:10px; margin-top:10px; flex-wrap:wrap; }
.line__end{ text-align:right; }
.line__total{ font-family:var(--display); font-weight:700; font-size:1.3rem; font-variant-numeric:tabular-nums; white-space:nowrap; }
.linkbtn{ background:none; border:0; padding:4px 0; cursor:pointer; font-size:.8rem; color:var(--ink-dim); text-decoration:underline; text-underline-offset:3px; }
.linkbtn:hover{ color:var(--clay); }
.totals div{ display:flex; justify-content:space-between; gap:16px; padding:9px 0; font-size:.94rem; }
.totals div.is-total{ margin-top:6px; padding-top:14px; border-top:1.5px solid var(--edge); font-family:var(--display); font-weight:700; font-size:1.9rem; }
.totals dt{ color:var(--ink-dim); }
.totals dd{ margin:0; font-variant-numeric:tabular-nums; font-weight:600; }
.totals .is-total dt{ color:var(--ink); }
.totals .is-free{ color:var(--teal-lo); font-weight:700; }
.segments{ display:flex; gap:8px; }
.segment{ flex:1; min-height:60px; padding:9px 12px; text-align:center; background:var(--cream); border:1.5px solid var(--edge); cursor:pointer; transition:background var(--fast), color var(--fast); }
.segment[aria-pressed='true']{ background:var(--ink); color:var(--cream); }
.segment b{ display:block; font-family:var(--display); font-weight:700; font-size:1.2rem; }
.segment span{ display:block; font-size:.74rem; opacity:.78; }

/* ---------- 14. forms ---------------------------------------------------- */
.field{ display:block; margin-bottom:16px; }
.field > span{ display:block; font-size:.82rem; font-weight:600; margin-bottom:6px; }
.field .hint{ font-weight:400; color:var(--ink-dim); }
.field input, .field select, .field textarea{ width:100%; min-height:50px; padding:12px 14px; background:var(--cream); border:2px solid var(--edge); color:var(--ink); transition:border-color var(--fast); }
.field textarea{ min-height:98px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--clay); }
.field input[aria-invalid='true'], .field select[aria-invalid='true']{ border-color:var(--clay); }
.field .err{ display:block; font-size:.8rem; color:#B3320F; margin-top:5px; font-weight:600; }
.field-row{ display:grid; gap:0 16px; grid-template-columns:1fr; }
@media (min-width:620px){ .field-row{ grid-template-columns:1fr 1fr; } }
.radios{ display:grid; gap:8px; }
.radio{ display:flex; align-items:flex-start; gap:11px; padding:13px 15px; cursor:pointer; border:2px solid var(--edge); transition:background var(--fast), border-color var(--fast); }
.radio:hover{ border-color:var(--ink); }
.radio:has(input:checked){ border-color:var(--ink); background:var(--sand); }
.radio input{ margin-top:4px; width:17px; height:17px; accent-color:var(--clay); flex:none; }
.radio b{ display:block; font-weight:600; }
.radio span{ display:block; font-size:.8rem; color:var(--ink-dim); }
.formnote{ font-size:.82rem; color:var(--ink-dim); margin-top:14px; }
.formnote code{ background:var(--oat); padding:1px 5px; font-size:.92em; }

/* ---------- 15. hours ---------------------------------------------------- */
.hours th, .hours td{ text-align:left; padding:11px 0; border-bottom:1px solid var(--rule); font-size:.93rem; }
.hours th{ font-family:var(--body); font-weight:600; font-size:.98rem; letter-spacing:.01em; }
.hours td:last-child{ text-align:right; font-variant-numeric:tabular-nums; }
.hours tr[data-today='1']{ color:var(--clay); }
:is(.on-sand,.tone-soft-alt) .hours tr[data-today='1']{ color:var(--teal); font-weight:700; }
.hours tr[data-today='1'] th::after{ content:' Today'; font-family:var(--body); font-size:.62rem; letter-spacing:.12em; }
.hours tr[data-shut='1'] td{ color:var(--ink-dim); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .hours th, :is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .hours td{ border-bottom-color:rgba(255,251,242,.24); }
:is(:is(.on-teal,.tone-deep),:is(.on-clay,.tone-accent)) .hours tr[data-today='1']{ color:var(--sand); }

/* ---------- 16. footer --------------------------------------------------- */
.site-foot{ background:var(--teal); color:var(--cream); padding-block:clamp(46px,6vw,74px) 24px; }
.site-foot .brand{ color:var(--cream); }
.site-foot .brand__sub{ color:var(--sand); }
.foot-grid{ display:grid; gap:32px; grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr)); }
.foot-grid h3{ font-family:var(--display); font-weight:700; font-size:1.25rem; letter-spacing:.06em; text-transform:uppercase; color:var(--sand); margin-bottom:12px; }
.foot-grid a{ text-decoration:none; color:rgba(255,251,242,.9); }
.foot-grid a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.foot-grid li + li{ margin-top:8px; }
.foot-bottom{ display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:space-between; margin-top:40px; padding-top:20px; border-top:2px solid rgba(255,251,242,.28); font-size:.79rem; color:rgba(255,251,242,.9); }

.quote-by{ font-family:var(--display); font-weight:700; font-size:1.15rem; letter-spacing:.06em; text-transform:uppercase; color:var(--clay); margin:24px 0 0; }
blockquote{ margin:0; }

/* ---------- 17. toast ---------------------------------------------------- */
.toast-host{ position:fixed; left:0; right:0; bottom:18px; z-index:120; display:grid; justify-items:center; gap:8px; padding-inline:16px; pointer-events:none; }
.toast{ display:flex; align-items:center; gap:12px; max-width:min(440px,100%); padding:13px 18px; background:var(--teal); color:var(--cream); border:1.5px solid var(--edge); font-size:.9rem; pointer-events:auto; animation:toastIn 240ms var(--ease); }
.toast b{ font-family:var(--display); font-weight:700; font-size:1.1rem; letter-spacing:.04em; }
.toast a{ color:var(--sand); margin-left:auto; white-space:nowrap; font-weight:600; }
@keyframes toastIn{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:none } }

/* ---------- 18. motion --------------------------------------------------- */
.js [data-reveal]{ opacity:0; transform:translateY(14px); }
.js [data-reveal].is-in{ opacity:1; transform:none; transition:opacity 600ms var(--ease), transform 600ms var(--ease); }
.js [data-reveal-stagger] > *{ opacity:0; transform:translateY(12px); }
.js [data-reveal-stagger].is-in > *{ opacity:1; transform:none; transition:opacity 520ms var(--ease), transform 520ms var(--ease); }
.js [data-reveal-stagger].is-in > *:nth-child(2){ transition-delay:60ms; }
.js [data-reveal-stagger].is-in > *:nth-child(3){ transition-delay:120ms; }
.js [data-reveal-stagger].is-in > *:nth-child(4){ transition-delay:180ms; }
.js [data-reveal-stagger].is-in > *:nth-child(5){ transition-delay:240ms; }
.js .hero__body > *{ animation:rise 640ms var(--ease) both; }
.js .hero__body > *:nth-child(2){ animation-delay:80ms; }
.js .hero__body > *:nth-child(3){ animation-delay:160ms; }
@keyframes rise{ from{ opacity:0; transform:translateY(16px) } to{ opacity:1; transform:none } }

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms!important; animation-iteration-count:1!important; transition-duration:.001ms!important; }
  .js [data-reveal],.js [data-reveal-stagger] > *{ opacity:1; transform:none; }
}

@media print{
  .site-head,.site-foot,.announce,.filterbar,.buy,.toast-host,.hero__cta{ display:none!important; }
  body{ background:#fff; }
}

/* ---------- 19. Corner Cut composition --------------------------------- */
.d1{
  font-size:clamp(3rem,6.2vw,6.7rem); line-height:.88; letter-spacing:-.065em;
  text-transform:none; max-width:9ch;
}
.d2{ font-size:clamp(2rem,4.4vw,4.5rem); line-height:.94; letter-spacing:-.05em; }
.d3{ letter-spacing:-.035em; }
.corner-index,.corner-kicker{
  margin:0 0 20px; font-size:.74rem; line-height:1; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; color:var(--clay);
}
.corner-index{ display:flex; align-items:center; gap:12px; }
.corner-index::after{ content:''; width:42px; height:2px; background:currentColor; }
.pan{ clip-path:polygon(0 0,calc(100% - 24px) 0,100% 24px,100% 100%,24px 100%,0 calc(100% - 24px)); }

/* The customer palette is concentrated in narrow, high-energy details. */
.btn{
  border-radius:0; font-family:var(--body); font-size:.9rem; letter-spacing:.07em;
  text-transform:uppercase; clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));
}
.btn:hover{ transform:translate(-3px,-3px); box-shadow:6px 6px 0 var(--ink); }
.tlink{ font-size:.86rem; letter-spacing:.06em; text-transform:uppercase; }
.sec-head{ border-top:0; padding-top:0; }

/* Hero: a full-width scene held by the location rail and one cut-corner card. */
.hero{ min-height:auto; display:block; padding:0; background:#101412; color:var(--ink); }
.corner-hero{
  position:relative; isolation:isolate; width:100%; min-height:clamp(660px,78vh,860px);
  margin-inline:auto; display:grid; grid-template-columns:86px minmax(0,1fr);
  background:#101412; overflow:hidden;
}
.corner-hero__rail{
  grid-column:1; position:relative; z-index:4; display:flex; flex-direction:column; align-items:center;
  justify-content:space-between; padding:34px 0; background:var(--clay);
  color:var(--sb-accent-ink,#fff); overflow:hidden;
}
.corner-hero__number{ font:700 1rem/1 var(--display); }
.corner-hero__place{
  writing-mode:vertical-rl; transform:rotate(180deg); font-size:.72rem;
  line-height:1; letter-spacing:.24em; text-transform:uppercase; white-space:nowrap;
}
.hero__inner{
  grid-column:2; position:relative; z-index:3; width:100%;
  display:flex; align-items:center; padding:clamp(54px,7vw,100px) clamp(28px,7vw,118px);
}
.hero__body{
  max-width:580px; padding:clamp(30px,3.7vw,50px); background:rgba(247,245,239,.78);
  border-left:7px solid var(--clay); box-shadow:12px 12px 0 rgba(12,15,13,.22);
  -webkit-backdrop-filter:blur(14px) saturate(.88); backdrop-filter:blur(14px) saturate(.88);
  clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px));
}
.hero .hero__title{
  max-width:10ch; margin-bottom:24px; color:var(--ink);
  font-size:clamp(3rem,4.8vw,5.2rem); line-height:.9; letter-spacing:-.055em;
}
.hero .hero__lede{ max-width:42ch; margin-bottom:30px; color:rgba(21,26,23,.82); }
.hero__cta{ padding-top:22px; border-top:1px solid rgba(21,26,23,.20); }
.hero .btn--ghost{ --fg:var(--ink); --bd:var(--ink); }
.hero .btn--ghost:hover{ --bg:var(--ink); --fg:var(--cream); }
.corner-hero__media{
  position:absolute; inset:0; z-index:0; min-width:0; margin:0; overflow:hidden;
  clip-path:none; background:#101412;
}
.corner-hero__media .hero__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.corner-hero__media .hero__scrim{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg,rgba(5,8,7,.54) 0%,rgba(5,8,7,.20) 54%,rgba(5,8,7,.12) 100%),
    linear-gradient(180deg,rgba(5,8,7,.16),rgba(5,8,7,.38));
}
.corner-hero__media figcaption{
  position:absolute; z-index:2; right:24px; bottom:20px; color:#fff;
  font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
}
@media (max-width:980px){
  .corner-hero{ min-height:680px; grid-template-columns:48px minmax(0,1fr); }
  .corner-hero__rail{ padding:24px 0; }
  .hero__inner{ grid-column:2; padding:52px clamp(22px,7vw,60px); }
  .hero__body{ max-width:560px; }
  .d1{ max-width:12ch; }
}
@media (max-width:640px){ .hero{ min-height:auto; } }
@media (max-width:520px){
  .corner-hero{ min-height:680px; grid-template-columns:36px minmax(0,1fr); }
  .corner-hero__rail{ padding:18px 0; }
  .corner-hero__place{ font-size:.62rem; }
  .hero__inner{ padding:34px 14px; }
  .hero__body{ padding:28px 20px 30px; background:rgba(247,245,239,.84); border-left-width:6px; box-shadow:8px 8px 0 rgba(12,15,13,.22); }
  .hero .hero__title{ margin-bottom:20px; font-size:clamp(2.85rem,13.5vw,3.7rem); }
  .hero .hero__lede{ font-size:.98rem; margin-bottom:24px; }
  .hero__cta{ gap:8px; padding-top:18px; }
  .hero__cta .btn{ min-height:46px; padding:10px 15px; font-size:.76rem; }
  .corner-hero__media .hero__img{ object-position:58% center; }
  .corner-hero__media figcaption{ right:14px; bottom:12px; }
}

/* Story: the copy card bites into a wide photograph instead of mirroring it. */
.corner-story{ display:grid; grid-template-columns:repeat(12,1fr); align-items:center; }
.corner-story__image{ grid-column:1 / 9; grid-row:1; min-height:560px; margin:0; }
.corner-story__image img{ width:100%; height:100%; min-height:560px; object-fit:cover; }
.corner-story__card{
  grid-column:7 / 13; grid-row:1; z-index:2; padding:clamp(34px,5vw,72px);
  background:#fff; border-left:8px solid var(--clay);
  clip-path:polygon(0 0,calc(100% - 30px) 0,100% 30px,100% 100%,0 100%);
}
.corner-story__card h2{ margin-bottom:26px; }
.corner-story__card .tlink{ margin-top:30px; }

/* Menu: irregular 7/5 and 5/7 blocks create a deliberate editorial cadence. */
.corner-menu{ display:grid; grid-template-columns:250px minmax(0,1fr); gap:clamp(30px,5vw,76px); align-items:start; }
.corner-menu__head{ position:sticky; top:112px; }
.corner-menu__head h2{ margin-bottom:18px; }
.corner-menu .menu-rows{ display:grid; grid-template-columns:repeat(12,1fr); gap:18px; }
.corner-menu .card{ display:grid; grid-template-columns:1fr; grid-template-rows:auto 1fr auto; border:0; box-shadow:none; }
.corner-menu .card:nth-child(odd){ grid-column:span 7; }
.corner-menu .card:nth-child(even){ grid-column:span 5; margin-top:72px; }
.corner-menu .card__plate{ grid-column:1; grid-row:1; }
.corner-menu .card__plate .plate{ min-height:0; height:auto; aspect-ratio:16/10; }
.corner-menu .card__body{ grid-column:1; grid-row:2; padding:22px 22px 0; }
.corner-menu .card__foot{ grid-column:1; grid-row:3; padding:16px 22px 22px; }
.corner-menu .card:nth-child(even) .card__plate .plate{ aspect-ratio:4/3; }
.corner-menu__link{ grid-column:2; margin-top:6px; }

/* Craft: one cinematic frame and a vertical stack of numbered notes. */
.corner-craft{ display:grid; grid-template-columns:repeat(12,1fr); gap:20px; align-items:start; }
.corner-craft__title{ grid-column:1 / 6; padding-right:24px; }
.corner-craft__image{ grid-column:1 / 9; min-height:520px; margin:18px 0 0; }
.corner-craft__image img{ width:100%; height:100%; min-height:520px; object-fit:cover; }
.corner-craft__notes{ grid-column:9 / 13; grid-row:1 / 3; display:grid; gap:16px; }
.corner-craft__notes article{ padding:26px; border-top:6px solid var(--clay); background:#fff; }
.corner-craft__notes article > span{ display:block; margin-bottom:26px; font:700 2rem/1 var(--display); color:var(--clay); }
.corner-craft__detail{ margin:0; min-height:270px; }
.corner-craft__detail img{ width:100%; height:100%; min-height:270px; object-fit:cover; }

/* Steps: intro beside a diagonal path, not another row of equal cards. */
.corner-order{ display:grid; grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr); gap:clamp(38px,7vw,110px); }
.corner-order__intro h2{ margin-bottom:24px; }
.corner-order__steps{ display:grid; grid-template-columns:1fr; gap:12px; }
.corner-order__steps .step{
  display:grid; grid-template-columns:74px 1fr; gap:4px 20px; padding:24px 26px;
  border:1px solid rgba(255,255,255,.34); background:rgba(255,255,255,.08);
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%);
}
.corner-order__steps .step:nth-child(2){ margin-left:44px; }
.corner-order__steps .step:nth-child(3){ margin-left:88px; }
.corner-order__steps .step::before{ grid-row:1 / 3; margin:0; color:var(--sand); }
.corner-order__steps .step h3,.corner-order__steps .step p{ grid-column:2; }

/* Room: unequal picture widths and baselines; every frame has a new silhouette. */
.corner-room__head{ width:min(100%,680px); margin-bottom:46px; }
.corner-room__head h2{ margin-bottom:18px; }
.corner-room__gallery{ display:grid; grid-template-columns:repeat(12,1fr); gap:16px; align-items:start; }
.corner-room__shot{ margin:0; }
.corner-room__shot img{ width:100%; height:100%; object-fit:cover; }
.corner-room__shot:nth-child(1){ grid-column:1 / 6; height:540px; }
.corner-room__shot:nth-child(2){ grid-column:6 / 10; height:390px; margin-top:96px; }
.corner-room__shot:nth-child(3){ grid-column:10 / 13; height:300px; margin-top:10px; }

/* Visit: dark cut-corner address block beside a calm hours ledger. */
.corner-visit{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); align-items:stretch; }
.corner-visit__place{
  padding:clamp(40px,6vw,78px); background:var(--teal); color:var(--cream);
  clip-path:polygon(0 0,calc(100% - 46px) 0,100% 46px,100% 100%,0 100%);
}
.corner-visit__place .corner-index,.corner-visit__place .tlink{ color:var(--sand); }
.corner-visit__place .lede{ color:rgba(255,255,255,.78); margin:12px 0 28px; }
.corner-visit__links{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; margin-bottom:34px; }
.corner-visit__hours{ padding:clamp(40px,6vw,78px); background:#fff; }
.corner-visit__hours-title{ display:flex; justify-content:space-between; align-items:start; gap:24px; margin-bottom:30px; }
.corner-visit__hours-title > span{ padding:7px 12px; background:var(--clay); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }

/* Quote and closing become graphic shapes rather than ordinary centred bands. */
.corner-quote{ display:grid; grid-template-columns:170px minmax(0,1fr); align-items:center; }
.corner-quote__mark{ font:700 clamp(9rem,20vw,18rem)/.6 var(--display); color:var(--clay); }
.corner-quote figure{ margin:0; padding:40px 0; border-block:1px solid rgba(255,255,255,.26); }
.corner-closing{
  padding:clamp(34px,5vw,68px); background:var(--clay); color:#fff;
  clip-path:polygon(0 0,calc(100% - 44px) 0,100% 44px,100% 100%,44px 100%,0 calc(100% - 44px));
}
.corner-closing .corner-index,.corner-closing .lede{ color:rgba(255,255,255,.84); }

@media (max-width:900px){
  .corner-story{ display:block; }
  .corner-story__image{ min-height:360px; }
  .corner-story__image img{ min-height:360px; }
  .corner-story__card{ width:calc(100% - 28px); margin:-62px 0 0 auto; position:relative; }
  .corner-menu{ grid-template-columns:1fr; }
  .corner-menu__head{ position:static; }
  .corner-menu__link{ grid-column:1; }
  .corner-craft__title{ grid-column:1 / 8; }
  .corner-craft__image{ grid-column:1 / 9; min-height:410px; }
  .corner-craft__image img{ min-height:410px; }
  .corner-craft__notes{ grid-column:9 / 13; }
  .corner-order{ grid-template-columns:1fr; }
  .corner-room__shot:nth-child(1){ grid-column:1 / 8; height:430px; }
  .corner-room__shot:nth-child(2){ grid-column:8 / 13; height:330px; margin-top:72px; }
  .corner-room__shot:nth-child(3){ grid-column:3 / 10; height:300px; margin-top:0; }
  .corner-visit{ grid-template-columns:1fr; }
}

@media (max-width:680px){
  .corner-story__card{ padding:32px 24px; }
  .corner-menu .menu-rows{ grid-template-columns:1fr; }
  .corner-menu .card:nth-child(odd),.corner-menu .card:nth-child(even){ grid-column:1; margin-top:0; }
  .corner-craft{ display:block; }
  .corner-craft__title{ margin-bottom:28px; }
  .corner-craft__image,.corner-craft__image img{ min-height:340px; }
  .corner-craft__notes{ margin-top:16px; }
  .corner-craft__detail{ min-height:230px; }
  .corner-order__steps .step:nth-child(2),.corner-order__steps .step:nth-child(3){ margin-left:0; }
  .corner-order__steps .step{ grid-template-columns:56px 1fr; padding:22px 18px; }
  .corner-room__gallery{ grid-template-columns:1fr 1fr; }
  .corner-room__shot:nth-child(1),.corner-room__shot:nth-child(2),.corner-room__shot:nth-child(3){ grid-column:auto; margin-top:0; height:280px; }
  .corner-room__shot:nth-child(1){ grid-column:1 / 3; height:350px; }
  .corner-quote{ grid-template-columns:70px minmax(0,1fr); }
  .corner-quote__mark{ font-size:8rem; }
  .corner-closing{ padding:36px 24px; }
}

/* Neutral brand shell: customer colours belong to content, not logo chrome. */
.site-head{background:#fff!important;color:#191919!important;border-bottom:1px solid #ddd!important}
.site-foot{background:#fff!important;background-image:none!important;color:#191919!important;border-top:1px solid #ddd!important}
.site-head :is(.brand,.brand__name,.nav a,.cart-btn),.site-foot :is(.brand,.brand__name,h2,h3,h4,a,p,li,small){color:#191919!important}
.site-head .brand__sub,.site-foot .brand__sub{color:#565656!important}
.site-head .brand__mark,.site-foot .brand__mark{background:transparent!important}
.site-foot :is(.foot-bottom,.foot__bottom){border-color:#ddd!important}

/* =========================================================================
   Courtyard Ribbon — template 10

   A quiet, image-led restaurant system. The home page is composed as a
   sequence of distinct editorial moments instead of repeating split cards:
   a low glass hero ribbon, three-part story, offset menu trays, panoramic
   kitchen stage, route line, triptych room and a ledger-style visit block.
   ========================================================================= */

:root{
  --cream:#f4f6f1;
  --oat:#e7ebe4;
  --sand:var(--sb-secondary-pale,#e3e9df);
  --clay:var(--sb-accent,#8f1d3f);
  --clay-hi:var(--sb-accent-quiet,#ad4966);
  --teal:var(--sb-deep,#4a6b3f);
  --teal-lo:var(--sb-deep-darker,#30472a);
  --ink:#17201b;
  --ink-dim:#59635d;
  --rule:rgba(23,32,27,.15);
  --edge:rgba(23,32,27,.38);
  --display:'Instrument Serif','Iowan Old Style','Times New Roman',serif;
  --body:'Schibsted Grotesk','Segoe UI',system-ui,sans-serif;
  --utility:'DM Sans','Segoe UI',system-ui,sans-serif;
  --max:1320px;
  --gutter:clamp(18px,4.2vw,58px);
  --sec-y:clamp(72px,9vw,138px);
  --r:2px;
  --r-sm:2px;
}

body{ background:var(--cream); font-family:var(--body); }
h1,h2,h3,h4,.d1,.d2,.d3,.d4{ font-family:var(--display); font-weight:400; letter-spacing:-.025em; }
.d1{ font-size:clamp(4rem,8.7vw,8.4rem); line-height:.82; }
.d2{ font-size:clamp(3rem,5.8vw,6rem); line-height:.9; }
.d3{ font-size:clamp(1.75rem,2.8vw,2.8rem); line-height:1; }
.d4{ font-size:clamp(1.25rem,1.8vw,1.65rem); line-height:1.1; }
.lede{ font-family:var(--body); font-size:clamp(1rem,1.08vw,1.16rem); line-height:1.72; }

.courtyard-label,.courtyard-kicker{
  margin:0 0 16px; color:var(--sb-deep,var(--clay)); font-family:var(--utility); font-size:.72rem;
  font-weight:700; letter-spacing:.2em; line-height:1.3; text-transform:uppercase;
}

/* All brand chrome remains neutral. Customer colours are deliberately
   restricted to active links, rules and controls so a logo always reads. */
.announce{ background:#eef1ec; color:var(--ink); border-bottom:1px solid var(--rule); font-family:var(--utility); }
.announce__mid{ color:var(--clay); }
.site-head{ background:#fff!important; border-bottom:1px solid var(--rule)!important; }
.site-head__bar{ min-height:82px; }
.brand__name{ font-family:var(--display); font-size:1.8rem; font-weight:400; }
.brand__sub{ color:var(--ink-dim)!important; font-family:var(--utility); }
.nav a,.cart-btn,.burger{ font-family:var(--utility); }
.site-foot{ background:#fff!important; color:var(--ink)!important; border-top:1px solid var(--rule)!important; }
.site-foot::before,.site-foot::after{ display:none!important; }
.site-foot :is(.lede,.fine,.fr){ color:var(--ink-dim)!important; }

.btn{ border-radius:999px; font-family:var(--utility); font-size:.9rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(23,32,27,.17); }
.tlink{ font-family:var(--utility); font-size:.82rem; letter-spacing:.08em; text-transform:uppercase; }

/* Hero — one full photograph, with content held in a low glass dock. */
.hero{ min-height:0; display:block; background:#101512; padding:0!important; }
.courtyard-hero{ position:relative; isolation:isolate; display:flex; align-items:flex-end; min-height:clamp(690px,84vh,920px); overflow:hidden; }
.courtyard-hero .hero__img{ position:absolute; inset:0; z-index:-3; width:100%; height:100%; object-fit:cover; object-position:center 52%; }
.courtyard-hero .hero__scrim{
  position:absolute; inset:0; z-index:-2;
  background:
    linear-gradient(90deg,rgba(8,12,10,.55) 0%,rgba(8,12,10,.28) 48%,rgba(8,12,10,.38) 100%),
    linear-gradient(180deg,rgba(8,12,10,.05) 0%,rgba(8,12,10,.18) 42%,rgba(8,12,10,.76) 100%);
}
.courtyard-hero__place{ position:absolute; z-index:2; top:32px; right:var(--gutter); margin:0; color:#fff; font-family:var(--utility); font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; text-shadow:0 1px 8px rgba(0,0,0,.4); }
.courtyard-hero__dock{
  position:relative; z-index:2; display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:clamp(28px,5vw,90px); align-items:end;
  margin-bottom:clamp(50px,6vw,92px); padding:0 var(--gutter);
  color:#fff; background:transparent; border:0; box-shadow:none;
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
.courtyard-hero__headline{ min-width:0; }
.courtyard-hero .courtyard-kicker{ color:rgba(255,255,255,.76); }
.courtyard-hero .hero__title{ max-width:10ch; color:#fff; text-wrap:balance; text-shadow:0 3px 24px rgba(0,0,0,.36); }
.courtyard-hero__details{ align-self:end; padding-bottom:4px; }
.courtyard-hero .hero__lede{ max-width:44ch; color:rgba(255,255,255,.92)!important; text-shadow:0 2px 16px rgba(0,0,0,.45); }
.courtyard-hero .hero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:26px; }
.courtyard-hero .btn--ghost{ --fg:#fff; --bd:rgba(255,255,255,.72); }

/* Story — title, photograph and copy occupy three independent columns. */
.courtyard-story{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:clamp(22px,3vw,48px); align-items:start; }
.courtyard-story__title{ grid-column:1 / 5; padding-top:clamp(6px,2vw,28px); }
.courtyard-story__title .d2{ max-width:7ch; }
.courtyard-story__image{ grid-column:5 / 10; height:clamp(430px,52vw,700px); }
.courtyard-story__copy{ grid-column:10 / 13; align-self:end; padding-bottom:clamp(10px,3vw,48px); }
.courtyard-story__copy .stack{ padding-top:22px; border-top:1px solid var(--clay); }
.courtyard-story__copy .tlink{ margin-top:28px; }

/* Menu — an editorial tray wall with deliberately uneven spans. */
.courtyard-menu{ display:grid; grid-template-columns:minmax(220px,.72fr) minmax(0,2fr); gap:clamp(34px,5vw,82px); align-items:start; }
.courtyard-menu__head{ position:sticky; top:122px; padding-top:20px; border-top:5px solid var(--clay); }
.courtyard-menu__head .d2{ max-width:6ch; }
.courtyard-menu__head .lede{ margin-top:22px; }
.courtyard-menu__head .tlink{ margin-top:26px; }
.courtyard-menu__trays{ display:grid!important; grid-template-columns:repeat(12,minmax(0,1fr))!important; gap:clamp(18px,2.3vw,34px)!important; }
.courtyard-menu__trays .card{ display:block; min-width:0; margin:0!important; border:0; border-radius:0; background:transparent; box-shadow:none; }
.courtyard-menu__trays .card:nth-child(1){ grid-column:1 / 8; }
.courtyard-menu__trays .card:nth-child(2){ grid-column:8 / 13; margin-top:70px!important; }
.courtyard-menu__trays .card:nth-child(3){ grid-column:1 / 6; }
.courtyard-menu__trays .card:nth-child(4){ grid-column:6 / 13; margin-top:-10px!important; }
.courtyard-menu__trays .card:nth-child(5){ grid-column:1 / 8; }
.courtyard-menu__trays .card:nth-child(6){ grid-column:8 / 13; margin-top:74px!important; }
.courtyard-menu__trays .card__media,.courtyard-menu__trays .plate{ aspect-ratio:4/3; border-radius:0; }
.courtyard-menu__trays .card:nth-child(2n) :is(.card__media,.plate){ aspect-ratio:1/1; }
.courtyard-menu__trays .card__body{ padding:18px 0 8px; border-bottom:1px solid var(--rule); }
.courtyard-menu__trays .card h3{ font-family:var(--display); font-size:clamp(1.5rem,2vw,2.15rem); font-weight:400; }

/* Kitchen — a panoramic stage followed by two horizontal notes. */
.courtyard-craft{ position:relative; }
.courtyard-craft__stage{ height:clamp(480px,56vw,740px); }
.courtyard-craft__stage::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(12,16,14,.08),rgba(12,16,14,.58)); pointer-events:none; }
.courtyard-craft__title{ position:absolute; z-index:2; left:calc(var(--gutter) + 2px); top:clamp(38px,6vw,82px); max-width:min(700px,70%); color:#fff; text-shadow:0 2px 16px rgba(0,0,0,.24); }
.courtyard-craft__title .courtyard-label{ color:#fff; }
.courtyard-craft__notes{ position:relative; z-index:3; display:grid; grid-template-columns:1fr 1fr; width:min(930px,calc(100% - 2 * var(--gutter))); margin:-78px 0 0 auto; background:#fff; border-top:5px solid var(--clay); box-shadow:0 20px 50px rgba(23,32,27,.12); }
.courtyard-craft__notes article{ padding:clamp(26px,3.5vw,48px); }
.courtyard-craft__notes article + article{ border-left:1px solid var(--rule); }

/* Ordering — a true three-stop route rather than another set of cards. */
.courtyard-order__intro{ display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.5fr); column-gap:clamp(30px,7vw,110px); align-items:end; margin-bottom:clamp(46px,7vw,88px); }
.courtyard-order__intro .courtyard-label{ grid-column:1 / -1; }
.courtyard-order__intro .d2{ max-width:10ch; }
.courtyard-order__steps{ position:relative; display:grid!important; grid-template-columns:repeat(3,1fr)!important; gap:0!important; counter-reset:courtyard-step; }
.courtyard-order__steps::before{ content:''; position:absolute; left:0; right:0; top:21px; height:1px; background:var(--rule); }
.courtyard-order__steps .step{ position:relative; display:block!important; counter-increment:courtyard-step; min-height:0; padding:64px clamp(18px,3vw,46px) 0 0!important; border:0!important; background:transparent!important; }
.courtyard-order__steps .step::before{ content:counter(courtyard-step,decimal-leading-zero); position:absolute; top:0; left:0; z-index:2; display:grid; place-items:center; width:44px; height:44px; color:#fff; background:var(--clay); border-radius:50%; font-family:var(--utility); font-size:.72rem; font-weight:700; letter-spacing:.08em; }
.courtyard-order__steps .step h3{ font-size:clamp(1.7rem,2.2vw,2.4rem); }
.courtyard-order__steps .step .lede{ margin-top:12px; }

/* Room — narrow / wide / narrow photographic triptych. */
.courtyard-room__head{ display:grid; grid-template-columns:1.15fr .7fr; column-gap:clamp(34px,8vw,130px); align-items:end; margin-bottom:clamp(38px,6vw,76px); }
.courtyard-room__head .courtyard-label{ grid-column:1 / -1; }
.courtyard-room__head .d2{ max-width:8ch; }
.courtyard-room__gallery{ display:grid; grid-template-columns:3fr 6fr 3fr; gap:clamp(10px,1.5vw,22px); align-items:end; }
.courtyard-room__shot{ height:clamp(360px,38vw,570px); }
.courtyard-room__shot:nth-child(2){ height:clamp(500px,52vw,730px); }
.courtyard-room__shot:nth-child(3){ align-self:start; }
.courtyard-room__shot figcaption{ font-family:var(--utility); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }

/* Visit — a grounded courtyard placard beside an opening-hours ledger. */
.courtyard-visit{ display:grid; grid-template-columns:.85fr 1.15fr; gap:0; align-items:stretch; border:1px solid var(--rule); background:#fff; }
.courtyard-visit__place{ position:relative; padding:clamp(34px,5vw,72px); background:#eef1ec; }
.courtyard-visit__place::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--clay); }
.courtyard-visit__place .d3{ margin-top:36px; }
.courtyard-visit__links{ display:flex; flex-wrap:wrap; gap:18px 28px; margin-top:30px; }
.courtyard-visit__place .btn{ margin-top:30px; }
.courtyard-visit__hours{ padding:clamp(34px,5vw,72px); }
.courtyard-visit__hours-title{ display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding-bottom:24px; border-bottom:1px solid var(--rule); }
.courtyard-visit__hours-title span{ font-family:var(--utility); font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.courtyard-visit__hours table tr{ border-bottom:1px solid var(--rule); }
.courtyard-visit__hours table :is(th,td){ padding:16px 0; text-align:left; }

/* Quote and closing deliberately break the previous layouts again. */
.courtyard-quote{ max-width:980px; padding-left:clamp(22px,5vw,72px); border-left:6px solid var(--clay); }
.courtyard-quote blockquote{ margin:0; }
.courtyard-quote .d2{ font-size:clamp(2.7rem,5.1vw,5.1rem); }
.courtyard-quote .quote-by{ margin-top:32px; font-family:var(--utility); font-size:.76rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.courtyard-closing{ display:grid; grid-template-columns:1fr auto; gap:clamp(28px,6vw,90px); align-items:end; padding:clamp(34px,5vw,72px); background:var(--sand); border-top:5px solid var(--clay); }
.courtyard-closing .d2{ max-width:10ch; }
.courtyard-closing .lede{ max-width:52ch; }
.courtyard-closing .btn--cream{ --bg:#fff; --fg:var(--ink); --bd:#fff; }

/* Generated section tone classes must never turn these signature structures
   into a single large customer-colour wall. */
section:has(.courtyard-story),section:has(.courtyard-craft),section:has(.courtyard-room),section:has(.courtyard-quote){ background:var(--cream)!important; color:var(--ink)!important; }
section:has(.courtyard-menu),section:has(.courtyard-order),section:has(.courtyard-visit),section:has(.courtyard-closing){ background:#eef1ec!important; color:var(--ink)!important; }
section:has(.courtyard-story) .lede,section:has(.courtyard-craft) .lede,section:has(.courtyard-menu) .lede,section:has(.courtyard-order) .lede,section:has(.courtyard-room) .lede,section:has(.courtyard-visit) .lede,section:has(.courtyard-quote) .lede,section:has(.courtyard-closing) .lede{ color:var(--ink-dim); }
section:has(.courtyard-craft) .courtyard-craft__title,section:has(.courtyard-craft) .courtyard-craft__title .courtyard-label{ color:#fff!important; }

@media (max-width:980px){
  .courtyard-hero__dock{ grid-template-columns:1fr; gap:22px; }
  .courtyard-hero__details{ display:grid; grid-template-columns:1fr auto; gap:26px; align-items:end; }
  .courtyard-story__title{ grid-column:1 / 6; }
  .courtyard-story__image{ grid-column:6 / 13; }
  .courtyard-story__copy{ grid-column:3 / 11; padding-top:8px; }
  .courtyard-menu{ grid-template-columns:1fr; }
  .courtyard-menu__head{ position:static; display:grid; grid-template-columns:1fr 1fr; gap:18px 42px; }
  .courtyard-menu__head .courtyard-label{ grid-column:1 / -1; }
  .courtyard-menu__head .tlink{ align-self:end; justify-self:start; }
  .courtyard-room__head{ grid-template-columns:1fr 1fr; }
}

@media (max-width:760px){
  .d1{ font-size:clamp(3.4rem,16vw,5.5rem); }
  .d2{ font-size:clamp(2.6rem,12vw,4.2rem); }
  .courtyard-hero{ min-height:690px; }
  .courtyard-hero__place{ top:22px; }
  .courtyard-hero__dock{ width:calc(100% - 24px); margin-bottom:12px; padding:26px 22px; }
  .courtyard-hero__details{ display:block; }
  .courtyard-hero .hero__cta{ display:grid; grid-template-columns:1fr 1fr; }
  .courtyard-story{ display:block; }
  .courtyard-story__title{ margin-bottom:30px; }
  .courtyard-story__image{ height:430px; }
  .courtyard-story__copy{ width:calc(100% - 22px); margin:-44px 0 0 auto; padding:28px; position:relative; z-index:2; background:#fff; }
  .courtyard-menu__head{ display:block; }
  .courtyard-menu__trays{ grid-template-columns:1fr 1fr!important; }
  .courtyard-menu__trays .card:nth-child(n){ grid-column:auto; margin:0!important; }
  .courtyard-menu__trays .card:nth-child(3n+1){ grid-column:1 / 3; }
  .courtyard-menu__trays .card:nth-child(n) :is(.card__media,.plate){ aspect-ratio:4/3; }
  .courtyard-craft__stage{ height:500px; }
  .courtyard-craft__title{ max-width:78%; }
  .courtyard-craft__notes{ grid-template-columns:1fr; width:calc(100% - 22px); margin:-48px 0 0 auto; }
  .courtyard-craft__notes article + article{ border-left:0; border-top:1px solid var(--rule); }
  .courtyard-order__intro{ display:block; }
  .courtyard-order__intro .lede{ margin-top:22px; }
  .courtyard-order__steps{ grid-template-columns:1fr!important; padding-left:0; }
  .courtyard-order__steps::before{ left:21px; right:auto; top:0; bottom:0; width:1px; height:auto; }
  .courtyard-order__steps .step{ padding:4px 0 42px 68px!important; }
  .courtyard-room__head{ display:block; }
  .courtyard-room__head .lede{ margin-top:22px; }
  .courtyard-room__gallery{ grid-template-columns:1fr 1fr; }
  .courtyard-room__shot,.courtyard-room__shot:nth-child(2),.courtyard-room__shot:nth-child(3){ height:320px; }
  .courtyard-room__shot:nth-child(2){ grid-column:1 / 3; grid-row:1; height:460px; }
  .courtyard-visit{ grid-template-columns:1fr; }
  .courtyard-closing{ grid-template-columns:1fr; }
  .courtyard-closing .btn{ justify-self:start; }
}

@media (max-width:480px){
  .courtyard-hero{ min-height:650px; }
  .courtyard-hero__dock{ padding:22px 18px; }
  .courtyard-hero .hero__cta{ grid-template-columns:1fr; }
  .courtyard-menu__trays{ grid-template-columns:1fr!important; }
  .courtyard-menu__trays .card:nth-child(n){ grid-column:1!important; }
  .courtyard-story__image{ height:360px; }
  .courtyard-craft__stage{ height:430px; }
  .courtyard-room__shot,.courtyard-room__shot:nth-child(2),.courtyard-room__shot:nth-child(3){ grid-column:1 / -1; height:330px; }
  .courtyard-room__gallery{ grid-template-columns:1fr; }
  .courtyard-visit__place,.courtyard-visit__hours{ padding:30px 22px; }
}

/* Mobile refinement: the desktop's low glass dock becomes a continuous
   gradient on small screens, so the first view feels like a restaurant
   rather than a dark UI card. */
@media (max-width:760px){
  .courtyard-hero{
    min-height:clamp(650px,calc(100svh - 126px),720px); align-items:flex-end;
  }
  .courtyard-hero .hero__img{ object-position:center center; }
  .courtyard-hero .hero__scrim{
    background:linear-gradient(180deg,rgba(8,12,10,.08) 0%,rgba(8,12,10,.14) 27%,rgba(8,12,10,.72) 67%,rgba(8,12,10,.96) 100%);
  }
  .courtyard-hero__place{
    top:22px; right:20px; padding:7px 10px; background:rgba(11,16,13,.52);
    border-radius:999px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
    font-size:.62rem; letter-spacing:.15em;
  }
  .courtyard-hero__dock{
    width:100%; margin:0; padding:clamp(150px,20vh,185px) 24px 26px;
    gap:18px; color:#fff; background:transparent;
    border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none;
  }
  .courtyard-hero .courtyard-kicker{ margin-bottom:10px; font-size:.65rem; }
  .courtyard-hero .hero__title{
    max-width:9ch; font-size:clamp(3.2rem,14vw,4.15rem); line-height:.84;
  }
  .courtyard-hero .hero__lede{
    max-width:36ch; font-size:.98rem; line-height:1.58;
  }
  .courtyard-hero .hero__cta{
    display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:20px;
  }
  .courtyard-hero .btn{
    min-height:48px; padding:10px 14px; font-size:.74rem;
  }
  .courtyard-hero .btn--ghost{ background:rgba(255,255,255,.06); }
}

@media (max-width:370px){
  .courtyard-hero__dock{ padding-inline:18px; }
  .courtyard-hero .hero__cta{ grid-template-columns:1fr; }
}
/* French pages: the decorative labels follow the page language. */
html[lang="fr"] .hours tr[data-today='1'] th::after{content:' Aujourd\2019 hui'}