/* ============================================================
   SATAF · v2 — רק מה שנדרש לשינויי המבנה מפגישת 04.08.
   ללא שינויי שפה עיצובית: אין טקסטורות, אין צבעי סניפים,
   אין שינוי רקעים או גבהים. הכל בנוי על הרכיבים של staf.css.
   ============================================================ */

/* ---------- 1 · הלוגו האמיתי במקום הוורדמארק הטקסטואלי ---------- */
.nav-logo.wordmark{font-size:0;letter-spacing:0;padding:0;display:inline-flex;align-items:center}
.nav-logo.wordmark::before{
  content:"";display:block;width:126px;height:42px;
  background:url("../img/logo-light.png") center/contain no-repeat;transition:.4s var(--ease)}
header.nav.solid .nav-logo.wordmark::before{background-image:url("../img/logo-dark.png")}
@media(max-width:600px){.nav-logo.wordmark::before{width:100px;height:33px}}

.drawer .d-logo{font-size:0;letter-spacing:0;display:inline-block;width:118px;height:40px;
  background:url("../img/logo-dark.png") center/contain no-repeat}
footer.site .f-word{font-size:0;letter-spacing:0;display:block;width:184px;height:60px;
  background:url("../img/logo-dark.png") center/contain no-repeat;margin-bottom:6px}

.hero .h-word{font-size:0;letter-spacing:0;margin-bottom:0;display:flex;justify-content:center}
.hero .h-word::before{content:"";display:block;width:min(440px,72vw);height:min(148px,24vw);
  background:url("../img/logo-light.png") center/contain no-repeat;
  filter:drop-shadow(0 4px 30px rgba(0,0,0,.45))}
.hero.short .h-word{font-size:0}
.hero.short .h-word::before{width:min(310px,54vw);height:min(104px,18vw)}

/* ---------- 2 · כפתור הזמנה צף (בקשת דורון: שמאל, מעל הנגישות) ---------- */
.order-fab{position:fixed;bottom:84px;inset-inline-end:16px;z-index:109;
  display:inline-flex;align-items:center;gap:10px;
  background:var(--ink);color:var(--paper);border:1px solid var(--gold);
  padding:12px 20px;border-radius:100px;cursor:pointer;text-decoration:none;
  font-family:'Cormorant Garamond',serif;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;font-size:.8rem;white-space:nowrap;
  box-shadow:0 10px 30px rgba(33,29,21,.34);transition:.35s var(--ease)}
.order-fab:hover{background:var(--gold-deep);border-color:var(--gold-deep);transform:translateY(-2px)}
html[dir=rtl] .order-fab{font-family:'Frank Ruhl Libre',serif;font-weight:700;
  letter-spacing:.02em;text-transform:none;font-size:.92rem}
@media(max-width:600px){.order-fab{bottom:76px;padding:10px 16px;font-size:.86rem}}
html.a11y-panel-open .order-fab{opacity:0;pointer-events:none}

.drawer nav a.d-order{background:var(--ink);color:var(--paper);text-align:center;border-radius:3px;
  margin-top:18px;border-bottom:none;padding:14px 0;font-size:1.35rem}
.drawer nav a.d-order:hover{background:var(--gold-deep);color:#fff;padding-inline-start:0}

/* ---------- 3 · המפעל — משתמש ברכיב .chef הקיים ---------- */
.chef .c-sub{font-family:'Cormorant Garamond',serif;text-transform:uppercase;letter-spacing:.24em;
  font-size:.8rem;color:var(--gold-soft);margin-bottom:8px}
.fa-chef{display:flex;gap:20px;align-items:center;margin-top:30px;padding-top:26px;
  border-top:1px solid rgba(255,255,255,.16)}
.fa-chef img{width:88px;height:88px;border-radius:50%;object-fit:cover;flex:none;
  border:1px solid var(--gold-soft)}
.fa-chef .fc-name{font-family:'Cormorant Garamond',serif;font-weight:500;font-size:1.5rem;color:var(--paper)}
html[dir=rtl] .fa-chef .fc-name{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1.25rem}
.fa-chef .fc-role{color:var(--gold-soft);font-size:.9rem;margin-top:2px}
.fa-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:30px}
.fa-thumbs img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:2px}

/* ---------- 4 · שלוש קטגוריות — וריאנט של .cat-grid הקיים ---------- */
.cat-grid.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:860px){.cat-grid.three{grid-template-columns:1fr}}

/* ---------- 5 · סושיאל — לינקים בלבד (בקשת דורון, בלי פיד) ---------- */
.social-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:24px}
.social-row a{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.24);
  border-radius:100px;padding:10px 20px;color:#e7ddca;transition:.3s var(--ease);font-size:.92rem}
.social-row a:hover{border-color:var(--gold-soft);color:#fff}
.social-row svg{width:18px;height:18px;flex:none}

/* ---------- 6 · עמוד קטגוריה — סלוט לסרטון (בקשת אסף) ---------- */
.cat-vidslot{position:relative;aspect-ratio:16/9;max-width:820px;margin:0 auto;
  border:1px dashed var(--line-2);border-radius:4px;background:var(--paper-2);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:var(--muted);font-size:.9rem;padding:20px}

/* ---------- 7 · ניקוי שאריות הזמנת שולחן ---------- */
.booking,#bookResult,#bookForm{display:none !important}

/* ============================================================
   v2.1 — סבב תיקונים 23.08 (עיצוב)
   ============================================================ */

/* ---------- 8 · קונטקטבר: אייקונים בלבד + אוויר מתחת ---------- */
.contactbar .cb-in{padding-bottom:26px}
.social-row{margin-top:4px;padding-bottom:52px;gap:16px}
.social-row a{width:46px;height:46px;padding:0;justify-content:center;border-radius:50%;gap:0}
.social-row a > span{display:none}
.social-row svg{width:20px;height:20px}
@media(max-width:600px){.social-row{padding-bottom:40px}}

/* ---------- 9 · כרטיסי הקטגוריות: כהות שנפתחת בהובר ---------- */
.cat::after{content:"";position:absolute;inset:0;z-index:1;
  background:rgba(12,10,6,.5);transition:opacity .55s var(--ease);pointer-events:none}
.cat:hover::after,.cat:focus-visible::after{opacity:0}
.cat .cat-veil{transition:opacity .55s var(--ease)}
.cat:hover .cat-veil{opacity:.45}
.cat img{opacity:1}
.cat .cat-in{z-index:3}
@media(hover:none){.cat::after{background:rgba(12,10,6,.34)}}

/* ---------- 10 · תפריט הצד: צד לפי שפה + מידה שנכנסת במסך ---------- */
html[dir=rtl] .drawer .panel{inset-inline-start:auto;inset-inline-end:auto;
  left:auto;right:0;transform:translateX(102%)}
html[dir=ltr] .drawer .panel{inset-inline-start:auto;inset-inline-end:auto;
  right:auto;left:0;transform:translateX(-102%)}
html .drawer.open .panel,html[dir=rtl] .drawer.open .panel,html[dir=ltr] .drawer.open .panel{transform:translateX(0)}
.drawer .panel{width:min(420px,88vw);padding:26px 38px 22px;overflow:hidden}
.drawer .d-top{margin-bottom:20px}
.drawer .d-logo{width:104px;height:34px}
.drawer nav{display:flex;flex-direction:column}
.drawer nav a{padding:clamp(5px,1.1vh,11px) 0;font-size:clamp(1.02rem,2.35vh,1.6rem);line-height:1.25}
html[dir=rtl] .drawer nav a.he{font-size:clamp(.98rem,2.2vh,1.45rem)}
.drawer nav a.d-order{margin-top:clamp(8px,1.6vh,18px);padding:clamp(9px,1.5vh,14px) 0;
  font-size:clamp(.9rem,1.9vh,1.2rem)}
.drawer .d-foot{padding-top:clamp(12px,2vh,26px);font-size:.82rem;line-height:1.6}
.drawer .d-foot .langbtn{margin-bottom:10px !important}
@media(max-height:720px){.drawer .d-foot{font-size:.76rem}}

/* ---------- 11 · רקע: טקסטורה עדינה במקום לבן ---------- */
body{background-color:#EFE8DA;
  background-image:url("../img/texture-paper.png");
  background-repeat:repeat;background-size:340px 340px;background-attachment:fixed}
:root{--paper:#EFE8DA}

/* ---------- 12 · סטף הרי ירושלים — ירוק זית ---------- */
body.theme-jlm{
  --paper:#E2E8D2; --paper-2:#D6DEC3; --paper-3:#C9D2B4;
  --ink:#1D2416; --ink-2:#2A331F; --ink-soft:#414C31; --muted:#78826A;
  --gold:#7B8A4E; --gold-deep:#5D6B36; --gold-soft:#AEB985;
  --line:#C9D0B6; --line-2:#B7C0A0;
  background-color:#E2E8D2;background-image:url("../img/texture-olive.png")}
body.theme-jlm .creations,body.theme-jlm .chef{background:#232B18}
body.theme-jlm .contactbar{background:#232B18}
body.theme-jlm footer.site{background:#D6DEC3}
body.theme-jlm .hero .veil{background:linear-gradient(180deg,rgba(20,26,14,.34),rgba(20,26,14,.62))}

/* ---------- 13 · סטף תל אביב — כחול עדין, שיש בהיר וחוט זהב ---------- */
body.theme-ta{
  --paper:#E9EEF3; --paper-2:#DCE5EC; --paper-3:#CCDAE5;
  --ink:#16222F; --ink-2:#15222F; --ink-soft:#3C4E60; --muted:#7B8B9B;
  --gold:#3F6285; --gold-deep:#2B4A69; --gold-soft:#93AEC6;
  --line:#C8D6E1; --line-2:#B2C4D4;
  background-color:#E9EEF3;
  background-image:linear-gradient(rgba(233,238,243,.45),rgba(233,238,243,.45)),url("../img/marble-light.jpg");
  background-size:cover;background-position:center;background-attachment:fixed}
body.theme-ta .band,body.theme-ta .split{background:transparent}
body.theme-ta [style*="--paper-2"],body.theme-ta [style*="paper-2"]{
  background:rgba(220,229,236,.72) !important}
body.theme-ta .creations,body.theme-ta .chef{background:#15222F}
body.theme-ta .contactbar{background:#15222F}
body.theme-ta footer.site{background:#DCE5EC}
body.theme-ta .card,body.theme-ta .prod{background:rgba(255,255,255,.62);border-color:var(--line)}
body.theme-ta .hero .veil{background:linear-gradient(180deg,rgba(12,24,38,.30),rgba(12,24,38,.60))}
body.theme-ta .cat-vidslot{background:rgba(255,255,255,.55);border-color:var(--line-2);color:var(--muted)}

/* ---------- 14 · עמודים משפטיים ---------- */
.legal{max-width:840px;margin-inline:auto}
.legal h2{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1.42rem;
  margin:40px 0 12px;color:var(--ink)}
.legal h2:first-of-type{margin-top:0}
.legal h3{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1.08rem;margin:22px 0 8px}
.legal p,.legal li{color:var(--ink-soft);font-size:1rem;line-height:1.95}
.legal p{margin-bottom:12px}
.legal ul,.legal ol{margin:0 0 16px;padding-inline-start:22px}
.legal li{margin-bottom:6px}
.legal .updated{color:var(--muted);font-size:.9rem;margin-bottom:34px;
  padding-bottom:18px;border-bottom:1px solid var(--line)}
.legal .note{background:var(--paper-2);border-inline-start:3px solid var(--gold);
  padding:16px 20px;border-radius:3px;margin:20px 0;font-size:.95rem}
.legal a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}

/* ---------- 15 · קרדיט נקודה למחשבה ---------- */
footer.site .f-bot .nk .bulb{display:none}
footer.site .f-bot a.nk{text-decoration:none;transition:.3s var(--ease)}
footer.site .f-bot a.nk:hover{color:var(--gold-deep)}
footer.site .f-bot .legal-links a{margin-inline-start:6px}

/* ============================================================
   v3 — סבב תיקוני תוכן (מייל הלקוח, שני חלקים)
   ============================================================ */

/* ---------- 16 · פס פרטי ההתקשרות — יורד, הסושיאל נשאר ---------- */
.contactbar .cb-in{display:none}
.contactbar .social-row{margin-top:0;padding:40px 0}

/* ---------- 17 · פוטר: לוגו ממורכז בלי הטקסט מתחתיו ---------- */
footer.site .f-in > div:first-child{grid-column:1/-1;text-align:center;margin-bottom:10px}
footer.site .f-word{margin-inline:auto}
footer.site .f-tag{display:none}
@media(min-width:861px){footer.site .f-in{grid-template-columns:1fr 1fr}}

/* ---------- 18 · טופס תכנון אירוע ---------- */
.ev-form{max-width:680px;margin-inline:auto}
.ev-form .co-f textarea{width:100%;border:1px solid var(--line);border-radius:3px;padding:12px 14px;
  background:#fff;font-family:'Frank Ruhl Libre',serif;font-size:1rem;color:var(--ink);
  outline:none;resize:vertical;line-height:1.7}
.ev-form .co-f input:focus,.ev-form .co-f select:focus,.ev-form .co-f textarea:focus{border-color:var(--gold)}
.ev-form .ev-submit{margin-top:8px;width:100%;justify-content:center}
.ev-form .co-note{text-align:center}
@media(max-width:600px){.ev-form .co-2{grid-template-columns:1fr}}
body.theme-ta .ev-form .co-f input,body.theme-ta .ev-form .co-f select,
body.theme-ta .ev-form .co-f textarea{background:rgba(255,255,255,.75)}

/* ---------- 19 · בלוקי split בתוך .wrap (עמודי תוכן) ---------- */
.wrap > .split{align-items:stretch;gap:clamp(28px,4vw,56px)}
.wrap > .split .s-media{min-height:clamp(320px,52vh,560px)}
@media(max-width:860px){.wrap > .split .s-media{min-height:300px}}

/* מלכודת ספאם — מוסתרת מבני אדם ומקוראי מסך */
/* מלכודת הספאם מוסתרת בלי לגרום לגלילה אופקית ב-RTL
   (left:-9999px גרם ל-scrollWidth של 11,000px בעמוד האירועים) */
.ev-hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* ============================================================
   20 · באנר עוגיות והסכמה (חוק הגנת הפרטיות · תיקון 13)
   ============================================================ */
.cbanner{position:fixed;inset-inline:0;bottom:0;z-index:210;
  background:var(--paper);border-top:1px solid var(--line);
  box-shadow:0 -10px 40px rgba(33,29,21,.14);
  transform:translateY(110%);transition:transform .5s var(--ease);
  padding:20px clamp(16px,4vw,48px)}
.cbanner.open{transform:translateY(0)}
.cb-wrap{max-width:var(--maxw);margin-inline:auto;display:flex;gap:26px;
  align-items:center;justify-content:space-between;flex-wrap:wrap}
.cb-txt{flex:1 1 420px;min-width:260px}
.cb-title{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1.08rem;
  color:var(--ink);margin-bottom:5px}
html[dir=ltr] .cb-title{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.25rem}
.cb-txt p{font-size:.9rem;line-height:1.7;color:var(--ink-soft);margin:0}
.cb-txt a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.cb-acts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.cb-acts button{font-family:'Frank Ruhl Libre',serif;font-weight:500;font-size:.92rem;
  padding:11px 20px;border-radius:3px;cursor:pointer;border:1px solid var(--line-2);
  background:transparent;color:var(--ink);transition:.3s var(--ease);white-space:nowrap}
html[dir=ltr] .cb-acts button{font-family:'Cormorant Garamond',serif;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
.cb-acts button:hover{border-color:var(--gold);color:var(--gold-deep)}
.cb-acts .cb-acc{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cb-acts .cb-acc:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}
.cb-acts .cb-set{border-color:transparent;text-decoration:underline;text-underline-offset:3px;padding-inline:8px}
@media(max-width:720px){
  .cb-wrap{gap:16px}
  .cb-acts{width:100%}
  .cb-acts button{flex:1 1 auto;text-align:center}
  .cb-acts .cb-set{flex-basis:100%;order:3}
}
/* להרים את הכפתורים הצפים כשהבאנר פתוח */
html.cookie-bar-open .order-fab{bottom:calc(84px + var(--cb-h,120px))}
html.cookie-bar-open .a11y-btn{bottom:calc(16px + var(--cb-h,120px))}
html.cookie-bar-open .a11y-panel{bottom:calc(82px + var(--cb-h,120px))}

/* ---- חלון ההגדרות ---- */
.cmodal{position:fixed;inset:0;z-index:230;display:flex;align-items:center;justify-content:center;
  padding:20px;visibility:hidden;opacity:0;transition:.35s var(--ease)}
.cmodal.open{visibility:visible;opacity:1}
.cmodal .cm-scrim{position:absolute;inset:0;background:rgba(20,17,10,.6)}
.cm-box{position:relative;z-index:2;background:var(--paper);border:1px solid var(--line);
  border-radius:4px;width:min(560px,100%);max-height:86vh;overflow-y:auto;
  padding:clamp(22px,4vw,34px);box-shadow:0 30px 80px rgba(20,17,10,.35)}
.cm-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:6px}
.cm-title{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1.32rem;color:var(--ink)}
html[dir=ltr] .cm-title{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.6rem}
.cm-x{background:none;border:none;font-size:1.7rem;line-height:1;color:var(--ink-soft);
  cursor:pointer;padding:0 4px;font-family:serif}
.cm-intro{font-size:.92rem;line-height:1.75;color:var(--ink-soft);margin-bottom:20px}
.cm-intro a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:3px}
.cm-row{border-top:1px solid var(--line);padding:16px 0}
.cm-row:last-of-type{border-bottom:1px solid var(--line)}
.cm-row-top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.cm-name{font-family:'Frank Ruhl Libre',serif;font-weight:700;font-size:1rem;color:var(--ink)}
html[dir=ltr] .cm-name{font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.1rem}
.cm-desc{font-size:.86rem;line-height:1.7;color:var(--muted);margin-top:5px}
.cm-always{font-size:.78rem;color:var(--gold-deep);letter-spacing:.06em;white-space:nowrap}
.cm-sw{position:relative;width:46px;height:26px;flex:none;background:var(--line-2);
  border:none;border-radius:100px;cursor:pointer;transition:.3s var(--ease)}
.cm-sw::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:.3s var(--ease);box-shadow:0 1px 3px rgba(0,0,0,.25)}
.cm-sw[aria-checked="true"]{background:var(--gold)}
.cm-sw[aria-checked="true"]::after{inset-inline-start:23px}
.cm-acts{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.cm-acts button{flex:1 1 auto;font-family:'Frank Ruhl Libre',serif;font-weight:500;font-size:.92rem;
  padding:12px 18px;border-radius:3px;cursor:pointer;border:1px solid var(--line-2);
  background:transparent;color:var(--ink);transition:.3s var(--ease)}
html[dir=ltr] .cm-acts button{font-family:'Cormorant Garamond',serif;font-weight:600;
  text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}
.cm-acts button:hover{border-color:var(--gold);color:var(--gold-deep)}
.cm-acts .cm-save{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cm-acts .cm-save:hover{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}
footer.site .f-bot .cookie-link{background:none;border:none;padding:0;cursor:pointer;
  color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px}
footer.site .f-bot .cookie-link:hover{color:var(--gold-deep)}
.cb-more{white-space:nowrap}
html[dir=rtl] .cm-sw::after{right:3px;left:auto}
html[dir=rtl] .cm-sw[aria-checked="true"]::after{right:23px;left:auto}
html[dir=ltr] .cm-sw::after{left:3px;right:auto}
html[dir=ltr] .cm-sw[aria-checked="true"]::after{left:23px;right:auto}

/* 21 · הסרת הערת הדמו בצ׳קאאוט */
.cart-panel .co-note{display:none !important}

/* 22 · אנגלית מוסתרת עד לתרגום מקצועי — להסרה כשהתרגום מוכן */
.langbtn{display:none !important}

/* ============================================================
   23 · המילה SATAF בתוך הטקסט → הוורדמארק (בלי הענף שמעל)
   ============================================================ */
.sfmark{position:relative;display:inline-block;
  width:3.30em;height:.98em;vertical-align:-.19em;
  background-color:currentColor;
  -webkit-mask:url("../img/wordmark.png") center/contain no-repeat;
          mask:url("../img/wordmark.png") center/contain no-repeat}
.sfmark > i{position:absolute;width:1px;height:1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap;font-style:normal}
/* דפדפן בלי תמיכה במסכה — נשארים עם המילה */
@supports not ((-webkit-mask-image:url(a)) or (mask-image:url(a))){
  .sfmark{width:auto;height:auto;background:none;vertical-align:baseline}
  .sfmark > i{position:static;width:auto;height:auto;clip-path:none}
}

/* ============================================================
   24 · סבב 03.09 — מרכוז כל התוויות + קו דקורטיבי משני הצדדים
   (הבקשה החוזרת ביותר של הלקוח: "למרכז ולהוסיף קו מהצד השני")
   ============================================================ */
.label{justify-content:center;text-align:center}
.label::before{content:"";width:46px;height:1px;background:currentColor;
  opacity:.7;flex:0 0 auto}
.label::after{background:currentColor;flex:0 0 auto}
@media (max-width:520px){
  .label{gap:12px;font-size:.8rem;letter-spacing:.26em}
  .label::before,.label::after{width:30px}
}

/* מרכוז בלוקי הטקסט של הסקשנים */
.split .s-text,
.visit .v-text,
.chef .c-text,
.creations .c-top > div{text-align:center}
.split .s-text .lead,
.visit .v-text .lead,
.chef .c-text .lead,
.creations .c-top .lead{margin-inline:auto}
.split .s-sign,
.chef .c-sign,
.visit .v-sign{margin-inline:auto}

/* כרטיסיות הלוקיישן בדף הבית — כותרת ומלל ממורכזים */
.loc-card{justify-content:center;text-align:center}
.loc-card .l-in{text-align:center;width:100%}
.loc-card .l-go{justify-content:center}

/* רשימת הפרטים בעמודי הלוקיישן */
.v-info{max-width:560px;margin-inline:auto}
.v-info li{justify-content:center;text-align:center}

/* ============================================================
   25 · כותרות — הוורדמארק יורד מהכותרות הגדולות ("זה גס מאוד")
   ונשאר רק בטקסט הרץ. בכותרת המילה נכתבת בגרסה עדינה.
   ============================================================ */
.sfword{font-family:'Cormorant Garamond',serif;font-weight:500;
  letter-spacing:.09em;font-size:.92em}
html[dir=rtl] .display.he{font-weight:600}
.display{letter-spacing:.005em}

/* ============================================================
   26 · הורדת הלוגו העליון (נשאר הלוגו המרכזי בהירו ובפוטר)
   ============================================================ */
header.nav .nav-logo{display:none !important}

/* ============================================================
   27 · מחירים בתפריט — גלויים (בקשת הלקוח 15.09; קודם היו מוסתרים)
   ============================================================ */
.menu-cols .mrow{flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:6px}
.menu-cols .mrow > div{width:100%}
.menu-cols .m-price{font-size:1.1rem;letter-spacing:.03em;color:var(--gold-deep);margin-top:2px}

/* ============================================================
   28 · שעות פתיחה — קיץ / חורף
   ============================================================ */
.v-hours{display:block}
.v-hours .vh-s{display:block;font-size:.78rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);margin:8px 0 2px;
  font-family:'Cormorant Garamond',serif;font-weight:600}
.v-hours .vh-s:first-child{margin-top:0}
.v-hours .vh-l{display:block;line-height:1.9}
.v-waze{display:block;width:fit-content;margin:10px auto 0;font-size:.86rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);
  border-bottom:1px solid currentColor;padding-bottom:1px}
.v-waze:hover{opacity:.75}

/* ============================================================
   29 · הרי ירושלים — ירוק כהה עם טקסט בהיר
   בקשת הלקוח 01.09: "את הצבע הירוק הזה צריך להחליף לכהה יותר
   ... שהכיתוב עדיין יראה יפה עליו · בכל מקום שהירוק הזה מופיע".

   שים לב: texture-olive.png היה קובץ אטום לגמרי, ולכן צבע הרקע
   שמתחתיו מעולם לא נראה. הוחלף ב-texture-grain.png — אותה
   טקסטורה בדיוק אבל עם שקיפות, כך שהצבע באמת נשלט מכאן.
   ============================================================ */
body.theme-jlm{
  --paper:#3C482C; --paper-2:#334024; --paper-3:#2B3720;
  --ink:#EDE7D6; --ink-2:#E3DCC7; --ink-soft:#D5CDB4; --muted:#A9B292;
  --gold:#C3CDAF; --gold-deep:#D8DFC6; --gold-soft:#C3CDAF;
  --line:#5C6B47; --line-2:#6B7B53;
  background-color:#3C482C;
  background-image:url("../img/texture-grain.png")}

/* סרגלים וסקשנים כהים — לא יורשים את --ink שהתהפך */
body.theme-jlm .creations,
body.theme-jlm .chef,
body.theme-jlm .contactbar{background:#222B18}
body.theme-jlm .creations .c-top .display{color:#EDE7D6}
body.theme-jlm footer.site{background:#334024}

/* בר הניווט הדביק — הרקע הקרם מקודד קשיח ב-staf.css */
body.theme-jlm header.nav.solid{background:rgba(46,56,34,.92);border-bottom-color:#5C6B47}

/* הלוגו הכהה אינו נראה על רקע כהה — גרסה בהירה */
body.theme-jlm footer.site .f-word,
body.theme-jlm .drawer .d-logo{background-image:url("../img/logo-light.png")}

/* כרטיסים, כפתורים וקצוות על רקע כהה */
body.theme-jlm .card,
body.theme-jlm .prod,
body.theme-jlm .cat-vidslot{background:rgba(255,255,255,.06);border-color:var(--line)}
body.theme-jlm .btn-outline{border-color:var(--gold);color:var(--gold-deep)}
body.theme-jlm .btn-outline:hover{background:var(--gold);color:#25301A}
body.theme-jlm .cb-acts .cb-acc:hover,
body.theme-jlm .cm-acts .cm-save:hover{background:var(--gold);border-color:var(--gold);color:#25301A}
body.theme-jlm .cm-sw{background:#5C6B47}
body.theme-jlm .hero .veil{background:linear-gradient(180deg,rgba(16,22,10,.34),rgba(16,22,10,.66))}

/* 30 · אחרי הסרת הלוגו העליון — העגלה חוזרת לקצה ולא לאמצע */
header.nav .nav-in{grid-template-columns:1fr auto}
header.nav .nav-right{justify-self:end}

/* ============================================================
   31 · רשת הקטגוריות מתפרשת שווה על כל הרוחב
   הרשת הוגדרה ל-5 עמודות קבועות, אבל אחרי הסרת "לחמים" נשארו
   4 כרטיסים — ונוצרה עמודה ריקה שנראתה כאילו השורה נקטעה.
   grid-auto-flow:column נותן עמודה שווה לכל כרטיס, בלי קשר למספרם.
   ============================================================ */
@media(min-width:861px){
  .cat-grid:not(.three){grid-template-columns:none;
    grid-auto-flow:column;grid-auto-columns:1fr}
  .cat-grid:not(.three) .cat:nth-child(4){
    border-inline-start:1px solid rgba(255,255,255,.12)}
  .cat-grid:not(.three) .cat:first-child{border-inline-start:none}
}

/* ============================================================
   32 · האיצטרובל מהלוגו מעל כל כותרת־משנה (label)
   ------------------------------------------------------------
   הבקשה: "מעל כל כותרת... להוסיף את האיצטרובל מהלוגו".
   האיקון לא נוצר כקובץ חדש — הוא נחתך ישירות מ-logo-dark.png
   באמצעות mask, כך שאין נכס נוסף להוריד (הקובץ כבר נטען בפוטר
   ובתפריט הצד) והצבע יורש אוטומטית את צבע הכותרת (currentColor):
   זהב על רקע בהיר, בהיר על הסקשנים הכהים, ירוק בדף ירושלים.

   המתמטיקה של החיתוך (logo-dark.png = 1200x790):
   תיבת האיצטרובל בקובץ = x 272..795, y 29..352  →  524x324.
   mask-size     = 1200/524 = 229%  ·  790/324 = 243.8%
   mask-position = 272/(1200-524) = 40.2%  ·  29/(790-324) = 6.22%
   אם הלוגו יוחלף אי־פעם — צריך לחשב מחדש את ארבעת המספרים האלה.

   ה-<i class="pine"> מוזרק ב-staf-v2.js כילד הראשון של .label.
   ============================================================ */
.label{flex-wrap:wrap}
.label > .pine{order:-1;flex:0 0 100%;display:flex;justify-content:center;
  margin-bottom:12px;line-height:0}
.label > .pine::before{content:"";display:block;width:54px;height:33px;
  background-color:currentColor;opacity:.92;
  -webkit-mask:url("../img/logo-dark.png") 40.2% 6.22%/229% 243.8% no-repeat;
          mask:url("../img/logo-dark.png") 40.2% 6.22%/229% 243.8% no-repeat}
@media(max-width:520px){
  .label > .pine{margin-bottom:9px}
  .label > .pine::before{width:42px;height:26px}
}
/* דפדפן בלי תמיכה ב-mask לא יציג ריבוע מלא אלא כלום */
@supports not ((-webkit-mask-image:url("x")) or (mask-image:url("x"))){
  .label > .pine{display:none}
}

/* ============================================================
   33 · דף הבית — רקע מעט כהה יותר וטקסט שבולט עליו
   ------------------------------------------------------------
   הבקשה: "ברקעים בדף הבית להכהות קצת את הרקע ולשנות את הצבע
   של הכיתוב ככה שיבלוט".
   הזהב הישן (#B0894E) על הנייר הישן (#EFE8DA) נתן יחס ניגודיות
   של 2.64:1 — מתחת לסף של ת"י 5568 / WCAG AA (4.5:1 לטקסט רגיל),
   ולכן הכותרות הקטנות כמעט נבלעו ברקע.
   הרקע הוכהה ל-#E7DFCF והזהב ל-#7A5C2C — יחס 4.67:1, עובר AA.
   חל על דף הבית בלבד (body.home).
   ============================================================ */
body.home{
  --paper:#E7DFCF; --paper-2:#DED5C2; --paper-3:#D3C8B2;
  --ink:#1B1810; --ink-2:#26221A; --ink-soft:#3E382A; --muted:#635B4A;
  --gold:#7A5C2C; --gold-deep:#63491F;
  --line:#CDC1AB; --line-2:#BFB197;
  background-color:#E7DFCF}
/* הסקשנים הכהים (היצירות שלנו / השף) שומרים על הזהב הבהיר שלהם */
body.home .creations .label,
body.home .chef .label{color:var(--gold-soft)}

/* ============================================================
   34 · הוורדמארק — גרסה מלאה, מותאמת לעובי ולגודל של הטקסט
   ------------------------------------------------------------
   הבקשה: "בכל מקום שרשומה המילה סטף שיהיה הלוגו של הסטף בלי
   האיצטרובל, ושזה יהיה מותאם לשאר הטקסט מבחינת העובי והגודל".

   הקובץ הקודם, wordmark.png, היה הלוגוטייפ ה*מתוחם* — קווי מתאר
   חלולים עם צל. כשמסכה צובעת אותו בצבע אחד מתקבל סבך קווים שנקרא
   כהדגשה מוזרה באמצע משפט, ובכותרות הוא נראה חלול. לכן נוצר
   wordmark-solid-1609.png: אותו לוגוטייפ בדיוק, מהקובץ הווקטורי
   המקורי (Logo/לוגו לחולצה.pdf) ב-300dpi, עם מילוי הפנים של
   האותיות ודיאטה קלה (erosion) שמיישרת את העובי לטקסט הרץ.
   יחס הצדדים 3.373:1 — הגובה ב-em, כך שהלוגו גדל ומתכווץ יחד עם
   הטיפוגרפיה שסביבו, ו-currentColor נותן את הצבע.

   בעקבות זה בוטל SF_PLAIN ב-staf-v2.js — הלוגו מופיע עכשיו גם
   בכותרות, לא רק בטקסט הרץ.
   ============================================================ */
/* 17.09 — הבקשה: הלוגו המקורי בכל מקום, בלי שינוי עובי ובלי האיצטרובל.
   גרסת המילוי ירדה מהטקסט הרץ גם היא; נשארה רק גרסת קווי המתאר,
   שהיא הלוגוטייפ כפי שהוא בקובץ המקורי. הועלה לרזולוציית מאסטר של
   900px כדי שהקווים יישארו נקיים גם בגודל קטן, והגובה הוגדל מעט
   מאותה סיבה. wordmark-solid-1609.png נשאר בשרת אם נרצה לחזור. */
.sfmark{width:3.12em;height:.92em;vertical-align:-.115em;
  margin-inline:.12em;
  -webkit-mask-image:url("../img/wordmark-outline-1609.png");
          mask-image:url("../img/wordmark-outline-1609.png")}
/* ------------------------------------------------------------
   16.09 (ערב) · בכותרות — הלוגו בקווי מתאר, לא במילוי.
   הבקשה: "פשוט שים אותו רגיל, רק שקווי המתאר שלו יהיו בצבע
   של הטקסט". במילוי הלוגו נקרא ככותרת מודגשת ולא כלוגו; בקווי
   מתאר הוא נקרא כלוגו, וה-mask על currentColor צובע את הקווים
   בצבע הכותרת — כחול בדף תל אביב, כהה בבהיר, ירוק בירושלים.
   wordmark-outline-1609.png = אותו מקור ווקטורי, בלי המילוי.

   בטקסט הרץ נשאר המילוי: בגובה של ~14px הרווח בין קווי המתאר
   קטן מפיקסל והלוגו נקרא כסבך. ההפרדה היא לפי גודל בלבד —
   שתי הגרסאות הן אותו לוגו.
   ------------------------------------------------------------ */
.display .sfmark,h1 .sfmark,h2 .sfmark,h3 .sfmark,.hero .sfmark{
  height:.74em;width:2.50em;vertical-align:-.035em;
  -webkit-mask-image:url("../img/wordmark-outline-1609.png");
          mask-image:url("../img/wordmark-outline-1609.png")}
/* בהירו הלוגו המרכזי כבר מוצג — אין שינוי שם */

/* ============================================================
   35 · "מאחורי הקלעים" — מרכוז הטקסט במקטע "לפני שהוויטרינה מתמלאת"
   ============================================================ */
.fac-center{text-align:center}
.fac-center .lead{margin-inline:auto}
/* הפולבק מסעיף 23 נדרס על ידי הכללים שלמעלה — מוחזר כאן */
@supports not ((-webkit-mask-image:url("a")) or (mask-image:url("a"))){
  .sfmark,.display .sfmark,h1 .sfmark,h2 .sfmark,h3 .sfmark,.hero .sfmark{
    width:auto;height:auto;margin-inline:0;background:none;vertical-align:baseline}
}

/* ============================================================
   36 · סבב 17.09
   ============================================================ */

/* --- דף הבית: רקעים כהים יותר, וטקסט שמותאם אליהם ---------
   סבב שני של ההכהיה. הזהב הוכהה יחד עם הרקע כדי לשמור על
   הניגודיות מעל 4.5:1 (ת"י 5568 / WCAG AA):
   #63491F על #D3C7AC = 5.01:1. הטקסט נשאר כהה ולא בהיר —
   על נייר בגוון הזה כתב בהיר היה מוריד את הניגודיות, לא מעלה. */
body.home{
  --paper:#B8A882; --paper-2:#AC9C74; --paper-3:#A08F65;
  --ink:#12100A; --ink-2:#1D1A12; --ink-soft:#2B2718; --muted:#47412E;
  --gold:#3F2D10; --gold-deep:#30210A;
  --line:#9C8C68; --line-2:#8E7D58;
  background-color:#B8A882}


/* --- עמוד הכריכים: האירו ממורכז וברור, בדסקטופ ובמובייל ---
   הצילום לאורך והכריך יושב בחלק התחתון שלו; ברירת המחדל של
   object-fit:cover חתכה אותו החוצה במסך רחב. */
body.page-sandw .hero .bg{object-position:center 68%}
@media(max-width:820px){ body.page-sandw .hero .bg{object-position:center 60%} }
body.page-sandw .hero .veil{background:
  radial-gradient(130% 100% at 50% 44%, rgba(12,10,6,.20), rgba(12,10,6,.52) 100%),
  linear-gradient(180deg,rgba(12,10,6,.52) 0%,rgba(12,10,6,.16) 38%,rgba(12,10,6,.26) 68%,rgba(12,10,6,.66) 100%)}

/* --- "* התמונות להמחשה בלבד" בתחתית כל עמוד --------------- */
footer.site .photo-note{
  max-width:var(--maxw);margin:0 auto;padding:16px var(--pad) 26px;
  border-top:1px solid var(--line);
  font-size:.78rem;letter-spacing:.04em;line-height:1.7;
  color:var(--muted);text-align:center}

/* --- הכותרת באנגלית נקראת משמאל לימין ---------------------
   בעמוד RTL "A day at SATAF" הוצג כ-"SATAF A day at". */
.display[dir="ltr"]{direction:ltr;text-align:center}

/* ============================================================
   37 · האיצטרובל כסימן מים לבן ברקע
   ------------------------------------------------------------
   הבקשה: "להוסיף ברקע בלבן את הלוגו של האיצטרובל בשקיפות גבוהה
   שרק יתן מעט מרקם לרקע".
   texture-pine-1709.png — אריח 460px חסר תפרים, נבנה מהאיצטרובל
   שבקובץ הווקטורי המקורי: ארבעה מופעים בגדלים ובזוויות שונות,
   בלבן, עם אלפא מקסימלי של 30/255 (כ-12%). הוא נטען כשכבת רקע
   ראשונה מעל טקסטורת הנייר הקיימת, כך שהנייר נשאר והאיצטרובל
   רק מוסיף מרקם.
   ============================================================ */
body{
  background-image:url("../img/texture-pine-1709.png"), url("../img/texture-paper.png");
  background-repeat:repeat, repeat;
  background-size:460px 460px, 340px 340px;
  background-attachment:fixed, fixed}
/* ⚠ texture-olive.png הוא קובץ אטום לגמרי — אם משתמשים בו כאן הוא
   מכסה את הירוק הכהה #3C482C שמוגדר בסעיף 26, והטקסט הבהיר של
   עמוד ירושלים נשאר בהיר על רקע בהיר ונעלם. חייבים texture-grain.png. */
body.theme-jlm{
  background-image:url("../img/texture-pine-1709.png"), url("../img/texture-grain.png");
  background-size:460px 460px, 340px 340px;
  background-repeat:repeat, repeat;
  background-attachment:fixed, fixed}
body.theme-ta{
  background-image:url("../img/texture-pine-1709.png"),
                   linear-gradient(rgba(233,238,243,.45),rgba(233,238,243,.45)),
                   url("../img/marble-light.jpg");
  background-size:460px 460px, auto, cover;
  background-repeat:repeat, no-repeat, no-repeat}

/* ============================================================
   38 · טקסט הגוף כהה יותר בכל שאר העמודים
   ------------------------------------------------------------
   דף הבית כבר קיבל טקסט כהה בסעיף 36; שאר העמודים נשארו עם
   --ink-soft המקורי (#4C4638), והכתב נראה אפרפר על הנייר הבהיר.
   #2B2718 על #EFE8DA = 12.25:1 (היה 7.69:1).
   --muted הוכהה גם הוא: #8B8271 נתן 3.12:1 בלבד — מתחת לסף AA
   לטקסט קטן; #5A5341 נותן 6.27:1.
   מוגדר על :root בלבד, ולכן עמודי ירושלים ותל אביב (שמגדירים
   פלטה משלהם על ה-body) ודף הבית לא מושפעים.
   ============================================================ */
:root{--ink-soft:#2B2718; --muted:#5A5341}