/* hbRail, the one horizontal slider (MG, 16/10/2026). Behaviour: assets/js/polish-rail.js. Contract: ORDERING-UX "Rails (MG)".
   The designer's line: 44px round buttons on her cream with a hairline, ink chevron; ink fill on hover (chevron stays
   visible); a soft fade on the side that has more; no native scrollbar anywhere. Phones: swipe, no buttons. */
/* .hb-rail = the track's parent; hbRail makes it a positioning box only when it is static (sticky hosts stay sticky). */
.hb-rail__track { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none; -ms-overflow-style: none; }
.hb-rail__track::-webkit-scrollbar { display: none; }
.hb-rail__track > * { scroll-snap-align: start; }
/* The fade sits on the inline sides that have more to show (start = right in Hebrew). */
.hb-rail__track--fade { --hb-rail-fs: 0px; --hb-rail-fe: 0px; -webkit-mask-image: linear-gradient(to left, transparent 0, #000 var(--hb-rail-fs), #000 calc(100% - var(--hb-rail-fe)), transparent 100%); mask-image: linear-gradient(to left, transparent 0, #000 var(--hb-rail-fs), #000 calc(100% - var(--hb-rail-fe)), transparent 100%); }
.hb-rail__track--fade:dir(ltr) { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--hb-rail-fs), #000 calc(100% - var(--hb-rail-fe)), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 var(--hb-rail-fs), #000 calc(100% - var(--hb-rail-fe)), transparent 100%); }
.hb-rail__track--fade.has-prev { --hb-rail-fs: 36px; }
.hb-rail__track--fade.has-next { --hb-rail-fe: 36px; }
.hb-rail__track:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 2px; border-radius: 14px; }

.hb-rail__btn {
	position: absolute; top: var(--hb-rail-y, 50%); z-index: 3; display: none; place-items: center; width: 44px; height: 44px; margin-top: -22px; padding: 0;
	border: 1px solid rgba(53, 43, 36, .12); border-radius: 50%; background: var(--hb-filter-bg, #f9f4f0); color: var(--hb-ink-warm, #352b24);
	box-shadow: 0 6px 16px rgba(53, 43, 36, .12); cursor: pointer; transition: background-color .18s ease-out, color .18s ease-out, opacity .18s ease-out, transform .09s ease-out;
}
.hb-rail__btn--prev { right: calc(var(--hb-rail-x1, 0px) - 16px); }
.hb-rail__btn--next { left: calc(var(--hb-rail-x0, 0px) - 16px); }
.hb-rail__btn:dir(ltr).hb-rail__btn--prev { right: auto; left: calc(var(--hb-rail-x0, 0px) - 16px); }
.hb-rail__btn:dir(ltr).hb-rail__btn--next { left: auto; right: calc(var(--hb-rail-x1, 0px) - 16px); }
.hb-rail__chev { width: 9px; height: 9px; margin-inline-start: 3px; border-top: 2px solid currentColor; border-left: 2px solid currentColor; transform: rotate(-45deg); }
.hb-rail__btn--prev .hb-rail__chev { margin-inline: 0 3px; transform: rotate(135deg); }
.hb-rail__btn:dir(ltr) .hb-rail__chev { transform: rotate(135deg); }
.hb-rail__btn--prev:dir(ltr) .hb-rail__chev { transform: rotate(-45deg); }
.hb-rail__btn:disabled { opacity: 0; pointer-events: none; }
.hb-rail__btn[hidden] { display: none !important; }
.hb-rail__btn:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 2px; }
.hb-rail__btn:active { transform: scale(.94); }
@media (hover: hover) and (pointer: fine) {
	.hb-rail__btn { display: grid; }
	.hb-rail__btn:hover { background: var(--hb-ink-warm, #352b24); color: #fff; }
}
@media (prefers-reduced-motion: reduce) { .hb-rail__btn { transition: none; } }
html.hb-a11y-motion .hb-rail__btn { transition: none; }

/* Sticky toolbars: the header pill's gutters on both sides (polish-rail.js sets the margins), rounded all round. */
.hb-sticky-gutter { box-sizing: border-box; max-width: none !important; width: auto !important; }
/* The packages bar keeps a rounded panel shape that reads as the header pill; its chips never sit cut against its edge. */
.hb-pkbar.hb-sticky-gutter.is-stuck { background: rgba(249, 244, 240, .98); }

/* Home reviews (owner 16/10: "למה יש כאן רווח גדול למטה?"). The sage trust panel kept 112px of bottom padding on phones
   for a "more reviews" button that no longer exists, so ~160px of empty sage sat under the cards. Without the slanted
   desktop shape (phones, no mask) the reviews' own --hb-sec-y padding closes the panel: bottom = top. On tablets and
   computers the panel keeps the designer's slanted bottom edge, whose rise is what that padding pays for. */
@media (max-width: 767px) { body .hb-trust { padding-bottom: 0; } }
/* Tablets and computers: the slanted bottom edge rises about 7% of the panel's height (≈78px on a computer). The panel's
   bottom padding is set so the space under the cards matches the space above the title at the edge's highest point and
   grows gently toward its lowest one, instead of 120px on top of the reviews' own --hb-sec-y. */
@media (min-width: 768px) { body .hb-trust { padding-bottom: 72px; } }
@media (min-width: 1024px) { body .hb-trust { padding-bottom: 52px; } }
/* The reviews row on phones is a swipe rail (hbRail): a peek of the next card, no scrollbar. */
.hb-reviews__grid.hb-rail__track { scroll-snap-type: x mandatory; }

/* Path lists ("רוצים אירוע כזה?", help boxes, empty cart; owner 16/10: "אייקונים לא זהים בעיצוב"). Equal choices get
   equal icons: one light sage circle with a sage glyph for every item, no filled "featured" chip. */
body .hb-paths .hb-paths__ico,
body .hb-paths .hb-paths__a--quote .hb-paths__ico { background: #eef2ec; color: #4f624d; }

/* ---- /packages/ #menus (MG, owner 16/10: "אין כאן מרווח מהטקסט מהצדדים", "כפילויות") ------------------------------ */
.hb-pkp__menus .hb-pkp__head { max-width: 62ch; padding-inline: 16px; box-sizing: border-box; }
/* The bagel is a small badge over the title (no roll from the edge, so no half-empty band beside it). */
.hb-pkp__bagel.hb-pkp__bagel--badge { width: 84px; margin: 0 auto 8px; transform: none !important; }
@media (min-width: 1024px) { .hb-pkp__bagel.hb-pkp__bagel--badge { width: 104px; } }
/* "מה ההבדל?": two framed cards, side by side, one per way to order. */
.hb-pkp__vs { max-width: 760px; margin: 22px auto 0; padding-inline: 16px; box-sizing: border-box; }
.hb-pkp__vs-q { margin: 0 0 10px; font-weight: 700; font-size: 16px; text-align: center; color: #352b24; }
.hb-pkp__vs ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.hb-pkp__vs li { display: grid; align-content: start; gap: 4px; padding: 14px 14px 16px; border-radius: 22px; background: #fff; box-shadow: inset 0 0 0 1px rgba(53, 43, 36, .08); text-align: start; }
.hb-pkp__vs-ico { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 4px; border-radius: 50%; background: #eef2ec; color: #4f624d; }
.hb-pkp__vs strong { font-size: 16px; line-height: 1.3; color: #352b24; }
.hb-pkp__vs li > span:last-child { font-size: 14.5px; line-height: 1.45; color: #5b524d; }
@media (min-width: 768px) { .hb-pkp__vs li { padding: 18px 20px 20px; } .hb-pkp__vs strong { font-size: 17px; } }
/* Menu cards: name, price once, one guests line, compact rows with the category icon and the value in a chip. */
.hb-pkp__menu h3 { margin: 0; font-size: 19px; line-height: 1.3; }
.hb-pkp__menu .hb-pkp__price { margin-top: 2px; }
.hb-pkp__menu .hb-pkp__mtot { margin: 4px 0 0; font-size: 15px; line-height: 1.45; }
.hb-pkp__menu .hb-pkp__mtot.is-off > span { font-weight: 600; color: #352b24; }
.hb-pkp__hint { display: inline-flex; align-items: center; min-height: 44px; margin-inline-start: 2px; font-weight: 500; color: #8a5600; text-decoration: underline; text-underline-offset: 3px; }
.hb-pkp__menu .hb-pkp__includes { margin: 10px 0 18px; font-size: 14.5px; }
.hb-pkp__menu .hb-pkp__includes li { grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 6px 0; border-top: 1px solid rgba(53, 43, 36, .08); }
.hb-pkp__inc-ico { display: grid; place-items: center; color: #8c7068; }
.hb-pkp__menu .hb-pkp__includes em { padding: 2px 9px; border-radius: 999px; background: #f2ebe6; font-size: 12.5px; font-weight: 600; line-height: 1.5; color: #5b4a43; white-space: nowrap; text-align: center; }
.hb-pkp__menu { padding-bottom: 18px !important; }

/* ---- A catering menu (/menus/<menu>/), MG 16/10 (owner: "מלא שטח למעלה עד שמגיעים לתפריט") ----------------------- */
/* Compact hero: a small badge (computers only), the eyebrow carries the kind of menu, one facts strip. */
.hb-menu .hb-om__head { padding-block: 18px 6px; }
.hb-menu .hb-om__badge { width: 96px; margin-bottom: 6px; }
@media (max-width: 767px) { .hb-menu .hb-om__badge { display: none; } .hb-menu .hb-om__head { padding-top: 8px; } .hb-menu .hb-om__title { font-size: 34px; line-height: 1.12; } .hb-menu .hb-om__lead { margin-top: 8px; font-size: 16.5px; line-height: 1.45; } }
.hb-menu__facts--strip { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 0; margin-top: 14px; font-size: 15px; }
.hb-menu__facts--strip li { display: inline-flex; align-items: center; gap: 6px; padding: 0 12px; border-radius: 0; background: none !important; color: #352b24; white-space: nowrap; }
.hb-menu__facts--strip li + li { border-inline-start: 1px solid rgba(53, 43, 36, .22); }
.hb-menu__facts--strip li .hb-i { flex: none; color: #8c7068; }
.hb-menu__facts--strip strong { font-weight: 700; }
@media (max-width: 440px) { .hb-menu__facts--strip { font-size: 14px; } .hb-menu__facts--strip li { gap: 4px; padding: 0 8px; } .hb-menu__facts--strip li .hb-i { width: 16px; height: 16px; } }
/* Headings keep the site gutter (they sat 10px from the edge on phones). */
@media (max-width: 767px) { .hb-menu .hb-menu__block-title, .hb-menu .hb-menu__notes > h2 { padding-inline: 6px; } }
/* Every section is the designer's framed panel: cream card, ink title with its category icon, a light chip for the rule. */
.hb-menu .hb-menu__sec { border: 0; border-radius: 28px; background: #f9f4f0; padding: 6px; }
.hb-menu .hb-menu__sec .hb-menu__sec-head,
.hb-menu .hb-menu__sec.is-incl .hb-menu__sec-head,
.hb-menu .hb-menu__sec.is-pick .hb-menu__sec-head { background: none !important; color: #352b24; padding: 12px 14px 10px; gap: 8px 10px; }
.hb-menu .hb-menu__sec-head h3 { display: inline-flex; align-items: center; gap: 10px; font-size: clamp(19px, 1.6vw, 22px); }
.hb-menu__sec-ico { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #fff; color: #8c7068; flex: none; }
.hb-menu .hb-menu__rule,
.hb-menu .hb-menu__sec.is-incl .hb-menu__rule { padding: 3px 12px; border-radius: 999px; background: #eef2ec; color: #3f513e; font-weight: 700; font-size: 13.5px; }
.hb-menu .hb-menu__rule small { color: #5b524d; font-weight: 500; }
.hb-menu .hb-menu__count { background: #fff; color: #352b24; box-shadow: inset 0 0 0 1px rgba(53, 43, 36, .12); }
.hb-menu .hb-menu__sec.is-full .hb-menu__count { background: #657b63; color: #fff; box-shadow: none; }
.hb-menu .hb-menu__sec > .hb-menu__items,
.hb-menu .hb-menu__sec > .hb-menu__cols { background: #fff; }
.hb-menu .hb-menu__sec > .hb-menu__cols { border-radius: 20px 20px 0 0; }
.hb-menu .hb-menu__sec > .hb-menu__items { border-radius: 20px; overflow: hidden; }
.hb-menu .hb-menu__sec > .hb-menu__cols + .hb-menu__items { border-radius: 0 0 20px 20px; }
.hb-menu .hb-menu__sheet { display: grid; gap: 14px; }
.hb-menu .hb-menu__block { display: grid; gap: 14px; }
/* The sticky bar holds the quote's state only, in the site's white bar style; the cart button stays off it. */
@media (max-width: 1023px) {
	body .hb-menu__bar { background: rgba(255, 255, 255, .97); color: #352b24; border-radius: 22px; padding: 8px; padding-inline-start: 16px; box-shadow: 0 10px 30px rgba(53, 43, 36, .2); }
	body .hb-menu__bar p { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; font-size: 13.5px; line-height: 1.35; }
	body .hb-menu__bar p strong { display: inline; font-size: 17px; }
	body .hb-menu__bar [data-hb-menu-picked] { flex-basis: 100%; font-weight: 700; }
	body .hb-menu__bar-sep { display: none; }
	body:has(.hb-menu__bar) .hb-fab--cart { display: none !important; }
	body:has(.hb-fab--cart .hb-cart-count:not([hidden])) .hb-menu__bar { padding-left: 8px; }
}

/* ---- Shared components from defect hunt #2 (MG 16/10) ------------------------------------------------------------ */
/* FAQ titles on inner pages (catering pages, kashrut, seasonal): the same side gutter as the text around them. */
@media (max-width: 767px) { body:not(.home) .hb-faq .hb-faq__title { padding-inline: 6px; } }
/* "לפי סוג אירוע": the label, then one row of chips that slides (hbRail), instead of a cloud on four rows. */
.hb-cp.hb-contact > .hb-cp__evlinks { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 10px; max-width: 980px; margin-inline: auto; }
.hb-cp__evlinks > span { margin: 0; text-align: center; }
.hb-cp__evrow { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; padding: 2px 4px; scroll-padding-inline: 4px; }
.hb-cp__evrow > .hb-chip { flex: none; }
@media (min-width: 1024px) { .hb-cp__evrow:not(.has-prev):not(.has-next) { justify-content: center; } }
/* About: the business details are one quiet line, not four outlined pills. */
.hb-about__facts { gap: 4px 0; }
.hb-about__facts li { padding: 0 12px; border: 0; border-radius: 0; background: none; }
.hb-about__facts li + li { border-inline-start: 1px solid rgba(255, 255, 255, .55); }
.hb-about__facts a { display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 767px) { .hb-about__facts li { padding: 0 8px; } }
/* Reviews on tablets: three columns left ~200px per card ("GOOGLE · 5/5" broke over two lines); two and a peek, sliding. */
@media (min-width: 768px) and (max-width: 1023px) {
	body .hb-reviews__grid.hb-rail__track { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 16px) / 2.2); gap: 16px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; }
	body .hb-reviews__grid.hb-rail__track > * { scroll-snap-align: start; }
}

/* Owner 17/10/2026: the menu bar's button sat ~66px off the bar's left edge (main.css reserves room for the cart
   button, which this page hides). Same 8px inset on both ends. */
@media (max-width: 767px) {
	html body:has(.hb-fab--cart .hb-cart-count:not([hidden])) .hb-contact > .hb-menu__bar,
	html body .hb-menu__bar { padding-left: 8px !important; }
	html body .hb-menu__bar .hb-btn { flex: none; }
}
/* "לפי סוג אירוע:" on phones (owner 17/10/2026): the arrow sat on the last chip ("שבת חתן"). Phones swipe only, no
   arrows, and the row ends with room after its last chip so nothing is ever covered. No fades. */
@media (max-width: 767px) {
	.hb-cp__evlinks .hb-rail__btn { display: none !important; }
	.hb-cp__evrow { padding-inline: 4px 24px; scroll-padding-inline: 4px 24px; }
	.hb-cp__evrow::after { content: ""; flex: 0 0 1px; }
}
.hb-cp__evrow.hb-rail__track--fade { -webkit-mask-image: none; mask-image: none; } /* no fades on this row (owner) */