/* ============================================================
   סרגל הניווט של שורשים וזיכרון
   ------------------------------------------------------------
   עצמאי לגמרי — לא תלוי ב-Tailwind ולא בסגנונות שבתוך הדפים,
   כדי שהתפריט יהיה זהה בכל דף גם כשה-CSS הפנימי שלהם שונה.
   הקידומת snav נבחרה כדי לא להתנגש ב-.navbar/.nav-link הישנים.
   ============================================================ */

:root {
    --snav-ink:      #53411e;
    --snav-ink-dark: #3a2d15;
    --snav-gold:     #c69a3c;
    --snav-gold-dk:  #a87f2b;
    --snav-line:     rgba(198, 154, 60, .14);
    --snav-h:        66px;
}

.snav {
    position: fixed;
    inset-inline: 0;
    top: 0;
    z-index: 60;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--snav-line);
    font-family: Assistant, system-ui, -apple-system, sans-serif;
    transition: box-shadow .22s ease;
}
.snav.is-scrolled { box-shadow: 0 4px 24px rgba(0, 0, 0, .07) }

/* ---------- רצועת המבצע ---------- */
.snav-promo {
    position: relative;
    background: var(--snav-gold);
    color: #fff;
    text-align: center;
    font-size: .875rem;
    font-weight: 600;
    padding: .6rem 2.6rem;
}
.snav-promo a { color: #fff; text-decoration: underline; font-weight: 800 }
.snav-promo strong { font-weight: 800 }
.snav-promo-x {
    position: absolute;
    inset-inline-start: .7rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: 0;
    color: rgba(255, 255, 255, .75);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    padding: .2rem .4rem;
    border-radius: 6px;
    transition: color .18s ease, background-color .18s ease;
}
.snav-promo-x:hover { color: #fff; background: rgba(255, 255, 255, .15) }
.snav-promo[hidden] { display: none }

/* ---------- השורה הראשית ---------- */
.snav-bar {
    max-width: 1280px;
    margin-inline: auto;
    padding: .55rem 1.5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: var(--snav-h);
}

.snav-brand {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex: none;
    text-decoration: none;
}
.snav-emblem { position: relative; width: 44px; height: 44px; flex: none }
.snav-emblem img { width: 100%; height: 100%; display: block }
.snav-flame {
    position: absolute;
    width: 15px;
    top: -5px;
    inset-inline-start: 50%;
    transform: translateX(-50%);
}
.snav-name {
    display: block;
    font-family: 'Frank Ruhl Libre', Georgia, serif;
    font-weight: 700;
    font-size: 1.06rem;
    color: var(--snav-ink-dark);
    line-height: 1.15;
}
.snav-motto {
    display: block;
    font-size: .68rem;
    color: var(--snav-gold-dk);
    font-weight: 600;
}

/* ---------- הקישורים ---------- */
.snav-links {
    display: none;
    align-items: center;
    gap: .1rem;
    flex: 1;
    justify-content: center;
}
.snav-link {
    position: relative;
    padding: .5rem .62rem;
    font-weight: 600;
    font-size: .9rem;
    color: var(--snav-ink);
    text-decoration: none;
    border-radius: 8px;
    white-space: nowrap;
    transition: color .2s ease, background-color .2s ease;
}
/* הקו מתחת לקישור נפתח מהמרכז החוצה */
.snav-link::after {
    content: '';
    position: absolute;
    inset-inline: .62rem;
    bottom: .18rem;
    height: 2px;
    background: var(--snav-gold);
    border-radius: 2px;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .22s cubic-bezier(.23, 1, .32, 1);
}
@media (hover: hover) and (pointer: fine) {
    .snav-link:hover { color: var(--snav-ink-dark); background: rgba(198, 154, 60, .08) }
    .snav-link:hover::after { transform: scaleX(1) }
}
.snav-link[aria-current="page"] {
    color: var(--snav-ink-dark);
    font-weight: 800;
}
.snav-link[aria-current="page"]::after { transform: scaleX(1) }

/* ---------- כפתור ההזמנה ---------- */
.snav-cta {
    display: none;
    flex: none;
    padding: .62rem 1.4rem;
    border-radius: 999px;
    background: var(--snav-gold);
    color: #fff;
    font-weight: 800;
    font-size: .9rem;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 2px 10px rgba(198, 154, 60, .3);
    transition: background-color .18s ease, transform .16s ease-out, box-shadow .18s ease;
}
@media (hover: hover) and (pointer: fine) {
    .snav-cta:hover { background: var(--snav-gold-dk); box-shadow: 0 4px 16px rgba(198, 154, 60, .38) }
}
.snav-cta:active { transform: scale(.97) }

/* ---------- כפתור ההמבורגר ---------- */
.snav-burger {
    margin-inline-start: auto;
    background: none;
    border: 0;
    color: var(--snav-ink);
    cursor: pointer;
    padding: .45rem;
    border-radius: 8px;
    line-height: 0;
    transition: background-color .18s ease, transform .16s ease-out;
}
.snav-burger:active { transform: scale(.94) }
.snav-burger svg { width: 27px; height: 27px }

/* ---------- המגירה שנפתחת מהצד ---------- */
.snav-scrim {
    position: fixed;
    inset: 0;
    z-index: 70;
    background: rgba(36, 27, 13, .45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity .26s ease-out;
}
.snav-scrim[hidden] { display: none }
.snav-scrim.is-open { opacity: 1 }

/* מיקום פיזי בכוונה: translateX אינו מודע לכיוון הכתיבה, ולכן
   inset-inline-end ב-RTL היה מצמיד את המגירה לשמאל ושולח אותה החוצה
   ימינה — כלומר פותח אותה אל מחוץ למסך. right תמיד הצד הימני. */
.snav-mobile {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 80;
    width: min(84vw, 330px);
    height: 100%;
    background: #fffdf8;
    border-left: 1px solid var(--snav-line);
    box-shadow: -12px 0 40px rgba(36, 27, 13, .16);
    padding: 1.1rem 1.3rem 2rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    /* מתחילה מחוץ למסך ונכנסת פנימה. ease-out כדי שתרגיש מיידית. */
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.32, .72, 0, 1);
}
.snav-mobile[hidden] { display: none }
.snav-mobile.is-open { transform: translateX(0) }

.snav-mhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: .8rem;
    margin-bottom: .5rem;
    border-bottom: 1px solid var(--snav-line);
}
.snav-mhead span {
    font-family: 'Frank Ruhl Libre', Georgia, serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--snav-ink-dark);
}
.snav-mclose {
    background: none;
    border: 0;
    color: var(--snav-ink);
    font-size: 1.7rem;
    line-height: 1;
    cursor: pointer;
    padding: .1rem .5rem;
    border-radius: 8px;
    transition: background-color .18s ease, transform .16s ease-out;
}
.snav-mclose:active { transform: scale(.92) }

.snav-mobile a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .78rem .2rem;
    font-weight: 600;
    font-size: 1.02rem;
    color: var(--snav-ink);
    text-decoration: none;
    border-bottom: 1px solid rgba(198, 154, 60, .1);
    transition: color .18s ease;
}
.snav-mobile a[aria-current="page"] { color: var(--snav-ink-dark); font-weight: 800 }
.snav-mobile a:active { color: var(--snav-gold-dk) }

/* "המוצר והמחיר" — הסיבה שהאתר קיים. לא נותנים לו להיבלע ברשימה. */
.snav-mobile a.snav-mbuy {
    background: #fff8e9;
    border: 1px solid rgba(198, 154, 60, .3);
    border-radius: 12px;
    padding: .85rem .9rem;
    margin: .6rem 0;
    font-weight: 800;
    color: var(--snav-ink-dark);
}
.snav-mobile a.snav-mbuy small {
    display: block;
    font-weight: 600;
    font-size: .76rem;
    color: var(--snav-gold-dk);
    margin-top: .12rem;
}

.snav-mobile .snav-mcta {
    margin-top: 1rem;
    justify-content: center;
    background: var(--snav-gold);
    color: #fff;
    font-weight: 800;
    border-radius: 999px;
    border-bottom: 0;
    padding: .95rem 1rem;
    box-shadow: 0 3px 14px rgba(198, 154, 60, .32);
}
.snav-mobile .snav-mcta:active { color: #fff; transform: scale(.98) }

.snav-mfoot {
    margin-top: 1.4rem;
    padding-top: 1rem;
    border-top: 1px solid var(--snav-line);
    font-size: .82rem;
    color: var(--snav-gold-dk);
    line-height: 1.7;
}
.snav-mfoot a { display: inline; padding: 0; border: 0; font-size: .82rem; font-weight: 700 }

/* ---------- נקודות שבירה ---------- */
@media (min-width: 1060px) {
    .snav-links { display: flex }
    .snav-cta   { display: inline-flex; align-items: center }
    .snav-burger { display: none }
    .snav-mobile { display: none !important }
}

/* ריווח לגוף הדף כדי שהתוכן לא ייחבא מתחת לסרגל הקבוע */
body.has-snav { padding-top: var(--snav-h) }
body.has-snav.has-promo { padding-top: calc(var(--snav-h) + 2.5rem) }

@media (prefers-reduced-motion: reduce) {
    .snav, .snav-link, .snav-link::after, .snav-cta, .snav-burger { transition: none }
}

    /* שורת המיצוב — מופיעה מתחת לשם המותג בסרגל */
    .snav-tag { display: block; font-size: .64rem; font-weight: 700;
      color: var(--snav-gold-dk); letter-spacing: .1em; margin-top: 1px }
    @media (max-width: 460px) { .snav-tag { display: none } }