/* העיצוב של האתר. שני כיווני עיצוב חיים כאן יחד, על אותו תוכן:
     data-look="shabbat"  "אור של שבת" (ברירת המחדל): פינות כמעט ישרות, פתיחה עם תמונה על כל הרוחב.
     data-look="stone"    "אבן ירושלמית": פינות מעוגלות, כותרות ממורכזות, פתיחה עם תמונה במסגרת קשת.
   הכיוון הקבוע נכתב בקובץ ההגדרות ("כיוון עיצוב"). לצפייה: להוסיף לכתובת ‎?look=stone או ‎?look=shabbat.
   האתר בהיר תמיד, נבנה קודם לטלפון (375 פיקסלים), ומתרחב למסכים גדולים.
   כלל חשוב: כל תוכן נראה גם בלי קוד וגם אם אנימציה לא רצה. מצב המנוחה הוא תמיד מצב גלוי. */

/* ===== צבעי המותג "הרובע שלי": קבועים בשני כיווני העיצוב (הלוגו, הכותרת העליונה, הכותרת התחתונה והתפריט התחתון) ===== */
:root{
  --navy:#0D2A5E; --navy-rgb:13,42,94; --navy-hi:#17408A; --navy-lo:#081C42;  /* כחול עמוק, גוון בהיר לריחוף, גוון כהה */
  --cream:#FFF8E7; --cream-rgb:255,248,231;                                   /* שמנת על כחול */
  --gold-hot:#F2B632; --gold-hi:#FFE08A; --gold-lo:#C98A14;                   /* זהב עז, רק על רקע כהה */
  --f-logo:"Assistant","Arial Hebrew",Arial,sans-serif; --f-logo-en:"Jost","Assistant",Arial,sans-serif;
}
/* ===== משתנים: כיוון א, "אור של שבת" =====
   זהב על רקע בהיר (--gold) משמש רק לקווים, לאייקונים ולכותרות גדולות. טקסט קטן על בהיר: כחול עמוק, או זהב כהה (--label) לתוויות.
   ניגודיות שנבדקה: כחול על הרקע 13.0, טקסט משני 6.5 (5.8 על הרקע המשני), תווית 5.4 (4.8 על הרקע המשני), שמנת על כחול 13.1. */
:root{
  /* רקע האתר בצבע אבן ירושלמית ושמנת, לא לבן חיוור */
  --bg:#F2E8D5; --bg-rgb:242,232,213; --bg2:#E9DCC3; --bg3:#DFD0B2; --card:#FAF4E6;
  --ink:#0D2A5E; --ink-rgb:13,42,94; --soft:#2B3F66; --muted:#45536F; --line:#DCCDAF; --line2:#CBB98F;
  /* --label הוא צבע הכותרות הקטנות שמעל הכותרת. כהה דיו כדי להיקרא גם על הרקע הכהה ביותר */
  --gold:#E9A91E; --label:#6B4D08; --num:#0D2A5E; --btn:#0D2A5E; --btn-hover:#17408A; --btn-ink:#FFF8E7;
  --wa:#25D366; --wa-ink:#06381D;
  --serif:"Frank Ruhl Libre","David","Times New Roman",serif;
  --sans:"Assistant","Arial Hebrew",Arial,sans-serif;
  --hw:300;      /* משקל כותרות גדולות */
  --hw2:400;     /* משקל כותרות קטנות */
  --hwb:500;     /* משקל שם המותג */
  --fwb:600;     /* משקל מודגש בטקסט */
  --r:2px;       /* רדיוס פינות */
  --arch:2px;    /* צורת מסגרת התמונות הגדולות */
  --card-ar:4/3; /* יחס תמונה בכרטיסים כלליים */
  --svc-ar:3/4;  /* יחס תמונה בכרטיסי השירותים */
  --top:60px; --dock:0px; --gut:20px; --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
@media (max-width:860px){:root{--dock:calc(64px + env(safe-area-inset-bottom,0px))}}
/* ===== משתנים: כיוון ב, "אבן ירושלמית" ===== */
:root[data-look="stone"]{
  --bg:#F6F1E7; --bg-rgb:246,241,231; --bg2:#EBE3D3; --bg3:#DFD5C1; --card:#FCF9F2;
  --ink:#2E2A25; --ink-rgb:46,42,37; --soft:#4A443C; --muted:#655D52; --line:#DDD3BF; --line2:#CFC2A8;
  --gold:#A8843F; --label:#5A5349; --num:#A8843F; --btn:#7A5A2E; --btn-hover:#684B24; --btn-ink:#FFFFFF;
  --serif:"Bellefair","Frank Ruhl Libre","David",serif;
  --sans:"IBM Plex Sans Hebrew","Assistant","Arial Hebrew",Arial,sans-serif;
  --hw:400; --hw2:400; --hwb:400; --fwb:500;
  --r:6px; --arch:999px 999px 6px 6px; --card-ar:4/5; --svc-ar:4/5;
}
@media (min-width:861px){:root{--top:72px;--gut:clamp(28px,4vw,48px)}}

/* ===== בסיס ===== */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--top) + 12px)}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.7 var(--sans);overflow-x:clip;-webkit-font-smoothing:antialiased}
@media (min-width:861px){body{font-size:18px}}
img,video,canvas{max-width:100%;display:block}
/* לתמונות יש רוחב וגובה מוצהרים (הבנייה מוסיפה אותם), ולכן הגובה נגזר מהרוחב בפועל */
img{height:auto}
h1,h2,h3,h4{font-family:var(--serif);font-weight:var(--hw);line-height:1.14;margin:0;text-wrap:balance}
h1{font-size:clamp(34px,5.2vw,64px)}
h2{font-size:clamp(29px,4.1vw,50px);margin-block:14px 18px}
h3,h4{font-size:23px;font-weight:var(--hw2);line-height:1.25}
p{margin:0}
a{color:inherit}
[hidden]{display:none!important}
/* עטיפת התמונות בפורמט AVIF: שקופה לעיצוב, כאילו התמונה עומדת לבד */
picture.av{display:contents}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:var(--r)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:var(--r)}
.skip:focus{top:10px}

.wrap{width:100%;max-width:1240px;margin-inline:auto;padding-inline:max(var(--gut),env(safe-area-inset-left,0px)) max(var(--gut),env(safe-area-inset-right,0px))}
.wrap.narrow{max-width:900px}
.sec{padding-block:clamp(72px,11vw,150px)}
.sec-s{padding-block:clamp(44px,7vw,92px)}
.tint{background:var(--bg2)}
.center{text-align:center;margin-top:clamp(32px,5vw,56px)}

/* תווית קטנה מעל כל כותרת: קו זהב דק ואחריו מילים */
.eyebrow{display:flex;align-items:center;gap:12px;font:var(--fwb) 13.5px/1.3 var(--sans);letter-spacing:.06em;color:var(--label);margin:0}
.eyebrow::before{content:"";flex:none;width:28px;height:1px;background:var(--gold)}
[dir="ltr"] .eyebrow{text-transform:uppercase;letter-spacing:.15em;font-size:12px}
.lead{color:var(--muted);font-size:clamp(17px,1.55vw,20px);max-width:64ch}
.note{font-size:14px;color:var(--muted);margin-top:22px;max-width:80ch}

/* חץ שמתהפך לפי כיוון השפה */
.arr::after{content:"←";display:inline-block;transition:transform .35s var(--ease)}
[dir="ltr"] .arr::after{content:"→"}
.arr.rev::after{content:"→"}
[dir="ltr"] .arr.rev::after{content:"←"}

/* ===== כפתורים (גובה 48 לפחות) ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:10px 26px;border-radius:var(--r);border:1px solid transparent;font:var(--fwb) 16px/1.2 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;text-align:center;transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s,transform .35s var(--ease)}
.btn svg{width:21px;height:21px;flex:none}
.btn.primary{background:var(--btn);color:var(--btn-ink)}
.btn.wa{background:var(--wa);color:var(--wa-ink)}
.btn.ghost{background:transparent;border-color:rgba(var(--ink-rgb),.34);color:var(--ink)}
/* כפתור זהב עז: רק על רקע כהה (מסך הפתיחה והמסכים הגדולים), עם טקסט בכחול העמוק */
.btn.gold{background:linear-gradient(to bottom,var(--gold-hi),var(--gold-hot));color:var(--navy);box-shadow:0 10px 26px -14px rgba(242,182,50,.9)}
.share summary svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
/* לחיצה: שינוי צבע ברור בכל מכשיר, וכיווץ קטן */
.btn:active{transform:scale(.975)}
.btn.primary:active{background:var(--btn-hover)}
.btn.wa:active{background:#17A84E}
.btn.ghost:active{background:var(--bg3);border-color:var(--ink)}
.btn.gold:active{background:linear-gradient(to bottom,var(--gold-hot),var(--gold-lo))}
@media (hover:hover){
  .btn.primary:hover{background:var(--btn-hover);box-shadow:0 12px 26px -16px rgba(var(--ink-rgb),.7)}
  .btn.wa:hover{background:#1FC25C}
  .btn.ghost:hover{background:var(--bg2);border-color:var(--ink)}
  .btn.gold:hover{background:linear-gradient(to bottom,#FFEBAD,#F7C548);box-shadow:0 14px 30px -14px rgba(242,182,50,1)}
  a:hover .arr::after,.btn:hover .arr::after{transform:translateX(-4px)}
  [dir="ltr"] a:hover .arr::after,[dir="ltr"] .btn:hover .arr::after{transform:translateX(4px)}
  a:hover .arr.rev::after{transform:translateX(4px)}
  [dir="ltr"] a:hover .arr.rev::after{transform:translateX(-4px)}
}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;align-items:flex-start}
@media (max-width:560px){.btns>.btn,.btns>.share,.btns>.share>summary{width:100%}}

/* ===== הלוגו "השער": קשת אבן עם אבן ראשה מזהב, ולידה שם המותג. זהה בשני כיווני העיצוב =====
   מצב המנוחה הוא לוגו שלם וגלוי. רק כשהקוד פועל (המחלקה live) החלקים מוסתרים ונבנים, אבן אחר אבן. */
.defs{position:absolute}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--cream);text-decoration:none;min-width:0;line-height:1}
.logo svg{flex:none;width:38px;height:38px;overflow:visible}
.logo .stone{fill:var(--cream);stroke:var(--navy);stroke-width:1.1}
.logo .stone,.logo .key{transform-box:fill-box}
.logo-w{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.logo-he{font:300 25px/1 var(--f-logo);white-space:nowrap}
.logo-he b{font-weight:700}
.logo-he i{font-style:normal;color:var(--gold-hot)}
.logo-en{font:500 15px/1 var(--f-logo-en);letter-spacing:.32em;margin-inline-end:-.32em;text-transform:uppercase;white-space:nowrap;direction:ltr}
/* הלוגו המלא (בכותרת התחתונה ובמסך הכניסה): סמל, שם, קו זהב, השם באנגלית ושורה קטנה */
.logo-full{gap:clamp(16px,2.4vw,28px)}
.logo-full svg{width:clamp(112px,13vw,168px);height:clamp(112px,13vw,168px)}
.logo-full .logo-w{gap:8px}
.logo-full .logo-he{font-size:clamp(46px,6vw,74px)}
.logo-full .logo-en{align-self:stretch;text-align:center;font-size:clamp(15px,1.9vw,24px);margin-inline-end:0;padding-inline-start:.32em}
.logo-full .logo-name{font-size:clamp(25px,3.6vw,46px);letter-spacing:.26em;padding-inline-start:.26em}
.logo-rule{display:block;align-self:stretch;height:2px;background:linear-gradient(to left,var(--gold-hi),var(--gold-hot),var(--gold-lo));transform-origin:right center}
[dir="ltr"] .logo-rule{background:linear-gradient(to right,var(--gold-hi),var(--gold-hot),var(--gold-lo));transform-origin:left center}
.logo-sub{align-self:stretch;text-align:center;font:400 clamp(13px,1.4vw,16px)/1.3 var(--f-logo);letter-spacing:.14em;color:rgba(var(--cream-rgb),.78)}
@media (max-width:640px){
  .logo-full{flex-direction:column;gap:16px}
  .logo-full .logo-w{align-items:center}
}
/* התנועה של הלוגו */
.live [data-t]{opacity:0;transition:opacity .5s ease,transform .7s cubic-bezier(.2,.8,.2,1),clip-path .9s cubic-bezier(.3,.7,.2,1)}
.live .stone[data-t]{transform:translateY(7px)}
.live .key[data-t]{transform:translateY(-22px)}
.live .logo-he[data-t],.live .logo-name[data-t]{opacity:1;clip-path:inset(-.25em -.1em -.25em 100%)}
[dir="ltr"] .live .logo-name[data-t]{clip-path:inset(-.25em 100% -.25em -.1em)}
.live .logo-rule[data-t]{opacity:1;transform:scaleX(0)}
.live .logo-en[data-t],.live .logo-sub[data-t]{transform:translateY(6px)}
.live [data-t].on{opacity:1;transform:none}
.live .logo-he[data-t].on,[dir] .live .logo-name[data-t].on{clip-path:inset(-.25em -.1em -.25em -.1em)}
.live .key.on{filter:drop-shadow(0 0 7px rgba(255,205,90,.75))}
.live.fade [data-t].on{opacity:0;transition:opacity .8s ease}
/* שם האתר שבכותרת העליונה נכתב פעם אחת, אחרי הכניסה, ומאז נשאר: הוא לא נמוג עם הקשת בין מחזור למחזור */
.live.fade .keep[data-t].on{opacity:1}
/* האיפוס בין מחזור למחזור נעשה בלי מעברים, כדי שהחלקים לא "יימחקו" לעין לפני הבנייה מחדש */
.reset [data-t]{transition:none!important}
@media (prefers-reduced-motion:reduce){.live [data-t]{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important;filter:none!important}}

/* ===== כותרת עליונה: פס בכחול העמוק. זהה בשני כיווני העיצוב ===== */
.top,.foot-band,.dock,.fab,.pre{--sans:var(--f-logo);--serif:"Frank Ruhl Libre","David","Times New Roman",serif;--r:2px;--fwb:600;--hw:300;font-family:var(--sans)}
.top{position:sticky;top:0;z-index:60;background:var(--navy);color:var(--cream);box-shadow:0 0 0 rgba(0,0,0,0);transition:box-shadow .3s}
.top.scrolled{box-shadow:0 10px 30px -18px rgba(4,14,36,.75)}
.top-in{display:flex;align-items:center;gap:12px;height:var(--top)}
.brand{margin-inline-end:auto}
.nav{display:none}
.lang{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:0 15px;border:1px solid rgba(var(--cream-rgb),.42);border-radius:var(--r);font:var(--fwb) 14px var(--sans);color:var(--cream);text-decoration:none;transition:background-color .25s,border-color .25s,color .25s,transform .35s var(--ease)}
.lang:active{background:var(--cream);color:var(--navy)}
.menu{position:relative;flex:none}
.menu summary{list-style:none;width:44px;height:44px;display:grid;place-items:center;cursor:pointer;border-radius:50%;transition:background-color .25s}
.menu summary:active{background:rgba(var(--cream-rgb),.18)}
.menu summary::-webkit-details-marker{display:none}
.bars{display:grid;gap:7px;width:22px}
.bars i{height:1.5px;background:var(--cream);transition:transform .3s var(--ease)}
.menu[open] .bars i:first-child{transform:translateY(4.25px) rotate(45deg)}
.menu[open] .bars i:last-child{transform:translateY(-4.25px) rotate(-45deg)}
.menu nav{position:absolute;top:calc(100% + 8px);inset-inline-end:0;min-width:210px;display:grid;background:#FFFDF8;color:var(--navy);border:1px solid #E5DAC5;border-top:2px solid var(--gold-hot);border-radius:4px;padding:8px;box-shadow:0 24px 50px -24px rgba(var(--navy-rgb),.55)}
.menu nav a{padding:12px 16px;border-radius:var(--r);text-decoration:none;font-size:17px;transition:background-color .2s}
.menu nav a[aria-current],.menu nav a:active{background:#F3EAD9}
.top :focus-visible,.foot-band :focus-visible,.dock :focus-visible,.fab :focus-visible{outline-color:var(--gold-hot)}
/* על רקעים כהים מסגרת הפוקוס בזהב, כדי שמי שמנווט במקלדת יראה איפה הוא */
.hero :focus-visible,.screen :focus-visible,.cover :focus-visible,.season.is-chan :focus-visible,.chan-night :focus-visible,.lb :focus-visible{outline-color:var(--gold-hot)}
[data-look="stone"] .hero :focus-visible{outline-color:var(--ink)}
.menu nav :focus-visible{outline-color:var(--navy)}
@media (max-width:420px){
  .top-in{gap:8px}
  .top .logo svg{width:34px;height:34px}
  .top .logo{gap:8px}
  .top .logo-he{font-size:23px}
  .top .logo-en{font-size:12.5px;letter-spacing:.24em;margin-inline-end:-.24em}
  .lang{padding:0 12px}
}
@media (hover:hover){
  .lang:hover{background:rgba(var(--cream-rgb),.12);border-color:var(--cream)}
  .menu summary:hover{background:rgba(var(--cream-rgb),.12)}
  .menu nav a:hover{background:#F3EAD9}
}
@media (min-width:861px){
  .menu{display:none}
  .top .logo svg{width:44px;height:44px}
  .top .logo{gap:12px}
  .top .logo-he{font-size:29px}
  .top .logo-en{font-size:17px}
  .nav{display:flex;gap:clamp(14px,2.2vw,30px);margin-inline:auto clamp(8px,2vw,28px)}
  .nav a{position:relative;text-decoration:none;font-size:16px;padding:8px 0;white-space:nowrap;color:rgba(var(--cream-rgb),.92);transition:color .25s}
  .nav a::after{content:"";position:absolute;inset-inline:0;bottom:2px;height:1.5px;background:var(--gold-hot);transform:scaleX(0);transition:transform .35s var(--ease)}
  .nav a:hover,.nav a[aria-current]{color:#fff}
  .nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
}

/* ===== מסך פתיחה, כיוון א: תמונה על כל הרוחב, והכותרת עליה בתחתית, על הדרגה כהה ===== */
.hero{position:relative;isolation:isolate;display:flex;align-items:flex-end;overflow:hidden;min-height:min(calc(100svh - var(--top) - var(--dock)),900px);background:#060D1E;color:#fff}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-media img,.hero-media video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 62%}
/* הדרגה כהה מאחורי הטקסט. תמונת הכותל בלילה בהירה באמצע (הקיר המואר), ולכן:
   במחשב ההדרגה באה מלמטה ומהצד של הטקסט, והקיר נשאר מואר בצד השני.
   בטלפון התמונה מוגדלת מעט ומוזזת למעלה, כך שהקיר המואר נראה מעל הכותרת, והטקסט יושב על הרחבה הכהה. */
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,13,30,.94) 0%,rgba(6,13,30,.7) 22%,rgba(6,13,30,.22) 48%,rgba(6,13,30,0) 70%),linear-gradient(to left,rgba(6,13,30,.86) 0%,rgba(6,13,30,.62) 34%,rgba(6,13,30,0) 68%)}
[dir="ltr"] .hero-media::after{background:linear-gradient(to top,rgba(6,13,30,.94) 0%,rgba(6,13,30,.7) 22%,rgba(6,13,30,.22) 48%,rgba(6,13,30,0) 70%),linear-gradient(to right,rgba(6,13,30,.86) 0%,rgba(6,13,30,.62) 34%,rgba(6,13,30,0) 68%)}
@media (max-width:700px){
  [data-look="shabbat"] .hero-media img{top:-23.5%;bottom:auto;height:118%}
  .hero-media::after,[dir="ltr"] .hero-media::after{background:linear-gradient(to top,rgba(6,13,30,.96) 0%,rgba(6,13,30,.9) 34%,rgba(6,13,30,.72) 50%,rgba(6,13,30,.2) 64%,rgba(6,13,30,0) 78%)}
}
.hero-in{padding-block:clamp(84px,17vh,220px) clamp(32px,5vh,64px)}
@media (max-width:860px){.hero-in{padding-bottom:36px}}
.hero .eyebrow{color:rgba(255,255,255,.92)}
.hero .eyebrow::before{background:var(--gold-hot)}
.hero h1{font-size:clamp(32px,4.3vw,58px);line-height:1.1;margin-block:14px 16px;text-shadow:0 2px 26px rgba(0,0,0,.35)}
.hero h1 em{display:block}
[dir="ltr"] .hero h1{font-size:clamp(30px,3.8vw,52px)}
.hero h1 em{font-style:normal;color:var(--gold-hot)}
.hero-b{font:var(--hw2) clamp(21px,2.4vw,30px)/1.3 var(--serif);max-width:34ch}
.hero-p{color:rgba(255,255,255,.92);max-width:54ch;margin-top:12px}
/* שעון ירושלים: תגית בראש מסך הפתיחה, עם סמל שעון בזהב. בטלפון מעל הכותרת, ובמחשב למעלה מתחת לפס העליון */
.hero-zman{display:flex;flex-wrap:wrap;align-items:center;row-gap:3px;width:fit-content;max-width:100%;margin:0 0 16px;padding:7px 15px;border:1px solid rgba(242,182,50,.55);border-radius:18px;background:rgba(6,13,30,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font-size:15px;line-height:1.4;color:rgba(255,255,255,.9);box-shadow:0 10px 24px -14px rgba(0,0,0,.8)}
/* שורת התגיות בראש מסך הפתיחה: שעון ירושלים, ולידו הכפתור "מידע למבקר" */
.hero-tags{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px}
.hero-tags .hero-zman{position:static;margin:0;max-width:100%}
.hero-info{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 16px;border:1px solid rgba(242,182,50,.55);border-radius:999px;background:rgba(6,13,30,.5);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font:600 15px/1 var(--sans);cursor:pointer;box-shadow:0 10px 24px -14px rgba(0,0,0,.8);transition:background-color .2s,border-color .2s}
.hero-info svg{flex:none;width:17px;height:17px;fill:none;stroke:var(--gold-hot);stroke-width:2;stroke-linecap:round}
.hero-info:active{background:rgba(6,13,30,.75)}
@media (hover:hover){.hero-info:hover{border-color:var(--gold-hot);background:rgba(6,13,30,.72)}}
@media (min-width:861px){.hero-tags{position:absolute;z-index:3;top:40px;inset-inline-start:max(var(--gut),calc((100% - 1240px)/2 + var(--gut)));max-width:calc(100% - 2 * var(--gut) - 220px);margin:0}}
[data-look="stone"] .hero-tags{position:static;margin:0 0 16px}
[data-look="stone"] .hero-info{background:transparent;color:var(--ink);border-color:rgba(var(--ink-rgb),.3);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
/* החלונית "מידע למבקר" */
.infobox{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:16px;background:rgba(6,13,30,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.infobox-in{position:relative;width:min(100%,640px);max-height:min(88vh,740px);overflow:auto;background:var(--card);color:var(--ink);border-top:3px solid var(--gold-hot);border-radius:10px;padding:clamp(22px,4vw,34px);box-shadow:0 40px 80px -30px rgba(4,14,36,.85)}
.infobox h2{font-size:clamp(24px,3vw,32px);margin:0 0 14px;padding-inline-end:42px}
.infobox-x{position:absolute;top:10px;inset-inline-end:10px;width:42px;height:42px;border:0;border-radius:50%;background:none;color:var(--ink);font-size:30px;line-height:1;cursor:pointer}
.info-tabs{display:flex;flex-wrap:wrap;gap:8px}
.info-tabs button{appearance:none;min-height:44px;padding:0 17px;border-radius:999px;border:1px solid rgba(var(--ink-rgb),.3);background:none;color:var(--ink);font:var(--fwb) 15.5px var(--sans);cursor:pointer;transition:background-color .2s,color .2s}
.info-tabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
.info-panel .list{margin-top:12px;grid-template-columns:1fr}
.info-panel .list li{padding:12px 0;font-size:16.5px;line-height:1.55}
.infobox .note{margin-top:16px}
@media (hover:hover){.infobox-x:hover{background:var(--bg2)}.info-tabs button:hover{border-color:var(--ink)}}
.hero-zman::before{content:"";flex:none;width:16px;height:16px;margin-inline-end:9px;background:var(--gold-hot);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center/contain no-repeat}
@media (min-width:861px){.hero-zman{position:absolute;z-index:3;top:40px;inset-inline-start:max(var(--gut),calc((100% - 1240px)/2 + var(--gut)));max-width:calc(100% - 2 * var(--gut) - 220px);margin:0}}
.hero-zman span+span::before{content:"·";color:var(--gold-hot);margin-inline:10px}
.hero-zman b{font-weight:600;color:#fff;font-variant-numeric:tabular-nums}
[data-look="stone"] .hero-zman{position:static;color:var(--muted);background:transparent;border-color:rgba(var(--ink-rgb),.25);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;margin:0 0 16px}
[data-look="stone"] .hero-zman b{color:var(--ink)}
/* על התמונה הכהה הכפתור הראשי בזהב עז, עם טקסט בכחול העמוק */
.hero .btn.primary{background:linear-gradient(to bottom,var(--gold-hi),var(--gold-hot));color:var(--navy);box-shadow:0 10px 26px -14px rgba(242,182,50,.9)}
.hero .btn.primary:active{background:linear-gradient(to bottom,var(--gold-hot),var(--gold-lo))}
@media (hover:hover){.hero .btn.primary:hover{background:linear-gradient(to bottom,#FFEBAD,#F7C548)}}
/* הכפתור "סיור מודרך בקול" במסך הפתיחה: שקוף עם מסגרת בהירה, ובזהב בזמן שהקריינות פועלת */
.hero-voice{background:rgba(6,13,30,.42);border-color:rgba(255,255,255,.62);color:#fff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero-voice svg{width:20px;height:20px}
.hero-voice[aria-pressed="true"]{background:var(--gold-hot);border-color:var(--gold-hot);color:var(--navy)}
.hero-voice:active{background:rgba(255,255,255,.24)}
@media (hover:hover){.hero-voice:hover{background:rgba(255,255,255,.16);border-color:#fff}.hero-voice[aria-pressed="true"]:hover{background:var(--gold-hi)}}
[data-look="stone"] .hero-voice{background:transparent;border-color:rgba(var(--ink-rgb),.34);color:var(--ink);-webkit-backdrop-filter:none;backdrop-filter:none}
[data-look="stone"] .hero-voice[aria-pressed="true"]{background:var(--gold-hot);border-color:var(--gold-hot);color:var(--navy)}
.credit{position:absolute;z-index:1;top:10px;inset-inline-end:14px;font-size:11px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.75)}

/* ===== מסך פתיחה, כיוון ב: רקע בהיר, כותרת במרכז, ומתחתיה התמונה במסגרת קשת ===== */
/* התמונה תמיד במסך הראשון: בטלפון היא מעל הכותרת, ובמחשב היא לצד הכותרת */
[data-look="stone"] .hero{flex-direction:column;align-items:center;min-height:0;background:var(--bg);color:var(--ink);text-align:center;padding-bottom:clamp(30px,5vw,56px)}
[data-look="stone"] .hero-in{padding-block:clamp(20px,3.4vw,40px) 0}
[data-look="stone"] .hero-media{position:relative;inset:auto;z-index:0;order:-1;flex:none;margin-top:clamp(18px,3vw,32px);width:min(calc(100% - 2 * var(--gut)),300px);height:min(36svh,330px);border-radius:999px 999px 0 0;background:var(--bg2)}
@media (min-width:861px){
  [data-look="stone"] .hero{flex-direction:row;justify-content:center;gap:clamp(36px,5vw,84px);text-align:start;min-height:min(calc(100svh - var(--top)),820px);padding:clamp(24px,4vh,52px) var(--gut)}
  [data-look="stone"] .hero-in{flex:0 1 600px;width:auto;margin:0;padding:0}
  [data-look="stone"] .hero-media{order:2;margin:0;width:min(36vw,440px);height:min(calc(100svh - var(--top) - 90px),580px)}
  [data-look="stone"] .hero .eyebrow,[data-look="stone"] .hero .btns{justify-content:flex-start}
  [data-look="stone"] .hero h1,[data-look="stone"] .hero-b,[data-look="stone"] .hero-p{margin-inline:0}
}
[data-look="stone"] .hero-media::after{display:none}
[data-look="stone"] .hero-media img,[data-look="stone"] .hero-media video{object-position:50% 100%}
[data-look="stone"] .hero .eyebrow{color:var(--muted);justify-content:center}
[data-look="stone"] .hero .eyebrow::before{background:var(--gold)}
[data-look="stone"] .hero h1{margin-inline:auto;text-shadow:none}
[data-look="stone"] .hero h1 em{color:var(--gold)}
[data-look="stone"] .hero-b,[data-look="stone"] .hero-p{margin-inline:auto}
[data-look="stone"] .hero-p{color:var(--soft)}
[data-look="stone"] .hero .btns{justify-content:center}
[data-look="stone"] .hero .btn.primary,[data-look="stone"] .hero .btn.primary:active{background:var(--btn);color:var(--btn-ink);box-shadow:none}
@media (hover:hover){[data-look="stone"] .hero .btn.primary:hover{background:var(--btn-hover)}}
[data-look="stone"] .credit{top:auto;bottom:8px;inset-inline-end:12px}

/* כיוון ב: תוויות וכותרות ממורכזות בראש כל חלק */
[data-look="stone"] :is(.sec,.sec-s,.page-head)>.wrap>.eyebrow{justify-content:center}
[data-look="stone"] :is(.sec,.sec-s,.page-head)>.wrap>.eyebrow::after{content:"";flex:none;width:28px;height:1px;background:var(--gold)}
[data-look="stone"] :is(.sec,.sec-s,.page-head)>.wrap>:is(h1,h2){text-align:center}
[data-look="stone"] :is(.sec,.sec-s,.page-head)>.wrap>.lead{text-align:center;margin-inline:auto}
[data-look="stone"] .filter,[data-look="stone"] .kinds{justify-content:center}
[data-look="stone"] :is(.sec,.sec-s)>.wrap>.note{text-align:center;margin-inline:auto}

/* ===== פס עונתי ===== */
.season{display:grid;gap:22px;margin-top:clamp(28px,5vw,60px);background:var(--card);border:1px solid var(--line);border-top:2px solid var(--gold);border-radius:var(--r);padding:clamp(24px,4vw,44px)}
.season h2{font-size:clamp(25px,3.1vw,38px);margin-block:10px 10px}
.season p{color:var(--muted);max-width:62ch}
.when{display:inline-block;margin-top:14px;font:var(--fwb) 14.5px/1.4 var(--sans);color:var(--ink)!important;border:1px solid var(--gold);border-radius:var(--r);padding:6px 15px}
.season-b{display:flex;flex-direction:column;gap:10px;justify-content:center}
@media (min-width:861px){.season{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px}.season-b{min-width:250px}}
/* בעונת חנוכה הפס כולו בכחול העמוק, ובו חנוכייה מזהב עם נרות דולקים. זהה בשני כיווני העיצוב */
.season.is-chan{background:radial-gradient(120% 150% at 50% 0%,var(--navy-hi) 0%,var(--navy) 52%,var(--navy-lo) 100%);border-color:rgba(242,182,50,.5);border-top-color:var(--gold-hot);color:var(--cream);box-shadow:0 30px 60px -34px rgba(4,14,36,.8)}
.season.is-chan h2{color:var(--gold-hi)}
.season.is-chan p{color:rgba(var(--cream-rgb),.92)}
.season.is-chan .eyebrow{color:var(--gold-hi)}
.season.is-chan .eyebrow::before{background:var(--gold-hot)}
.season.is-chan .when{color:var(--cream)!important;border-color:var(--gold-hot)}
.season.is-chan .btn.primary{background:linear-gradient(to bottom,var(--gold-hi),var(--gold-hot));color:var(--navy)}
.season.is-chan .btn.ghost{border-color:rgba(var(--cream-rgb),.5);color:var(--cream)}
.season.is-chan .btn.ghost:active{background:rgba(var(--cream-rgb),.2);border-color:var(--cream)}
@media (hover:hover){
  .season.is-chan .btn.primary:hover{background:linear-gradient(to bottom,#FFEBAD,#F7C548)}
  .season.is-chan .btn.ghost:hover{background:rgba(var(--cream-rgb),.14);border-color:var(--cream)}
}
.season-men{display:grid;place-items:center;text-decoration:none}
.season-men svg{width:min(64vw,230px);height:auto;overflow:visible;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4)) drop-shadow(0 0 34px rgba(255,196,96,.42));transition:transform .45s var(--ease)}
@media (hover:hover){.season-men:hover svg{transform:scale(1.05)}}
@media (min-width:861px){.season.is-chan{grid-template-columns:auto minmax(0,1fr) auto}.season-men svg{width:clamp(170px,17vw,240px)}}

/* ===== ארבעת השירותים ===== */
.svcs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px;margin-top:clamp(32px,5vw,60px)}
.svc{display:block;text-decoration:none;min-width:0}
.svc-ph{display:block;aspect-ratio:var(--svc-ar);border-radius:var(--r);overflow:hidden;background:var(--bg2)}
.svc-ph img,.apt-ph img,.card-ph img,.arch img,.g img,.yt img,.wide-ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.svc-cart img{object-position:64% 50%}
.svc b{display:block;font:var(--hw2) clamp(20px,2.2vw,27px)/1.2 var(--serif);margin-top:14px}
.svc-p{display:block;font-size:15px;line-height:1.5;color:var(--muted);margin-top:6px}
@media (min-width:900px){.svcs{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}.svcs.n5{grid-template-columns:repeat(5,minmax(0,1fr));gap:22px}.svcs.n3{grid-template-columns:repeat(3,minmax(0,1fr))}.svc-p{font-size:16px}}
@media (hover:hover){.svc:hover img,.apt:hover img,.card.link:hover img,.g:hover img,.yt:hover img{transform:scale(1.045)}}
[data-look="stone"] .svc,[data-look="stone"] .apt-bd{text-align:center}
[data-look="stone"] .tags{justify-content:center}

/* ===== כרטיסי דירות: תמונה גבוהה ===== */
.apts{display:grid;gap:44px 28px;margin-top:clamp(32px,5vw,60px)}
.apt{display:block;text-decoration:none;min-width:0}
.apt-ph{display:block;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--bg2)}
.tint .apt-ph,.tint .svc-ph,.tint .card-ph{background:var(--bg3)}
.apt-bd{display:block;padding-top:18px}
.apt-n{display:block;font:var(--hw2) clamp(24px,2.5vw,30px)/1.2 var(--serif)}
.apt-p{display:block;color:var(--muted);font-size:16px;line-height:1.55;margin-top:8px}
.tags{display:flex;flex-wrap:wrap;margin-top:12px;font-size:14.5px;font-weight:var(--fwb)}
.tags span+span::before{content:"·";color:var(--gold);margin-inline:9px}
.more{display:inline-block;margin-top:14px;font-weight:var(--fwb);font-size:15.5px;border-bottom:1px solid var(--gold);padding-bottom:2px}
@media (min-width:700px){.apts{grid-template-columns:repeat(3,minmax(0,1fr))}.apts.two{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px;margin-inline:auto}}
@media (max-width:699px){.apt{max-width:420px;margin-inline:auto;width:100%}}

/* ===== מהדלת לכותל ===== */
.walk{background:var(--bg2)}
.walk-in{display:grid;gap:30px;justify-items:center;text-align:center;padding-block:clamp(72px,11vw,120px)}
.walk-tx .eyebrow{justify-content:center}
.walk-tx .lead{margin-inline:auto}
.walk-hint{display:none}
.walk-frame{position:relative;width:min(100%,330px);aspect-ratio:9/16;border-radius:calc(var(--r) * 3);overflow:hidden;background:var(--bg3);box-shadow:0 40px 70px -40px rgba(var(--ink-rgb),.55)}
.walk-frame .show{position:absolute;inset:0;border-radius:0;aspect-ratio:auto;box-shadow:none}
.walk-frame canvas{position:absolute;inset:0;width:100%;height:100%}
.walk-cap{position:absolute;inset-inline:0;bottom:8%;padding:0 18px;text-align:center;font:var(--hw2) clamp(20px,2.1vw,27px)/1.25 var(--serif);color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.85),0 0 2px rgba(0,0,0,.6)}
.route{display:none;list-style:none;margin:0;padding:0}
/* מצב גלילה: מופעל על ידי הקוד רק במחשב. בלי קוד נשארת המצגת הפשוטה */
.walk.scrub .walk-track{height:340vh}
.walk.scrub .walk-stick{position:sticky;top:var(--top);height:calc(100vh - var(--top));height:calc(100svh - var(--top));display:flex;align-items:center}
.walk.scrub .walk-in{grid-template-columns:minmax(0,1fr) auto minmax(0,.8fr);gap:clamp(28px,5vw,80px);align-items:center;justify-items:stretch;text-align:start;padding-block:0}
.walk.scrub .walk-tx .eyebrow{justify-content:flex-start}
.walk.scrub .walk-tx .lead{margin-inline:0}
.walk.scrub .walk-frame{width:auto;height:min(78vh,720px)}
.walk.scrub .walk-frame .show{display:none}
.walk.scrub .walk-hint{display:block;margin-top:26px;font-size:14px;font-weight:var(--fwb);color:var(--muted)}
.walk.scrub .route{display:grid;gap:46px;position:relative;justify-self:start}
.route::before{content:"";position:absolute;inset-inline-start:27px;top:28px;bottom:28px;width:1px;background:rgba(var(--ink-rgb),.18)}
.route li{position:relative;display:flex;align-items:center;gap:16px;color:var(--muted);transition:color .3s}
.route .m{width:56px;height:56px;flex:none;border-radius:50%;display:grid;place-content:center;justify-items:center;background:var(--bg2);border:1px solid rgba(var(--ink-rgb),.25);font:var(--hw2) 22px/1 var(--serif);color:var(--ink);transition:border-color .3s,background-color .3s,color .3s}
.route .m small{font:var(--fwb) 10.5px/1 var(--sans);margin-top:2px}
.route b{font:var(--hw2) 22px var(--serif)}
.route li.on{color:var(--ink)}
.route li.on .m{background:var(--btn);border-color:var(--btn);color:var(--btn-ink)}

/* ===== שני טורים: תמונה גדולה וטקסט ===== */
.split{display:grid;gap:36px;align-items:center}
.arch{margin:0;aspect-ratio:4/5;border-radius:var(--arch);overflow:hidden;background:var(--bg2);width:100%;max-width:470px}
.split .arch{margin-inline:auto}
@media (min-width:861px){.split{grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(48px,8vw,120px)}}
@media (min-width:861px){.split.flip{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)}.split.flip>.arch{order:2}}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:24px 0 0;padding:0}
.chips li{border:1px solid var(--line);background:var(--card);border-radius:var(--r);padding:6px 15px;font-size:15px;font-weight:var(--fwb)}

/* ===== כרטיסים כלליים (אתרי הרובע, סיורים, אוכל, חנוכה) ===== */
.group{display:flex;align-items:center;gap:16px;font-size:25px;margin-top:clamp(40px,6vw,64px)}
.group::after{content:"";flex:1;height:1px;background:rgba(var(--ink-rgb),.14)}
[data-look="stone"] .group::before{content:"";flex:1;height:1px;background:rgba(var(--ink-rgb),.14)}
.swipe{display:none;font-size:13.5px;color:var(--muted);margin-top:6px}
.cards{display:grid;gap:36px 28px;margin-top:clamp(24px,4vw,40px)}
.card{display:flex;flex-direction:column;align-items:flex-start;min-width:0;text-decoration:none}
.card-ph{position:relative;width:100%;aspect-ratio:var(--card-ar);border-radius:var(--r);overflow:hidden;background:var(--bg2)}
.card h3,.card h4{margin:16px 0 6px}
.card p{font-size:16px;line-height:1.6;color:var(--muted)}
.card .btn{margin-top:16px}
.card .langs{font-size:14px;font-weight:var(--fwb);color:var(--ink);margin-top:10px}
[data-look="stone"] .card{align-items:center;text-align:center}
.chip{position:absolute;top:10px;inset-inline-start:10px;background:rgba(var(--bg-rgb),.94);border-radius:var(--r);padding:4px 12px;font-size:13px;font-weight:var(--fwb);line-height:1.4;max-width:calc(100% - 20px);text-align:start}
.cr{position:absolute;bottom:6px;inset-inline-end:9px;font-size:10px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.8)}
@media (min-width:700px){.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.cards.two{grid-template-columns:repeat(2,minmax(0,1fr))}.cards.four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.cards.four{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:699px){
  /* בטלפון: שורת כרטיסים שמחליקים לצד, בלי גלילה של כל העמוד */
  .swipe{display:block}
  .cards.row{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gut));padding:2px var(--gut) 12px;scroll-padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .cards.row::-webkit-scrollbar{display:none}
  .cards.row>.card{flex:0 0 78%;scroll-snap-align:start}
}

/* ===== שאלות נפוצות ===== */
.faq{margin-top:clamp(24px,4vw,44px);border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:21px 0;cursor:pointer;font:var(--hw2) clamp(19px,2vw,24px)/1.3 var(--serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:300 30px/1 var(--serif);color:var(--gold);transition:transform .35s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding-bottom:24px;max-width:70ch;color:var(--soft)}

/* ===== ראש עמוד פנימי ===== */
.page-head{padding-top:clamp(36px,6vw,84px)}
.page-head h1{margin-block:16px 20px}
.back{display:inline-flex;align-items:center;gap:8px;min-height:48px;margin-top:10px;text-decoration:none;font-weight:var(--fwb);font-size:15px;color:var(--muted)}
.head-split{display:grid;gap:26px;align-items:center;padding-bottom:clamp(40px,6vw,80px)}
.head-split.page-top,.head-wide.page-top{padding-top:clamp(24px,5vw,70px)}
.head-tx h1{margin-block:16px 20px}
.head-ph{margin-inline:auto}
@media (max-width:860px){.head-ph{order:-1;aspect-ratio:1/1;max-width:400px}}
@media (min-width:861px){.head-split{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(48px,7vw,110px)}.head-ph{margin-inline-end:0}}
.head-wide .head-tx{max-width:820px}
.wide-ph{margin:clamp(30px,5vw,56px) 0 0;border-radius:var(--r);overflow:hidden;aspect-ratio:16/10;background:var(--bg2)}
.wide-ph img{object-position:58% 100%}
@media (min-width:861px){.wide-ph{aspect-ratio:2.1/1}}

/* שיתוף */
.share{position:relative}
.share summary{list-style:none}
.share summary::-webkit-details-marker{display:none}
.share-box{position:absolute;z-index:5;top:calc(100% + 8px);inset-inline-start:0;min-width:230px;display:grid;background:var(--card);border:1px solid var(--line);border-radius:calc(var(--r) * 2);padding:8px;box-shadow:0 24px 50px -24px rgba(var(--ink-rgb),.4)}
.share-box a,.share-box button{appearance:none;border:0;background:none;text-align:start;font:var(--fwb) 16px var(--sans);color:var(--ink);padding:13px 14px;min-height:48px;border-radius:var(--r);text-decoration:none;cursor:pointer}
@media (hover:hover){.share-box a:hover,.share-box button:hover{background:var(--bg2)}}

/* ===== סינון ===== */
/* פס החיפוש בראש עמוד הדירות: תאריכים, מספר אנשים וכפתור זמינות, בתיבה אחת */
.finder{display:grid;gap:10px;margin-top:clamp(24px,4vw,40px);padding:12px;background:var(--card);border:1px solid var(--line2);border-radius:calc(var(--r) * 2);box-shadow:0 26px 46px -32px rgba(var(--ink-rgb),.5)}
.fd{display:grid;gap:3px;align-content:center;padding:8px 14px;border:1px solid var(--line);border-radius:var(--r);background:#fff;min-width:0}
.fd>span{font:var(--fwb) 13px/1.2 var(--sans);color:var(--muted)}
.fd input{appearance:none;-webkit-appearance:none;border:0;background:none;font:600 17px/1.3 var(--sans);color:var(--ink);min-height:30px;width:100%;padding:0;margin:0}
.fd:focus-within{border-color:var(--ink)}
.fd-n{grid-auto-flow:row}
.step{display:flex;align-items:center;gap:12px}
.step button{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid rgba(var(--ink-rgb),.32);background:var(--card);color:var(--ink);font:600 20px/1 var(--sans);cursor:pointer;display:grid;place-items:center;padding:0}
.step button:active{background:var(--bg3)}
.step output{min-width:2.2ch;text-align:center;font:700 20px/1 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums}
.fd-go{min-height:58px;align-self:stretch}
.finder-note{font-size:14.5px;color:var(--muted);margin-top:10px}
.apt[data-nofit]{display:none}
.finder~.filter{margin-top:16px}
@media (min-width:861px){.finder{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto auto;align-items:stretch}.fd-go{padding-inline:26px}}
@media (max-width:860px){.finder{grid-template-columns:1fr 1fr}.fd-n,.fd-go{grid-column:1/-1}.fd-n{display:flex;align-items:center;justify-content:space-between}}
@media (hover:hover){.step button:hover{border-color:var(--ink);background:var(--bg2)}}
.filter{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:clamp(28px,4vw,44px)}
.filter button{appearance:none;min-height:48px;padding:0 18px;border-radius:var(--r);border:1px solid rgba(var(--ink-rgb),.28);background:var(--card);color:var(--ink);font:var(--fwb) 15px var(--sans);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.filter button[aria-pressed="true"]{background:var(--btn);border-color:var(--btn);color:var(--btn-ink)}
.filter-sep{width:1px;height:26px;background:var(--line2);margin-inline:6px}
.filter .filter-clear{border:0;background:none;text-decoration:underline;text-underline-offset:4px;color:var(--muted);padding:0 8px}
.empty,.soon{margin-top:32px;padding:30px 24px;border:1px dashed var(--line2);border-radius:var(--r);text-align:center;color:var(--muted);font:var(--hw) clamp(19px,2vw,23px)/1.5 var(--serif)}
@media (max-width:560px){.filter-sep{display:none}}

/* ===== עמוד נכס ===== */
.nums{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0;background:var(--line);border-block:1px solid var(--line)}
.nums>div{background:var(--bg);padding:24px 10px;text-align:center}
.nums>div:last-child:nth-child(odd){grid-column:1/-1}
.nums dt{font:var(--hw) clamp(42px,5.6vw,68px)/1 var(--serif);color:var(--num);direction:ltr}
.nums dd{margin:8px 0 0;font-size:14.5px;line-height:1.35;color:var(--muted)}
@media (min-width:700px){.nums{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.nums>div:last-child:nth-child(odd){grid-column:auto}}
.list{list-style:none;margin:28px 0 0;padding:0;display:grid;column-gap:56px}
.list li{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--line)}
.list li::before{content:"";flex:none;width:7px;height:7px;margin-top:.66em;transform:rotate(45deg);background:var(--gold)}
@media (min-width:760px){.list{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== מדורי עמודי נישה: השוואה, ציר זמן, מחירון ===== */
.vs{display:grid;gap:18px;margin-top:clamp(26px,4vw,44px)}
.vs-col{border:1px solid var(--line);border-radius:calc(var(--r) * 2);background:var(--card);padding:clamp(22px,3vw,34px)}
.vs-col h3{font-size:21px;padding-bottom:15px;border-bottom:1px solid var(--line)}
.vs-col ul{list-style:none;margin:0;padding:0}
.vs-col li{position:relative;padding:14px 0;padding-inline-start:27px;font-size:16.5px;line-height:1.6;color:var(--soft);border-bottom:1px solid var(--line)}
.vs-col li:last-child{border-bottom:0;padding-bottom:0}
.vs-col li::before{content:"–";position:absolute;inset-inline-start:0;color:var(--muted)}
.vs-col.ours{border-color:var(--gold);box-shadow:0 22px 46px -32px rgba(var(--ink-rgb),.55)}
.vs-col.ours li{color:var(--ink)}
.vs-col.ours li::before{content:"✓";font-weight:700;color:var(--gold)}
@media (min-width:760px){.vs{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}}

.steps{list-style:none;counter-reset:s;margin:clamp(26px,4vw,44px) 0 0;padding:0}
.steps li{position:relative;display:grid;gap:5px;padding:0 0 30px;padding-inline-start:clamp(54px,7vw,72px)}
.steps li::before{counter-increment:s;content:counter(s);position:absolute;inset-inline-start:0;top:0;width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:var(--bg2);border:1px solid var(--line);font:var(--fwb) 15px/1 var(--sans);color:var(--ink)}
.steps li::after{content:"";position:absolute;inset-inline-start:19px;top:44px;bottom:2px;width:1px;background:var(--line)}
.steps li:last-child{padding-bottom:0}
.steps li:last-child::after{display:none}
.steps-t{font:var(--fwb) 13.5px/1.3 var(--sans);letter-spacing:.05em;color:var(--label)}
.steps b{font:var(--hw2) 21px/1.25 var(--serif)}
.steps li>span:last-child{color:var(--muted);font-size:16.5px;line-height:1.6;max-width:64ch}

.rate{list-style:none;margin:clamp(26px,4vw,40px) 0 0;padding:0;border-top:1px solid var(--line)}
.rate li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:4px 18px;padding:16px 0;border-bottom:1px solid var(--line)}
.rate b{font-weight:var(--fwb);font-size:17px}
.rate span{grid-column:1;font-size:14.5px;color:var(--muted);line-height:1.5}
.rate em{grid-row:1;grid-column:2;font-style:normal;font:var(--hw2) 20px/1 var(--serif);color:var(--ink);white-space:nowrap}

/* מצגות וסרטון */
.shows{display:flex;flex-wrap:wrap;justify-content:center;gap:34px clamp(16px,4vw,60px)}
.shows figure{margin:0;flex:1 1 148px;max-width:300px;min-width:0}
.show{position:relative;aspect-ratio:9/16;border-radius:calc(var(--r) * 2);overflow:hidden;background:var(--bg3);cursor:pointer;box-shadow:0 30px 50px -34px rgba(var(--ink-rgb),.5)}
.show img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease}
.show img.on{opacity:1}
.show .dots{position:absolute;bottom:12px;inset-inline:0;display:flex;justify-content:center;gap:6px;pointer-events:none}
.show .dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5)}
.show .dots i.on{background:#fff}
.shows figcaption{display:grid;justify-items:center;gap:4px;text-align:center;margin-top:16px}
.shows figcaption .eyebrow::before{display:none}
.shows figcaption b{font:var(--hw2) 21px/1.25 var(--serif)}
.shows figcaption span:not(.eyebrow){font-size:15px;color:var(--muted);line-height:1.5}
.shows figcaption .btn{margin-top:10px}
.yt{position:relative;display:block;aspect-ratio:9/16;border-radius:calc(var(--r) * 2);overflow:hidden;background:var(--bg3);box-shadow:0 30px 50px -34px rgba(var(--ink-rgb),.5)}
.yt-play{position:absolute;inset:0;margin:auto;width:70px;height:70px;border-radius:50%;background:rgba(var(--bg-rgb),.94)}
.yt-play::after{content:"";position:absolute;inset:0;margin:auto;width:0;height:0;border-block:11px solid transparent;border-left:18px solid var(--ink);transform:translateX(3px)}

/* גלריה */
.gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense;gap:8px;margin-top:clamp(24px,4vw,40px)}
.g{position:relative;display:block;aspect-ratio:1;border-radius:var(--r);overflow:hidden;background:var(--bg2);cursor:zoom-in}
.g.w{grid-column:span 2;grid-row:span 2}
.g span{position:absolute;bottom:8px;inset-inline-start:8px;background:rgba(var(--bg-rgb),.93);border-radius:var(--r);padding:3px 11px;font-size:13px;font-weight:var(--fwb);line-height:1.5;max-width:calc(100% - 16px)}
@media (min-width:760px){.gal{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}}
/* גלריית חנוכה: ערב אחר ערב, כל ערב עם כותרת נר ותאריך */
.gal-night{margin-top:clamp(32px,5vw,56px)}
.gal-night h3{font-size:clamp(21px,2.2vw,26px)}
.gal-night h3 small{font-size:.68em;font-weight:400;color:var(--muted);margin-inline-start:10px}
.gal-night>p{color:var(--soft);margin-top:6px}
.gal-night .gal{margin-top:16px}

/* ===== מדריכים: מאמר לקריאה נוחה, טור צר ושורות מרווחות ===== */
.guide-head .eyebrow a{color:inherit;text-decoration:none}
.guide-date{margin-top:14px;font-size:14px;color:var(--muted)}
.guide-ph{margin-top:clamp(24px,4vw,40px)}
.guide-ph img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:calc(var(--r) * 2);display:block}
.guide-body{padding-block:clamp(28px,5vw,56px)}
.guide-body section{margin-top:clamp(34px,5vw,52px)}
.guide-body h2{font-size:clamp(24px,2.8vw,32px)}
.guide-body p{font-size:clamp(17px,1.5vw,19px);line-height:1.85;margin-top:14px;color:var(--soft)}
.guide-body .list{margin-top:16px}
.guide-tldr{background:var(--bg2);border-radius:calc(var(--r) * 2);padding:clamp(20px,3vw,30px)}
.guide-tldr ul{margin:12px 0 0;padding-inline-start:20px}
.guide-tldr li{line-height:1.8;margin-top:6px}
.guide-link a,.guide-more a{font-weight:var(--fwb)}
.guide-more{margin-top:clamp(40px,6vw,64px);border-top:1px solid var(--line);padding-top:24px}
.guide-more ul{list-style:none;margin:10px 0 0;padding:0}
.guide-more li{margin-top:10px}
.card-h{font-size:clamp(20px,2vw,24px)}

/* ===== פס הזמנה ===== */
.band{display:grid;gap:26px;align-items:center;background:var(--bg2);border-radius:calc(var(--r) * 2);padding:clamp(28px,5vw,68px)}
.band h2{font-size:clamp(26px,3.3vw,42px);margin-block:12px 12px}
.band h2:first-child{margin-top:0}
.band p{color:var(--soft);max-width:56ch}
.band-nums{font-size:14px;color:var(--muted)!important;margin-top:16px;line-height:1.9}
.band-b{display:grid;gap:10px}
@media (min-width:861px){.band{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(36px,6vw,90px)}}

/* ===== אירועים ===== */
.kinds{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;row-gap:6px;font:var(--hw) clamp(25px,3.6vw,44px)/1.3 var(--serif)}
.kinds li:not(:last-child)::after{content:"";display:inline-block;width:7px;height:7px;transform:rotate(45deg);background:var(--gold);margin-inline:clamp(12px,2vw,24px);vertical-align:middle}
.ev-form{display:grid;gap:14px}
.ev-form label{display:grid;gap:5px}
.ev-form label span{font-size:14px;font-weight:var(--fwb);color:var(--muted)}
.ev-form input,.ev-form select{width:100%;min-height:50px;padding:0 14px;border:1px solid var(--line2);border-radius:var(--r);background:var(--card);color:var(--ink);font:400 17px var(--sans)}
.ev-form .btn{margin-top:6px}

/* ===== חנוכה: לוח שמונת הלילות ===== */
.chdays{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:clamp(24px,4vw,40px)}
.chday{display:grid;gap:2px;align-content:start;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 4px;text-align:center;min-width:0}
.chday b{font:var(--hw) 30px/1.1 var(--serif);color:var(--num)}
.chday small{font-size:12px;line-height:1.35;color:var(--muted)}
.chday .c{font-size:13.5px;font-weight:var(--fwb)}
.chday .tm{font-size:12px;font-weight:var(--fwb);background:var(--bg2);border-radius:var(--r);padding:1px 5px;margin-top:2px;justify-self:center}
.chday.sh{border-color:var(--gold)}
@media (min-width:900px){.chdays{grid-template-columns:repeat(9,minmax(0,1fr))}}
/* המדור בכחול העמוק, ובראשו אותה חנוכייה מזהב שבעמוד השער. זהה בשני כיווני העיצוב */
.chan-night{background:radial-gradient(120% 110% at 50% 0%,var(--navy-hi) 0%,var(--navy) 48%,var(--navy-lo) 100%);color:var(--cream)}
.chan-night h2{color:var(--gold-hi)}
.chan-night .lead{color:rgba(var(--cream-rgb),.92)}
.chan-night .eyebrow{color:var(--gold-hi)}
.chan-night .eyebrow::before{background:var(--gold-hot)}
.chan-night .chday{color:#0D2A5E;border-color:rgba(242,182,50,.45)}
.chan-night .chday.sh{border-color:var(--gold-hot);box-shadow:0 0 0 1px var(--gold-hot)}
.chan-men{display:grid;place-items:center;margin-bottom:clamp(22px,3.4vw,40px)}
.chan-men svg{width:min(72vw,300px);height:auto;overflow:visible;filter:drop-shadow(0 12px 24px rgba(0,0,0,.4)) drop-shadow(0 0 40px rgba(255,196,96,.45))}

/* ===== כותרת תחתונה ===== */
.foot{color:var(--muted);font-size:15.5px}
/* הפס הגדול בכחול העמוק, עם הלוגו המלא. זהה בשני כיווני העיצוב.
   מאחורי הכחול, ברמז בלבד, תמונת הכותל (הקוד מוסיף אותה כשמתקרבים לפס). הכחול מכסה 90 אחוז ויותר, כך שהלוגו והטקסט נשארים בניגודיות מלאה */
.foot-band{position:relative;isolation:isolate;background:radial-gradient(120% 90% at 50% 0%,var(--navy-hi) 0%,var(--navy) 55%,var(--navy-lo) 100%) var(--navy);color:rgba(var(--cream-rgb),.8);padding-block:clamp(56px,8vw,104px) clamp(44px,6vw,72px);line-height:1.7}
.foot-band::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(13,42,94,.9),rgba(8,28,66,.95)),var(--foot-img,none) 50% 40%/cover no-repeat;opacity:0;transition:opacity 1.2s ease}
.foot-band.bg-on::before{opacity:1}
.foot-logo{display:flex;justify-content:center;padding-bottom:clamp(40px,6vw,72px);margin-bottom:clamp(36px,5vw,60px);border-bottom:1px solid rgba(var(--cream-rgb),.16)}
.foot-big{font:var(--hw) clamp(31px,5vw,60px)/1.12 var(--serif);color:var(--cream);text-wrap:balance}
.foot-id{margin-top:16px;max-width:60ch}
.foot-cols{display:grid;gap:30px;margin-top:clamp(32px,5vw,56px);padding-top:clamp(26px,4vw,40px);border-top:1px solid rgba(var(--cream-rgb),.16)}
.foot-h{font-weight:var(--fwb);color:var(--cream);margin-bottom:4px}
.foot a{text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:36px}
.foot-band a{color:var(--cream);transition:color .2s}
.foot-band a:active{color:var(--gold-hot)}
.foot-nav{display:flex;flex-wrap:wrap;align-content:flex-start;gap:2px 24px}
.foot-nav a{font-weight:var(--fwb)}
@media (hover:hover){.foot-cols a:hover{color:var(--gold-hi);text-decoration:underline;text-decoration-color:var(--gold-hot);text-underline-offset:5px}}
.foot-end{padding-block:6px 36px}
.foot-small{margin-top:22px;font-size:13px}
@media (min-width:700px){.foot-cols{grid-template-columns:1fr 1fr}}

/* לוגו שותף AI, מועתק מהאתר הקודם, ונשאר זהה בשני הכיוונים. מצב המנוחה גלוי, והאנימציה רק מוסיפה */
.madeby{display:block!important;margin-top:26px;--b-bg:#16202B;--b-gold:#D9A05B;--b-cream:#F4F1EA}
.madeby .by{display:block;font-size:13px;margin-bottom:8px}
.sbrand{display:flex;align-items:center;gap:12px;background:var(--b-bg);color:var(--b-cream);border-radius:10px;padding:12px 26px;border:1px solid rgba(217,160,91,.35);position:relative;overflow:hidden;text-align:start}
.sbrand::after,.sbrand::before{content:"";position:absolute;top:0;bottom:0;width:8px;background:var(--b-gold)}
.sbrand::after{right:0}.sbrand::before{left:0}
.sbrand .word{display:flex;flex-direction:column;line-height:1.15;position:relative;z-index:1;padding-bottom:6px}
.sbrand .word b{font:700 27px/1.15 "Frank Ruhl Libre","David",Georgia,serif;display:inline-flex;gap:.3em;align-items:baseline}
.sbrand .l,.sbrand .ai{display:inline-block}
.sbrand .ai{color:var(--b-gold)}
.sbrand .rule{height:2px;margin-top:4px;background:linear-gradient(to left,var(--b-gold),transparent);transform-origin:right}
.sbrand .orb{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(217,160,91,.55),rgba(217,160,91,0) 70%);pointer-events:none}
.sbrand .orb:nth-child(1){width:90px;height:90px;left:18%;top:-30px}
.sbrand .orb:nth-child(2){width:60px;height:60px;left:45%;bottom:-20px}
.sbrand .orb:nth-child(3){width:70px;height:70px;left:68%;top:-15px}

/* ===== תפריט תחתון קבוע בטלפון ===== */
.dock{display:none}
@media (max-width:860px){
  body{padding-bottom:var(--dock)}
  /* בכחול העמוק, כמו הכותרת העליונה, עם קו זהב דק מעל. זהה בשני כיווני העיצוב */
  .dock{position:fixed;z-index:55;inset-inline:0;bottom:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-bottom:env(safe-area-inset-bottom,0px);background:var(--navy);border-top:1px solid rgba(242,182,50,.55)}
  .dock a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:64px;text-decoration:none;font:var(--fwb) 12.5px/1 var(--sans);color:var(--cream);transition:background-color .2s,color .2s}
  .dock a:active{background:var(--navy-hi);color:var(--gold-hi)}
  .dock svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
  .dock .ic-wa{color:#3FE07D}
}

/* ===== פס קטן להשוואת שני כיווני העיצוב. מופיע רק אחרי שנכנסו עם ‎?look= ===== */
.lookbar{position:fixed;z-index:70;left:50%;transform:translateX(-50%);bottom:14px;display:flex;gap:4px;padding:4px;background:#0D2A5E;border:1px solid rgba(242,182,50,.5);border-radius:999px;box-shadow:0 14px 34px -14px rgba(0,0,0,.6);direction:rtl}
.lookbar button{appearance:none;border:0;background:transparent;color:#FFF8E7;font:600 13.5px/1 Arial,sans-serif;padding:0 14px;min-height:36px;border-radius:999px;cursor:pointer;white-space:nowrap}
.lookbar button[aria-pressed="true"]{background:#F2B632;color:#0D2A5E}
@media (max-width:860px){.lookbar{bottom:calc(72px + env(safe-area-inset-bottom,0px))}}

/* ===== חלון להגדלת תמונה והודעה קצרה ===== */
.lb{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:rgba(20,24,30,.96);padding:60px 12px 70px}
.lb img{max-width:100%;max-height:100%;border-radius:var(--r);object-fit:contain}
.lb button{position:absolute;appearance:none;border:0;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font:400 26px/1 Arial,sans-serif;cursor:pointer}
.lb-x{top:max(12px,env(safe-area-inset-top,0px));inset-inline-end:12px}
.lb-p{inset-inline-start:10px;top:50%;margin-top:-25px}
.lb-n{inset-inline-end:10px;top:50%;margin-top:-25px}
.lb-c{position:absolute;inset-inline:0;bottom:max(22px,env(safe-area-inset-bottom,0px));text-align:center;color:#FBF7EF;font-size:16px}
.toast{position:fixed;z-index:95;left:50%;transform:translateX(-50%);bottom:calc(120px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:9px 18px;border-radius:var(--r);font-weight:var(--fwb);font-size:14.5px;white-space:nowrap}

/* ===== הבמה והמסכים הגדולים בעמוד הראשי =====
   מסך הפתיחה נדבק למקומו, וכל מסך אחריו עולה מלמטה ומכסה את קודמו. ההדבקה פועלת רק כשהקוד הוסיף את המחלקה on,
   והקוד גם קובע לכל מסך גבוה מהחלון נקודת הדבקה שבה רואים את תחתיתו, כך ששום כפתור לא נחתך. */
.stage{position:relative}
.season-wrap{position:relative;z-index:1;display:flow-root;background:var(--bg)}
.season-wrap .season{margin-block:clamp(28px,5vw,60px)}
/* מודעת החנוכה בעמוד הראשי: לא מלבן על רקע בהיר, אלא מסך כהה ברוחב מלא שמשתלב בערימת המסכים.
   היא נדבקת כמו מסך (הקוד קובע לה את נקודת ההדבקה), ומסך הדירות עולה עליה אחרי שהייה קצרה */
.season-wrap.chan{background:radial-gradient(130% 110% at 50% 0%,var(--navy-hi) 0%,var(--navy) 55%,var(--navy-lo) 100%) var(--navy);border-top:1px solid rgba(242,182,50,.5);box-shadow:0 -24px 40px -24px rgba(4,14,36,.7)}
.season-wrap.chan .season{background:none;border:0;border-radius:0;box-shadow:none;margin-block:0;padding:clamp(34px,7vh,76px) 0}
.stage.on .season-wrap.chan{position:sticky;top:var(--top)}
.stage.on .season-wrap.chan+.stack{margin-top:22vh}
@media (min-width:861px){.stage.on .season-wrap.chan+.stack{margin-top:40vh}}
@media (max-width:860px){
  .season-wrap.chan .season{gap:14px;padding-block:26px 30px;text-align:center}
  .season-wrap.chan .season-men svg{width:min(40vw,150px)}
  .season-wrap.chan .season h2{font-size:24px;margin-block:6px 6px}
  .season-wrap.chan .season .eyebrow{justify-content:center}
  .season-wrap.chan .season .when{margin-top:10px}
}
.stack{position:relative;z-index:1}
.stage.on .hero,.stage.on .screen{position:sticky;top:var(--top)}
.screen{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:calc(100svh - var(--top) - var(--dock));background:var(--navy-lo);color:#fff;--label:rgba(255,255,255,.94)}
/* צל רך שהמסך העולה מטיל על המסך שמתחתיו */
.screen::before{content:"";position:absolute;inset-inline:0;bottom:100%;height:110px;background:linear-gradient(to top,rgba(4,12,30,.42),rgba(4,12,30,0));pointer-events:none}
/* במחשב: קצה עליון רך (מסכה) שמתקצר ככל שהמסך מתקרב למקומו. הקוד מעדכן את ‎--fade בזמן הגלילה */
.stack.feather .screen{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade,0px));mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade,0px))}
.screen-bg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.screen-bg img{position:absolute;inset-inline:0;top:-7%;width:100%;height:114%;max-width:none;object-fit:cover}
.screen-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,17,42,.95) 0%,rgba(6,17,42,.8) 36%,rgba(6,17,42,.42) 66%,rgba(6,17,42,.2) 100%)}
.screen-in{padding-block:clamp(72px,12vh,150px) clamp(40px,7vh,84px)}
.screen-tx{max-width:660px}
.screen .eyebrow::before{background:var(--gold-hot)}
.screen-n{font-family:var(--f-logo-en);font-weight:500;letter-spacing:.14em;color:var(--gold-hot);direction:ltr}
/* בראש כל מסך: שם המחלקה, גדול וברור. מתחתיו, קטן יותר ובזהב, המשפט היפה */
.screen h2{font-size:clamp(34px,4.5vw,58px);font-weight:500;line-height:1.1;margin-block:12px 8px;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.screen-sub{font:var(--hw2) clamp(20px,2.1vw,28px)/1.25 var(--serif);color:var(--gold-hi);margin-bottom:12px;text-shadow:0 1px 14px rgba(0,0,0,.4)}
.screen-p{font-size:clamp(17px,1.6vw,21px);color:rgba(255,255,255,.93);max-width:46ch}
.screen .chips{margin-top:20px}
.screen .chips li{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34);color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.screen .btns{margin-top:26px}
/* כפתור עם מסגרת על מסך כהה (למשל "הזמנה במייל" במסך האוכל) */
.screen .btn.ghost{border-color:rgba(255,255,255,.62);color:#fff;background:rgba(6,13,30,.3)}
.screen .btn.ghost:active{background:rgba(255,255,255,.24);border-color:#fff}
@media (hover:hover){.screen .btn.ghost:hover{background:rgba(255,255,255,.16);border-color:#fff}}
/* הכפתור לעמוד המלא: גבוה במסך, מיד מתחת לכותרת, גדול ובולט */
.screen-go{margin-block:16px 18px}
.btn.big{min-height:58px;padding:12px 34px;font-size:18.5px;min-width:230px}
@media (max-width:860px){.screen-go{margin-block:12px 14px}.btn.big{min-height:54px;font-size:17.5px}}
/* מסך ההסעות: רקע כחול, והתמונה מוצגת במלואה לצד הטקסט */
.screen-side{align-items:center;background:radial-gradient(120% 90% at 50% 0%,var(--navy-hi) 0%,var(--navy) 55%,var(--navy-lo) 100%) var(--navy)}
.screen-side .screen-in{display:grid;gap:24px;align-items:center}
.screen-fig{margin:0;border-radius:6px;overflow:hidden;border:1px solid rgba(255,255,255,.18);box-shadow:0 40px 70px -40px rgba(0,0,0,.75)}
.screen-fig img{width:100%;height:auto}
@media (max-width:860px){
  .screen-in{padding-block:48px 40px}
  .screen-fig{order:-1}
  .screen .chips{gap:6px;margin-top:16px}
  .screen .chips li{font-size:14px;padding:5px 12px}
  .screen .btns{margin-top:20px}
}
@media (min-width:861px){.screen-side .screen-in{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,6vw,90px)}}

/* מסך החנוכה בעמוד הראשי: מסך מלא כמו שאר המסכים, עם תמונת רקע של חנוכייה דולקת. הקצה העליון שלו רך בכל מכשיר,
   כך שהוא נמוג לתוך מסך הפתיחה כשהוא עולה (הקוד קובע את גובה הקצה הרך לפי הגלילה) */
.screen-chan{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade,0px));mask-image:linear-gradient(to bottom,transparent 0,#000 var(--fade,0px))}
.screen-chan .screen-bg img{object-position:50% 38%}
.screen-chan .screen-bg::after{background:linear-gradient(to top,rgba(6,13,30,.96) 0%,rgba(6,13,30,.86) 38%,rgba(6,13,30,.5) 70%,rgba(6,13,30,.26) 100%)}
.screen-when{margin-top:14px;font:var(--fwb) 15px/1.45 var(--sans);color:var(--gold-hi);text-shadow:0 1px 10px rgba(0,0,0,.5)}
/* שהייה: כל מסך נשאר גלוי במלואו לזמן מה, ורק אז המסך הבא מתחיל לעלות עליו.
   הרווח שלפני כל מסך שקוף, ודרכו רואים את המסך הקודם, שעדיין דבוק למקומו */
.stage.on .screen+.screen{margin-top:28vh}
@media (min-width:861px){.stage.on .screen+.screen{margin-top:55vh}}

/* מסך הדירות: רואים בו את הדירות עצמן, כל תמונה היא קישור לעמוד הדירה. במחשב התמונות לצד הטקסט, ובטלפון מעליו */
.screen-apartments .screen-in{display:grid;gap:22px;align-items:end}
.screen-apts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.sapt{position:relative;display:block;aspect-ratio:4/5;border-radius:6px;overflow:hidden;text-decoration:none;color:#fff;border:1px solid rgba(255,255,255,.3);box-shadow:0 30px 50px -30px rgba(0,0,0,.8);transition:border-color .25s,transform .35s var(--ease)}
.sapt img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform .6s var(--ease)}
.sapt::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,17,42,.92) 0%,rgba(6,17,42,.3) 46%,rgba(6,17,42,0) 72%)}
.sapt b{position:absolute;z-index:1;inset-inline:10px;bottom:10px;font:600 clamp(13.5px,1.3vw,18px)/1.25 var(--f-logo);text-shadow:0 1px 8px rgba(0,0,0,.6)}
.sapt:active{border-color:var(--gold-hot)}
.sapt:focus-visible{outline:2px solid var(--gold-hot);outline-offset:3px}
@media (hover:hover){.sapt:hover{border-color:var(--gold-hot)}.sapt:hover img{transform:scale(1.05)}}
/* התגיות לא מוצגות במסך הדירות: התמונות הגדולות מספרות את אותו דבר, והמקום שלהן הולך לתמונות */
.screen-apartments .chips{display:none}
/* בטלפון: התמונות מעל הטקסט, גדולות, בשורה שמחליקים אותה הצידה. רואים שתיים, והשלישית מציצה מהקצה */
@media (max-width:860px){
  .screen-apts{order:-1;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gut));padding:2px var(--gut) 6px;scroll-padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .screen-apts::-webkit-scrollbar{display:none}
  .sapt{flex:0 0 42%;aspect-ratio:5/6;scroll-snap-align:start}
  .screen-apartments .screen-in{padding-top:40px}
  .sapt b{font-size:15px}
}
/* במחשב: התמונות תופסות את רוב רוחב המסך, והטקסט בעמודה צרה לצדן. הרווח בתחתית שומר שהכפתורים הצפים לא יכסו את שמות הדירות */
@media (min-width:861px){
  .screen-apartments .screen-in{grid-template-columns:minmax(0,.72fr) minmax(0,1.6fr);gap:clamp(28px,3.5vw,56px);align-items:center;padding-bottom:76px}
  .screen-apts{gap:16px}
  .sapt{aspect-ratio:3/4}
  .sapt b{inset-inline:14px;bottom:14px;font-size:clamp(16px,1.5vw,21px)}
}

/* מי אנחנו: משפט אחד גדול, בעמוד הראשי בלבד */
.about{padding-block:clamp(40px,6vw,76px) 0}
.about-p{font:var(--hw2) clamp(21px,2.5vw,31px)/1.5 var(--serif);color:var(--ink);margin-top:12px}
/* שורת המשנה בראש עמודי השירותים: מתחת לשם המחלקה הגדול */
.head-sub{font:var(--hw2) clamp(21px,2.3vw,30px)/1.3 var(--serif);color:var(--label);margin-block:-6px 16px}

/* ===== ראש עמוד עם תמונה שלמה (עמוד החנוכה): התמונה על כל המסך, והכיתוב עליה. זהה בשני כיווני העיצוב ===== */
.cover{position:relative;isolation:isolate;display:flex;align-items:flex-end;overflow:hidden;min-height:min(calc(100svh - var(--top) - var(--dock)),860px);background:#060D1E;color:#fff;--label:rgba(255,255,255,.94)}
.cover-media{position:absolute;inset:0;z-index:-1;overflow:hidden}
.cover-media img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 42%}
.cover-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,13,30,.96) 0%,rgba(6,13,30,.78) 30%,rgba(6,13,30,.3) 58%,rgba(6,13,30,.12) 100%)}
.cover-in{padding-block:clamp(90px,18vh,220px) clamp(32px,5vh,60px)}
.cover .eyebrow::before{background:var(--gold-hot)}
.cover h1{font-size:clamp(33px,4.5vw,58px);margin-block:14px 16px;max-width:20ch;text-shadow:0 2px 26px rgba(0,0,0,.45)}
.cover-p{font-size:clamp(17px,1.5vw,20px);color:rgba(255,255,255,.94);max-width:58ch}
.cover .when{color:#fff!important;border-color:var(--gold-hot);background:rgba(6,13,30,.45)}
.cover .btn.ghost{border-color:rgba(255,255,255,.6);color:#fff}
.cover .btn.ghost:active{background:rgba(255,255,255,.22);border-color:#fff}
@media (hover:hover){.cover .btn.ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}}

/* ===== רשת הקוביות בעמוד הנכס: עובדות במספרים, עם תמונות בחלק מהקוביות ===== */
:root{--on-btn-num:var(--gold-hot)}
:root[data-look="stone"]{--on-btn-num:#FFFFFF}
.bento{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:dense;gap:8px}
.b-cell{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:128px;border-radius:calc(var(--r) * 2);background:var(--btn);color:var(--btn-ink)}
.b-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.b-big{grid-column:span 2;aspect-ratio:4/3;color:#fff}
.b-big::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,17,42,.92),rgba(6,17,42,.12) 64%)}
.b-pic{aspect-ratio:1}
.b-wide{grid-column:span 2;aspect-ratio:2/1}
.b-light{background:var(--bg2);color:var(--ink)}
.b-fact-tx{position:relative;z-index:1;display:grid;gap:6px;padding:16px}
.b-fact-tx b{justify-self:start;direction:ltr;font:var(--hw) clamp(44px,6vw,76px)/1 var(--serif);color:var(--on-btn-num)}
.b-big .b-fact-tx b{font-size:clamp(64px,9vw,118px);color:var(--gold-hot)}
.b-light .b-fact-tx b{color:var(--num)}
.b-fact-tx span{font-size:15px;line-height:1.35}
.b-light .b-fact-tx span{color:var(--muted)}
.b-cap{position:absolute;bottom:8px;inset-inline-start:8px;background:rgba(var(--bg-rgb),.93);color:var(--ink);border-radius:var(--r);padding:3px 11px;font-size:13px;font-weight:var(--fwb);line-height:1.5;max-width:calc(100% - 16px)}
@media (min-width:760px){
  .bento{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(150px,17vw,214px);gap:12px}
  .b-big{grid-row:span 2}
  .b-big,.b-pic,.b-wide{aspect-ratio:auto}
  .b-fact-tx{padding:20px}
}
@media (hover:hover){.b-cell:hover img{transform:scale(1.045)}}

/* ===== כפתורים צפים: ניגון וגלילה אוטומטית. בטלפון: רק הניגון, קטן, בצד, מעל התפריט התחתון ===== */
.fab{position:fixed;z-index:56;inset-inline-end:max(16px,env(safe-area-inset-right,0px));bottom:16px;display:flex;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(242,182,50,.6);background:rgba(var(--navy-rgb),.94);color:var(--cream);font:600 14px/1 var(--f-logo);cursor:pointer;box-shadow:0 10px 24px -12px rgba(4,14,36,.75);transition:background-color .25s,color .25s,border-color .25s,transform .35s var(--ease)}
.pill[aria-pressed="true"]{background:var(--gold-hot);border-color:var(--gold-hot);color:var(--navy)}
.pill:active{transform:scale(.94);background:var(--navy-hi)}
.pill[aria-pressed="true"]:active{background:var(--gold-hi)}
.eq{display:inline-flex;gap:3px;align-items:flex-end;height:14px}
.eq i{display:block;width:3px;height:5px;border-radius:2px;background:currentColor}
.eq i:nth-child(2){height:9px}
.pill[aria-pressed="true"] .eq i{height:10px}
.pill-ic::before{content:"▶";font-size:11px}
.pill[aria-pressed="true"] .pill-ic::before{content:"❚❚";font-size:10px}
.pill-sv{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#auto{display:none}
/* בעמוד הראשי, בכל גודל מסך: במסך הפתיחה יש כפתור גדול למדריך הקולי, ולכן הכפתור הקטן שבפינה מוסתר כל עוד הגדול נראה.
   הוא מופיע רק אחרי שמסך הפתיחה כוסה (המחלקה off-hero, שהקוד שם על גוף העמוד). כך אף פעם אין שני כפתורים למדריך על המסך */
.p-home:not(.off-hero) #voice{display:none}
@media (min-width:861px){#auto{display:inline-flex}}
@media (hover:hover){.pill:hover{background:var(--navy-hi);border-color:var(--gold-hot)}.pill[aria-pressed="true"]:hover{background:var(--gold-hi)}}
/* בטלפון: כפתור הניגון קטן, ויושב בקצה התפריט התחתון, במקום שהתפריט מפנה לו. כך הוא אף פעם לא מכסה טקסט או כפתור בעמוד */
@media (max-width:860px){
  .fab{bottom:calc(env(safe-area-inset-bottom,0px) + 12px);inset-inline-end:5px;z-index:57}
  .pill{width:40px;min-height:40px;padding:0;justify-content:center;background:transparent;box-shadow:none;border-color:rgba(242,182,50,.5)}
  .pill:active{background:var(--navy-hi)}
  .pill-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .has-fab .dock{padding-inline-end:50px}
  /* כפתור המדריך הקולי בטלפון: לא בתוך התפריט התחתון (שם הוא נדחק על המילה האחרונה), אלא עיגול צף מעליו, ליד החץ */
  #voice{position:fixed;z-index:56;inset-inline-end:62px;bottom:calc(var(--dock) + 12px);width:44px;height:44px;border-radius:50%;border-color:rgba(242,182,50,.6);background:rgba(var(--navy-rgb),.94);color:var(--gold-hi);box-shadow:0 10px 24px -12px rgba(4,14,36,.75)}
  #voice[aria-pressed="true"]{background:var(--gold-hot);border-color:var(--gold-hot);color:var(--navy)}
  .p-home #voice{inset-inline-end:106px;bottom:calc(var(--dock) + 8px);width:40px;height:40px}
  /* כפתור הגלילה האוטומטית בטלפון: עיגול קטן מעל התפריט התחתון, באותו צד כמו החץ "למעלה" (שם בדרך כלל אין טקסט), והחץ עולה מעליו. רק בעמוד הראשי */
  .hero-zman{font-size:14px;padding:6px 13px}
  /* שני הכפתורים הצפים יושבים זה ליד זה, צמוד מעל התפריט התחתון, ולמסכים יש רווח בתחתית בשבילם. כך הם לא מכסים כפתור */
  .p-home .totop{bottom:calc(var(--dock) + 8px);width:40px;height:40px}
  .p-home .hero-in{padding-bottom:58px}
  .p-home .screen-in{padding-bottom:58px}
  .p-home #auto{display:grid;place-items:center;position:fixed;z-index:56;inset-inline-end:58px;bottom:calc(var(--dock) + 8px);width:40px;height:40px;min-height:0;padding:0;border-radius:50%;border-color:rgba(242,182,50,.6);background:rgba(var(--navy-rgb),.94);color:var(--gold-hi);box-shadow:0 10px 24px -12px rgba(4,14,36,.75)}
  .p-home #auto[aria-pressed="true"]{background:var(--gold-hot);border-color:var(--gold-hot);color:var(--navy)}
  /* במסך הפתיחה כפתור הגלילה לא מוצג, כדי שלא יכסה את הכפתורים. הוא מופיע אחרי שמסך הפתיחה כוסה */
  .p-home:not(.off-hero) #auto{display:none}
  .dock{transition:padding .25s}
}
@media (max-width:400px){.has-fab .dock a{font-size:11.5px;letter-spacing:-.01em}.has-fab .dock{padding-inline-end:48px}}

/* ===== כפתור "חזרה למעלה" ותגית וואטסאפ צפה. שניהם מופיעים רק אחרי שגוללים (המחלקה past על גוף העמוד) =====
   במחשב: החץ מעל כפתורי הניגון והגלילה, והוואטסאפ בפינה הנגדית. בטלפון: רק החץ, מעל התפריט התחתון. */
.totop,.fwa{position:fixed;z-index:56;opacity:0;visibility:hidden;translate:0 12px;transition:opacity .3s,translate .35s var(--ease),visibility 0s .3s,background-color .25s,border-color .25s,transform .35s var(--ease)}
.past .totop,.past .fwa{opacity:1;visibility:visible;translate:0 0;transition-delay:0s}
.totop{inset-inline-end:max(16px,env(safe-area-inset-right,0px));bottom:68px;width:46px;height:46px;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid rgba(242,182,50,.6);background:rgba(var(--navy-rgb),.94);color:var(--gold-hi);cursor:pointer;box-shadow:0 10px 24px -12px rgba(4,14,36,.75)}
.totop svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.totop:active{background:var(--navy-hi);transform:scale(.94)}
.totop:focus-visible,.fwa:focus-visible{outline:2px solid var(--gold-hot);outline-offset:3px}
.fwa{inset-inline-start:max(16px,env(safe-area-inset-left,0px));bottom:16px;display:none;align-items:center;gap:9px;min-height:48px;padding-inline:16px 20px;border-radius:999px;background:var(--wa);color:var(--wa-ink);font:700 15.5px/1 var(--f-logo);text-decoration:none;box-shadow:0 12px 28px -12px rgba(6,56,29,.75)}
.fwa svg{width:24px;height:24px;flex:none}
.fwa:active{background:#17A84E}
@media (min-width:861px){.fwa{display:inline-flex}}
/* בעמוד הראשי יש כפתור וואטסאפ בכל מסך, ולכן התגית הצפה לא מופיעה בו: בלי וואטסאפ כפול ובלי לכסות כפתורים */
.p-home .fwa{display:none!important}
@media (hover:hover){.totop:hover{background:var(--navy-hi);border-color:var(--gold-hot)}.fwa:hover{background:#1FC25C}}
@media (max-width:860px){.totop{bottom:calc(var(--dock) + 12px);inset-inline-end:10px;width:44px;height:44px}}
/* במחשב החץ יושב בשורת הכפתורים הצפים, ולא מעליהם, כדי שלא יכסה תוכן */
@media (min-width:861px){.fab .totop{position:static;display:none;width:40px;height:40px;translate:none}.past .fab .totop{display:grid}}

/* ===== חלון המייל ===== */
.mailbox{position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:20px;background:rgba(6,13,30,.62);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.mailbox-in{position:relative;width:min(100%,430px);display:grid;gap:12px;text-align:center;background:var(--card);color:var(--ink);border-top:3px solid var(--gold-hot);border-radius:8px;padding:34px 26px 24px;box-shadow:0 40px 80px -30px rgba(4,14,36,.85)}
.mailbox h2{font-size:25px;margin:0}
.mailbox-a{font:600 17px/1.4 var(--f-logo-en);color:var(--soft);overflow-wrap:anywhere}
.mailbox .btn{width:100%}
.mailbox-n{font-size:14px;color:var(--muted)}
.mailbox-x{position:absolute;top:6px;inset-inline-end:6px;width:42px;height:42px;border:0;background:none;font-size:28px;line-height:1;color:var(--muted);cursor:pointer;border-radius:50%}
.mailbox-x:active{background:var(--bg3)}
@media (hover:hover){.mailbox-x:hover{background:var(--bg2);color:var(--ink)}}

/* ===== מסך הכניסה: רק בכניסה הראשונה בביקור, ורק כשהקוד יוצר אותו. הקשת נבנית, הכותל מתגלה מבעד לפתח, והשער נפתח =====
   הלוגו המלא נבנה לאט (כחמש שניות), ואז השער נפתח. לחיצה, מקש או גלגול מדלגים.
   כל התנועה כאן היא רק שקיפות, הזזה והגדלה (בלי חיתוכים ובלי שינויי גודל), כדי שתרוץ חלק.
   השער נפתח מיד: הקשת והכותל מופיעים ברכות, וכל הכניסה נמשכת כשתיים וחצי שניות. הלוגו עצמו נבנה אחר כך, בכותרת העליונה.
   גם אם משהו נתקע, האנימציה pre-kill מעלימה את המסך אחרי שש שניות. */
.pre{position:fixed;inset:0;z-index:200;display:grid;place-items:center;overflow:hidden;background:radial-gradient(120% 100% at 50% 0%,var(--navy-hi) 0%,var(--navy) 58%,var(--navy-lo) 100%);transition:opacity .6s ease;animation:pre-kill .01s linear 6s forwards}
.pre.out{opacity:0;pointer-events:none}
/* החלון שבפתח הקשת: בגודלו המלא הוא מכסה את כל המסך, ובהתחלה הוא מוקטן לגודל הפתח. המידות נקבעות בקוד */
.pre-win{position:absolute;left:0;top:0;overflow:hidden;background:#060D1E;opacity:0;transition:opacity .7s ease,transform 1.25s cubic-bezier(.7,0,.2,1)}
.pre.peek .pre-win{opacity:1}
.pre-win img{position:absolute;max-width:none;object-fit:cover;object-position:50% 62%}
/* הדרגה כהה על התמונה שבחלון, כמו זו שעל תמונת הפתיחה בעמוד: בזכותה תחתית התמונה נמסה אל הרקע הכהה של החלון */
.pre-shade{position:absolute;background-image:linear-gradient(to top,rgba(6,13,30,1) 0%,rgba(6,13,30,.7) 22%,rgba(6,13,30,.22) 48%,rgba(6,13,30,0) 70%)}
.pre-logo{position:relative;z-index:1;will-change:transform,opacity;transition:transform 1.25s cubic-bezier(.7,0,.2,1),opacity .5s ease .1s;animation:pre-in .7s ease backwards}
.pre-logo svg{width:clamp(150px,28vw,230px);height:clamp(150px,28vw,230px)}
.pre.open .pre-logo{opacity:0}
@keyframes pre-kill{to{visibility:hidden;opacity:0}}
/* הקשת מופיעה ברכות מתוך הכחול, ולא בבת אחת */
@keyframes pre-in{from{opacity:0}}

/* ===== גרעיניות עדינה מעל העמוד, במחשב בלבד, כדי שהעמוד ירגיש מצולם ולא שטוח ===== */
@media (min-width:861px) and (pointer:fine){
  body::after{content:"";position:fixed;inset:0;z-index:58;pointer-events:none;opacity:.055;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
}

/* ===== החנוכייה הצפה במסך הפתיחה, בעונת חנוכה. הקוד מוסיף אותה, והיא קישור לעמוד חנוכה ===== */
.hmen{position:absolute;z-index:3;top:26px;inset-inline-end:max(var(--gut),calc((100% - 1240px)/2 + var(--gut)));width:190px;display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:#fff}
.hmen svg{width:150px;height:auto;overflow:visible;filter:drop-shadow(0 8px 18px rgba(0,0,0,.45)) drop-shadow(0 0 26px rgba(255,196,96,.38));transition:transform .45s var(--ease)}
.hmen-cap{display:grid;justify-items:center;gap:1px;text-align:center;line-height:1.3;background:rgba(6,17,42,.66);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(242,182,50,.6);border-radius:12px;padding:6px 14px 7px;transition:background-color .25s,border-color .25s}
.hmen-cap b{font:500 18px/1.3 var(--serif);color:var(--gold-hi)}
.hmen-cap small{font-size:13px;color:rgba(255,255,255,.92);white-space:nowrap}
.hmen-cap .go{font-size:13px;font-weight:700;color:var(--gold-hi)}
.hmen .fl,.season-men .fl,.chan-men .fl{transform-box:fill-box;transform-origin:50% 100%}
/* החנוכייה העתיקה (תמונה על רקע כהה): הקצוות נמוגים בעיגול רך, כך שאין מסגרת ואין ריבוע.
   על רקע כחול אחיד (הפס העונתי ועמוד החנוכה) הרקע הכהה של התמונה נעלם לגמרי, ונשארים רק החנוכייה והאור */
.men-pic{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 52%,#000 56%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 52%,#000 56%,transparent 100%)}
.hmen .men-pic{width:204px;max-width:none;margin-bottom:-18px;transition:transform .45s var(--ease)}
.season-men .men-pic{width:min(64vw,250px);mix-blend-mode:screen}
.chan-men .men-pic{width:min(74vw,330px);mix-blend-mode:screen}
@media (min-width:861px){.season-men .men-pic{width:clamp(190px,19vw,260px)}}
@media (max-width:700px){.hmen .men-pic{width:124px}}
@media (hover:hover){.hmen:hover .men-pic{transform:scale(1.05)}}
.hmen:focus-visible{outline:3px solid var(--gold-hi);outline-offset:6px;border-radius:14px}
.hmen:active .hmen-cap{background:rgba(6,17,42,.9);border-color:var(--gold-hi)}
@media (hover:hover){.hmen:hover svg{transform:scale(1.07)}.hmen:hover .hmen-cap{background:rgba(6,17,42,.86);border-color:var(--gold-hi)}}
.hero.has-hmen .credit{inset-inline-end:auto;inset-inline-start:14px}
@media (max-width:860px){.hero.has-hmen .hero-in{padding-top:250px}}
@media (max-width:700px){
  .hmen{width:112px;top:12px;inset-inline-end:10px;gap:5px}
  .hmen svg{width:98px}
  .hmen-cap{padding:4px 9px 5px;border-radius:10px}
  .hmen-cap b{font-size:13.5px}
  .hmen-cap small{display:none}
  .hero.has-hmen .hero-in{padding-top:172px}
}
/* בכיוון "אבן ירושלמית" מסך הפתיחה בהיר וממורכז, ולכן החנוכייה יושבת בראשו, בתוך הזרימה */
[data-look="stone"] .hmen{position:relative;top:auto;inset-inline-end:auto;order:-2;margin:18px auto -6px}
[data-look="stone"] .hero.has-hmen .hero-in{padding-top:clamp(20px,3.4vw,40px)}
/* במחשב התמונה עומדת לצד הכותרת, והחנוכייה צפה בפינה העליונה של מסך הפתיחה, כמו בכיוון הראשי */
@media (min-width:861px){
  [data-look="stone"] .hmen{position:absolute;top:18px;inset-inline-end:var(--gut);order:0;margin:0}
  [data-look="stone"] .hero.has-hmen .hero-in{padding-top:0}
}
/* בטלפון, כשיש חנוכייה, התמונה נמוכה יותר כדי שהכותרת תישאר במסך הראשון */
@media (max-width:860px){[data-look="stone"] .hero.has-hmen .hero-media{height:min(24svh,210px)}}

/* ===== כותרות שעולות מילה אחר מילה. מצב המנוחה גלוי: המילים מוסתרות רק בזמן שהאנימציה עצמה רצה ===== */
.kw{display:inline-block;overflow:hidden;vertical-align:bottom;padding-block:.12em .14em;margin-block:-.12em -.14em}
.kc{display:inline-block}

/* ===== תגובות קטנות בריחוף, בלחיצה ובפוקוס ===== */
.more{transition:border-color .25s,color .25s}
.faq summary{transition:color .2s}
.faq summary:active{color:var(--btn-hover)}
.chips li{transition:border-color .25s,background-color .25s}
.filter button:active{background:var(--bg3);border-color:var(--ink)}
.back{transition:color .2s}
.apt:active .apt-n,.svc:active b{color:var(--btn-hover)}
.g:active img,.apt:active img{transform:scale(1.03)}
.mag{transition:transform .35s var(--ease)}
@media (hover:hover){
  .apt:hover .more{border-bottom-color:var(--ink)}
  .faq summary:hover{color:var(--btn-hover)}
  .chips li:hover{border-color:var(--gold)}
  .filter button:hover{border-color:var(--ink);background:var(--bg2)}
  .filter button[aria-pressed="true"]:hover{background:var(--btn-hover)}
  .back:hover{color:var(--ink)}
  .lb button:hover{background:rgba(255,255,255,.3)}
  .share-box a:hover,.share-box button:hover{color:var(--btn-hover)}
}

/* ===== תנועה. הכול בתוך תנאי: מי שביקש פחות תנועה לא מקבל אותה ===== */
@media (prefers-reduced-motion:no-preference){
  /* מעבר רך בין עמודים: התוכן מתחלף בעדינות, והכותרת העליונה, התפריט התחתון והכפתורים הצפים נשארים במקומם */
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:vt-out .26s ease both}
  ::view-transition-new(root){animation:vt-in .5s var(--ease) both}
  .top{view-transition-name:top}
  .dock{view-transition-name:dock}
  .fab{view-transition-name:fab}
  html:not(.lenis){scroll-behavior:smooth}
  .hero-media img{animation:drift 30s ease-in-out infinite alternate}
  .hero-in>*{animation:rise 1s var(--ease) both}
  .hero-in>h1.kgo{animation:none}
  /* בזמן מסך הכניסה התנועה של מסך הפתיחה מחכה */
  .pre-on .hero-in>*,.pre-on .kgo .kc,.pre-on .hero-media img{animation-play-state:paused}
  .kgo .kc{animation:kc-rise .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--kd,0s) + var(--i,0) * 80ms)}
  /* כרטיסים ותמונות שנכנסים בעדינות כשמגיעים אליהם */
  .inview{animation:rise2 1s var(--ease) both;animation-delay:calc(var(--i,0) * 90ms)}
  .pill[aria-pressed="true"] .eq i{animation:eq 1s ease-in-out infinite}
  .pill[aria-pressed="true"] .eq i:nth-child(2){animation-delay:.2s}
  .pill[aria-pressed="true"] .eq i:nth-child(3){animation-delay:.4s}
  .hmen{animation:floaty 5.5s ease-in-out infinite}
  /* חנוכייה אמיתית לא מתנדנדת */
  .hmen.has-pic{animation:none}
  .hmen .fl,.season-men .fl,.chan-men .fl{animation:flick 1.6s ease-in-out infinite alternate}
  .walk-cap{transition:opacity .22s ease}
  .hero-in>*:nth-child(2){animation-delay:.08s}
  .hero-in>*:nth-child(3){animation-delay:.18s}
  .hero-in>*:nth-child(4){animation-delay:.26s}
  .hero-in>*:nth-child(5){animation-delay:.34s}
  /* כותרות שנכנסות פעם אחת: הקוד מוסיף את המחלקה רגע לפני שהן נכנסות למסך */
  .rise{animation:rise .95s var(--ease) both}
  .sbrand .l,.sbrand .ai{animation:10s ease-in-out infinite}
  .sbrand .l1{animation-name:w1}.sbrand .l2{animation-name:w2}.sbrand .l3{animation-name:w3}.sbrand .l4{animation-name:w4}.sbrand .ai{animation-name:w5}
  .sbrand .rule{animation:w6 10s ease-in-out infinite}
  .sbrand .orb{animation:float 9s ease-in-out infinite}
  .sbrand .orb:nth-child(2){animation-delay:-3s}.sbrand .orb:nth-child(3){animation-delay:-6s}
}
@keyframes drift{from{transform:scale(1.02)}to{transform:scale(1.09) translateY(-1%)}}
/* הכניסה היא תזוזה קלה בלבד, בלי להעלים: גם אם האנימציה נתקעת בתחילתה, הטקסט נשאר קריא */
@keyframes rise{from{opacity:.55;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes w1{0%{opacity:0;filter:blur(6px)}7%,80%{opacity:1;filter:blur(0)}90%,100%{opacity:0;filter:blur(3px)}}
@keyframes w2{0%,2.5%{opacity:0;filter:blur(6px)}9.5%,80.5%{opacity:1;filter:blur(0)}90.5%,100%{opacity:0;filter:blur(3px)}}
@keyframes w3{0%,5%{opacity:0;filter:blur(6px)}12%,81%{opacity:1;filter:blur(0)}91%,100%{opacity:0;filter:blur(3px)}}
@keyframes w4{0%,7.5%{opacity:0;filter:blur(6px)}14.5%,81.5%{opacity:1;filter:blur(0)}91.5%,100%{opacity:0;filter:blur(3px)}}
@keyframes w5{0%,11%{opacity:0;filter:blur(8px)}19%,82%{opacity:1;filter:blur(0)}92%,100%{opacity:0;filter:blur(3px)}}
@keyframes w6{0%,15%{opacity:1;transform:scaleX(0)}27%,82%{opacity:1;transform:scaleX(1)}92%,100%{opacity:0;transform:scaleX(1)}}
@keyframes float{0%,100%{transform:translate(0,0)}33%{transform:translate(10px,-8px)}66%{transform:translate(-8px,6px)}}
@keyframes kc-rise{from{transform:translateY(110%)}to{transform:none}}
@keyframes rise2{from{opacity:.3;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}
@keyframes floaty{0%,100%{translate:0 0;rotate:-1.2deg}50%{translate:0 -10px;rotate:1.2deg}}
@keyframes flick{0%{transform:scale(1,1) skewX(0)}30%{transform:scale(.9,1.1) skewX(3deg)}60%{transform:scale(1.06,.94) skewX(-3deg)}100%{transform:scale(.96,1.05) skewX(1deg)}}
@keyframes vt-out{to{opacity:0}}
@keyframes vt-in{from{opacity:0;transform:translateY(14px)}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important}.pre{display:none!important}}

/* ===== תמונות בתוך מדור (אחת או שתיים זו לצד זו) ===== */
.sec-ph{display:grid;gap:12px;margin-top:clamp(22px,3vw,34px);grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),420px))}
.sec-ph figure{margin:0;border-radius:var(--r);overflow:hidden;background:var(--bg2);aspect-ratio:1}
.sec-ph img{width:100%;height:100%;object-fit:cover;display:block}

/* ===== תפריט עליון: "ראשי" ותפריטי משנה (במחשב נפתחים במעבר עכבר, בטלפון מופיעים מוזחים בתפריט) ===== */
.menu nav a.sub{padding:9px 16px;padding-inline-start:34px;font-size:15px;color:var(--soft)}
@media (min-width:861px){
  .nav{align-items:center;gap:clamp(12px,1.7vw,28px)}
  .nav-i{position:relative;display:flex;align-items:center}
  .nav-i>a{padding-inline-end:13px}
  .nav-i>a::before{content:"";position:absolute;inset-inline-end:0;top:50%;width:5px;height:5px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-75%) rotate(45deg);opacity:.75}
  .nav-sub{position:absolute;top:100%;inset-inline-start:-14px;min-width:230px;display:grid;padding:8px;background:#FFFDF8;border:1px solid #E5DAC5;border-top:2px solid var(--gold-hot);border-radius:4px;box-shadow:0 24px 50px -24px rgba(var(--navy-rgb),.55);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s,transform .2s,visibility .2s;z-index:70}
  .nav-i:hover .nav-sub,.nav-i:focus-within .nav-sub{opacity:1;visibility:visible;transform:none}
  .nav .nav-sub a{color:var(--navy);padding:10px 14px;font-size:15.5px;border-radius:2px;white-space:nowrap}
  .nav .nav-sub a::after{display:none}
  .nav .nav-sub a:hover,.nav .nav-sub a:focus-visible{background:#F3EAD9;color:var(--navy)}
}
@media (min-width:861px) and (max-width:1120px){.nav a{font-size:15px}.nav{gap:12px}}
/* תפריט תחתון בטלפון: "ראשי" ראשון, וכמה פריטים שיש, ברוחב שווה */
@media (max-width:860px){
  .dock{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
  .dock a[aria-current]{color:var(--gold-hi)}
}

/* ===== עמוד השאלות לפי נושאים ===== */
.faq-topics{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(20px,3vw,30px)}
.faq-topics a{padding:8px 16px;border:1px solid var(--line2);border-radius:999px;text-decoration:none;color:var(--ink);font-size:15px;background:var(--card);transition:background-color .2s,border-color .2s}
.faq-topics a:hover{background:var(--bg2);border-color:var(--gold)}
.faq-group{margin-top:clamp(36px,5vw,56px);scroll-margin-top:90px}
.faq-group h2{font-size:clamp(23px,2.6vw,30px);margin-bottom:6px}
.faq-more{white-space:nowrap;font-weight:var(--fwb)}

/* ===== שאלו אותנו: הצ'אט בעמוד הראשי, בתוך "טלפון" בכחול העמוק ===== */
.ask{display:grid;gap:clamp(28px,5vw,64px);align-items:center}
@media (min-width:900px){.ask{grid-template-columns:minmax(0,1fr) 400px}}
.ask-tx .btn{margin-top:18px}
.phone{width:100%;max-width:390px;height:min(620px,82vh);margin-inline:auto;background:var(--navy);border:1.5px solid var(--gold);border-radius:30px;padding:14px 12px;display:flex;flex-direction:column;box-shadow:0 30px 60px -30px rgba(var(--navy-rgb),.65);font-family:var(--sans)}
.phone-head{display:flex;align-items:center;gap:10px;padding:4px 8px 12px;border-bottom:1px solid rgba(var(--cream-rgb),.16);color:var(--cream)}
.phone-av{width:36px;height:36px;border-radius:50%;background:rgba(var(--cream-rgb),.1);display:grid;place-items:center;flex:none}
.phone-av svg{width:24px;height:24px}
.phone-head b{display:block;font-size:15.5px;font-weight:var(--fwb);line-height:1.2}
.phone-head small{display:flex;align-items:center;gap:6px;font-size:12px;color:rgba(var(--cream-rgb),.72)}
.phone-head small::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--wa)}
.chat{flex:1;min-height:0;overflow-y:auto;padding:12px 4px;display:flex;flex-direction:column;gap:8px;scrollbar-width:none;overscroll-behavior:contain}
.chat::-webkit-scrollbar{display:none}
.msg{max-width:88%;padding:9px 13px;border-radius:14px;font-size:15px;line-height:1.55;animation:msg-in .35s cubic-bezier(.2,1.2,.4,1) both}
.msg.bot{background:rgba(var(--cream-rgb),.1);color:var(--cream);align-self:flex-start;border-end-start-radius:4px}
.msg.me{background:var(--gold);color:var(--navy-lo);align-self:flex-end;border-end-end-radius:4px;font-weight:var(--fwb)}
.msg a.more{display:inline-block;margin-top:6px;color:var(--gold-hi);font-weight:var(--fwb);text-decoration:underline;text-underline-offset:3px}
.typing{display:flex;gap:4px;padding:11px 13px;background:rgba(var(--cream-rgb),.1);border-radius:14px;align-self:flex-start}
.typing i{width:6px;height:6px;border-radius:50%;background:rgba(var(--cream-rgb),.6);animation:chat-dot 1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
.chat-quick{display:flex;flex-direction:column;gap:6px;padding-top:8px;max-height:48%;overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain}
.chat-quick button{background:transparent;border:1px solid rgba(233,169,30,.6);color:var(--gold-hi);border-radius:999px;padding:9px 14px;font:inherit;font-size:14.5px;line-height:1.35;cursor:pointer;transition:background-color .2s}
.chat-quick button:hover,.chat-quick button:focus-visible{background:rgba(233,169,30,.14)}
.chat-quick button.back{border-style:dashed;color:rgba(var(--cream-rgb),.8);border-color:rgba(var(--cream-rgb),.35)}
.chat-quick a.go{display:flex;justify-content:center;background:var(--wa);color:var(--wa-ink);text-decoration:none;border-radius:999px;padding:10px 14px;font-size:15px;font-weight:var(--fwb)}
.phone noscript .faq{color:var(--cream);overflow:auto}
@keyframes msg-in{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes chat-dot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.msg,.typing i{animation:none}}

/* ===== הזמנת אוכל מתוך המחירון ===== */
.rate li.pickable .qty{grid-column:2;grid-row:2;justify-self:end}
.qty{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--line2);border-radius:999px;background:var(--card);padding:2px}
.qty button{width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:var(--ink);font:600 21px/1 var(--sans);cursor:pointer;transition:background-color .2s}
.qty button:hover:not(:disabled){background:var(--bg2)}
.qty button:disabled{opacity:.35;cursor:default}
.qty output{min-width:26px;text-align:center;font:600 16px/1 var(--sans);color:var(--ink)}
.qty.on{border-color:var(--gold);background:#FFF6DC}
.rate li:has(> .ev-pick){grid-template-columns:auto minmax(0,1fr) auto;cursor:pointer}
.rate li:has(> .ev-pick) b,.rate li:has(> .ev-pick) span{grid-column:2}
.rate li:has(> .ev-pick) em{grid-column:3}
.ev-pick{grid-row:1/span 2;width:22px;height:22px;margin:2px 0 0;accent-color:var(--navy);cursor:pointer}
.rate li.auto{opacity:.7}
.ev-guests{display:grid;gap:6px;margin-top:clamp(22px,3vw,32px);max-width:320px}
.ev-guests span{font-size:15px;font-weight:var(--fwb);color:var(--ink)}
.ev-guests input,.order-fields input,.order-fields textarea{width:100%;min-height:50px;padding:10px 14px;border:1px solid var(--line2);border-radius:var(--r);background:var(--card);color:var(--ink);font:400 17px var(--sans)}
.order-box{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:calc(var(--r) * 2);padding:clamp(22px,4vw,44px);box-shadow:0 30px 60px -40px rgba(var(--navy-rgb),.35)}
.order-lines{margin-top:22px;border-top:1px solid var(--line)}
.order-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:16px}
.order-line b{white-space:nowrap;font-weight:var(--fwb)}
.order-empty{color:var(--muted);padding:16px 0}
.order-total{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0 4px;font-size:18px;font-weight:var(--fwb)}
.order-total b{font:500 clamp(24px,3vw,30px)/1 var(--serif)}
.order-fields{display:grid;gap:14px;margin-top:22px}
.order-fields label{display:grid;gap:6px}
.order-fields label span{font-size:14px;font-weight:var(--fwb);color:var(--muted)}
@media (min-width:640px){.order-fields{grid-template-columns:1fr 1fr}.order-fields .wide{grid-column:1/-1}}
.order-box .btns{margin-top:22px}
.order-bar{position:fixed;z-index:56;inset-inline:12px;bottom:calc(var(--dock,0px) + 12px);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;padding-inline-start:18px;background:var(--navy);color:var(--cream);border:1px solid var(--gold);border-radius:999px;box-shadow:0 18px 40px -18px rgba(var(--navy-rgb),.7);font-weight:var(--fwb)}
.order-bar .btn{min-height:42px;padding:0 18px;font-size:15px}
@media (min-width:861px){.order-bar{inset-inline:auto;inset-inline-start:24px;bottom:24px;min-width:420px}}
/* הצאט בראש עמוד השאלות: נמוך יותר */
.faq-chat{margin-top:clamp(22px,3vw,32px)}
.faq-chat .phone{height:min(500px,70vh);max-width:440px;margin-inline:0}
/* פס ההזמנה במחשב: באמצע למטה, כדי לא להסתיר את תגית הוואטסאפ הצפה */
@media (min-width:861px){.order-bar{inset-inline:auto;left:50%;right:auto;transform:translateX(-50%);bottom:24px;min-width:460px}}
/* בטלפון: פס ההזמנה מעל הכפתורים הצפים (מדריך קולי, ניגון), שיושבים מעל התפריט התחתון */
@media (max-width:860px){.order-bar{bottom:calc(var(--dock) + 64px)}}
/* ראש עמוד חנוכה: שתי תמונות סמטאות לאורך, זו לצד זו, עם קו דק ביניהן */
.cover-duo{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#060D1E}
.cover-duo img{position:relative;inset:auto;width:100%;height:100%;object-fit:cover}
/* במחשב: התמונות בחצי השמאלי, בלי צל עליהן, והכיתוב בחצי הימני על רקע כחול עמוק. כך רואים את הסמטאות ואת החנוכיות שלמות */
@media (min-width:861px){
  .cover-duo{inset-inline-start:50%;gap:3px}
  .cover-duo::after{display:none}
  .cover:has(.cover-duo){align-items:center;background:radial-gradient(120% 90% at 85% 40%,#10285A 0%,#060D1E 70%)}
  .cover:has(.cover-duo) .cover-in{padding-inline-end:calc(50% + 24px);padding-block:clamp(50px,9vh,110px)}
}
/* כל תמונה עטופה ב-picture (עותק AVIF): העטיפה היא התא, והתמונה ממלאת אותו */
.cover-duo>picture{position:relative;display:block;min-height:0;overflow:hidden}
.cover-duo>picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* ===== שאלו אותנו: לוח רחב. נושאים למעלה, שאלות בצד אחד ותשובה בצד השני ===== */
.ask-head{text-align:center;max-width:720px;margin-inline:auto}
.ask-head .eyebrow{justify-content:center}
.ask-head .lead{margin-inline:auto}
.ask-board{margin-top:clamp(26px,4vw,44px);background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 40px 80px -50px rgba(var(--navy-rgb),.5)}
.ask-tabs{display:flex;gap:8px;padding:14px clamp(14px,2vw,22px);overflow-x:auto;background:var(--bg2);border-bottom:1px solid var(--line);scrollbar-width:none}
.ask-tabs::-webkit-scrollbar{display:none}
.ask-tabs button{flex:none;padding:10px 18px;border-radius:999px;border:1px solid var(--line2);background:var(--card);color:var(--ink);font:600 15.5px/1.2 var(--sans);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.ask-tabs button:hover{border-color:var(--gold)}
.ask-tabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.ask-body{display:grid;grid-template-columns:minmax(0,1fr)}
.ask-qs{display:flex;flex-direction:column;padding:8px clamp(8px,1.4vw,14px)}
.ask-qs>button{position:relative;display:block;width:100%;text-align:start;padding:15px 16px;padding-inline-end:40px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:500 17px/1.45 var(--sans);cursor:pointer;transition:background-color .2s}
.ask-qs>button:last-of-type{border-bottom:0}
.ask-qs>button::after{content:"";position:absolute;inset-inline-end:16px;top:50%;width:8px;height:8px;border:solid var(--gold-lo);border-width:0 0 2px 2px;transform:translateY(-50%) rotate(45deg);transition:transform .25s}
.ask-qs>button:hover{background:var(--bg)}
.ask-qs>button[aria-expanded="true"]{background:#FFF4D6;color:var(--navy);font-weight:600;box-shadow:inset -4px 0 0 var(--gold)}
.ask-ans{position:relative;background:var(--navy);color:var(--cream);padding:clamp(26px,4vw,48px);display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.ask-ans:empty{display:none}
.ask-ans::before{content:"״";position:absolute;top:-18px;inset-inline-end:22px;font:400 150px/1 var(--serif);color:rgba(233,169,30,.16);pointer-events:none}
.ask-q{font:500 clamp(22px,2.3vw,30px)/1.3 var(--serif);color:var(--gold-hi);margin:0}
.ask-a{font-size:clamp(17px,1.35vw,19px);line-height:1.85;margin-top:14px;color:rgba(var(--cream-rgb),.94)}
.ask-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:26px}
.ask-actions .btn.wa{min-height:48px}
.ask-more{color:var(--gold-hi);font-weight:var(--fwb);text-decoration:underline;text-underline-offset:4px}
.ask-ans.in>*{animation:msg-in .45s cubic-bezier(.2,1,.3,1) both}
.ask-ans.in>*:nth-child(2){animation-delay:.06s}.ask-ans.in>*:nth-child(3){animation-delay:.12s}
.ask-all{margin-top:24px}
.faq-chat{margin-top:clamp(20px,3vw,30px)}
@media (min-width:861px){
  .ask-body{grid-template-columns:minmax(0,5fr) minmax(0,6fr);min-height:460px}
  .ask-qs>button::after{transform:translateY(-50%) rotate(45deg)}
  .ask-qs>button[aria-expanded="true"]::after{border-color:var(--gold)}
}
/* בטלפון: התשובה נפתחת מתחת לשאלה, כמו כרטיס */
@media (max-width:860px){
  .ask-qs .ask-ans{margin:2px 0 12px;border-radius:8px;padding:22px 20px}
  .ask-qs>button[aria-expanded="true"]::after{transform:translateY(-30%) rotate(-45deg)}
}
@media (prefers-reduced-motion:reduce){.ask-ans.in>*{animation:none}}

/* ===== עמוד השאלות: עיצוב ===== */
/* פס הכותרת בכחול עמוק, עם הילה של זהב, והלוח עולה עליו מלמטה */
.faq-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(90% 120% at 50% -10%,#1B3F86 0%,var(--navy) 45%,var(--navy-lo) 100%);color:var(--cream);text-align:center;padding:clamp(48px,8vw,104px) 0 clamp(110px,14vw,170px)}
.faq-hero::before{content:"";position:absolute;inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(242,182,50,.7),transparent)}
.faq-hero::after{content:"?";position:absolute;z-index:-1;top:50%;left:50%;transform:translate(-50%,-56%);font:400 clamp(260px,34vw,460px)/1 var(--serif);color:rgba(242,182,50,.07);pointer-events:none}
.faq-hero .eyebrow{justify-content:center;color:var(--gold-hi)}
.faq-hero .eyebrow::before{background:var(--gold-hot)}
.faq-hero h1{color:#fff;margin-block:14px 16px}
.faq-hero .lead{color:rgba(var(--cream-rgb),.88);margin-inline:auto}
.faq-board{position:relative;z-index:2;margin-top:clamp(-130px,-10vw,-80px)}
.faq-board .ask-board{margin-top:0;box-shadow:0 50px 90px -50px rgba(var(--navy-rgb),.7)}
/* כל השאלות לפי נושא */
.faq-all-head{text-align:center}
.faq-all-head .eyebrow{justify-content:center}
.faq-topics{position:sticky;top:calc(var(--top) + 8px);z-index:5;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:clamp(18px,3vw,28px) auto 0;padding:10px;max-width:max-content;background:rgba(var(--bg-rgb),.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:999px}
.faq-topics a{padding:8px 16px;border:0;background:transparent;font-size:15px;font-weight:var(--fwb)}
.faq-topics a:hover{background:var(--bg2)}
.faq-group{display:grid;gap:14px 40px;margin-top:clamp(40px,6vw,72px);scroll-margin-top:calc(var(--top) + 90px)}
.faq-side h2{font-size:clamp(25px,2.6vw,32px);margin:6px 0 4px}
.faq-num{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--navy);color:var(--gold-hi);font:500 17px/1 var(--serif);box-shadow:0 0 0 5px rgba(233,169,30,.18)}
.faq-count{font-size:14px;color:var(--muted)}
.faq-cards{margin-top:0;border-top:0;display:grid;gap:10px}
.faq-cards details{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:0 clamp(16px,2vw,24px);transition:border-color .25s,box-shadow .25s}
.faq-cards details:hover{border-color:var(--line2)}
.faq-cards details[open]{border-color:var(--gold);box-shadow:0 18px 40px -28px rgba(var(--navy-rgb),.45);background:#FFFCF3}
.faq-cards summary{padding:18px 0;font-size:clamp(18px,1.7vw,21px)}
.faq-cards summary::after{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--bg2);font-size:24px;color:var(--gold-lo)}
.faq-cards details[open] summary::after{background:var(--navy);color:var(--gold-hi)}
.faq-cards details p{padding-bottom:20px;line-height:1.85}
@media (min-width:900px){
  .faq-group{grid-template-columns:240px minmax(0,1fr);align-items:start}
  .faq-side{position:sticky;top:calc(var(--top) + 96px)}
}
@media (max-width:860px){.faq-topics{border-radius:14px;max-width:100%}}

/* ===== טבלת זמני תפילה במדריכים ===== */
.tbl-wrap{margin-top:20px;overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--card);box-shadow:0 24px 50px -40px rgba(var(--navy-rgb),.45)}
.ptable{width:100%;min-width:560px;border-collapse:collapse;font-size:15.5px;line-height:1.5}
.ptable thead th{background:var(--navy);color:var(--cream);font-weight:var(--fwb);text-align:start;padding:13px 14px;font-size:15px;white-space:nowrap}
.ptable thead th:first-child{color:var(--gold-hi)}
.ptable tbody th,.ptable td{padding:13px 14px;text-align:start;vertical-align:top;border-top:1px solid var(--line)}
.ptable tbody tr:nth-child(even){background:rgba(var(--bg-rgb),.55)}
.ptable tbody th{font:500 17px/1.35 var(--serif);color:var(--ink);white-space:nowrap;position:sticky;inset-inline-start:0;background:inherit;background-color:var(--card)}
.ptable tbody tr:nth-child(even) th{background-color:#F6EFDF}
.ptable tbody th small{display:block;font:400 12.5px/1.4 var(--sans);color:var(--muted);margin-top:3px;white-space:normal}
.ptable td span{display:block;color:var(--soft)}
.ptable td span+span{margin-top:4px}
.ptable td span:only-child:is(:empty){display:none}
.guide-body .tbl-wrap+.note{margin-top:10px;font-size:14px;color:var(--muted)}
.info-more{margin-top:14px}
.info-more a{font-weight:var(--fwb);color:var(--ink)}