/* =====================================================
   menu.css — styles owned by the menu view (views/menu.js).
   The baseline menu look (.hero .heroPhoto .srcline .probbox
   .numbers .typical .budgetrow .course .dish .addbtn .faqsec
   .menuFooter) lives in base.css and is NOT restyled here.
   Every class below is menu- prefixed.
   ===================================================== */

/* ---------- sticky category quick-nav ---------- */
.menu-quicknav{
  position:fixed;top:0;right:0;left:0;z-index:40;
  background:var(--veil);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  border-bottom:1px solid var(--ink);
  box-shadow:0 5px 16px rgba(28,25,21,.07);
  transform:translateY(-110%);
  visibility:hidden;
  transition:transform .28s ease, visibility .28s;
}
.menu-quicknav.menu-qn-show{transform:translateY(0);visibility:visible}
.menu-quicknav-in{
  max-width:980px;margin:0 auto;padding:0 26px; /* aligns with .wrap */
  display:flex;align-items:center;gap:2px;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.menu-quicknav-in::-webkit-scrollbar{display:none}
.menu-qn-name{
  font-family:"Frank Ruhl Libre",serif;font-size:13.5px;font-weight:700;
  white-space:nowrap;max-width:170px;overflow:hidden;text-overflow:ellipsis;
  padding:10px 0 10px 14px;margin-left:10px;border-left:1px solid var(--faint);
  flex-shrink:0;
}
.menu-qn{
  font-family:inherit;font-size:12.5px;letter-spacing:.3px;font-weight:400;
  color:var(--soft);background:none;border:none;border-bottom:2px solid transparent;
  padding:9px 11px 7px;cursor:pointer;white-space:nowrap;flex-shrink:0;
  display:inline-flex;align-items:center;gap:6px;
  transition:color .15s, border-color .15s;
}
.menu-qn-ico{width:15px;height:15px;color:var(--soft2);opacity:.7;flex-shrink:0;transition:color .15s,opacity .15s}
.menu-qn-ico svg{width:100%;height:100%;display:block}
.menu-qn-n{
  font-size:9.5px;font-weight:700;color:var(--soft);background:var(--faint2);
  border-radius:8px;padding:1px 5px;line-height:1.5;font-variant-numeric:tabular-nums;
  transition:color .15s,background .15s;
}
.menu-qn:hover{color:var(--ink)}
.menu-qn:hover .menu-qn-ico{opacity:1;color:var(--ink)}
.menu-qn.menu-qn-on{color:var(--acc);border-bottom-color:var(--acc)}
.menu-qn.menu-qn-on .menu-qn-ico{color:var(--acc);opacity:1}
.menu-qn.menu-qn-on .menu-qn-n{color:var(--paper);background:var(--acc)}

/* ---------- hero meta links (city / transparency) ---------- */
.menu-metalink{
  text-decoration:none;cursor:pointer;
  border-bottom:1px dotted var(--faint);
  transition:color .15s, border-color .15s;
}
.menu-metalink:hover{color:var(--acc);border-color:var(--acc)}

/* ---------- "התפריט במספרים" kicker ---------- */
.menu-numtitle{
  text-align:center;font-size:10.5px;letter-spacing:4px;
  color:var(--soft);font-weight:400;margin:26px 0 6px;
}

/* ---------- per-category median whisper in the course head ---------- */
.menu-medwhisper{
  font-size:10.5px;letter-spacing:1.5px;color:var(--soft);
  font-weight:400;white-space:nowrap;cursor:default;
}

/* ---------- table total + diners stepper in the typical line ---------- */
.menu-tablerow{
  display:inline-flex;align-items:center;gap:7px;
  margin-top:6px;flex-wrap:wrap;justify-content:center;
}
.menu-din{
  width:22px;height:22px;border-radius:50%;border:1px solid var(--faint);
  background:transparent;color:var(--soft);
  font-family:"Heebo",sans-serif;font-size:14px;line-height:1;cursor:pointer;
  transition:all .15s;
}
.menu-din:hover{border-color:var(--acc);color:var(--acc);transform:scale(1.1)}
.menu-dinN{
  min-width:18px;text-align:center;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;
}

/* ---------- budget checker: combo rows ---------- */
.menu-combos{
  margin-top:12px;display:flex;flex-direction:column;gap:8px;align-items:center;
}
.menu-combo{
  width:100%;max-width:560px;background:#fff;border:1px solid var(--faint);
  padding:9px 16px;text-align:right;font-size:13.5px;line-height:1.9;color:var(--soft);
}
.menu-combo b{color:var(--ink)}
.menu-combo.menu-combo-best{border-color:var(--ink);box-shadow:2px 2px 0 var(--faint)}
.menu-combo-tag{
  display:block;font-size:9.5px;letter-spacing:2.5px;color:var(--acc);margin-bottom:2px;
}

/* ---------- FAQ section head ---------- */
.menu-faqhead{display:flex;align-items:center;gap:18px;margin-bottom:10px}
.menu-faqhead h2{font-size:13.5px;letter-spacing:5px;font-weight:700;white-space:nowrap}
.menu-faqrule{flex:1;height:1px;background:var(--faint)}

/* ---------- footer action buttons styled like the footer links ---------- */
.menu-linkbtn{
  background:none;border:none;padding:0;font:inherit;letter-spacing:inherit;
  color:var(--acc);cursor:pointer;
}
.menu-linkbtn:hover{text-decoration:underline}

/* ---------- honest empty state ---------- */
.menu-empty{
  text-align:center;padding:50px 0;color:var(--soft);
  font-style:normal;font-size:17px;line-height:2.2;
}
.menu-empty-ink{width:70px;height:70px;margin:0 auto 14px;color:#c9c2b2}

/* ---------- keyboard focus ---------- */
.menu-qn:focus-visible,
.menu-din:focus-visible,
.menu-linkbtn:focus-visible,
.menu-metalink:focus-visible{
  outline:2px solid var(--acc);outline-offset:2px;border-radius:2px;
}

/* ---------- print: the sheet stays a clean document ---------- */
@media print{
  .menu-quicknav,.menu-din,.menu-linkbtn{display:none !important}
  .menu-combo.menu-combo-best{box-shadow:none}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .menu-quicknav{transition:none}
  .menu-din:hover{transform:none}
}

/* ---------- mobile (flawless at 390px) ---------- */
@media (max-width:640px){
  .menu-qn-name{display:none}
  .menu-quicknav-in{padding:0 16px} /* aligns with mobile .wrap */
  .menu-qn{padding:12px 7px 10px}
  .menu-combo{font-size:12.5px;padding:8px 12px}
}

/* (removed dead .menu-thumb rules — never emitted; dish media is .menu-photo / .menu-seal) */

/* ============================================================
   Menu-page detail additions (national context, tags, strip,
   corpus context, "לפני שיוצאים" panel)
   ============================================================ */

/* national price context per dish */
.menu-natl{font-size:12px;color:var(--soft);font-weight:300;margin:4px 46px 0 0;line-height:1.5}
.menu-natl b{color:var(--ink);font-weight:700}
.menu-natl a{color:var(--acc);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s;white-space:nowrap}
.menu-natl a:hover{border-color:var(--acc)}

/* dietary tags derived from published text */
.menu-tags{display:block;margin:5px 46px 0 0}
.menu-tag{
  display:inline-block;font-size:10.5px;letter-spacing:.5px;padding:2px 9px;margin-left:6px;
  border:1px solid var(--faint);border-radius:2px;color:var(--soft);background:#fff;
}
.menu-tag-vegan{border-color:#3d7a4f;color:#3d7a4f}
.menu-tag-veg{border-color:#3d7a4f;color:#3d7a4f}
.menu-tag-spicy{border-color:#9c3c30;color:#9c3c30}
.menu-tag-gf{border-color:#8a6a1e;color:#8a6a1e}

/* corpus context line */
.menu-context{
  max-width:680px;margin:10px auto 0;text-align:center;font-size:13.5px;color:var(--soft);font-weight:300;line-height:1.7;
}
.menu-context b{color:var(--ink);font-weight:700}
.menu-context a{color:var(--acc);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.menu-context a:hover{border-color:var(--acc)}

/* mini price-distribution strip */
.menu-ms{max-width:560px;margin:14px auto 0}
.menu-ms svg{display:block;width:100%;height:auto;overflow:visible}
.menu-ms-ax{stroke:var(--faint);stroke-width:1.4}
.menu-ms-dot{fill:var(--ink);opacity:.55}
.menu-ms-med{stroke:var(--acc);stroke-width:1.6}
.menu-ms-medlbl{font:700 11px "Heebo",sans-serif;fill:var(--acc)}
.menu-ms-end{font:400 10.5px "Heebo",sans-serif;fill:#8a8478;letter-spacing:.3px}

/* "לפני שיוצאים" panel */
.menu-beforego{
  max-width:560px;margin:22px auto 0;padding:18px 22px;background:#fff;
  border:1px solid var(--ink);box-shadow:3px 3px 0 var(--faint);
}
.menu-bg-title{font-size:13px;letter-spacing:5px;font-weight:700;text-align:center;margin-bottom:14px}
.menu-bg-row{display:flex;gap:11px;align-items:flex-start;padding:7px 0;border-top:1px solid var(--faint2);font-size:14.5px;line-height:1.6}
.menu-bg-row:first-of-type{border-top:none}
.menu-bg-ic{flex-shrink:0;width:20px;text-align:center;opacity:.85}
.menu-bg-row a{color:var(--acc);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.menu-bg-row a:hover{border-color:var(--acc)}
.menu-bg-open{color:#3d7a4f;font-weight:700}
.menu-bg-closed{color:#9c3c30;font-weight:700}
.menu-bg-note{color:#8a6a1e;font-weight:700}
.menu-bg-hnote{display:block;margin-top:5px;font-size:12px;color:var(--soft);font-weight:300;line-height:1.6}
.menu-bg-sub{font-size:13px;color:var(--soft);font-weight:300}
.menu-bg-hours-t{
  display:inline-block;margin-right:8px;font-family:"Heebo",sans-serif;font-size:12px;
  background:none;border:none;color:var(--acc);cursor:pointer;padding:0;
}
.menu-bg-hours{margin-top:8px;border:1px solid var(--faint2);border-radius:3px;overflow:hidden}
.menu-bg-hrow{display:flex;justify-content:space-between;padding:5px 12px;font-size:13px;color:var(--soft);font-weight:300;border-top:1px solid var(--faint2)}
.menu-bg-hrow:first-child{border-top:none}
.menu-bg-hrow-today{background:var(--faint2);color:var(--ink);font-weight:700}
.menu-bg-stamp{margin-top:12px;font-size:11px;color:var(--soft);font-weight:300;line-height:1.6;text-align:center;font-style:normal}
@media(max-width:640px){
  .menu-natl,.menu-tags{margin-right:0}
  .menu-beforego{padding:16px 16px}
}

/* ============================================================
   THE PRINTED-MENU CARD — the courses, framed like a real menu
   Warm cream stock · double-rule frame in the restaurant accent ·
   crest + fleuron masthead · centered menu-style section heads ·
   refined serif dish setting · "בתאבון" footer.
   ============================================================ */
.menu-card{
  position:relative;max-width:660px;margin:40px auto 0;
  padding:46px 48px 40px;
  background:#fdfaf2;                         /* the menu sheet: a shade brighter than the warm page, so it lifts */
  background-image:
    radial-gradient(rgba(120,100,60,.035) 1px, transparent 1px),
    radial-gradient(rgba(120,100,60,.03) 1px, transparent 1px);
  background-size:7px 7px, 11px 11px;
  background-position:0 0, 3px 4px;
  border:1px solid var(--ink);
  box-shadow:0 22px 55px rgba(28,25,21,.16), 0 1px 0 rgba(28,25,21,.5);
}
.menu-card::before{                          /* inner accent hairline — the classic double frame */
  content:'';position:absolute;inset:8px;pointer-events:none;
  border:1px solid color-mix(in srgb, var(--acc) 42%, transparent);
}
.menu-card::after{                           /* faint corner flourishes */
  content:'';position:absolute;inset:8px;pointer-events:none;
}

/* masthead */
.menu-card-head{text-align:center;margin-bottom:6px}
.menu-crest{width:50px;height:50px;margin:0 auto 12px;opacity:.9}
.menu-card-kicker{font-size:11.5px;letter-spacing:7px;color:var(--soft);font-weight:500;margin-right:-7px}
.menu-cardname{
  font-family:"Frank Ruhl Libre","David Libre",serif;
  font-size:clamp(28px,5.2vw,40px);font-weight:700;letter-spacing:.5px;line-height:1.12;margin-top:8px;
}
.menu-cuisine{font-size:12px;letter-spacing:3.5px;color:var(--soft);font-weight:400;margin-top:9px;margin-right:-3.5px}
.menu-fleuron{display:block;width:170px;height:20px;margin:16px auto 4px;stroke:var(--acc);fill:var(--acc)}
.menu-fleuron line{stroke:var(--acc);stroke-width:1}
.menu-fleuron path[fill="none"]{stroke:var(--acc);stroke-width:1}

/* section (course) headers, menu style: centered, letter-spaced, short accent rules */
.menu-card .course{margin-top:40px}
.menu-card .course:first-of-type{margin-top:30px}
.menu-card .course .head{justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:6px}
.menu-card .course .head h2{
  font-size:16px;letter-spacing:6px;font-weight:700;margin-right:-6px;
}
.menu-card .course .head .rule{flex:0 1 66px;height:1px;background:var(--acc);opacity:.45}
.menu-card .menu-medwhisper{
  flex-basis:100%;order:5;text-align:center;margin:2px 0 12px;
  font-size:11.5px;letter-spacing:1px;color:var(--soft);font-weight:300;
}

/* the dishes, set like a menu — one elegant reading column so names
   (including long English ones) sit on one baseline with a proper dotted leader */
.menu-card .items{columns:1;max-width:520px;margin:0 auto}
.menu-card .dish{padding:12px 2px 14px}
.menu-card .dish:hover{background:transparent}      /* a printed menu doesn't light up */
.menu-card .dish .nm{font-size:18px;font-weight:600;letter-spacing:.15px;color:var(--ink);flex:0 1 auto}
.menu-card .dish:hover .nm{color:var(--ink)}
.menu-card .dish .pr{font-family:"Frank Ruhl Libre",serif;font-weight:600;font-size:17px}
.menu-card .dish .pr.na{font-family:"Heebo",sans-serif}
.menu-card .dish .dots{border-bottom:1px dotted color-mix(in srgb, var(--ink) 32%, transparent);transform:translateY(-5px)}
.menu-card .dish .ds{
  font-family:"Frank Ruhl Libre",serif;font-size:14px;line-height:1.62;font-weight:300;
  color:#6d6459;margin-top:5px;margin-right:46px;
}
.menu-card .dish .seal{opacity:.72}
.menu-card .dish .star{color:var(--acc)}
.menu-card .addbtn{opacity:.38;transition:opacity .18s, background .18s, transform .18s}
.menu-card .dish:hover .addbtn,.menu-card .addbtn:focus-visible{opacity:1}

/* footer */
.menu-card-foot{text-align:center;margin-top:38px}
.menu-foot-word{font-family:"Frank Ruhl Libre",serif;font-size:21px;letter-spacing:5px;color:var(--acc);margin-top:6px;margin-right:-5px}
.menu-foot-stamp{font-size:11px;letter-spacing:1.5px;color:var(--soft);font-weight:300;margin-top:9px}

@media(max-width:640px){
  .menu-card{padding:32px 22px 30px;margin-top:28px}
  .menu-card::before{inset:6px}
  .menu-card .dish .ds{margin-right:0}
}
@media print{
  .menu-card{box-shadow:none;background:#fff;border-color:#000}
  .menu-card::before{border-color:#000}
  .menu-card .addbtn{display:none}
}

/* ============================================================
   MENU-AS-STAGE — the menu is the main act. Compact top bar for
   orientation · cover photo · menu card centre-stage · practical
   info to the side (sticky) · the archive dossier below.
   ============================================================ */
.menu-top{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding:8px 0 2px}
.menu-top .back{font-size:13px;color:var(--soft);text-decoration:none;font-weight:300;white-space:nowrap}
.menu-top .back:hover{color:var(--acc)}
.menu-topmeta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;color:var(--soft);font-weight:300}
.menu-topmeta a{color:var(--soft);text-decoration:none;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.menu-topmeta a:hover{color:var(--acc);border-color:var(--acc)}
.menu-topmeta .transtag{color:var(--acc)}
.menu-topicon{width:18px;height:18px;border-radius:4px;vertical-align:middle;margin-left:2px}

/* cover photo — the source image, framed like a menu's cover PLATE. Centred and
   capped to the menu-card width so it caps the menu instead of spanning full width
   (heterogeneous source images: object-position centre keeps the subject in frame). */
.menu-cover{
  max-width:640px;margin:22px auto 0;position:relative;
  border:1px solid var(--ink);padding:7px;background:var(--card);box-shadow:6px 6px 0 var(--faint);
}
.menu-cover::after{                          /* thin ceramic inner frame — a plate edge */
  content:"";position:absolute;inset:11px;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--acc) 34%,transparent);
}
.menu-cover img{
  width:100%;height:234px;object-fit:cover;object-position:center;display:block;
  filter:grayscale(.3) sepia(.05) contrast(1.02);transition:filter .5s;
}
.menu-cover:hover img{filter:none}
.menu-cover figcaption{font-size:10.5px;color:var(--soft);letter-spacing:.5px;padding:8px 4px 2px;font-weight:300;text-align:center}
.menu-cover figcaption a{color:var(--acc);text-decoration:none}
@media(max-width:640px){.menu-cover{padding:5px}.menu-cover::after{inset:9px}.menu-cover img{height:176px}}

/* the stage */
.menu-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:38px;align-items:start;margin-top:26px}
.menu-main{min-width:0}
.menu-aside{position:sticky;top:16px}
.menu-aside .menu-beforego{margin-top:0;max-width:none}
@media(max-width:900px){
  .menu-layout{grid-template-columns:1fr;gap:0}
  .menu-aside{position:static;margin-top:24px}
}

/* the dossier, below the menu */
.menu-dossier{max-width:720px;margin:64px auto 0;border-top:1px solid var(--faint)}
.menu-dossier-head{display:flex;align-items:center;justify-content:center;gap:16px;margin:30px 0 20px}
.menu-dossier-head h2{font-size:14px;letter-spacing:6px;font-weight:700;color:var(--ink);white-space:nowrap;margin-right:-6px}
.menu-dossier-head .rule{flex:0 1 90px;height:1px;background:var(--faint)}
.menu-dossier .menu-numtitle{margin-top:20px}
.menu-dossier .srcline{margin-top:0}

/* wider single column now that dishes may carry media */
.menu-card .items{max-width:600px}

/* dish media — EVERY dish is a small framed "plate": a real source photo when we have
   one, otherwise a generative seal. Uniform footprint = a catalogue of plates (Wolt study:
   uniform tiles set the rhythm). Enlarge by TAP/CLICK (lightbox), not hover-zoom. */
.menu-card .dish{display:flex;gap:16px;align-items:flex-start}
.menu-card .dish-body{flex:1;min-width:0}
.menu-card .dish-media{position:relative;width:104px;height:104px;flex-shrink:0;margin-top:3px;border-radius:3px}
.menu-card .menu-seal{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:.6}
.menu-card .menu-seal svg{width:78px;height:78px}
/* a seal-only dish still reads as a mounted plate: faint ceramic mount + hairline frame */
.menu-card .dish-media.seal-only{
  background:color-mix(in srgb, var(--acc) 5%, var(--card));
  border:1px solid var(--faint);box-shadow:var(--lift);
}
.menu-card .dish-media.seal-only .menu-seal{opacity:.72}
/* photo plate: ink frame + ceramic inner rule (mount), grayscale at rest → full colour on
   row hover/focus, click to enlarge. No scale-on-hover (broke on touch). */
.menu-card .menu-photo{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;
  border:1px solid var(--ink);border-radius:3px;background:var(--card);cursor:zoom-in;
  box-shadow:0 5px 16px rgba(28,25,21,.16), inset 0 0 0 3px var(--card), inset 0 0 0 4px color-mix(in srgb,var(--acc) 30%,transparent);
  filter:grayscale(.28) sepia(.05) contrast(1.02);
  transition:filter .35s, box-shadow .35s;
}
.menu-card .dish:hover .menu-photo,.menu-card .menu-photo:focus-visible{
  filter:none;
  box-shadow:0 9px 24px rgba(28,25,21,.28), inset 0 0 0 3px var(--card), inset 0 0 0 4px color-mix(in srgb,var(--acc) 48%,transparent);
}
.menu-card .menu-photo:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.menu-card .dish .ds{margin-right:0}
@media(max-width:640px){
  .menu-card .dish-media{width:88px;height:88px}
  .menu-card .menu-seal svg{width:64px;height:64px}
}

/* dish-body flush alignment (media column already provides the indent) */
.menu-card .menu-natl,.menu-card .menu-tags{margin-right:0}

/* ============================================================
   Research-grounded craft (deep-research 2026-07-08):
   · Hebrew has NO italic — quiet voice = tracking + soft ink
   · tabular numerals in the price column (a typeset column)
   · semantic fleuron ❦ dividing courses (hedera, historic use)
   · colophon per issue (the archive-as-journal imprint)
   ============================================================ */
/* tabular price column — units line up vertically like a set menu */
.menu-card .dish .pr{font-variant-numeric:tabular-nums;letter-spacing:.3px}

/* fleuron between courses — a section mark with a job, not decoration */
.menu-card .course + .course::before{
  content:"❦";display:block;text-align:center;color:var(--acc);
  font-size:16px;line-height:1;opacity:.6;margin:6px 0 22px;
}

/* colophon */
.menu-colophon{
  max-width:440px;margin:12px auto 0;text-align:center;
  font-size:10.5px;letter-spacing:1px;line-height:1.75;color:var(--soft);font-weight:300;
}

/* the "quiet voice" that replaced italic: descriptions get gentle tracking + faded ink,
   a genuinely lighter register than the dish name (research: two real forms, never a slant) */
.menu-card .dish .ds{letter-spacing:.15px;color:#6f665a}

/* ============================================================
   Deep-research features (2026-07-08): micrography crest,
   secondary Hebrew hand for descriptions, never-deleted
   archive timeline, consumer-rights note.
   ============================================================ */
.menu-crest{width:68px;height:68px}
.menu-crest .micro{width:100%;height:100%;display:block}
/* masthead logo — the real brand mark in a circular ceramic medallion (accent-tinted
   ground), replacing the woven seal when a logo exists. Circular so crestInscribe fits. */
.menu-crest.has-logo{width:84px;height:84px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--brand),0 4px 15px rgba(28,25,21,.17)}
.menu-crest-logo{max-width:64%;max-height:64%;object-fit:contain}
/* provenance wax-seal — circular rubber-stamp corner ornament (real metadata only) */
.menu-card{position:relative}
.provseal{position:absolute;top:16px;left:16px;width:84px;height:84px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-6deg);color:var(--brand);pointer-events:none;opacity:.9;z-index:3;text-align:center}
.provseal .ps-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--brand);box-shadow:inset 0 0 0 3px rgba(122,31,43,.22)}
.provseal .ps-t1{font-size:8.5px;letter-spacing:2px;font-weight:600}
.provseal .ps-date{font-family:"Frank Ruhl Libre","David Libre",serif;font-weight:800;font-size:16px;line-height:1;margin:1px 0}
.provseal .ps-t2{font-size:7.5px;letter-spacing:1.5px;font-weight:600}
@media (max-width:600px){.provseal{width:64px;height:64px;top:10px;left:10px}.provseal .ps-date{font-size:12px}.provseal .ps-t1{font-size:7px}.provseal .ps-t2{font-size:6px}}
/* related-menus rail + record-completeness meter */
.menu-related{margin-top:36px}
.menu-related-rail{display:flex;gap:16px;overflow-x:auto;padding:6px 2px 14px;scroll-snap-type:x proximity}
.menu-related-rail .rcard{min-width:234px;max-width:250px;flex:0 0 auto;scroll-snap-align:start}
.menu-complete{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:6px 0 14px}
.menu-complete .cm-k{font-weight:700;letter-spacing:1px;color:var(--soft);font-size:11px}
.menu-complete .cm-i{background:var(--faint2);border-radius:3px;padding:2px 9px;font-size:12px;color:var(--soft)}
.menu-complete .cm-i b{color:var(--ink)}
.menu-complete .cm-yes{color:var(--acc4,#2e6b45);background:color-mix(in srgb,var(--acc4,#2e6b45) 10%,var(--paper))}

/* descriptions in the "quiet voice": the SAME serif at a light weight, with gentle
   tracking and faded ink — a lighter register than the dish name, the way a printed
   menu differentiates when the script (Hebrew) has no italic. Two fonts only. */
.menu-card .dish .ds{
  font-family:var(--serif);font-weight:300;
  font-size:15px;line-height:1.7;color:#6b6154;letter-spacing:.15px;
}

/* never-deleted dated archive — "התפריט לאורך השנים" */
.menu-timeline{max-width:600px;margin:16px auto 0;padding:13px 20px;border:1px solid var(--faint);background:var(--card);text-align:center}
.menu-tl-title{display:block;font-size:11px;letter-spacing:4px;color:var(--soft);margin-bottom:7px}
.menu-tl-pt{display:block;font-size:14px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.menu-tl-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acc);margin-left:6px;vertical-align:middle}
.menu-tl-note{display:block;font-size:11.5px;color:var(--soft);font-weight:300;line-height:1.75;margin-top:7px}

/* consumer-rights note in the "before you go" panel */
.menu-bg-rights{margin-top:12px;padding-top:11px;border-top:1px solid var(--faint2);font-size:12px;line-height:1.75;color:var(--soft);font-weight:300}
.menu-bg-rights a{color:var(--acc);text-decoration:none;white-space:nowrap;border-bottom:1px solid transparent}
.menu-bg-rights a:hover{border-color:var(--acc)}

/* ============================================================
   Per-restaurant typographic ENVELOPE + material craft
   (blind emboss · tile corners · bound spine on the binding edge)
   NOTE: no overflow:hidden on .menu-card — the dish hover-enlarge
   must be free to overflow.
   ============================================================ */
.menu-card-head{position:relative}
.menu-cardname{text-shadow:0 1px 0 rgba(255,255,255,.6), 0 -1px 0 rgba(28,25,21,.05)}   /* blind emboss */
.menu-foot-word{text-shadow:0 1px 0 rgba(255,255,255,.55)}

/* bound "spine" on the right (RTL binding) edge of the sheet */
.menu-card::after{
  content:"";position:absolute;top:0;bottom:0;right:0;width:7px;pointer-events:none;
  background:linear-gradient(90deg, color-mix(in srgb,var(--acc) 30%,transparent), color-mix(in srgb,var(--acc) 5%,transparent) 62%, transparent);
  border-left:1px solid color-mix(in srgb,var(--acc) 20%,transparent);
}
/* Armenian-tile corner squares flanking the masthead */
.menu-card-head::before,.menu-card-head::after{
  content:"";position:absolute;top:-30px;width:6px;height:6px;transform:rotate(45deg);
  background:var(--acc);opacity:.45;
}
.menu-card-head::before{right:-30px}
.menu-card-head::after{left:-30px}

/* the three envelopes — same honest text, different stock & voice */
.menu-env-fine{background:#fdfaf2}                                   /* chef / known: a bright fresh sheet */
.menu-env-market{                                                    /* market / street-food: warm kraft stock */
  background:#f4ebd6;
  background-image:radial-gradient(rgba(120,90,40,.05) 1px,transparent 1px),radial-gradient(rgba(120,90,40,.038) 1px,transparent 1px);
}
.menu-env-market .menu-cardname{font-weight:900;letter-spacing:1px}
.menu-env-market .menu-card-kicker{color:color-mix(in srgb,var(--acc) 65%, var(--soft))}
.menu-env-chain{background:#fbf8f0;background-image:none}            /* chain: cleaner, flatter, crisper */
.menu-env-chain .menu-cardname{letter-spacing:.5px}
@media print{.menu-card::after{display:none}.menu-cardname{text-shadow:none}}

/* inline semantic marks beside the dish name — drawn line-icons in natural colour
   (chili red / sprout green / wheat ochre), a printed-menu symbol, not a UI pill */
.menu-mark{display:inline-flex;vertical-align:-.16em;margin-right:4px}
.menu-mark .ico{width:.92em;height:.92em;stroke-width:1.55}
.menu-mark-spicy{color:#b23a2c}
.menu-mark-vegan,.menu-mark-veg{color:#3d7a4f}
.menu-mark-gf{color:#8a6a1e}
/* keep prices/medians bidi-isolated so "₪48" never flips against Hebrew */
.pr,.dp,.idx-geo-med,.menu-ms-medlbl{unicode-bidi:isolate}

/* ============================================================
   Drawn-icon integration for the practical panel + polychrome
   ceramic touches (task: official icons + more colour)
   ============================================================ */
/* "לפני שיוצאים" lead icons carry the restaurant's ceramic accent */
.menu-bg-ic{opacity:1}
.menu-bg-ic .ico{width:18px;height:18px;stroke-width:1.55;color:var(--acc)}
/* social links: brand glyph + label, tidy separators */
.menu-bg-socs{display:inline-flex;align-items:center;flex-wrap:wrap;gap:2px}
.menu-bg-soc{display:inline-flex;align-items:center;gap:5px}
.menu-bg-soc .ico{width:15px;height:15px;color:var(--acc)}
.menu-bg-dot{margin:0 7px;color:var(--faint)}
/* consumer-rights scales */
.menu-rights-ico{width:15px;height:15px;color:var(--acc);vertical-align:-.22em;margin-left:3px}
/* footer action-button icons sit on the accent text */
.menuFooter .ico{width:1.05em;height:1.05em;vertical-align:-.16em;margin-right:2px}
/* two-tone Armenian-tile corners: restaurant accent + ceramic turquoise */
.menu-card-head::after{background:var(--acc2)}

/* ============================================================
   MOTION + RICHNESS (2026-07-09) — the menu is never blank and
   it comes alive: identity watermark, course emblems, staggered
   dishes, self-inscribing crest, count-up stats, accession stamp,
   ken-burns cover. ALL motion gated by prefers-reduced-motion.
   ============================================================ */

/* the sheet's own identity seal, watermarked huge and faint behind the courses —
   fills what read as empty space, and it's generated from the real restaurant name.
   z-index:-1 + isolation on the card keeps it above the paper, below every dish, and
   does NOT trap the dish hover-zoom in a stacking context. */
.menu-card{isolation:isolate}
.menu-watermark{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(86%,520px);opacity:.08;pointer-events:none;z-index:-1;
}
.menu-watermark svg{width:100%;height:auto;display:block}

/* a small ink emblem in each course header, chosen from the category type */
.menu-course-ico{width:21px;height:21px;color:var(--acc);opacity:.66;flex-shrink:0}
.menu-course-ico svg{width:100%;height:100%;display:block}
@media(max-width:640px){.menu-course-ico{width:17px;height:17px}}

/* the whole course is always present; its DISHES write themselves in on load,
   staggered — as a pure CSS animation. Crucially this does NOT depend on scroll or
   an IntersectionObserver, so the menu is NEVER left blank: worst case (no animation
   support) the dishes simply show at full opacity. This replaced an observer-gated
   reveal that could leave the whole menu invisible if the observer was throttled. */
.menu-card .course{opacity:1;transform:none;transition:none}
.menu-card .dish{animation:dishIn .5s ease both;animation-delay:min(calc(var(--i,0) * 45ms), 480ms)}
@keyframes dishIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}

/* dish-name ink underline, drawn on hover (RTL: grows from the right) */
.menu-card .dish .nm{position:relative}
.menu-card .dish .nm::after{
  content:"";position:absolute;right:0;bottom:-2px;height:1px;width:0;
  background:var(--acc);opacity:.6;transition:width .3s ease;
}
.menu-card .dish:hover .nm::after{width:100%}

/* accession rubber-stamp in the colophon — "presses in" when scrolled to */
.menu-stamp{
  display:inline-block;margin-top:15px;padding:6px 15px 5px;transform:rotate(-6deg);
  border:2px solid var(--acc);border-radius:5px;color:var(--acc);opacity:.58;
  line-height:1.25;text-align:center;
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--acc) 32%,transparent);
}
.menu-stamp span{display:block;font-size:8px;letter-spacing:3px}
.menu-stamp b{display:block;font-size:12px;letter-spacing:1.4px;font-weight:700;font-variant-numeric:tabular-nums}
.menu-stamp.stamped{animation:stampIn .52s cubic-bezier(.2,1.5,.4,1)}
@keyframes stampIn{0%{opacity:0;transform:rotate(-17deg) scale(1.55)}55%{opacity:.6}100%{opacity:.58;transform:rotate(-6deg) scale(1)}}

/* the crest inscribes itself — ink spreading from the centre — on load */
.menu-crest{animation:crestInscribe 1.15s cubic-bezier(.2,.75,.2,1) both}
@keyframes crestInscribe{
  0%{opacity:0;clip-path:circle(0% at 50% 50%);transform:rotate(-22deg)}
  60%{opacity:1}
  100%{opacity:1;clip-path:circle(120% at 50% 50%);transform:rotate(0)}
}
/* the fleurons wipe open from the centre, like a rule being drawn */
.menu-fleuron{animation:fleuronWipe .9s .2s cubic-bezier(.4,0,.2,1) both}
@keyframes fleuronWipe{from{clip-path:inset(0 50% 0 50%);opacity:0}to{clip-path:inset(0 0 0 0);opacity:1}}

/* the cover settles from a gentle zoom (Ken Burns) */
.menu-cover img{animation:kenBurns 9s ease-out both}
@keyframes kenBurns{from{transform:scale(1.09)}to{transform:scale(1)}}

@media (prefers-reduced-motion: reduce){
  .menu-card .dish{animation:none !important;opacity:1 !important;transform:none !important}
  .menu-crest,.menu-fleuron,.menu-cover img,.menu-stamp{animation:none !important}
  .menu-crest{clip-path:none}
  .menu-fleuron{clip-path:none}
}

/* ============================================================
   Wolt-informed VISUAL layer (2026-07-09): honest signature
   strip, tap/click lightbox, sticky-nav scroll-margin. Nothing
   here fabricates data — photos are real, captions are computed.
   ============================================================ */

/* "מן התפריט" — honest signature plates (photo-rich menus only) */
.menu-signature{margin:6px 0 30px;position:relative;z-index:1}
.menu-sig-head{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:5px}
.menu-sig-head h2{font-size:12px;letter-spacing:5px;font-weight:700;white-space:nowrap;margin-right:-5px}
.menu-sig-head .rule{flex:0 1 54px;height:1px;background:var(--acc);opacity:.45}
.menu-sig-sub{text-align:center;font-size:10.5px;letter-spacing:.3px;color:var(--soft);font-weight:300;margin-bottom:14px}
.menu-sig-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 2px 10px;scrollbar-width:thin}
.menu-sig-rail::-webkit-scrollbar{height:7px}
.menu-sig-plate{flex:0 0 auto;width:150px;scroll-snap-align:start;text-align:center}
.menu-sig-plate img{
  width:150px;height:112px;object-fit:cover;display:block;cursor:zoom-in;
  border:1px solid var(--ink);border-radius:3px;background:var(--card);
  box-shadow:0 6px 16px rgba(28,25,21,.16), inset 0 0 0 3px var(--card), inset 0 0 0 4px color-mix(in srgb,var(--acc) 30%,transparent);
  filter:grayscale(.24) sepia(.05);transition:filter .35s;
}
.menu-sig-plate img:hover,.menu-sig-plate img:focus-visible{filter:none}
.menu-sig-plate figcaption{margin-top:8px;display:flex;flex-direction:column;gap:1px;padding:0 2px}
.menu-sig-nm{font-family:var(--serif);font-size:13.5px;font-weight:600;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-sig-pr{font-family:var(--serif);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.menu-sig-cap{font-size:10px;letter-spacing:.2px;color:var(--soft);font-weight:300}
@media(max-width:640px){.menu-sig-plate,.menu-sig-plate img{width:132px}.menu-sig-plate img{height:99px}}

/* lightbox — a photo enlarged as an archived exhibit (tap/click; Esc/backdrop to close) */
.menu-lightbox{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px}
.menu-lb-backdrop{position:absolute;inset:0;background:rgba(28,25,21,.82);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.menu-lb-fig{position:relative;z-index:1;max-width:min(92vw,900px);max-height:88vh;margin:0;text-align:center;cursor:zoom-out}
.menu-lb-fig img{max-width:100%;max-height:78vh;object-fit:contain;display:block;margin:0 auto;border:1px solid rgba(253,252,248,.5);background:#0e0d0b;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.menu-lb-fig figcaption{margin-top:12px;color:var(--paper);font-size:12px;letter-spacing:.5px;font-weight:300}
.menu-lb-close{position:absolute;top:16px;left:16px;z-index:2;width:40px;height:40px;border-radius:50%;border:1px solid rgba(253,252,248,.5);background:rgba(28,25,21,.45);color:var(--paper);font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.menu-lb-close:hover{background:rgba(28,25,21,.75)}
@media (prefers-reduced-motion: no-preference){
  .menu-lightbox:not([hidden]) .menu-lb-fig{animation:lbIn .3s ease both}
  @keyframes lbIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
}

/* sticky quick-nav: don't let an anchored course hide under the bar */
.menu-card .course{scroll-margin-top:56px}

/* ============================================================
   Calorie ESTIMATE (heuristic, NOT from source) — deliberately
   styled APART from the real numbers: ochre + dashed + "הערכה"
   tag, so the price stays the ink-solid truth and calories read
   as the estimate they are. (Eden-approved, always ≈/הערכה.)
   ============================================================ */
/* the "הערכה" chip, shared by the summary + dish-page note */
.menu-cal-tag{font-size:9px;letter-spacing:1px;color:#8a6a1e;border:1px solid color-mix(in srgb,#8a6a1e 40%,transparent);border-radius:2px;padding:0 4px;margin-right:5px;vertical-align:1px;white-space:nowrap}

/* ---- per-dish NUTRITION estimate: a COMPACT soft-ochre card. Collapsed = one
       tight line (kcal + composition bar + «הערכה» + «פירוט»); the P/C/F grams +
       derivation open on demand, so the menu stays light. ---- */
.nutri{
  display:flex;align-items:center;flex-wrap:wrap;gap:5px 9px;
  margin-top:9px;padding:5px 10px 6px;
  background:linear-gradient(180deg,color-mix(in srgb,#8a6a1e 5.5%,transparent),color-mix(in srgb,#8a6a1e 2.5%,transparent));
  border:1px solid color-mix(in srgb,#8a6a1e 14%,transparent);
  border-radius:8px;
}
.nutri-kcal{white-space:nowrap;display:inline-flex;align-items:baseline;gap:3px}
.nutri-kcal b{font-weight:800;font-size:14px;color:#8a6a1e;font-variant-numeric:tabular-nums;letter-spacing:.2px}
.nutri-kcal i{font-style:normal;font-size:9px;color:var(--soft);letter-spacing:.8px;font-weight:500}
.nutri-bar{display:inline-flex;width:56px;height:5px;border-radius:3px;overflow:hidden;background:color-mix(in srgb,#8a6a1e 12%,var(--card));flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(28,25,21,.05)}
.nutri-bar i{height:100%;display:block}
.nutri-bar i+i{box-shadow:inset 1px 0 0 0 color-mix(in srgb,var(--card) 85%,transparent)}
.nb-p{background:#2e6b45}.nb-c{background:#c08a24}.nb-f{background:#a3532a}
.nutri-tag{font-size:7.5px;letter-spacing:1.5px;color:#8a6a1e;background:color-mix(in srgb,#8a6a1e 10%,transparent);border-radius:3px;padding:1px 5px;white-space:nowrap;font-weight:600}
.nutri-how{background:none;border:none;font:inherit;font-size:10px;color:var(--soft2);cursor:pointer;letter-spacing:.3px;position:relative;padding:0 0 0 12px}
.nutri-how::after{content:'▾';position:absolute;left:0;top:1px;font-size:8px;transition:transform .2s}
.nutri-how:hover{color:#8a6a1e}
.nutri-how-open::after{transform:rotate(180deg)}
.nutri-detail{flex-basis:100%;margin-top:4px;padding-top:7px;border-top:1px dashed color-mix(in srgb,#8a6a1e 28%,transparent)}
.nutri-detail .nutri-facts{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:7px}
.nf{font-size:11px;color:var(--soft);font-weight:400;white-space:nowrap;letter-spacing:.2px;display:inline-flex;align-items:center}
.nf::before{content:'';width:6px;height:6px;border-radius:50%;margin-left:5px;flex-shrink:0}
.nf-p::before{background:#2e6b45}.nf-c::before{background:#c08a24}.nf-f::before{background:#a3532a}
.nf b{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;margin-left:3px;color:var(--ink)}
.nutri-expl{display:block;font-size:11.5px;line-height:1.75;color:var(--soft);font-weight:300}
.nutri-detail b{color:#8a6a1e;font-weight:700}
.nutri-detail a{color:var(--acc);text-decoration:none;white-space:nowrap}
@media(max-width:640px){.nutri{gap:5px 8px;padding:5px 9px}.nutri-detail .nutri-facts{gap:10px}}
/* calorie summary block (dossier) */
.menu-calsum{max-width:600px;margin:16px auto 0;padding:12px 18px;border:1px dashed color-mix(in srgb,#8a6a1e 40%,transparent);border-radius:3px;background:color-mix(in srgb,#8a6a1e 4%,var(--card));text-align:center}
.menu-calsum-h{font-size:11px;letter-spacing:3px;color:#8a6a1e;font-weight:500;margin-bottom:6px}
.menu-calsum-b{font-size:13px;color:var(--soft);font-weight:300;line-height:1.85}
.menu-calsum-b b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.menu-calsum-note{font-size:10.5px;color:var(--soft);font-weight:300;margin-top:7px;line-height:1.6}
.menu-calsum-note a{color:var(--acc);text-decoration:none}
/* budget-combo calorie tail */
.menu-combo-cal{color:#8a6a1e;font-weight:400;font-size:12px;font-variant-numeric:tabular-nums}

/* per-course contact sheet — a thin thumbnail rail + honest coverage caption */
.menu-contactsheet{margin:2px auto 18px;max-width:600px}
.menu-cs-rail{display:flex;gap:7px;overflow-x:auto;scroll-snap-type:x proximity;padding:2px 0 6px;scrollbar-width:thin}
.menu-cs-rail::-webkit-scrollbar{height:6px}
.menu-cs-thumb{
  flex:0 0 auto;width:52px;height:52px;object-fit:cover;scroll-snap-align:start;cursor:zoom-in;
  border:1px solid var(--ink);border-radius:2px;background:var(--card);
  box-shadow:inset 0 0 0 2px var(--card);filter:grayscale(.3) sepia(.05);transition:filter .3s, transform .2s;
}
.menu-cs-thumb:hover,.menu-cs-thumb:focus-visible{filter:none;transform:translateY(-2px)}
.menu-cs-thumb:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.menu-cs-cap{text-align:center;font-size:10px;letter-spacing:.4px;color:var(--soft);font-weight:300;margin-top:3px}

/* price-vs-national-median tick under natlLine (visual encoding of the same numbers) */
.menu-natl-tick{display:block;width:132px;height:16px;margin-top:5px;overflow:visible}
.nt-ax{stroke:var(--faint);stroke-width:1.4}
.nt-med{stroke:var(--soft);stroke-width:1.4}
.nt-dot{fill:var(--acc)}

/* wide-screen "SPREAD": the sheet widens and dishes set in two columns, like a large
   printed bill of fare — Wolt's 2-col grid translated to the editorial sheet. Menu route only. */
@media (min-width:1200px){
  body.menu-route .wrap{max-width:1240px}
  body.menu-route .menu-quicknav-in{max-width:1240px}
  .menu-card{max-width:940px}
  .menu-card .items{columns:2;column-gap:46px;column-rule:1px solid var(--faint);max-width:none}
  .menu-card .dish{break-inside:avoid;-webkit-column-break-inside:avoid}
  .menu-signature,.menu-contactsheet{max-width:none}
}
