/**
 * Regular pages (package QW, SGO 16/10/2026). Loaded last (inc/polish.php, key 'static') on every page, so it can
 * settle what the earlier layers left uneven, without touching main.css or the files other packages own.
 *
 * 1. One spacing scale (owner, 16/10: "a section title glued to its cards, a huge gap above it"). Reusable tokens:
 *      --hb-sec-y       section padding, the same above and below            44 / 64 / 72 px  (phone / ≥768 / ≥1280)
 *      --hb-title-gap   section title (with its one subline) → its content   20 / 28 / 28 px
 *      --hb-sub-gap     section title → its subline                           8 px
 *      --hb-gutter      side gutter of a hero card (= the home hero)          10 / 13 px
 *      --hb-hero-radius radius of a hero card (= the home hero)               28 / 40 px
 *    Applied below to the pages this package owns (never the home page; the home package may reuse the tokens).
 * 2. Heroes: every hero/intro with a background picture is a rounded card with the home hero's gutters.
 * 3. Packages (/packages/): a short title band, one sticky toolbar (guests · סינון ומיון · count), compact cards.
 */

:root {
	--hb-sec-y: 44px;
	--hb-title-gap: 20px;
	--hb-sub-gap: 8px;
	--hb-gutter: 10px;
	--hb-hero-radius: 28px;
}
@media (min-width: 768px) {
	:root { --hb-sec-y: 64px; --hb-title-gap: 28px; --hb-gutter: 13px; --hb-hero-radius: 40px; }
}
@media (min-width: 1280px) {
	:root { --hb-sec-y: 72px; }
}

/* 1. Rhythm on the pages this package owns (scoped to their article classes; never home, category or product pages). A section is a panel with the same padding
   above and below; a title (with its one subline) sits a fixed --hb-title-gap above its content. Panels that
   carry a bagel overlapping the hero or rolling in from the edge keep their own top padding on purpose. */
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) :is(.hb-pkp__head, .hb-clients > header, .hb-about__team > header, .hb-ev__form > header) { margin-bottom: 0 !important; }
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) :is(.hb-pkp__head, .hb-clients > header, .hb-about__team > header, .hb-ev__form > header) > :is(h2, .hb-about__h2) + p { margin-top: var(--hb-sub-gap) !important; }
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) :is(.hb-pkp__head, .hb-clients > header, .hb-about__team > header, .hb-ev__form > header) + * { margin-top: var(--hb-title-gap) !important; }
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) :is(.hb-reviews__title, .hb-gallery__title, .hb-why__title, .hb-about__numbers > .hb-about__h2, .hb-cp__service > .hb-about__h2, .hb-ev__answer > h2) + :not(p, span) { margin-top: var(--hb-title-gap) !important; }
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) .hb-ev__answer > h2 + .hb-ev__answer-text { margin-top: 12px !important; }
:is(.hb-about, .hb-quote, .hb-ev, .hb-faqp, .hb-galp, .hb-kosher, .hb-pkp, .hb-page, .hb-state, article[class*="hb-cp--"]) :is(.hb-about__story, .hb-about__numbers, .hb-about__team, .hb-about__contact, .hb-gallery.hb-cp__gal, .hb-why.hb-cp__why, .hb-cp__sec.hb-cp__cmp, .hb-cp__sec.hb-cp__steps, .hb-ev__form, .hb-faqp__cta, .hb-page__help, .hb-kosher > .hb-kosher__faq) { padding-block: var(--hb-sec-y) !important; }
.hb-pkp .hb-packages--page .hb-pk-filter.hb-pkbar { margin-top: 0 !important; }

/* 2. Heroes ------------------------------------------------------------------------------------------------- */
/* FX-4 (16/10/2026): the intro block shrink-wrapped its text, so it changed width (399→470px at 768) the moment the
   web font replaced the fallback, and everything centred in it moved. It now takes the band's width up to its cap
   from the first paint; its children stay centred, so nothing looks different. (--hb-gutter itself was measured
   constant from the first paint: 10px under 768, 13px from 768, main.css and this file agree.) */
.hb-about__intro { width: 100%; }
/* The category / tag / event-type title band ran edge to edge on phones (its article has no side padding there). */
@media (max-width: 767px) {
	.hb-cp.hb-shop > .hb-shop__hero.hb-about__hero { margin-inline: var(--hb-gutter); border-radius: var(--hb-hero-radius); }
	.hb-cp.hb-shop > .hb-shop__hero.hb-about__hero .hb-hero__media { border-radius: inherit; }
}

/* 3. Packages ----------------------------------------------------------------------------------------------- */
/* Title band like the category pages: name and one line, no spinning bagel; the cards come up to the first screen. */
.hb-pkp > .hb-about__hero.hb-about__hero--slim { min-height: 0; padding: clamp(22px, 2.2vw, 30px) 20px clamp(20px, 2vw, 28px); justify-content: center; }
.hb-pkp > .hb-about__hero .hb-about__intro { padding-bottom: 0; }
.hb-pkp > .hb-about__hero .hb-about__title { font-size: clamp(30px, 3.4vw, 48px); line-height: 1.08; }
.hb-pkp > .hb-about__hero .hb-about__lead { margin-top: 8px; font-size: clamp(15px, 1.2vw, 18px); line-height: 1.45; }
.hb-pkp > .hb-about__hero .hb-about__hero-bagel { display: none; }
.hb-pkp > .hb-pkp__packages { padding-top: clamp(20px, 2.4vw, 32px); }
.hb-pkp > .hb-pkp__packages > .hb-pkp__head { margin-bottom: 0; }
.hb-pkp > .hb-pkp__packages > .hb-pkp__head .hb-about__h2 { font-size: clamp(26px, 2.4vw, 34px); }
.hb-pkp > .hb-pkp__packages > .hb-pkp__head p { margin-top: var(--hb-sub-gap); font-size: 15.5px; }
.hb-pkp .hb-packages--page .hb-packages__subhead { display: none; }

/* The toolbar: one sticky row on every width. polish-static.js pins it under the header (--hb-pk-top). */
.hb-pkp .hb-packages--page .hb-pk-filter.hb-pkbar {
	position: sticky; top: var(--hb-pk-top, 8px); z-index: 40; display: flex; flex-wrap: nowrap; align-items: center; gap: 8px;
	width: auto; max-width: 1180px; margin: var(--hb-title-gap) auto 18px; padding: 8px 10px; border-radius: 999px;
	background: transparent; box-shadow: none; transition: background-color .25s ease, box-shadow .25s ease;
}
.hb-pkp .hb-pk-filter.hb-pkbar.is-stuck { background: rgba(249, 244, 240, .96); box-shadow: 0 10px 24px rgba(53, 43, 36, .1); -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px); }
.hb-pkp .hb-pk-filter.hb-pkbar > .hb-dd { flex: none; width: auto; min-width: 0; margin: 0; }
.hb-pkp .hb-pk-filter.hb-pkbar > .hb-dd.hb-pkbar__ev { display: none; }
.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn,
.hb-pkbar__open {
	display: inline-flex; align-items: center; gap: 8px; height: 44px; min-height: 44px; width: auto; padding: 0 14px; border: 1px solid rgba(53, 43, 36, .16); border-radius: 999px !important;
	background: #fff; color: #352b24; font: 700 15px/1 var(--hb-font); white-space: nowrap; cursor: pointer; box-shadow: none;
}
.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn .hb-pk-filter__icon { width: 20px; height: 20px; margin: 0; padding: 0; background: none; }
.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn .hb-pk-filter__icon img { width: 20px; height: 20px; }
.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__value { font-size: 15px; }
.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__list { min-width: 220px; }
.hb-pkbar__open { position: relative; }
.hb-pkbar__open svg { flex: none; }
.hb-pkbar__open.is-on { border-color: #657b63; background: #eef2ec; }
.hb-pkbar__n { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 99px; background: #657b63; color: #fff; font-size: 12px; }
.hb-pkbar__n[hidden] { display: none; }
@media (hover: hover) and (pointer: fine) { .hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn:hover, .hb-pkbar__open:hover { border-color: rgba(53, 43, 36, .5); } }
.hb-pkbar__open:focus-visible, .hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn:focus-visible { outline: 2px solid #352b24; outline-offset: 2px; }
.hb-pkp .hb-pk-filter.hb-pkbar > .hb-pkp__count { flex: 1 1 auto; min-width: 0; margin: 0; padding-inline-start: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: end; font-size: 14px; color: #5f524c; }

/* Sheet (phone) / dialog (computer): event type and order. */
.hb-pksheet { position: fixed; inset: 0; z-index: 1200; display: grid; align-items: end; justify-items: center; visibility: hidden; }
.hb-pksheet.is-open { visibility: visible; }
.hb-pksheet__scrim { position: absolute; inset: 0; background: rgba(30, 24, 20, .42); opacity: 0; transition: opacity .3s ease; }
.hb-pksheet.is-open .hb-pksheet__scrim { opacity: 1; }
.hb-pksheet__panel {
	position: relative; width: 100%; max-height: min(86vh, 640px); overflow: auto; padding: 14px 18px calc(16px + env(safe-area-inset-bottom, 0px));
	border-radius: 26px 26px 0 0; background: #fff; color: #352b24; transform: translateY(100%); transition: transform .42s cubic-bezier(.32, .72, 0, 1);
}
.hb-pksheet.is-open .hb-pksheet__panel { transform: none; }
.hb-pksheet__panel::before { content: ""; display: block; width: 40px; height: 5px; margin: 0 auto 12px; border-radius: 5px; background: rgba(53, 43, 36, .18); }
.hb-pksheet__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.hb-pksheet__head h2 { margin: 0; font-size: 21px; line-height: 1.2; }
.hb-pksheet__x { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: #f6efe9; color: #352b24; cursor: pointer; }
.hb-pksheet__x:focus-visible, .hb-pksheet__chip:focus-visible, .hb-pksheet__clear:focus-visible, .hb-pksheet__go:focus-visible { outline: 2px solid #352b24; outline-offset: 2px; }
.hb-pksheet__sec { padding: 14px 0; border-bottom: 1px solid rgba(53, 43, 36, .1); }
.hb-pksheet__sec:last-of-type { border-bottom: 0; }
.hb-pksheet__sec h3 { margin: 0 0 10px; font-size: 16px; }
.hb-pksheet__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hb-pksheet__chip { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 16px; border: 1px solid rgba(53, 43, 36, .18); border-radius: 999px; background: #fff; color: #352b24; font: 600 15px/1.1 var(--hb-font); cursor: pointer; }
.hb-pksheet__chip[aria-checked="true"] { border-color: #352b24; background: #352b24; color: #fff; }
@media (hover: hover) and (pointer: fine) { .hb-pksheet__chip:not([aria-checked="true"]):hover { border-color: #352b24; } }
.hb-pksheet__foot { position: sticky; bottom: calc(-16px - env(safe-area-inset-bottom, 0px)); display: flex; align-items: center; gap: 10px; margin: 6px -18px calc(-16px - env(safe-area-inset-bottom, 0px)); padding: 12px 18px calc(14px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid rgba(53, 43, 36, .1); background: #fff; }
.hb-pksheet__clear { min-height: 44px; padding: 0 6px; border: 0; background: none; color: #352b24; font: 600 15px/1 var(--hb-font); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.hb-pksheet__go { flex: 1 1 auto; min-height: 50px; padding: 0 18px; border: 0; border-radius: 999px; background: #657b63; color: #fff; font: 700 16px/1 var(--hb-font); cursor: pointer; }
.hb-pksheet__go:hover { background: #5a6f58; }
html.hb-pksheet-open { overflow: hidden; }
@media (min-width: 768px) {
	.hb-pksheet { align-items: center; }
	.hb-pksheet__panel { width: min(520px, calc(100vw - 40px)); border-radius: 28px; transform: translateY(16px) scale(.98); opacity: 0; transition: transform .3s cubic-bezier(.22, 1, .36, 1), opacity .2s ease; }
	.hb-pksheet.is-open .hb-pksheet__panel { transform: none; opacity: 1; }
	.hb-pksheet__panel::before { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-pksheet__panel, .hb-pksheet__scrim, .hb-pkp .hb-pk-filter.hb-pkbar { transition: none !important; }
}

/* What a package includes: a sage check, not the X-shaped logo mark (brand rule: the X never reads as "remove"). */
.hb-pkp .hb-pk-card__items li::before { width: 14px; height: 14px; background: #657b63; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%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='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat; }
@media (max-width: 479px) { .hb-pkp .hb-pk-filter.hb-pkbar > .hb-pkp__count { display: none; } }

/* Compact package cards on computers: a whole card (photo, name, what is in it, price, button) on the first screen
   at 1440×900. Wider photo, smaller name, the list in two columns, price and button side by side. */
@media (min-width: 1024px) {
	.hb-pkp > .hb-pkp__packages { padding-top: 22px; }
	.hb-pkp > .hb-pkp__packages > .hb-pkp__head .hb-about__h2 { font-size: 30px; line-height: 1.15; }
	.hb-pkp > .hb-pkp__packages > .hb-pkp__head p { font-size: 15.5px; line-height: 1.4; }
	.hb-pkp .hb-packages--page .hb-pk-filter.hb-pkbar { margin-bottom: 12px; }
	.hb-pkp .hb-packages--page .hb-pk-card__media { aspect-ratio: 2.75 / 1; height: auto; margin: 12px 12px 0; }
	.hb-pkp .hb-packages--page .hb-pk-card__media img { width: 100%; height: 100%; object-fit: cover; }
	.hb-pkp .hb-packages--page .hb-pk-card__body { padding: 12px 22px 4px; }
	.hb-pkp .hb-packages--page .hb-pk-card__title { margin: 0 0 6px; font-size: 24px; line-height: 1.2; }
	.hb-pkp .hb-packages--page .hb-pk-card__items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 12px; }
	.hb-pkp .hb-packages--page .hb-pk-card__items li { margin: 0; font-size: 14px; line-height: 1.3; }
	.hb-pkp .hb-packages--page .hb-pk-card__foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; padding: 10px 22px 0; }
	.hb-pkp .hb-packages--page .hb-pk-card__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 6px; padding: 0; }
	.hb-pkp .hb-packages--page .hb-pk-card__from { width: auto; font-size: 14px; }
	.hb-pkp .hb-packages--page .hb-pk-card__amount { font-size: 24px; line-height: 1.15; white-space: nowrap; }
	.hb-pkp .hb-packages--page .hb-pk-card__total { flex-basis: 100%; font-size: 13.5px; }
	.hb-pkp .hb-packages--page .hb-pk-card__cta.hb-btn { width: auto; min-height: 48px; height: 48px; padding: 0 18px; font-size: 16px; }
	.hb-pkp .hb-packages--page .hb-pk-card__note { grid-column: 1 / -1; margin: 0; padding: 4px 0 12px; line-height: 1.35; }
}
@media (max-width: 767px) {
	.hb-pkp > .hb-about__hero.hb-about__hero--slim { padding: 20px 16px 18px; }
	.hb-pkp > .hb-about__hero .hb-about__title { font-size: 27px; }
	.hb-pkp > .hb-about__hero .hb-about__lead { margin-top: 6px; font-size: 14.5px; }
	.hb-pkp .hb-packages--page .hb-pk-filter.hb-pkbar { margin-inline: -4px; padding: 6px 6px; }
	.hb-pkp .hb-pk-filter.hb-pkbar .hb-dd__btn, .hb-pkbar__open { padding: 0 12px; font-size: 14.5px; }
	.hb-pkp .hb-pk-filter.hb-pkbar > .hb-pkp__count { font-size: 13px; }
}

/* ================================================================================================
   Three ways to order (template-parts/catering/paths.php). Every regular page ends with the same three choices:
   build it yourself, ready packages, a quote. White tiles on the rose band, one icon, one line, an arrow.
   Phone: stacked rows. 768+: three in a row. Compact (page.php help, 404): the titles only, as pills.
   ================================================================================================ */
.hb-paths { display: grid; gap: 10px; max-width: 980px; margin: 26px auto 0; padding: 0; list-style: none; text-align: start; }
.hb-paths > li { margin: 0; min-width: 0; }
.hb-paths__a {
	display: grid; grid-template-columns: 44px minmax(0, 1fr) 18px; align-items: center; gap: 14px; height: 100%; min-height: 64px;
	padding: 14px 16px; border: 1px solid rgba(53, 43, 36, .1); border-radius: 22px; background: #fff; color: var(--hb-ink-warm, #352b24);
	text-decoration: none; box-shadow: 0 1px 2px rgba(53, 43, 36, .05); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.hb-paths__ico { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #eef2ec; color: #4f624d; }
.hb-paths__ico svg { width: 22px; height: 22px; }
.hb-paths__txt { display: grid; gap: 3px; min-width: 0; }
.hb-paths__txt strong { font-weight: 700; font-size: 17px; line-height: 1.25; }
.hb-paths__txt small { font-weight: 400; font-size: 14.5px; line-height: 1.4; color: #5b524d; }
.hb-paths__go { display: grid; place-items: center; color: #657b63; }
.hb-paths__go svg { width: 18px; height: 18px; } /* the chevron already points onward (left) */
.hb-paths__a:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) {
	.hb-paths__a:hover { border-color: rgba(101, 123, 99, .55); box-shadow: 0 8px 22px rgba(53, 43, 36, .08); transform: translateY(-2px); }
}
.hb-paths__or { margin: 14px 0 0 !important; font-size: 15.5px !important; }
.hb-paths__or a { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; display: inline-flex; align-items: center; min-height: 44px; }
@media (min-width: 768px) {
	.hb-paths { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); gap: 14px; }
	.hb-paths:has(> li:nth-child(3)) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.hb-paths:not(:has(> li:nth-child(3))) { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 680px; }
	.hb-paths__a { grid-template-columns: 44px minmax(0, 1fr) 18px; padding: 16px 18px; }
}
/* Compact: titles only. */
.hb-paths--compact { margin-top: 4px; gap: 8px; max-width: 760px; font-size: 16px; }
.hb-paths--compact .hb-paths__a { min-height: 52px; padding: 6px 14px 6px 8px; border-radius: 999px; grid-template-columns: 38px minmax(0, 1fr) 16px; gap: 10px; }
.hb-paths--compact .hb-paths__ico { width: 38px; height: 38px; }
.hb-paths--compact .hb-paths__ico svg { width: 19px; height: 19px; }
.hb-paths--compact .hb-paths__txt strong { font-size: 15.5px; }
.hb-page__help .hb-paths--compact { width: 100%; }
@media (prefers-reduced-motion: reduce) { .hb-paths__a { transition: none; } .hb-paths__a:hover { transform: none; } }
/* Packages: the head, then the toolbar one title-gap below it (main.css left 64px of section padding on phones). */
.hb-pkp .hb-pkp__packages > .hb-packages { padding-top: 0; margin-top: var(--hb-title-gap); }