/* Demo template v5 design system. Every spacing, size, radius and colour comes from the tokens below.
   Each shop picks an identity on <html>: data-face (display type), data-shape (corners), data-theme (colours),
   data-hero (hero frame) and data-band (fact band). The presets are at the end of this file. */
:root{
  /* spacing scale, 4 px base */
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  /* type scale (phone) */
  --t-xs:.8125rem;--t-sm:.9375rem;--t-md:1.0625rem;--t-lg:1.1875rem;--t-xl:1.4375rem;--t-2xl:1.75rem;--t-3xl:2.25rem;--t-4xl:2.75rem;
  --lh-tight:1.1;--lh-snug:1.3;--lh-body:1.6;--measure:27em;
  --display:"Fraunces",Georgia,"Times New Roman",serif;--display-w:600;--display-case:none;
  --name-size:var(--t-4xl);--h2-size:var(--t-2xl);--brand-case:none;--brand-track:var(--track-tight);
  --body:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  /* layout */
  --vh-full:100dvh;--map-h:20rem;--pic-w:45rem;--thumb-l:5.5rem;--thumb-s:4rem;--chip-release:10rem;--stamp:6.5rem;--t-words:clamp(1.5rem,8.2vw,2.25rem);--hero-scrim:linear-gradient(to top,rgba(10,8,6,.78) 0%,rgba(10,8,6,.45) 55%,rgba(10,8,6,0) 100%);--hero-scrim-desk:linear-gradient(to top,rgba(10,8,6,.84) 0%,rgba(10,8,6,.7) 72%,rgba(10,8,6,0) 100%);--wrap:1160px;--gutter:var(--s5);--head-h:60px;--bar-h:72px;--sec-pad:var(--s6);
  /* shape */
  --r1:8px;--r2:14px;--r3:22px;--pill:999px;--r-btn:var(--pill);--r-hero:var(--r3);--arch:999px;
  --sh1:0 1px 2px rgba(31,27,22,.06),0 4px 14px -8px rgba(31,27,22,.18);
  --sh2:0 2px 6px rgba(31,27,22,.06),0 18px 40px -22px rgba(31,27,22,.35);
  /* colour: warm neutral base, the shop's accent on top */
  --bg:#fbf8f3;--surface:#fff;--ink:#1f1b16;--muted:#655e55;--line:#e7e0d5;--line-strong:#cfc5b6;
  --tint:color-mix(in srgb,var(--accent) 7%,var(--bg));
  --tint-2:color-mix(in srgb,var(--accent) 14%,var(--bg));
  --accent-deep:color-mix(in srgb,var(--accent) 82%,#000);
  --band-bg:var(--tint-2);--band-ink:var(--ink);--band-k:var(--accent-deep);
  /* sizes */
  --bw:1px;--bw-ctl:1.5px;--bw-2:2px;--ring:3px;--tap:44px;--ctl:48px;--ctl-lg:52px;--thumb:56px;--thumb-lg:72px;--dot:10px;--dot-sm:8px;--icon:22px;--glyph:26px;--ok-size:56px;
  --lunch-day:7.5em;--num-w:1.4em;--sheet-max:85dvh;--lb-max:1100px;--lb-h:74vh;--lb-dlg-h:92vh;--track:.08em;--track-tight:-.01em;
  /* fixed colours */
  --white:#fff;--stone:#b9b0a3;--paper-2:#efe9df;--success:#2e9d5b;--success-deep:#1d7442;--success-soft:rgba(46,157,91,.18);--live:#7ee2a2;--live-soft:rgba(126,226,162,.25);
  --error:#b3261e;--warn:#8a4b00;--dark:#2a2723;--dark-ink:#ece6dc;--dark-muted:#d6cfc4;--foot-bg:#1f1b16;--foot-ink:#d9d2c6;--foot-line:#3a342d;
  --scrim:rgba(31,27,22,.4);--lb-scrim:rgba(14,12,10,.94);--sh-sheet:0 -16px 48px rgba(31,27,22,.22);
  /* motion */
  --ease:cubic-bezier(.2,.7,.2,1);--dur:420ms;--dur-fast:160ms;
}
@media (min-width:860px){:root{--t-3xl:3rem;--t-4xl:4.25rem;--t-2xl:2.125rem;--t-xl:1.625rem;--gutter:var(--s6);--head-h:72px;--sec-pad:var(--s7)}}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--s9)}
body{position:relative;margin:0;background:var(--bg);color:var(--ink);font:400 var(--t-md)/var(--lh-body) var(--body);-webkit-font-smoothing:antialiased;padding-bottom:calc(var(--bar-h) + env(safe-area-inset-bottom))}
*,*::before,*::after{font-feature-settings:"lnum" 1!important} /* lining figures sitewide, a font shorthand would reset the numeric variant (round 3, Q7) */
@media (min-width:860px){body{padding-bottom:0}}
img{display:block;max-width:100%;height:auto}
a{color:var(--accent-deep);text-underline-offset:var(--ring)}
p{margin:0 0 var(--s4);max-width:var(--measure)}
h1,h2,h3{overflow-wrap:break-word;hyphens:manual;margin:0;font-family:var(--display);font-weight:var(--display-w);letter-spacing:var(--track-tight);text-wrap:balance;text-transform:var(--display-case);color:var(--ink)}
:focus-visible{outline:var(--ring) solid var(--accent);outline-offset:var(--bw-2)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 max(var(--gutter),env(safe-area-inset-left))}
.sr{position:absolute;width:var(--bw);height:var(--bw);overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html[lang=de] .en,html[lang=en] .de{display:none}
.h2{font-size:var(--h2-size);line-height:var(--lh-tight);margin:0 0 var(--s4)}
.h3{font-size:var(--t-xl);line-height:var(--lh-snug);margin:0 0 var(--s3)}
.lead{font-size:var(--t-lg);color:var(--muted);margin:0}
.lead-s,.muted{color:var(--muted)}
.lead-s{margin:0 0 var(--s4)}
.note{color:var(--muted);font-size:var(--t-sm);margin:var(--s4) 0 0}
.more-link{font-weight:700;text-decoration:none;display:inline-flex;align-items:center;min-height:var(--tap)}

/* ---------- buttons and chips ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--ctl);padding:var(--s3) var(--s5);border-radius:var(--r-btn);
  background:var(--accent);color:var(--accent-ink);border:var(--bw-ctl) solid var(--accent);font:700 var(--t-sm)/1.1 var(--body);text-decoration:none;cursor:pointer;text-align:center;
  transition:transform var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.btn:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn.ghost:hover{background:var(--surface);border-color:var(--ink)}
.actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:var(--s2);margin:var(--s5) 0 0;max-width:36rem}
.cta-band .actions{margin-left:auto;margin-right:auto}
.chip,.chip-link{display:inline-flex;align-items:center;min-height:var(--tap);padding:var(--s2) var(--s4);border-radius:var(--r-btn);border:var(--bw) solid var(--line-strong);
  background:var(--surface);color:var(--ink);font:600 var(--t-sm)/1 var(--body);text-decoration:none;white-space:nowrap}
.chip:hover,.chip-link:hover{border-color:var(--ink)}
.chip[aria-current=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.link-row{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s5) 0 0}

/* ---------- draft bar ---------- */
.draft{background:var(--dark);color:var(--dark-ink);font:500 var(--t-xs)/1.4 var(--body);border-bottom:var(--bw) solid var(--foot-line)}
.draft .wrap{padding-top:var(--s2);padding-bottom:var(--s2)}
.draft a{color:var(--white);font-weight:700;white-space:nowrap}

/* ---------- header and navigation ---------- */
.site-head{position:relative;z-index:30;background:var(--bg);border-bottom:var(--bw) solid var(--line)}
.nav-open .site-head{z-index:50}
.head-row{display:flex;align-items:center;gap:var(--s3);min-height:var(--head-h)}
.brand{display:flex;align-items:center;gap:var(--s2);font:var(--display-w) var(--t-md)/1.1 var(--display);text-transform:var(--brand-case);letter-spacing:var(--brand-track);color:var(--ink);text-decoration:none;margin-right:auto;min-width:0;min-height:var(--tap)}
.brand-t{white-space:nowrap}
.nw{white-space:nowrap}
/* a long name steps down and may take two lines, never an ellipsis (RT2) */
@media (max-width:859px){.brand-long{font-size:var(--t-sm)}.brand-xl .brand-t{white-space:normal;line-height:1.1}}
.glyph{width:var(--glyph);height:var(--glyph);color:var(--accent);flex:none}
.head-tools{display:flex;align-items:center;gap:var(--s1)}
.lang{display:flex;align-items:center}
.lang button{border:0;background:transparent;font:700 var(--t-xs)/1 var(--body);min-width:var(--tap);min-height:var(--tap);cursor:pointer;color:var(--muted);padding:0}
.lang button[aria-pressed=true]{color:var(--ink);text-decoration:underline;text-decoration-thickness:var(--bw-2);text-underline-offset:var(--s1)}
.lang-sep{color:var(--line-strong);font-size:var(--t-xs)}
.menu-btn{display:inline-flex;align-items:center;gap:var(--s2);min-height:var(--tap);padding:0 var(--s3);border:var(--bw) solid var(--line-strong);border-radius:var(--r-btn);background:var(--surface);color:var(--ink);font:700 var(--t-sm)/1 var(--body);cursor:pointer}
.burger,.burger::before,.burger::after{display:block;width:var(--s4);height:var(--bw-2);background:currentColor;border-radius:var(--bw-2)}
.burger{position:relative}.burger::before,.burger::after{content:"";position:absolute;left:0}
.burger::before{top:calc(-1 * var(--s1) - var(--bw))}.burger::after{top:calc(var(--s1) + var(--bw))}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:40;max-height:var(--sheet-max);overflow:auto;background:var(--surface);border-radius:var(--r3) var(--r3) 0 0;
  box-shadow:var(--sh-sheet);padding:var(--s5) var(--gutter) calc(var(--s5) + env(safe-area-inset-bottom));
  transform:translateY(105%);visibility:hidden;transition:transform 220ms var(--ease),visibility 0s linear 220ms}
.nav-open .nav{transform:none;visibility:visible;transition-delay:0s}
.nav-open::after{content:"";position:fixed;inset:0;z-index:35;background:var(--scrim)}
.nav-sheet-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 var(--s4);font:var(--display-w) var(--t-lg)/1.2 var(--display);text-transform:var(--brand-case)}
.nav-close{min-height:var(--tap);padding:0 var(--s4);border-radius:var(--r-btn);border:var(--bw) solid var(--line-strong);background:var(--surface);color:var(--ink);font:700 var(--t-sm)/1 var(--body);cursor:pointer}
.nav-links{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2)}
.nav-links a{display:flex;align-items:center;min-height:var(--ctl);padding:var(--s3) var(--s4);border-radius:var(--r2);background:var(--bg);border:var(--bw) solid var(--line);
  font:var(--display-w) var(--t-lg)/1.2 var(--display);text-transform:var(--display-case);color:var(--ink);text-decoration:none;min-width:0;overflow-wrap:anywhere}
.nav-links a[aria-current=page]{border-color:var(--accent);background:var(--tint)}
.nav-extra{display:flex;gap:var(--s2);margin-top:var(--s4)}.nav-extra .btn{flex:1}
.nav-open{overflow:hidden}
@media (max-width:859px){.menu-btn{width:var(--tap);padding:0;justify-content:center}.menu-btn .mb-t{position:absolute;width:var(--bw);height:var(--bw);overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
@media (min-width:860px){
  .brand{font-size:var(--t-lg)}
  .menu-btn{display:none}
  .nav{position:static;max-height:none;overflow:visible;background:none;border-radius:0;box-shadow:none;padding:0;transform:none;visibility:visible}
  .nav-sheet-head,.nav-extra{display:none}
  .nav-links{display:flex;gap:var(--s1)}
  .nav-links a{min-height:var(--tap);padding:var(--s2) var(--s3);border:0;border-radius:0;background:none;font:600 var(--t-sm)/1 var(--body);text-transform:none;border-bottom:var(--bw-2) solid transparent}
  .nav-links a:hover{border-bottom-color:var(--line-strong)}
  .nav-links a[aria-current=page]{background:none;border-bottom-color:var(--accent)}
}

/* ---------- sections: they own the vertical rhythm ---------- */
.sec{padding:var(--sec-pad) 0}
.sec .wrap>:first-child{margin-top:0}
.sec .wrap>:last-child{margin-bottom:0}
.tint{background:var(--tint)}
.band{background:var(--band-bg);color:var(--band-ink)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s2) var(--s4);flex-wrap:wrap;margin:0 0 var(--s4)}
.sec-head .h2{margin:0}
.sec-head+.lead-s{margin-top:calc(-1 * var(--s2))}
.sec-foot{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s5)}

/* ---------- start hero: the image leads ---------- */
.hero{padding:0 0 var(--sec-pad)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s4)}
.hero .hero-pic{margin:0 calc(-1 * var(--gutter));border-radius:0;max-height:62svh}
.name{font-size:var(--name-size);line-height:var(--lh-tight);margin:0 0 var(--s3);overflow-wrap:break-word;hyphens:manual}
.name-sub{font:600 var(--t-md)/1.3 var(--body);color:var(--muted);margin:calc(-1 * var(--s1)) 0 var(--s3)}
.tagline{font-size:var(--t-lg);line-height:1.45;margin:0 0 var(--s3);max-width:44ch}
.meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1) var(--s3);margin:0;color:var(--muted);font-size:var(--t-sm)}
.status{display:inline-flex;align-items:center;gap:var(--s2);font-weight:700;color:var(--ink)}
.status[hidden]{display:none}
.dot{width:var(--dot);height:var(--dot);border-radius:50%;background:var(--stone);flex:none}
.dot.open{background:var(--success);box-shadow:0 0 0 var(--s1) var(--success-soft)}
.hero-actions{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin-top:var(--s5)}
.hero-actions .btn{padding-left:var(--s3);padding-right:var(--s3)}
@media (min-width:860px){
  .hero{padding:var(--s7) 0}
  .hero-grid{grid-template-columns:5fr 7fr;align-items:center;gap:var(--s8)}
  .hero .hero-pic{order:2;margin:0;max-height:none;aspect-ratio:auto!important;height:clamp(26rem,72vh,44rem);border-radius:var(--r-hero)}
  .hero-actions{display:flex;flex-wrap:wrap}
  .hero-actions .btn{min-height:var(--ctl-lg);padding-left:var(--s6);padding-right:var(--s6);font-size:var(--t-md)}
  .hero .tagline{font-size:var(--t-lg);line-height:1.4}
  .hero-text .hero-actions{margin-top:var(--s4)}
  .hero-grid{align-items:start}.hero-text{padding-top:var(--s8)}
}
[data-hero=arch] .hero .hero-pic{border-radius:var(--arch) var(--arch) 0 0}
@media (min-width:860px){[data-hero=arch] .hero .hero-pic{border-radius:var(--arch) var(--arch) var(--r2) var(--r2)}}

/* ---------- inner page head ---------- */
.page-head{padding:var(--s6) 0 var(--s5)}
.page-head h1{font-size:var(--t-3xl);line-height:var(--lh-tight);margin:0 0 var(--s3)}
.page-head .wrap+.wrap{margin-top:var(--s5)}
.page-pic{border-radius:var(--r3)}
@media (max-width:859px){.page-pic{aspect-ratio:16/10!important}}
@media (min-width:860px){.page-head{padding:var(--s7) 0 var(--s5)}}
.sec.first,.sec.slim{padding-top:0}

/* ---------- pictures ---------- */
.pic{margin:0;overflow:hidden;border-radius:var(--r2);background:var(--tint-2)}
.pic img{width:100%;height:100%;object-fit:cover}

/* ---------- live status ---------- */
.now{display:flex;align-items:center;gap:var(--s3);background:var(--ink);color:var(--bg);border-radius:var(--r2);padding:var(--s3) var(--s4);font-weight:700;margin:0 0 var(--s4);max-width:none}
.now::before{content:"";width:var(--dot);height:var(--dot);border-radius:50%;background:var(--live);box-shadow:0 0 0 var(--s1) var(--live-soft);flex:none}
.now.closed::before{background:var(--stone);box-shadow:none}
.now[hidden]{display:none}
.menu-cats>.wrap .now{margin-top:var(--s4)}

/* ---------- dishes, tiles, steps, garments ---------- */
.dishes{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5) var(--s3)}
.dish{display:flex;flex-direction:column;gap:var(--s3);text-decoration:none;color:var(--ink);min-width:0}
.dish-t{display:flex;flex-direction:column;gap:var(--s1)}
.dish-t>*{margin:0}
.dish-n{font:var(--display-w) var(--t-lg)/1.2 var(--display);text-transform:var(--display-case)}
.dish-d{color:var(--muted);font-size:var(--t-sm);line-height:1.4}
.dish-p{font-weight:700;font-variant-numeric:lining-nums tabular-nums}
.lead-card .dish:first-child{grid-column:1/-1}
.lead-card .dish:first-child .pic{aspect-ratio:16/10!important}
.dish:hover .dish-n{text-decoration:underline;text-decoration-thickness:var(--bw-2)}
@media (min-width:860px){.dishes{grid-template-columns:repeat(3,1fr);gap:var(--s6) var(--s5)}.lead-card .dish:first-child{grid-column:auto}.lead-card .dish:first-child .pic{aspect-ratio:1/1!important}}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.tile{display:flex;flex-direction:column;gap:var(--s2);text-decoration:none;color:var(--ink)}
.tile-t{margin:0;font:var(--display-w) var(--t-lg)/1.2 var(--display);text-transform:var(--display-case)}
.tiles.n3 .tile:first-child{grid-column:1/-1}
.tiles.n3 .tile:first-child .pic{aspect-ratio:16/10!important}
@media (min-width:860px){.tiles{grid-template-columns:repeat(4,1fr);gap:var(--s5)}.tiles.n3{grid-template-columns:repeat(3,1fr)}.tiles.n3 .tile:first-child{grid-column:auto}.tiles.n3 .tile:first-child .pic{aspect-ratio:4/5!important}}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:var(--s5)}
.steps li{display:grid;grid-template-columns:var(--tap) 1fr;gap:var(--s3);align-items:start}
.steps .pic{grid-column:1/-1}
.step-n{display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:50%;background:var(--accent);color:var(--accent-ink);font:700 var(--t-md)/1 var(--body);font-variant-numeric:lining-nums tabular-nums}
.step-t .h3{margin:var(--s2) 0 var(--s1)}
.step-t p{margin:0;color:var(--muted)}
@media (min-width:860px){.steps{grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:var(--s6)}}
.garments{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.garment{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--r2);overflow:hidden}
.garment .pic{border-radius:0}
.garment-t{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s3)}
.garment-t>*{margin:0}
.garment-n{font:var(--display-w) var(--t-lg)/1.2 var(--display)}
.garment-d{color:var(--muted);font-size:var(--t-xs);line-height:1.35}
.garment-p{font-weight:700;color:var(--accent-deep);margin-top:var(--s1)}
.garment:hover{border-color:var(--accent)}
@media (min-width:860px){.garments{grid-template-columns:repeat(4,1fr);gap:var(--s5)}}

/* ---------- split, facts ---------- */
.split{display:grid;gap:var(--s5);align-items:center}
.split .pic{border-radius:var(--r3)}
.split-t>:last-child{margin-bottom:0}
.story{font-size:var(--t-lg);line-height:1.6}
@media (max-width:859px){.split .pic{aspect-ratio:4/3!important}}
@media (min-width:860px){.split{grid-template-columns:5fr 6fr;gap:var(--s8)}.split.rev>.pic{order:2}.split.no-img{grid-template-columns:1fr}}
.facts{list-style:none;margin:0;padding:0;display:grid;gap:var(--s4)}
.facts li{display:flex;flex-direction:column;gap:var(--s1);max-width:var(--measure)}
.facts b{font:var(--display-w) var(--t-xl)/1.15 var(--display);color:var(--band-k);text-transform:var(--display-case)}
@media (min-width:700px){.facts{grid-template-columns:repeat(3,1fr);gap:var(--s6)}}

/* ---------- menu and price lists ---------- */
.menu-body{position:relative}
.chipbar{position:sticky;top:0;z-index:5;background:var(--bg);border-bottom:var(--bw) solid var(--line);padding:0 max(var(--gutter),env(safe-area-inset-left))}
@media (min-width:860px){
  .menu-body{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:12rem minmax(0,1fr);gap:var(--s7);align-items:start}
  .menu-body .menu-cats .wrap{padding:0;max-width:none}
  .menu-body .chipbar{top:var(--s6);padding:var(--sec-pad) 0 0;border:0;background:none}
  .menu-body .chips{flex-direction:column;align-items:flex-start;overflow:visible;padding:0}
  .menu-body .chip{white-space:normal;text-align:left}
}
.gallery .chipbar{position:static;border:0;padding:0}
.chips{display:flex;gap:var(--s2);overflow-x:auto;padding:var(--s2) 0;scrollbar-width:none;margin:0}
.chips::-webkit-scrollbar{display:none}
.cat-grid{display:grid;gap:var(--s5)}
.cat-pic{border-radius:var(--r3)}
.cat-head{display:flex;align-items:center;gap:var(--s3);flex-wrap:wrap;margin:0 0 var(--s3)}
.cat-head .h2{margin:0}
.now-badge{font:700 var(--t-xs)/1 var(--body);background:var(--success-deep);color:var(--white);padding:var(--s1) var(--s2);border-radius:var(--pill)}
.now-badge[hidden]{display:none}
@media (max-width:859px){.cat-pic{aspect-ratio:16/9!important}}
@media (min-width:860px){.cat-grid{grid-template-columns:5fr 7fr;gap:var(--s8);align-items:start}.cat-grid>.pic{position:sticky;top:var(--s6)}
  .cat:nth-of-type(even) .cat-grid>.pic{order:2}}
.cat-grid.no-img{grid-template-columns:1fr}
@media (min-width:860px){.cat-grid.no-img .rows{columns:2;column-gap:var(--s8)}.cat-grid.no-img .row{break-inside:avoid}}
.rows{list-style:none;margin:0;padding:0}
.row{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) 0;border-bottom:var(--bw) solid var(--line)}
.row:last-child{border-bottom:0}
.row-pic{width:var(--thumb);height:var(--thumb);flex:none;border-radius:var(--r1)}
.row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--bw-2)}
.row-name{font-weight:700;line-height:1.3}
.row-desc{color:var(--muted);font-size:var(--t-sm);line-height:1.45}
.row-dur{color:var(--muted);font-size:var(--t-xs);font-weight:600}
.tags{display:flex;flex-wrap:wrap;gap:var(--s1);margin-top:var(--s1)}
.tag{font:600 var(--t-xs)/1 var(--body);padding:var(--s1) var(--s2);border-radius:var(--pill);background:var(--tint-2);color:var(--ink)}
.row-side{display:flex;flex-direction:column;align-items:flex-end;gap:var(--s1);flex:none}
.row-price{font:600 var(--t-md)/1.2 var(--body);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.row-act{display:inline-flex;align-items:center;min-height:var(--tap);font:700 var(--t-xs)/1 var(--body);color:var(--accent-deep);border:var(--bw) solid var(--line-strong);border-radius:var(--r-btn);padding:0 var(--s3);text-decoration:none;white-space:nowrap}
.row-act:hover{border-color:var(--accent)}
@media (min-width:860px){.row-pic{width:var(--thumb-lg);height:var(--thumb-lg)}}
.cat .more-link{margin-top:var(--s3)}
.price-cards{display:grid;gap:var(--s4);margin:var(--s5) 0 0}
@media (min-width:700px){.price-cards{grid-template-columns:repeat(2,1fr);gap:var(--s5)}}
@media (min-width:1000px){.price-cards{grid-template-columns:repeat(4,1fr)}}
@media (min-width:860px){.menu-body .price-cards{grid-template-columns:repeat(2,1fr)}}
.price-card{background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--r2);overflow:hidden}
.price-card .pic{border-radius:0}
.card-btn{margin-top:var(--s3);width:100%}
.pad{padding:var(--s5)}
.cta-band{text-align:center}.cta-band .actions{justify-content:center}
.cta-band p{margin-left:auto;margin-right:auto}

/* ---------- lunch (v4 component) ---------- */
.lunch-box{background:var(--surface);border-radius:var(--r3);padding:var(--s5);border:var(--bw) solid var(--line);border-top:var(--s1) solid var(--accent)}
.lunch-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--s1) var(--s4)}
.lunch-head h2{font-size:var(--h2-size)}
.lunch-time{font-weight:700;color:var(--accent-deep)}
.lunch-pic{margin:var(--s4) 0}
.lunch-lead{margin:var(--s3) 0 0}
.lunch-days{list-style:none;margin:var(--s4) 0 0;padding:0}
.lunch-days li{display:grid;grid-template-columns:var(--lunch-day) 1fr;gap:var(--s3);padding:var(--s3) 0;border-bottom:var(--bw) solid var(--line)}
.lunch-days li.today{font-weight:700}.lunch-days li.today .ld::after{content:" ●";color:var(--accent)}
.lunch-foot{margin:var(--s3) 0 0}

/* ---------- requests (v4 forms) ---------- */
.req-block{padding-top:0}
.req-layout{display:grid;gap:var(--s6)}
@media (min-width:960px){.req-layout{grid-template-columns:1.5fr .5fr;gap:var(--s7);align-items:start}.req-side{position:sticky;top:var(--s5)}}
.req-side{border-top:var(--bw-2) solid var(--ink);padding-top:var(--s4)}
.req-side .meta{margin:0 0 var(--s3)}
.side-pic{margin:0 0 var(--s4);border-radius:var(--r2)}
@media (min-width:960px){.req-side .hours-lines li{flex-direction:column;gap:0}.req-side .hours-lines li span:last-child{text-align:left}}
.big-link{font:var(--display-w) var(--t-xl)/1.2 var(--display);text-decoration:none;display:inline-flex;align-items:center;min-height:var(--tap)}
.tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border:var(--bw-ctl) solid var(--accent);border-radius:var(--r-btn);overflow:hidden;margin:0 0 var(--s5)}
.tab{border:0;background:var(--surface);color:var(--accent-deep);padding:var(--s3) var(--s2);font:700 var(--t-sm)/1.1 var(--body);min-height:var(--ctl);cursor:pointer}
.tab+.tab{border-left:var(--bw-ctl) solid var(--accent)}
.tab[aria-selected=true]{background:var(--accent);color:var(--accent-ink)}
.req,.done{background:var(--surface);border-radius:var(--r3);padding:var(--s5);border:var(--bw) solid var(--line)}
.req[hidden],.done[hidden],.tabs[hidden]{display:none!important}
@media (min-width:860px){.req,.done{padding:var(--s6)}}
.req-intro{color:var(--muted);margin:0 0 var(--s5)}
.req-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s4);margin:0 0 var(--s5)}
.req-fields>.wide,.req-fields>.pick,.req-fields>.calc,.req-fields>.photo,.req-fields>.svc-info,.req-fields>.date-err,.req-fields>.addr{grid-column:1/-1}
@media (max-width:420px){.req-fields{grid-template-columns:minmax(0,1fr)}}
.f{display:flex;flex-direction:column;gap:var(--s2);font:700 var(--t-sm)/1.3 var(--body);min-width:0}
.f.wide{grid-column:1/-1}
.req input,.req select,.req textarea{font:400 var(--t-md)/1.4 var(--body);color:var(--ink);background:var(--bg);border:var(--bw-ctl) solid var(--line-strong);border-radius:var(--r1);padding:var(--s3);min-height:var(--ctl);width:100%;min-width:0;-webkit-appearance:none;appearance:none;transition:border-color var(--dur-fast) var(--ease)}
.req input:focus,.req select:focus,.req textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 var(--ring) color-mix(in srgb,var(--accent) 22%,transparent)}
.req select{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - var(--s4)) 50%,calc(100% - var(--s3)) 50%;background-size:var(--s1) var(--s1);background-repeat:no-repeat;padding-right:var(--s6)}
.req .btn{width:100%}
.calc-k{margin:0 0 var(--s2);font:700 var(--t-sm)/1.3 var(--body)}
.chipset{display:flex;flex-wrap:wrap;gap:var(--s2)}
.calc .chipset{display:grid;grid-template-columns:1fr 1fr}
@media (min-width:860px){.calc .chipset{grid-template-columns:repeat(4,1fr)}}
.opt{position:relative}
.req .opt input,[data-check] .opt input{position:absolute;inset:0;width:100%;height:100%;min-height:0;margin:0;padding:0;border:0;opacity:0;cursor:pointer}
.opt>span{display:inline-flex;align-items:center;min-height:var(--tap);padding:var(--s2) var(--s4);border:var(--bw-ctl) solid var(--line-strong);border-radius:var(--r-btn);background:var(--bg);font:700 var(--t-sm)/1.2 var(--body);cursor:pointer;transition:background var(--dur-fast) var(--ease)}
.opt input:checked+span{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.opt input:focus-visible+span{outline:var(--ring) solid var(--ink);outline-offset:var(--bw-2)}
.gopt>span{display:flex;flex-direction:column;align-items:stretch;gap:var(--s2);padding:var(--s2);border-radius:var(--r2)!important;height:100%;text-align:center}
.gopt img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r1)}
.alts{display:grid;gap:var(--s2);margin:var(--s3) 0 0}.alts[hidden]{display:none}
.alt{display:flex;align-items:center;gap:var(--s3);border:var(--bw) solid var(--line);border-radius:var(--r1);padding:var(--s3);background:var(--bg);min-height:var(--ctl);font-weight:600}
.req .alt input{-webkit-appearance:checkbox;appearance:auto;width:var(--icon);height:var(--icon);min-height:0;padding:0;margin:0;border:0;background:none;accent-color:var(--accent);flex:none}
.alt>span{flex:1}.alt b{font-variant-numeric:lining-nums tabular-nums}
.alt.express{border-style:dashed;margin-top:var(--s2)}
.total{margin:var(--s4) 0 var(--s1);font-size:var(--t-lg)}
.total b{font:var(--display-w) var(--t-2xl)/1 var(--display);color:var(--accent-deep)}
.turn{color:var(--muted);font-size:var(--t-sm);margin:var(--s2) 0 0}
.photo{display:grid;gap:var(--s2)}
.photo .btn{background:var(--surface);color:var(--ink);border-color:var(--line-strong)}
.photo-info{font-size:var(--t-sm);color:var(--muted);margin:0}
.photo-info.hl{color:var(--ink)}
.svc-info{margin:calc(-1 * var(--s2)) 0 0;font-weight:700;color:var(--accent-deep)}
.date-err{color:var(--error);font-weight:700;margin:0}
.pick{font:700 var(--t-sm)/1.3 var(--body)}
.pick-label{display:block;margin:0 0 var(--s2)}
.pick.need .pick-label{color:var(--error)}
.pick-g{border-bottom:var(--bw) solid var(--line);margin:0}
.pick-g summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:var(--s3) 0;cursor:pointer;min-height:var(--tap);font:var(--display-w) var(--t-lg)/1.3 var(--display);text-transform:var(--display-case)}
.pick-g:not([open]) .pick-list{display:none}
.pick-g.off summary{color:var(--muted);cursor:default}.off-note{font:400 var(--t-xs)/1.3 var(--body);text-transform:none}
.pick-list{list-style:none;margin:0;padding:0 0 var(--s3);display:grid;font-weight:500}
.pick-list li{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"pi pn" "pi q";column-gap:var(--s3);row-gap:var(--s1);align-items:center;padding:var(--s3) 0;border-top:var(--bw) solid var(--line);min-width:0}
.pick-list li:not(:has(.pi)){grid-template-areas:"pn pn" "q q"}
.pick-list .pi{grid-area:pi;width:var(--thumb);height:var(--thumb);object-fit:cover;border-radius:var(--r1)}
.pick-list .pn{grid-area:pn;display:flex;justify-content:space-between;align-items:baseline;gap:var(--s3);min-width:0}
.pick-list .pn b{font-weight:600;line-height:1.3}
.pick-list .pp{color:var(--muted);font-size:var(--t-sm);font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.pick-list .q{grid-area:q;justify-self:end;display:flex;align-items:center;gap:var(--s1)}
.pick-list button{width:var(--tap);height:var(--tap);border-radius:50%;border:var(--bw) solid var(--line-strong);background:var(--surface);color:var(--ink);font:700 var(--t-lg)/1 var(--body);cursor:pointer;padding:0}
.pick-list .n{min-width:var(--num-w);text-align:center;font-variant-numeric:lining-nums tabular-nums;font-weight:700}
@media (max-width:359px){.pick-list .pi{display:none}}
.pick-note.removed{display:block;color:var(--warn);margin:0 0 var(--s2)}
.summary{border-top:var(--bw) solid var(--line);padding:var(--s3) 0 0;margin:0 0 var(--s4)}
.summary[hidden]{display:none}
.done{text-align:center}
.done .ok{width:var(--ok-size);height:var(--ok-size);border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-size:var(--t-xl);margin:0 auto var(--s4)}
.done h3{font-size:var(--t-2xl);margin:0 0 var(--s3)}
.done p{margin-left:auto;margin-right:auto}
.done-sum{background:var(--bg);border-radius:var(--r1);padding:var(--s3) var(--s4);margin:0 0 var(--s4);text-align:left}
.addr[hidden]{display:none}

/* ---------- gallery and lightbox ---------- */
.g-sec .h2{margin:0 0 var(--s4)}
.g-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3)}
.g-item{display:flex;flex-direction:column;gap:var(--s2);text-decoration:none;color:var(--muted)}
.g-item .pic{border-radius:var(--r2);transition:transform var(--dur) var(--ease)}
.g-item:hover .pic{transform:scale(1.015)}
.g-cap{font-size:var(--t-sm);color:var(--ink);font-weight:600}
@media (min-width:768px){.g-grid{grid-template-columns:repeat(3,1fr);gap:var(--s5)}}
@media (min-width:1200px){.g-grid{grid-template-columns:repeat(4,1fr)}}
.lightbox{border:0;padding:0;background:transparent;max-width:min(94vw,var(--lb-max));max-height:var(--lb-dlg-h);overflow:visible}
.lightbox::backdrop{--lb-scrim:rgba(14,12,10,.94);background:var(--lb-scrim)}
.lightbox figure{margin:0}
.lightbox img{max-height:var(--lb-h);width:auto;height:auto;border-radius:var(--r2);margin:0 auto}
.lightbox figcaption{color:var(--paper-2);padding:var(--s3) 0 0;font-size:var(--t-sm);text-align:center}
.lb-bar{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;gap:var(--s3);padding:var(--s4) var(--s4) calc(var(--s4) + env(safe-area-inset-bottom))}
.lb-nav,.lb-close{min-width:var(--ctl);min-height:var(--ctl);border-radius:var(--pill);border:0;background:var(--white);color:var(--ink);font:700 var(--t-sm)/1 var(--body);cursor:pointer;padding:0 var(--s4)}
.lb-nav{font-size:var(--t-xl)}
.lb-count{color:var(--paper-2);font-size:var(--t-sm);min-width:var(--ctl);text-align:center}

/* ---------- visit and contact ---------- */
.visit{display:grid;gap:var(--s7)}
@media (min-width:860px){.visit{grid-template-columns:1fr 1fr;gap:var(--s8)}}
.hours-lines{list-style:none;margin:0;padding:0}
.hours-lines li{display:flex;justify-content:space-between;gap:var(--s4);padding:var(--s3) 0;border-bottom:var(--bw) solid var(--line)}
.hours-lines li span:last-child{text-align:right;font-variant-numeric:lining-nums tabular-nums}
.hours{width:100%;border-collapse:collapse;font-size:var(--t-md);margin-top:var(--s3)}
.hours th,.hours td{text-align:left;padding:var(--s3) var(--s2);border-bottom:var(--bw) solid var(--line);font-weight:500}
.hours td{text-align:right;font-variant-numeric:lining-nums tabular-nums}
.hours tr.today th,.hours tr.today td{font-weight:700;color:var(--ink);background:var(--tint)}
.hours tr.today th::before{content:"";display:inline-block;width:var(--dot-sm);height:var(--dot-sm);border-radius:50%;background:var(--accent);margin:0 var(--s2) var(--bw-2) 0}
.addr-block{margin:0 0 var(--s4)}
.mapfig{margin:0;border-radius:var(--r2);overflow:hidden;border:var(--bw) solid var(--line)}
.mapfig img{width:100%}
.credit{font-size:var(--t-xs);color:var(--muted);padding:var(--s2) var(--s3);background:var(--surface)}
.prose{max-width:68ch}.prose h2{font-size:var(--t-xl);margin:var(--s6) 0 var(--s2)}

/* ---------- footer and action bar ---------- */
.site-foot{background:var(--foot-bg);color:var(--foot-ink);padding:var(--s8) 0 var(--s6)}
.site-foot a{color:var(--white)}
.foot-grid{display:grid;gap:var(--s6)}
.foot-brand{display:flex;align-items:center;gap:var(--s2);font:var(--display-w) var(--t-xl)/1.2 var(--display);text-transform:var(--brand-case);letter-spacing:var(--brand-track);color:var(--white);margin:0 0 var(--s3)}
.foot-brand .glyph{color:var(--white)}
.foot-hours{font-size:var(--t-sm);color:var(--foot-ink)}
.foot-line{color:var(--foot-ink)}
.foot-nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s5);align-content:start}
.foot-nav a{text-decoration:none;font-weight:600;min-height:var(--tap);display:flex;align-items:center}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2);border-top:var(--bw) solid var(--foot-line);margin-top:var(--s6);padding-top:var(--s4);font-size:var(--t-xs);color:var(--stone)}
.foot-legal a{display:inline-flex;align-items:center;min-height:var(--tap)}
@media (min-width:860px){.foot-grid{grid-template-columns:1.2fr .8fr}}
.bar-rail{position:absolute;left:0;right:0;top:var(--vh-full);bottom:0;z-index:20;pointer-events:none}
.actionbar{position:sticky;top:calc(var(--vh-full) - var(--bar-h) - env(safe-area-inset-bottom));pointer-events:auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--s2);padding:var(--s3) var(--gutter) calc(var(--s3) + env(safe-area-inset-bottom));
  background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(var(--dot));-webkit-backdrop-filter:blur(var(--dot));border-top:var(--bw) solid var(--line);
  transition:transform var(--dur-fast) var(--ease)}
.actionbar .btn{width:100%;padding-left:var(--s2);padding-right:var(--s2);font-size:var(--t-sm)}
.actionbar.away,.nav-open .actionbar{visibility:hidden}
@media (min-width:860px){.bar-rail{display:none}}

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

/* ---------- identity presets ---------- */
/* display faces */
[data-face=grotesk]{--display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;--display-w:700;--track-tight:-.025em;--brand-track:-.02em}
[data-face=condensed]{--display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;--display-w:600;--display-case:uppercase;--track-tight:.01em;--brand-case:uppercase;--brand-track:.08em;
  --name-size:calc(var(--t-4xl) * 1.3);--h2-size:calc(var(--t-2xl) * 1.15)}
[data-face=didone]{--display:"DM Serif Display",Georgia,"Times New Roman",serif;--display-w:400;--track-tight:0;--name-size:calc(var(--t-4xl) * 1.05)}
[data-face=slab]{--display:"Zilla Slab",Rockwell,Georgia,serif;--display-w:600;--track-tight:0;--name-size:calc(var(--t-4xl) * 1.1)}
[data-face=garamond]{--display:"Cormorant",Garamond,Georgia,serif;--display-w:600;--track-tight:0;--name-size:calc(var(--t-4xl) * 1.05);--h2-size:calc(var(--t-2xl) * 1.2)}
/* corners */
[data-shape=square]{--r1:2px;--r2:2px;--r3:4px;--r-btn:2px;--r-hero:0}
[data-shape=round]{--r1:12px;--r2:20px;--r3:30px;--r-btn:var(--pill);--r-hero:30px}
/* colour themes */
[data-theme=paper]{--bg:#f8f0ea;--surface:#fffaf6;--line:#ecdcd2;--line-strong:#d8c1b4;--muted:#6b5a55}
[data-theme=cool]{--bg:#f2f3f0;--surface:#fff;--line:#dcdfda;--line-strong:#bfc5bd;--muted:#59605c}
[data-theme=lilac]{--bg:#faf7f8;--surface:#fff;--line:#e9e1e6;--line-strong:#d2c5cd;--muted:#62596a}
[data-theme=dark]{--bg:#14110f;--surface:#1d1916;--ink:#f4ede3;--muted:#b7ad9f;--line:#302925;--line-strong:#4f453e;
  --tint:#1b1714;--tint-2:#25201b;--accent-deep:color-mix(in srgb,var(--accent) 70%,var(--white));--foot-bg:#0b0908;--scrim:rgba(0,0,0,.6)}
[data-theme=cool] .sec-head,[data-theme=cool] .visit .h2{border-top:var(--bw-2) solid var(--ink);padding-top:var(--s3)}
/* the fact band */
[data-band=accent]{--band-bg:var(--accent);--band-ink:var(--accent-ink);--band-k:var(--accent-ink)}
[data-band=dark]{--band-bg:var(--dark);--band-ink:var(--dark-ink);--band-k:color-mix(in srgb,var(--accent) 30%,var(--white))}

/* ---------- copy deck components (iteration 3) ---------- */
.headline{font:var(--display-w) var(--t-xl)/1.2 var(--display);text-transform:var(--display-case);margin:0 0 var(--s2)}
.btn-sub{font-size:var(--t-xs);color:var(--muted);margin:var(--s2) 0 0}
.help{display:block;font:400 var(--t-xs)/1.4 var(--body);color:var(--muted)}
p.help{margin:calc(-1 * var(--s2)) 0 0}
.fs{border:0;margin:0;padding:0;min-width:0}
.fs legend{padding:0}
.fs.need .calc-k{color:var(--error)}
.fixed{margin:0}
.dt{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--s2)}
.tile-d{color:var(--muted);font-size:var(--t-sm);margin:0}
.row-no{color:var(--muted);font-variant-numeric:lining-nums tabular-nums;font-weight:600;margin-right:var(--s1)}
.check-g{display:grid;grid-template-columns:1fr 1fr;margin:0 0 var(--s4);padding:0;list-style:none}.check-g>li{display:flex}.check-g>li>.opt{flex:1}
@media (min-width:860px){.check-g{grid-template-columns:repeat(4,1fr)}}
.check-alts{display:grid;gap:var(--s2);list-style:none;margin:0 0 var(--s2);padding:0}
.check-alts[hidden]{display:none}
.check-alts input{accent-color:var(--accent);width:var(--icon);height:var(--icon);flex:none;margin:0}
.check-res{font:var(--display-w) var(--t-2xl)/1.1 var(--display);color:var(--accent-deep);margin:var(--s4) 0 var(--s1)}
.about-block{max-width:var(--measure)}
.about-block .h3{margin-top:0}
.demo-note{font-size:var(--t-sm);color:var(--muted);border-top:var(--bw) solid var(--line);padding-top:var(--s3)}
.done-extra{font-weight:700}
.done-extra[hidden]{display:none}
.tags:empty{display:none}
p.tags{margin:0}
.name.long{font-size:var(--t-2xl);overflow-wrap:anywhere}
.pick-g summary::-webkit-details-marker{display:none}
.pick-g summary::after{content:"";width:var(--s2);height:var(--s2);border-right:var(--bw-2) solid currentColor;border-bottom:var(--bw-2) solid currentColor;transform:rotate(45deg);transition:transform var(--dur-fast) var(--ease);flex:none}
.pick-g[open] summary::after{transform:rotate(-135deg)}
.pick-g.off summary::after{display:none}
/* T7: an odd gallery leaves no orphan on phones */
@media (max-width:767px){.g-grid>.g-item:first-child:nth-last-child(2n+1){grid-column:1/-1}.g-grid>.g-item:first-child:nth-last-child(2n+1) .pic{aspect-ratio:16/10!important}}
/* T10: the shop's own street photo, when Nikolas has taken one */
.facade{margin:0 0 var(--s4);border-radius:var(--r2)}
/* Hair Company: editorial salon (round 2) */
[data-shape=crisp]{--r1:4px;--r2:4px;--r3:4px;--r-btn:4px;--r-hero:4px}
[data-theme=editorial]{--bg:#f5f1e9;--surface:#fbf8f2;--ink:#30251f;--muted:#6e6058;--line:#ddd3c6;--line-strong:#cfc4b6}
[data-theme=editorial] .sec-head{border-top:var(--bw) solid var(--accent);padding-top:var(--s3)}
[data-theme=editorial] .visit .h2{border-top:var(--bw) solid var(--accent);padding-top:var(--s3)}
@media (max-width:859px) and (max-height:740px){.hero .hero-pic{max-height:34svh}}
.headline+.tagline{font-size:var(--t-md);line-height:1.4}

/* ---------- iteration 4: directions from the explorations ---------- */
/* faces */
[data-face=bodoni]{--display:"Bodoni Moda",Didot,Georgia,serif;--display-w:500;--track-tight:-.015em;--name-size:calc(var(--t-4xl) * 1.1);--h2-size:calc(var(--t-2xl) * 1.1)}
[data-face=archivo]{--display:"Archivo","Helvetica Neue",Arial,sans-serif;--display-w:800;--track-tight:-.035em;--brand-track:-.03em;--name-size:calc(var(--t-4xl) * 1.15)}
[data-face=black]{--display:"Archivo Black","Arial Black",Arial,sans-serif;--display-w:400;--display-case:none;--track-tight:-.01em;--brand-case:uppercase;--brand-track:.02em}
[data-mono=on]{--mono:"IBM Plex Mono",ui-monospace,Menlo,monospace}
[data-mono=on] .row-price,[data-mono=on] .dish-p,[data-mono=on] .garment-p,[data-mono=on] .nl-price,[data-mono=on] .nl-no,[data-mono=on] .calc-k,[data-mono=on] .chip,[data-mono=on] .hero-strip,[data-mono=on] .stamp,[data-mono=on] .ix-no{font-family:var(--mono);letter-spacing:0}
/* shape: no rounding at all */
[data-shape=none]{--r1:0;--r2:0;--r3:0;--r-btn:0;--r-hero:0}
/* themes */
[data-theme=deli]{--bg:#f6f0d8;--surface:#fffaeb;--ink:#17234b;--muted:#46507a;--line:#c9c0a0;--line-strong:#17234b;--tint:#efe6c6;--tint-2:#e7dcb4}
[data-theme=deli] .row{border-bottom-style:dashed}
[data-theme=deli] .btn{border-width:var(--bw-2)}
[data-theme=night]{--bg:#151c18;--surface:#1e2922;--ink:#f4f3e8;--muted:#c0c9be;--line:#2c3830;--line-strong:#465247;
  --tint:#1a231e;--tint-2:#243029;--accent-deep:var(--accent);--foot-bg:#0e1310;--scrim:rgba(0,0,0,.6)}
[data-theme=workshop]{--bg:#f1f2e9;--surface:#fffef8;--ink:#153c35;--muted:#52645c;--line:#c9d0c4;--line-strong:#8b9d8f;--tint:#e7eadc;--tint-2:#dde2d0}
[data-theme=workshop] .sec-head,[data-theme=workshop] .visit .h2{border-top:var(--bw-2) solid var(--ink);padding-top:var(--s3)}
/* wordmark: two lines, the second in italic */
[data-mark=stack] .brand-t{display:flex;flex-direction:column;line-height:.95;white-space:normal}
[data-mark=stack] .wm-b{font-style:italic;padding-left:var(--s4)}
[data-mark=stack] .foot-brand span{display:flex;flex-direction:column;line-height:1}
[data-mark=rule] .brand-t{border-bottom:var(--bw-2) dashed currentColor;padding-bottom:var(--bw-2)}
/* hero with the text on the image */
.hero-ov{padding:0 0 var(--sec-pad)}
.hero-media{position:relative}
.hero-ov .hero-pic{margin:0;border-radius:0;max-height:none}
.hero-cap{--ink:var(--white);position:absolute;left:0;right:0;bottom:0;padding:var(--s9) 0 var(--s4);background:var(--hero-scrim);color:var(--ink)}
.hero-cap .name,.hero-cap .headline,.hero-cap .tagline{color:var(--ink);margin-bottom:var(--s2)}
.hero-cap .tagline{margin:0;max-width:40ch;font-size:var(--t-md);line-height:1.35}
.hero-words{font:var(--display-w) var(--t-words)/1 var(--display);overflow-wrap:anywhere;text-transform:uppercase;letter-spacing:var(--track-tight);margin:0 0 var(--s4);max-width:none}
.hero-below{padding-top:var(--s3)}
.hero-below .hero-actions{margin-top:var(--s4)}
.hero-strip{background:var(--ink);color:var(--bg);font-size:var(--t-sm)}
.hero-strip .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s1) var(--s4);padding-top:var(--s3);padding-bottom:var(--s3)}
[data-hero=panel] .hero-cap{--ink:var(--accent-ink);position:relative;margin:calc(-1 * var(--s8)) var(--gutter) 0;padding:var(--s4) 0 var(--s4);background:var(--accent);color:var(--accent-ink)}
[data-hero=panel] .hero-cap .name{font-size:var(--t-3xl)}
[data-hero=panel] .hero-cap .name,[data-hero=panel] .hero-cap .tagline{color:var(--ink)}
[data-hero=panel] .hero-below{padding-top:var(--s3)}
.hero-below .name{margin-top:var(--s2)}
.stamp{position:absolute;top:var(--s4);right:var(--s4);width:var(--stamp);height:var(--stamp);border-radius:50%;background:var(--bg);color:var(--accent);border:var(--bw-2) solid var(--accent);
  display:grid;place-content:center;text-align:center;font:700 var(--t-sm)/1.15 var(--body);transform:rotate(-8deg);margin:0}
.stamp span{display:block}.stamp span:last-child{font-size:var(--t-xs);font-weight:500}
@media (min-width:860px){
  .hero-ov{padding:0 0 var(--sec-pad)}
  .hero-ov .hero-pic{height:clamp(26rem,74vh,46rem);aspect-ratio:auto!important}
  .hero-cap{padding:var(--s9) 0 var(--s7);background:var(--hero-scrim-desk)}
  .hero-cap .tagline{font-size:var(--t-xl)}
  [data-hero=panel] .hero-cap .tagline{font-size:var(--t-lg)}
  .hero-words{font-size:var(--t-4xl)}
  [data-hero=panel] .hero-cap{position:absolute;margin:0;left:auto;right:var(--gutter);width:min(36rem,48%);bottom:calc(-1 * var(--s7));padding:var(--s6)}
  [data-hero=panel] .hero-cap .name{font-size:var(--name-size)}
  [data-hero=panel] .hero-below{padding-top:var(--s8)}
  [data-hero=panel] .hero-cap .wrap{padding:0}
}
/* numbered price list (café) */
.numlist{list-style:none;margin:0;padding:0;border-top:var(--bw-2) solid var(--ink)}
.nl-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s3);align-items:baseline;padding:var(--s4) 0;border-bottom:var(--bw) dashed var(--line-strong)}
.nl-no{font-weight:700;color:var(--accent)}
.nl-name{font:var(--display-w) var(--t-xl)/1.15 var(--display);margin:0;text-transform:var(--display-case)}
.nl-desc{color:var(--muted);font-size:var(--t-sm);margin:var(--s1) 0 0}
.nl-price{font-weight:700;white-space:nowrap}
/* salon service index */
.index{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s3)}
.ix{display:flex;flex-direction:column;gap:var(--s1);border-top:var(--bw) solid var(--accent);padding-top:var(--s3)}
.ix .pic{margin-bottom:var(--s2)}
.ix-no{font-size:var(--t-xs);font-weight:700;color:var(--accent);margin:0;letter-spacing:var(--track)}
.ix-name{font:var(--display-w) var(--t-lg)/1.2 var(--display);margin:0;overflow-wrap:break-word;hyphens:manual}
.ix-price{font:var(--display-w) var(--t-xl)/1.1 var(--display);margin:0}
.ix-link{font-weight:700;font-size:var(--t-sm);text-decoration:none;display:inline-flex;align-items:center;min-height:var(--tap)}
@media (min-width:860px){.index{grid-template-columns:repeat(4,1fr);gap:var(--s6)}}
/* big words (tailor) */
.big-words{font:var(--display-w) var(--t-words)/1 var(--display);overflow-wrap:anywhere;text-transform:uppercase;letter-spacing:var(--track-tight);margin:0 0 var(--s5);max-width:none}
@media (min-width:860px){.big-words{font-size:var(--t-4xl)}}
/* florist size grid and photographic chapters */
.sizes{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:var(--s4) var(--s3)}
.size{display:flex;flex-direction:column;gap:var(--s1)}
.size-n{font:var(--display-w) var(--t-lg)/1.2 var(--display);margin:var(--s2) 0 0}
.size-p{font:var(--display-w) var(--t-2xl)/1 var(--display);color:var(--accent-deep);margin:0}
[data-trade=florist] .cat-grid{grid-template-columns:1fr}
[data-trade=florist] .cat-grid>.pic{position:static;aspect-ratio:16/9!important;order:0!important}
@media (min-width:860px){[data-trade=florist] .cat-grid>.pic{aspect-ratio:21/9!important}[data-trade=florist] .sizes{grid-template-columns:repeat(4,1fr)}}
@media (min-width:768px) and (max-width:859px){.chipbar{position:static;border:0}}
.hero-below .headline{font-size:var(--t-lg);line-height:1.25}
@media (max-width:859px){.hero-below .headline+.tagline{display:none}}
@media (min-width:860px){.hero-ov .hero-media{max-width:calc(var(--wrap) - var(--gutter) - var(--gutter));margin:var(--s5) auto 0}.hero-ov .hero-pic{border-radius:var(--r-hero)}}
.hero-actions .btn:only-child{grid-column:1/-1}

/* ---------- iteration 5: round 3 fixes ---------- */
/* R1: on desktop the image carries name, status and buttons as one block */
.cap-acts{display:none}
.cap-acts .meta{color:var(--ink)}
.hero-cap .btn.ghost{color:var(--ink);border-color:currentColor;background:transparent}
.hero-below>.hero-actions:first-child{margin-top:0}
@media (min-width:860px){
  .cap-acts{display:block;margin-top:var(--s4)}
  .cap-acts .hero-actions{margin-top:var(--s3)}
  .hero-ov .hero-below{display:none}
  .hero-ov.has-words .hero-below{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s7);align-items:start;padding-top:var(--s6)}
  .hero-ov.has-words .hero-below>.meta{grid-column:1/-1}
  .hero-ov.has-words .hero-pic{height:clamp(22rem,58vh,38rem)}
  .has-words .below-acts .hero-actions{margin-top:0}
  .hero-ov{padding-bottom:var(--sec-pad)}
  [data-hero=panel] .hero-ov .hero-below{display:none}
}
/* R2: a short week, one centred column */
@media (min-width:860px){.visit.short{grid-template-columns:1fr;max-width:45rem;margin:0 auto}}
/* R3: lining figures for prices and times */
.row-price,.dish-p,.nl-price,.ix-price,.size-p,.garment-p,.check-res,.total,.status,.meta,.hours,.hours-lines,.hero-strip,.price-card,.foot-hours,.stamp,.row-no,.row-dur{font-variant-numeric:lining-nums tabular-nums}
/* R5: no orphans in card grids */
@media (min-width:860px){.dishes.n4,.dishes.n8{grid-template-columns:repeat(4,1fr)}.dishes.n2{grid-template-columns:repeat(2,1fr)}}
/* R6: a fixed number column */
.row-no{min-width:3.5ch;text-align:right;color:var(--muted);font-weight:600;flex:none}
/* R7: the appointment link per row is text, not a box */
.row-act{border:0;padding:0;min-height:var(--tap);font-size:var(--t-sm);text-decoration:none}
.row-act:hover{text-decoration:underline}
.ix-dur{font:500 var(--t-sm)/1.2 var(--body);color:var(--muted)}
/* Tamer: caps for the hero words and section heads only */
[data-face=black] .name,[data-face=black] .hero-below .headline,[data-face=black] .cap-texts .headline{text-transform:none}
[data-face=black] .headline{font:600 var(--t-lg)/1.3 var(--body);text-transform:none}
/* steps: titles aligned in one row on desktop */
@media (min-width:860px){.steps li{grid-row:span 2;grid-template-rows:subgrid;row-gap:var(--s3)}.steps li:not(:has(.pic)){grid-row:span 1}}
[data-hero=panel] .hero-cap .btn:not(.ghost){background:var(--accent-ink);color:var(--accent);border-color:var(--accent-ink)}
.opt.off>span{color:var(--muted);text-decoration:none;background:transparent;border-style:dashed;cursor:not-allowed}.hero-menu{margin:var(--s2) 0 0}
.hero-actions~.tagline{margin:var(--s4) 0 0;font-size:var(--t-md);line-height:1.4;max-width:46ch}
.hero-actions>.btn:only-child{grid-column:1/-1}
.hero-text .hero-actions{margin-top:var(--s4)}
.hero-text .tagline{line-height:1.35}
@media (max-width:859px){.hero-text .headline{font-size:var(--t-lg);line-height:1.25}}
/* the stuck chip bar lets go 10rem before the end of the menu, so it never covers the last rows, flow unchanged (the margins collapse to zero) */
@media (max-width:767px){.menu-body>.chipbar{margin-bottom:var(--chip-release)}.menu-body>.chipbar+*{margin-top:calc(-1 * var(--chip-release))}}
.hero-strip p{margin:0}
.hero-below+.hero-strip{margin-top:var(--s4)}
/* round 4 */
.hero-cap a:not(.btn){color:var(--ink)}
.check-g .opt>span,.calc .chipset .opt>span{display:flex;width:100%;justify-content:center;text-align:center}
.calc .chipset>.opt{display:flex}
@media (min-width:860px){.mapfig img{max-height:var(--map-h);object-fit:cover}}
.ix-dur{display:block;margin-top:var(--s1)}
.cat-body>:last-child{margin-bottom:0}
.cat:has(.cat-body>.row-price:last-child){padding-bottom:var(--s3)}
@media (max-width:859px){.name-trade{display:block;font-size:var(--t-xl);line-height:1.15;margin-top:var(--s1)}}
@media (max-width:374px){[data-face=black] .page-head h1{font-size:var(--t-words)}}
@media (max-width:767px){.chips.few{flex-wrap:wrap;overflow:visible}}
/* phones: the category photo becomes a thumbnail beside the heading, so the first rows show in the first screen (round 4, T4) */
@media (max-width:859px){
  html[data-trade] .cat-grid{position:relative}
  html[data-trade] .cat-grid>.cat-pic{position:absolute;top:0;right:var(--gutter);width:var(--thumb-l);height:var(--thumb-l);aspect-ratio:1/1!important;border-radius:var(--r2);margin:0}
  html[data-trade] .cat-grid>.cat-pic img{width:100%;height:100%;object-fit:cover}
  html[data-trade] .cat-grid:has(>.cat-pic) .cat-head,html[data-trade] .cat-grid:has(>.cat-pic) .cat-body>.lead-s{padding-right:calc(var(--thumb-l) + var(--s3))}
  html[data-trade] .cat-grid:has(>.cat-pic) .cat-head{min-height:var(--thumb-l);align-items:flex-start}
  html[data-trade] .cat-grid:has(>.cat-pic) .cat-head:has(+.lead-s){min-height:0}
  html[data-trade] .cat-grid:has(>.cat-pic) .cat-body>.lead-s{min-height:calc(var(--thumb-l) - var(--s8))}
}
.pick-list .pd{display:block;color:var(--muted);font-size:var(--t-xs);line-height:1.35;font-weight:400}.pick-list .pn{min-width:0}
.pick-list .pn{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--s3);align-items:baseline}.pick-list .pn>b{grid-column:1}.pick-list .pn>.pd{grid-column:1;grid-row:2}.pick-list .pn>.pp{grid-column:2;grid-row:1}
.row-na{color:var(--muted);font-size:var(--t-xs);font-weight:600;white-space:nowrap}
.price-close{margin-top:var(--s6);padding-top:var(--s5);border-top:var(--bw) solid var(--line)}.price-close p{margin:0 0 var(--s3);max-width:46ch}
.owner-view{margin:var(--s4) 0;border-top:var(--bw) solid var(--line);padding-top:var(--s3);text-align:left}
.owner-view summary{cursor:pointer;font-weight:600;font-size:var(--t-sm);color:var(--muted);min-height:var(--tap);display:flex;align-items:center}
.owner-msg{background:var(--surface);border:var(--bw) solid var(--line);border-radius:var(--r2);padding:var(--s3) var(--s4);font-size:var(--t-sm)}
.owner-msg p{margin:0 0 var(--s2)}.owner-msg .ow-f{color:var(--muted);font-size:var(--t-xs);margin:0}
.row-size{color:var(--muted);font-weight:500;font-size:var(--t-sm);white-space:nowrap}
.row-var{display:grid;grid-template-columns:repeat(auto-fit,minmax(7.5rem,1fr));gap:var(--s2) var(--s3);margin:var(--s2) 0 0}
.row-var>div{border-top:var(--bw) solid var(--line);padding-top:var(--s1)}
.row-var dt{font-size:var(--t-xs);color:var(--muted);font-weight:600}.row-var dd{margin:0;font-weight:600}
.row-var .row-dur{display:block;font-weight:500}
.lunch-week li.today .row-name::after{content:" · heute";color:var(--accent-deep);font-weight:600}html[lang=en] .lunch-week li.today .row-name::after{content:" · today"}
.today-card{display:grid;gap:var(--s2)}.today-dish{font:var(--display-w) var(--t-xl)/1.25 var(--display);margin:0;max-width:30ch}
.meta-tel{font-weight:600;white-space:nowrap}
.jetzt-k{display:inline-block;font:700 var(--t-xs)/1 var(--body);text-transform:uppercase;color:var(--accent-ink);background:var(--accent);padding:var(--s1) var(--s2);border-radius:var(--r-btn);margin:0 0 var(--s3)}
.jetzt-rows{list-style:none;margin:var(--s3) 0;padding:0}.jetzt-rows li{padding:var(--s2) 0;border-top:var(--bw) solid var(--line)}
.fact-big{font:var(--display-w) var(--t-2xl)/1.15 var(--display);margin:0;max-width:24ch}.fact-big b{display:block;color:var(--accent-deep)}.fact-big span{font-size:var(--t-lg)}
.facts-inline{margin:0;font-size:var(--t-sm);color:var(--muted)}.facts-inline b{color:var(--ink)}
@media (max-width:374px){.index{grid-template-columns:minmax(0,1fr)}}
/* the action bar sizes its columns to the labels, which never wrap (RT3) */
.actionbar{grid-template-columns:minmax(0,1.4fr) minmax(0,1.3fr) auto}
.actionbar .btn{white-space:nowrap;padding-left:var(--s2);padding-right:var(--s2)}
@media (max-width:389px){.actionbar .btn{font-size:var(--t-sm)}}
/* headings never break inside a word (T12): site.js steps the size down when one word is wider than its column */
h1,h2,h3,.name,.ix-name,.size-n,.dish-n{overflow-wrap:normal;word-break:keep-all;hyphens:manual}
.name-trade{display:block;font-size:var(--t-2xl);line-height:1.1;margin-top:var(--s1)}
/* phones: the tailor's garment picture is a thumbnail beside the garment name, the price rows come first (round 5) */
@media (max-width:699px){
  .price-card{position:relative}
  .price-card>.pic{position:absolute;top:var(--s3);right:var(--s3);width:var(--thumb-l);height:var(--thumb-l);aspect-ratio:1/1!important;border-radius:var(--r2);margin:0}
  .price-card>.pic img{width:100%;height:100%;object-fit:cover}
  .price-card:has(>.pic) .pad>h2{min-height:var(--thumb-l);padding-right:calc(var(--thumb-l) + var(--s3));display:flex;align-items:center;margin-top:0}
}
.size-line{font-weight:600;margin:0 0 var(--s3)}
/* compact pre-order rows: name, description and price on the left, the quantity on the right (round 5) */
.pick-list li{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"pi pn q";padding:var(--s2) 0}
.pick-list .q{grid-area:q;align-self:center}
@media (max-width:859px){.page-head{padding:var(--s5) 0 var(--s4)}.page-head h1{font-size:var(--t-2xl)}.page-head .lead{font-size:var(--t-md);line-height:1.45}}  /* inner pages get to the first row sooner (round 5) */
.ba{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s3)}
.ba-fig{margin:0}.ba-fig figcaption{font-size:var(--t-sm);font-weight:600;margin-top:var(--s2)}
.nl-row.has-th{grid-template-columns:var(--thumb-s) auto minmax(0,1fr) auto;align-items:center}
.nl-pic{width:var(--thumb-s);height:var(--thumb-s);margin:0;border-radius:var(--r2);overflow:hidden}.nl-pic img{width:100%;height:100%;object-fit:cover}
/* the three-bouquet comparison stays a wide picture, with a label under each bouquet (Codex L6) */
html[data-trade] .cat-grid>.cat-pic.wide-pic{position:static;width:auto;height:auto;aspect-ratio:auto!important;border-radius:var(--r3);overflow:visible}
html[data-trade] .cat-grid>.cat-pic.wide-pic img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r3)}
html[data-trade] .cat-grid:has(>.cat-pic.wide-pic) .cat-head,html[data-trade] .cat-grid:has(>.cat-pic.wide-pic) .cat-body>.lead-s{padding-right:0;min-height:0}
.size-labels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);margin-top:var(--s2);text-align:center;font-size:var(--t-sm);line-height:1.3}
.size-labels b{display:block;font-weight:600}
.pick-list li:not(:has(.pi)){grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"pn q"}  /* quantity beside the product, also without a picture (Codex L6) */
.tags{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2)}.tag{white-space:nowrap}  /* a spice label never splits (T15) */
@media (min-width:860px){.tiles.n2{grid-template-columns:repeat(2,minmax(0,1fr))}.tiles.n1{grid-template-columns:minmax(0,1fr)}}  /* no empty column tracks (RT12) */
@media (min-width:390px){.hours-alt.one{white-space:nowrap}}@media (max-width:430px){.hours-alt{font-size:var(--t-xs)}}  /* the week stays on one line under the hero (RT13), from 390 px: the English week overflowed at 375 */
/* galleries with fewer pictures than columns: as many columns as pictures (QR10) */
.g-grid.n1{grid-template-columns:minmax(0,26rem)}
@media (min-width:768px){.g-grid.n2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1200px){.g-grid.n3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.contact-pic{max-width:var(--pic-w)}