/**
 * Catering quote (/catering-quote/) polish, 16/10/2026, SGO. Loaded after main.css and polish-pages.css
 * (inc/polish.php) on every page, so every rule is scoped to .hb-quote / .hb-q / html.hb-q-js.
 * main.css is untouched. Brand tokens only; the two new values are the AA-safe sage already used by the
 * cookie notice (#657b63, white text 4.6:1) and a warm grey that holds 4.5:1 on the pink card (#5b524d).
 * Motion: transform and opacity only, 180–480ms, ease-out; everything stops under prefers-reduced-motion.
 */

.hb-quote {
	--q-sage: #657b63;
	--q-sage-hover: #566a54;
	--q-muted: #5b524d;
	--q-line: rgba(53, 43, 36, .12);
	--q-out: cubic-bezier(.22, 1, .36, 1);
	--q-spring: cubic-bezier(.34, 1.4, .64, 1);
	--q-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3l2.3 2.3 4.9-5.2' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--q-chev: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M16 10H4.5M9 5l-5 5 5 5' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	--q-pen: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M12.6 4.2l3.2 3.2M4 16l.8-3.6L13.4 3.8a1.6 1.6 0 0 1 2.3 0l.5.5a1.6 1.6 0 0 1 0 2.3L7.6 15.2z' fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Hero: a little shorter here, so the first step is in view sooner. ------------------------------- */
@media (min-width: 768px) {
	.hb-quote .hb-about__hero--slim { min-height: clamp(300px, 25vw, 380px); }
}

/* Layout -------------------------------------------------------------------------------------------- */
.hb-quote .hb-quote__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: 24px; }
.hb-quote .hb-quote__card { padding: clamp(24px, 3.2vw, 44px); border-radius: 32px; }
.hb-quote .hb-q { gap: 26px; }

/* FX-4 (16/10/2026): before main.js steps the form (page-catering-quote.php sets .is-stepped.hb-q--pre before the first
   paint), show exactly what its show(0) will show: step 1 and "המשך". polish-quote.js removes .hb-q--pre right after. */
.hb-q.hb-q--pre [data-hb-q-step]:not([data-hb-q-step="1"]), .hb-q.hb-q--pre .hb-q__back, .hb-q.hb-q--pre .hb-q__submit { display: none; }

/* Progress: numbered dots on a line -------------------------------------------------------------- */
.hb-quote .hb-q__progress { gap: 0; padding-bottom: 22px; border-bottom-color: var(--q-line); }
.hb-quote .hb-q.is-stepped .hb-q__bar { display: none; }
.hb-quote .hb-q__steps {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	overflow: visible;
	padding: 0;
	font-size: 14.5px;
	color: var(--q-muted);
}
.hb-quote .hb-q__steps li {
	position: relative;
	display: grid;
	justify-items: center;
	gap: 8px;
	min-width: 0;
	text-align: center !important;
	white-space: normal;
	font-weight: 500;
	color: var(--q-muted);
}
/* The line to the previous dot (RTL: to the right). */
.hb-quote .hb-q__steps li + li::before,
.hb-quote .hb-q__steps li + li::after {
	content: "";
	position: absolute;
	top: 17px;
	right: calc(-50% + 24px);
	left: calc(50% + 24px);
	height: 2px;
	border-radius: 2px;
	background: rgba(53, 43, 36, .14);
}
.hb-quote .hb-q__steps li + li::after {
	background: var(--q-sage);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .5s var(--q-out);
}
.hb-quote .hb-q__steps li.is-current::after,
.hb-quote .hb-q__steps li.is-done::after { transform: scaleX(1); }
.hb-q__dot {
	position: relative;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--hb-white);
	color: var(--q-muted);
	font-weight: 700;
	font-size: 15px;
	transition: background-color .3s var(--q-out), color .3s var(--q-out), transform .3s var(--q-spring);
}
.hb-q__dot-n { transition: opacity .2s var(--q-out), transform .3s var(--q-spring); }
.hb-q__dot::after {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 15px;
	height: 15px;
	background: var(--hb-white);
	-webkit-mask: var(--q-check) center / contain no-repeat;
	mask: var(--q-check) center / contain no-repeat;
	opacity: 0;
	transform: scale(.4) rotate(-12deg);
	transition: opacity .2s var(--q-out), transform .35s var(--q-spring);
}
.hb-quote .hb-q__steps li.is-current { color: var(--hb-ink-warm); font-weight: 700; }
.hb-quote .hb-q__steps li.is-current .hb-q__dot { background: var(--q-sage); color: var(--hb-white); box-shadow: 0 0 0 6px rgba(101, 123, 99, .18); transform: scale(1.06); }
.hb-quote .hb-q__steps li.is-done { color: var(--hb-ink-warm); }
.hb-quote .hb-q__steps li.is-done .hb-q__dot { background: var(--hb-ink-warm); color: var(--hb-white); }
.hb-quote .hb-q__steps li.is-done .hb-q__dot-n { opacity: 0; transform: scale(.4); }
.hb-quote .hb-q__steps li.is-done .hb-q__dot::after { opacity: 1; transform: none; }
.hb-quote .hb-q__steps li.is-reachable { cursor: pointer; }
.hb-q__dot-label { line-height: 1.25; }
/* "שלב 1 מתוך 4" stays for screen readers (aria-live); the dots say it visually. */
.hb-quote .hb-q.is-stepped .hb-q__count-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; margin: 0; }
.hb-quote .hb-q__progress { position: relative; }

/* Step transitions: in RTL "forward" arrives from the left, "back" from the right. ------------- */
.hb-quote .hb-q.is-stepped .hb-q__step { animation: none; }
.hb-quote .hb-q.is-stepped .hb-q__step.is-entering { animation: hbq-in-fwd .42s var(--q-out); }
.hb-quote .hb-q.is-stepped[data-dir="back"] .hb-q__step.is-entering { animation-name: hbq-in-back; }
@keyframes hbq-in-fwd { from { opacity: 0; transform: translateX(-22px); } to { opacity: 1; transform: none; } }
@keyframes hbq-in-back { from { opacity: 0; transform: translateX(22px); } to { opacity: 1; transform: none; } }

.hb-quote .hb-q__step { gap: 26px; }
.hb-quote .hb-q__title { font-size: clamp(26px, 2.3vw, 32px); line-height: 1.15; letter-spacing: -.01em; }
.hb-quote .hb-q__label,
.hb-quote .hb-field label { font-weight: 600; font-size: 16.5px; color: var(--hb-ink-warm); }
.hb-quote .hb-q__label { margin-bottom: 12px; }
.hb-quote .hb-q__label span,
.hb-quote .hb-field label span { color: #8a5a4c; }
.hb-q__hint { margin-top: -2px; font-size: 14px; line-height: 1.45; color: var(--q-muted); }

/* Choice pills ------------------------------------------------------------------------------------- */
.hb-quote .hb-q__choices { gap: 10px; }
.hb-quote .hb-choice span {
	gap: 0;
	min-height: 48px;
	padding: 0 20px;
	border: 1.5px solid rgba(53, 43, 36, .08);
	background: var(--hb-white);
	color: var(--hb-ink-warm);
	font-size: 16px;
	box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
	transition: background-color .22s var(--q-out), color .22s var(--q-out), border-color .22s var(--q-out), transform .25s var(--q-out);
}
.hb-quote .hb-choice span::before {
	content: "";
	flex: none;
	width: 0;
	height: 14px;
	margin-inline-end: 0;
	background: currentColor;
	-webkit-mask: var(--q-check) center / 14px no-repeat;
	mask: var(--q-check) center / 14px no-repeat;
	opacity: 0;
	transform: scale(.3);
	transition: width .25s var(--q-out), margin .25s var(--q-out), opacity .2s var(--q-out), transform .35s var(--q-spring);
}
.hb-quote .hb-choice input:checked + span {
	animation: none;
	border-color: var(--hb-ink-warm);
	background: var(--hb-ink-warm);
	color: var(--hb-white);
	box-shadow: 0 6px 16px rgba(53, 43, 36, .18);
}
.hb-quote .hb-choice input:checked + span::before { width: 14px; margin-inline-end: 8px; opacity: 1; transform: none; }
.hb-quote .hb-choice:hover span { border-color: rgba(53, 43, 36, .08); }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-choice:hover input:not(:checked) + span { border-color: rgba(53, 43, 36, .35); transform: translateY(-1px); box-shadow: 0 6px 14px rgba(53, 43, 36, .1); }
}
.hb-quote .hb-choice:active span { transform: scale(.97); transition-duration: .08s; }
.hb-quote .hb-choice input:focus-visible + span { outline: 2px solid var(--hb-ink-warm); outline-offset: 3px; }
.hb-quote .is-invalid .hb-choice span { border-color: rgba(176, 55, 32, .55); }

/* Text fields -------------------------------------------------------------------------------------- */
.hb-quote .hb-field { gap: 8px; }
.hb-quote .hb-field input,
.hb-quote .hb-field textarea,
.hb-quote .hb-date__btn {
	min-height: 52px;
	border: 1.5px solid rgba(53, 43, 36, .06);
	border-radius: 16px;
	font-size: 16px;
	transition: border-color .2s var(--q-out), background-color .2s var(--q-out);
}
.hb-quote .hb-field input::placeholder,
.hb-quote .hb-field textarea::placeholder { color: #7d726c; opacity: 1; }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-field input:hover:not(:focus),
	.hb-quote .hb-field textarea:hover:not(:focus),
	.hb-quote .hb-date__btn:hover { border-color: rgba(53, 43, 36, .28); }
}
.hb-quote .hb-field input:focus,
.hb-quote .hb-field textarea:focus { border-color: var(--q-sage); box-shadow: 0 0 0 4px rgba(101, 123, 99, .2); }
.hb-quote .hb-date__btn { color: var(--q-muted); }
.hb-quote .hb-date__btn.has-value { color: var(--hb-ink-warm); }
.hb-quote .hb-date.is-open .hb-date__btn { border-color: var(--q-sage); box-shadow: 0 0 0 4px rgba(101, 123, 99, .2); }
.hb-quote .is-invalid input:not([type="radio"]):not([type="checkbox"]) { border-color: #b03720; box-shadow: 0 0 0 4px rgba(176, 55, 32, .12); }

/* Errors: an icon, a soft entrance, a shake on the field when "המשך" is pressed too early. */
.hb-quote .hb-q__error {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	margin-top: 8px;
	font-size: 14.5px;
	font-weight: 600;
	color: #a3341f;
	animation: hbq-err .3s var(--q-out);
}
.hb-quote .hb-q__error[hidden] { display: none; }
.hb-quote .hb-q__error::before {
	content: "!";
	flex: none;
	display: grid;
	place-items: center;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	border-radius: 50%;
	background: #a3341f;
	color: var(--hb-white);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}
@keyframes hbq-err { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.hb-quote .is-shake { animation: hbq-shake .42s var(--q-out); }
@keyframes hbq-shake { 15%, 55% { transform: translateX(-6px); } 35%, 75% { transform: translateX(6px); } }

/* Guests: a big, friendly stepper and quick picks ---------------------------------------------------- */
.hb-quote .hb-q__guests .hb-stepper {
	display: flex;
	justify-content: space-between;
	width: min(100%, 320px);
	padding: 6px;
	border: 1.5px solid rgba(53, 43, 36, .06);
	box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
	transition: border-color .2s var(--q-out);
}
.hb-quote .hb-q__guests .hb-stepper:focus-within { border-color: var(--q-sage); box-shadow: 0 0 0 4px rgba(101, 123, 99, .2); }
.hb-quote .hb-q__guests .hb-stepper input {
	flex: 1;
	width: auto;
	min-width: 0;
	min-height: 52px;
	border: 0;
	box-shadow: none;
	font-weight: 700;
	font-size: 30px;
	letter-spacing: -.01em;
	color: var(--hb-ink-warm);
	font-variant-numeric: tabular-nums;
}
.hb-quote .hb-q__guests .hb-stepper input::placeholder { color: rgba(53, 43, 36, .3); }
.hb-quote .hb-q__guests .hb-stepper__btn {
	flex: none;
	width: 52px;
	height: 52px;
	background: var(--hb-filter-bg);
	font-size: 24px;
	touch-action: manipulation;
	user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	transition: background-color .2s var(--q-out), color .2s var(--q-out), transform .18s var(--q-out);
}
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-q__guests .hb-stepper__btn:hover { background: var(--hb-ink-warm); color: var(--hb-white); }
}
.hb-quote .hb-q__guests .hb-stepper__btn:active { transform: scale(.9); transition-duration: .06s; }
.hb-quote .hb-q__guests .hb-stepper.is-bump input { animation: hbq-num .32s var(--q-spring); }
@keyframes hbq-num { 40% { transform: scale(1.12); } }
.hb-quote .is-invalid .hb-stepper { border-color: #b03720; box-shadow: 0 0 0 4px rgba(176, 55, 32, .12); }

.hb-q__presets { display: flex; flex-wrap: wrap; gap: 8px; margin-top: -12px; }
.hb-q__preset {
	min-width: 56px;
	min-height: 44px;
	padding: 0 14px;
	border: 1.5px solid rgba(53, 43, 36, .12);
	border-radius: 999px;
	background: rgba(255, 255, 255, .55);
	color: var(--hb-ink-warm);
	font: 600 15px var(--hb-font);
	font-variant-numeric: tabular-nums;
	cursor: pointer;
	touch-action: manipulation;
	transition: background-color .2s var(--q-out), color .2s var(--q-out), border-color .2s var(--q-out), transform .2s var(--q-out);
}
@media (hover: hover) and (pointer: fine) {
	.hb-q__preset:hover { border-color: var(--hb-ink-warm); background: var(--hb-white); transform: translateY(-1px); }
}
.hb-q__preset:active { transform: scale(.95); transition-duration: .06s; }
.hb-q__preset[aria-pressed="true"] { border-color: var(--hb-ink-warm); background: var(--hb-ink-warm); color: var(--hb-white); transform: none; }
.hb-q__preset:focus-visible { outline: 2px solid var(--hb-ink-warm); outline-offset: 3px; }

/* Step 3: dishes ----------------------------------------------------------------------------------- */
.hb-quote .hb-qb__intro { color: var(--q-muted); }
.hb-quote .hb-qb__dish { transition: border-color .22s var(--q-out), background-color .22s var(--q-out), transform .25s var(--q-out); }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-qb__dish:not([aria-pressed="true"]):hover { border-color: rgba(53, 43, 36, .22); transform: translateY(-2px); box-shadow: 0 12px 26px rgba(53, 43, 36, .1); }
	.hb-quote .hb-qb__tab:not([aria-selected="true"]):hover,
	.hb-quote .hb-qb__chip:not([aria-pressed="true"]):hover { border-color: var(--hb-ink-warm); }
}
.hb-quote .hb-qb__dish:active { transform: scale(.97); transition-duration: .08s; }
.hb-quote .hb-qb__dish[aria-pressed="true"] { border-color: var(--hb-ink-warm); background: var(--hb-white); box-shadow: 0 0 0 1.5px var(--hb-ink-warm), 0 10px 24px rgba(53, 43, 36, .12); }
.hb-quote .hb-qb__dish[aria-pressed="true"] .hb-qb__dish-check { background-color: var(--hb-ink-warm); transform: scale(1.08); }
.hb-quote .hb-qb__dish-desc { color: var(--q-muted); }
.hb-quote .hb-qb__chip[aria-pressed="true"],
.hb-quote .hb-qb__tab-n { background: var(--hb-ink-warm); border-color: var(--hb-ink-warm); }
.hb-quote .hb-qb__toggle[aria-checked="true"] .hb-qb__switch { background: var(--q-sage); }
.hb-quote .hb-qb__skip { min-height: 44px; color: var(--hb-ink-warm); }

/* Navigation ---------------------------------------------------------------------------------------- */
.hb-quote .hb-q__nav { gap: 12px; padding-top: 22px; border-top-color: var(--q-line); }
.hb-quote .hb-q__nav .hb-btn--lg { min-width: 0; }
.hb-quote .hb-q__next,
.hb-quote .hb-q__submit {
	gap: 14px;
	min-width: 230px;
	min-height: 64px;
	padding: 0 26px 0 22px;
	border-color: var(--q-sage);
	background: var(--q-sage);
	color: var(--hb-white);
	box-shadow: 0 10px 24px rgba(101, 123, 99, .28);
	transition: background-color .22s var(--q-out), transform .25s var(--q-out);
}
.hb-quote .hb-q__next:hover,
.hb-quote .hb-q__submit:hover { background: var(--q-sage-hover); border-color: var(--q-sage-hover); color: var(--hb-white); }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-q__next:hover,
	.hb-quote .hb-q__submit:hover { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(101, 123, 99, .34); }
	.hb-quote .hb-q__next:hover .hb-q__arrow { transform: translateX(-4px); }
	.hb-quote .hb-q__back:hover .hb-q__arrow { transform: translateX(3px) scaleX(-1); }
}
.hb-quote .hb-q__next:active,
.hb-quote .hb-q__submit:active { transform: scale(.98); transition-duration: .08s; }
.hb-quote .hb-q__next:focus-visible,
.hb-quote .hb-q__submit:focus-visible,
.hb-quote .hb-q__back:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 3px; }
.hb-q__next-text { display: grid; gap: 3px; text-align: start; line-height: 1.1; }
.hb-q__next-label { font-size: 19px; }
.hb-q__next-to { font-weight: 500; font-size: 13px; }
.hb-q__next-to:empty { display: none; }
.hb-q__arrow {
	flex: none;
	width: 20px;
	height: 20px;
	background: currentColor;
	-webkit-mask: var(--q-chev) center / contain no-repeat;
	mask: var(--q-chev) center / contain no-repeat;
	transition: transform .3s var(--q-out);
}
.hb-q__arrow--back { transform: scaleX(-1); }
.hb-quote .hb-q__back {
	gap: 8px;
	min-height: 52px;
	padding: 0 20px;
	border: 1.5px solid rgba(53, 43, 36, .25);
	background: transparent;
	color: var(--hb-ink-warm);
	transition: background-color .2s var(--q-out), border-color .2s var(--q-out), transform .2s var(--q-out);
}
.hb-quote .hb-q__back:hover { background: rgba(255, 255, 255, .7); border-color: rgba(53, 43, 36, .4); }
.hb-quote .hb-q__back:active { transform: scale(.96); }
.hb-quote .hb-q__submit { gap: 12px; }
.hb-quote .hb-q__submit.is-loading { opacity: 1; cursor: progress; }
.hb-q__spinner { display: none; width: 18px; height: 18px; border: 2.5px solid rgba(255, 255, 255, .35); border-top-color: var(--hb-white); border-radius: 50%; animation: hbq-spin .7s linear infinite; }
.hb-quote .hb-q__submit.is-loading .hb-q__spinner { display: block; }
@keyframes hbq-spin { to { transform: rotate(360deg); } }
.hb-q__sumbtn { display: none; }

/* Summary (desktop: sticky side card) ------------------------------------------------------------- */
.hb-quote .hb-quote__aside { top: 116px; gap: 14px; }
.hb-quote .hb-quote__summary {
	padding: 24px 24px 20px;
	border-radius: 28px;
	background: var(--hb-white);
	box-shadow: 0 1px 2px rgba(53, 43, 36, .04), 0 18px 40px rgba(53, 43, 36, .08);
	outline: none;
}
.hb-quote__sum-head { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px 10px; margin-bottom: 8px; }
.hb-quote .hb-quote__summary h2 { margin: 0; font-size: 21px; }
.hb-quote__sum-meter { grid-column: 1 / -1; grid-row: 2; position: relative; display: block; height: 4px; overflow: hidden; border-radius: 4px; background: rgba(53, 43, 36, .09); }
.hb-quote__sum-meter-fill { position: absolute; inset: 0; border-radius: inherit; background: var(--q-sage); transform: scaleX(.04); transform-origin: right; transition: transform .6s var(--q-out); }
.hb-quote__sum-close { display: none; }
.hb-quote .hb-quote__summary dl { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; font-size: 15px; }
.hb-quote__row {
	display: grid;
	position: relative;
	grid-template-columns: 118px minmax(0, 1fr);
	gap: 4px 12px;
	align-items: baseline;
	padding: 11px 8px 11px 44px;
	margin-inline: -8px;
	border-bottom: 1px dashed rgba(53, 43, 36, .12);
	border-radius: 12px;
	transition: background-color .5s var(--q-out);
}
.hb-quote__row:last-child { border-bottom: 0; }
.hb-quote__row[hidden] { display: none; }
.hb-quote .hb-quote__summary dt { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; color: var(--q-muted); }
.hb-quote .hb-quote__summary dd { margin: 0; font-weight: 700; color: var(--hb-ink-warm); overflow-wrap: anywhere; }
.hb-quote__row.is-empty dd { font-weight: 500; color: rgba(53, 43, 36, .45); }
.hb-quote__row.is-updated { animation: hbq-row 1.1s var(--q-out); }
.hb-quote__row.is-updated dd { animation: hbq-val .45s var(--q-out); }
@keyframes hbq-row { 0% { background-color: rgba(101, 123, 99, .16); } 100% { background-color: transparent; } }
@keyframes hbq-val { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.hb-quote__picks-row { grid-template-columns: 1fr; }
.hb-quote .hb-quote__picks { font-weight: 500 !important; font-size: 14px; line-height: 1.55; white-space: pre-line; }
.hb-quote__total-row dd { font-size: 17px; color: var(--q-sage) !important; white-space: nowrap; }
.hb-quote__total-note { margin: 6px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--q-muted); }
.hb-quote__total-note[hidden] { display: none; }
.hb-quote__edit {
	position: absolute;
	top: 50%;
	left: 4px;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin-top: -17px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--hb-ink-warm);
	cursor: pointer;
	opacity: 0;
	transform: scale(.85);
	transition: opacity .2s var(--q-out), transform .25s var(--q-out), background-color .2s var(--q-out);
}
.hb-quote__edit::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--q-pen) center / contain no-repeat; mask: var(--q-pen) center / contain no-repeat; }
.hb-quote__edit:hover { background: var(--hb-filter-bg); }
.hb-quote__row.is-empty .hb-quote__edit { display: none; }
.hb-quote__row:focus-within .hb-quote__edit { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .hb-quote__row:hover .hb-quote__edit { opacity: 1; transform: none; } }
@media (hover: none) { .hb-quote__edit { opacity: .75; transform: none; } }
.hb-quote__picks-row .hb-quote__edit { top: 22px; }
.hb-quote__edit:focus-visible { opacity: 1; outline: 2px solid var(--hb-ink-warm); outline-offset: 2px; border-radius: 4px; }
.hb-quote .hb-quote__help p { color: var(--hb-ink-warm); }
.hb-quote .hb-contact__card { transition: transform .25s var(--q-out); }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-contact__card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(53, 43, 36, .1); }
}
/* After sending, the done screen lists everything; the side card would repeat it. */
html.hb-q-sent .hb-quote .hb-quote__summary { display: none; }

/* Success ---------------------------------------------------------------------------------------- */
.hb-quote .hb-q__done { gap: 12px; padding: 18px 0 8px; }
.hb-quote .hb-q__check { position: relative; width: 84px; height: 84px; background: var(--q-sage); animation: none; }
.hb-quote .hb-q__check::before { width: 34px; height: 28px; background: var(--hb-white); }
.hb-quote .hb-q__check::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--q-sage); opacity: 0; }
.hb-quote .hb-q__done-hours { font-size: 15px !important; color: var(--q-muted); }
.hb-quote .hb-q__done-sum { box-shadow: 0 14px 34px rgba(53, 43, 36, .08); }
.hb-quote .hb-q__done-sum dt { color: var(--q-muted); }
.hb-quote .hb-q__done.is-in .hb-q__check { animation: hbq-pop .6s var(--q-spring) both; }
.hb-quote .hb-q__done.is-in .hb-q__check::before { animation: hbq-tick .45s .25s var(--q-spring) both; }
.hb-quote .hb-q__done.is-in .hb-q__check::after { animation: hbq-ring 1s .2s var(--q-out); }
.hb-quote .hb-q__done.is-in > :not(.hb-q__check) { animation: hbq-up .55s var(--q-out) both; }
.hb-quote .hb-q__done.is-in > h2 { animation-delay: .18s; }
.hb-quote .hb-q__done.is-in > p { animation-delay: .26s; }
.hb-quote .hb-q__done.is-in > .hb-q__done-hours { animation-delay: .32s; }
.hb-quote .hb-q__done.is-in > dl { animation-delay: .4s; }
.hb-quote .hb-q__done.is-in > a { animation-delay: .5s; }
@keyframes hbq-pop { from { opacity: 0; transform: scale(.5); } to { opacity: 1; transform: none; } }
@keyframes hbq-tick { from { opacity: 0; transform: scale(.3) rotate(-20deg); } to { opacity: 1; transform: none; } }
@keyframes hbq-ring { from { opacity: .7; transform: scale(1); } to { opacity: 0; transform: scale(1.6); } }
@keyframes hbq-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-q__wa:hover { transform: translateY(-1px); }
}

/* Tablet ------------------------------------------------------------------------------------------- */
@media (max-width: 960px) {
	.hb-quote .hb-quote__grid { grid-template-columns: minmax(0, 1fr); max-width: 680px; }
}

/* Phones ------------------------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.hb-quote .hb-quote__card { padding: 22px 16px 24px; border-radius: 28px; }
	.hb-quote .hb-q { gap: 22px; }
	.hb-quote .hb-q__step { gap: 22px; }
	.hb-quote .hb-q__title { font-size: 25px; }
	.hb-quote .hb-q__progress { padding-bottom: 18px; }
	.hb-quote .hb-q__steps { display: grid; overflow: visible; padding: 0; font-size: 12.5px; }
	.hb-quote .hb-q__steps li { gap: 6px; font-size: 12.5px; white-space: normal; }
	.hb-quote .hb-q__steps li + li::before,
	.hb-quote .hb-q__steps li + li::after { top: 15px; right: calc(-50% + 20px); left: calc(50% + 20px); }
	.hb-q__dot { width: 32px; height: 32px; font-size: 14px; }
	.hb-quote .hb-q__steps li .hb-q__dot-label { white-space: nowrap; opacity: 0; transform: translateY(-3px); transition: opacity .25s var(--q-out), transform .3s var(--q-out); }
	.hb-quote .hb-q__steps li.is-current .hb-q__dot-label { opacity: 1; transform: none; }
	.hb-quote .hb-q__steps li.is-current .hb-q__dot { box-shadow: 0 0 0 5px rgba(101, 123, 99, .18); }
	.hb-quote .hb-choice span { min-height: 46px; padding: 0 16px; font-size: 15.5px; }
	.hb-quote .hb-q__choices { gap: 8px; }
	.hb-quote .hb-q__guests .hb-stepper { width: 100%; }
	.hb-q__presets { flex-wrap: nowrap; gap: 6px; margin-top: -8px; }
	.hb-q__preset { flex: 1 1 0; min-width: 0; min-height: 44px; padding: 0 4px; font-size: 14.5px; }
	.hb-quote .hb-contact__row { gap: 16px; }

	/* The accessibility button stays clear of the dock (the cookie case is handled in polish-global.css). */
	html.hb-q-js body:has(.hb-q.is-stepped) .hb-a11y { top: auto; bottom: calc(var(--hb-dock, 0px) + 22px); }
}

/* Phones and tablets with JavaScript: a dock at the bottom and the summary as a sheet. ---------------------- */
@media (max-width: 960px) {
	/* With JavaScript: the buttons become a dock at the bottom of the screen. */
	html.hb-q-js .hb-quote .hb-quote__card { padding-bottom: 104px; }
	html.hb-q-js.hb-q-sent .hb-quote .hb-quote__card { padding-bottom: 28px; }
	html.hb-q-js .hb-quote .hb-q.is-stepped .hb-q__nav {
		position: fixed;
		inset-inline: 10px;
		bottom: calc(10px + env(safe-area-inset-bottom, 0px));
		z-index: 1040;
		display: flex;
		align-items: center;
		gap: 8px;
		margin: 0;
		padding: 8px;
		border: 1px solid rgba(53, 43, 36, .08);
		border-radius: 28px;
		background: rgba(255, 255, 255, .94);
		-webkit-backdrop-filter: saturate(1.4) blur(14px);
		backdrop-filter: saturate(1.4) blur(14px);
		box-shadow: 0 14px 40px rgba(53, 43, 36, .2);
		transition: transform .38s var(--q-out), opacity .3s var(--q-out), visibility 0s;
	}
	html.hb-q-js .hb-quote .hb-q.is-stepped .hb-q__nav.is-away,
	html.hb-q-js .hb-quote .hb-q.is-stepped .hb-q__nav.is-typing {
		opacity: 0;
		visibility: hidden;
		transform: translateY(calc(100% + 24px));
		transition: transform .32s var(--q-out), opacity .25s var(--q-out), visibility 0s .32s;
	}
	html.hb-q-js .hb-quote .hb-q__nav .hb-btn { flex: 1 1 auto; min-width: 0; }
	html.hb-q-js .hb-quote .hb-q__next,
	html.hb-q-js .hb-quote .hb-q__submit { min-height: 54px; padding: 0 18px; box-shadow: none; justify-content: space-between; }
	html.hb-q-js .hb-quote .hb-q__next-label { font-size: 17px; }
	html.hb-q-js .hb-quote .hb-q__next-to { font-size: 12px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-q__next-text { min-width: 0; }
	html.hb-q-js .hb-quote .hb-q__submit { justify-content: center; }
	html.hb-q-js .hb-quote .hb-q__back { flex: none !important; width: 54px; min-height: 54px; padding: 0; border-color: rgba(53, 43, 36, .16); }
	html.hb-q-js .hb-quote .hb-q__back-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-q__back[hidden] { display: none; }

	.hb-q__sumbtn {
		position: relative;
		flex: none;
		display: grid;
		place-items: center;
		width: 54px;
		height: 54px;
		padding: 0;
		border: 1.5px solid rgba(53, 43, 36, .16);
		border-radius: 50%;
		background: var(--hb-filter-bg);
		color: var(--hb-ink-warm);
		cursor: pointer;
		touch-action: manipulation;
		transition: background-color .2s var(--q-out), transform .2s var(--q-out);
	}
	html.hb-q-js .hb-q.is-stepped .hb-q__sumbtn { display: grid; }
	.hb-q__sumbtn:active { transform: scale(.94); }
	.hb-q__sumbtn[aria-expanded="true"] { background: var(--hb-ink-warm); color: var(--hb-white); }
	.hb-q__sumbtn:focus-visible { outline: 2px solid var(--hb-ink-warm); outline-offset: 2px; }
	.hb-q__sumbtn-ico {
		width: 22px;
		height: 22px;
		background: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 6h12M8 12h12M8 18h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='4' cy='6' r='1.4'/%3E%3Ccircle cx='4' cy='12' r='1.4'/%3E%3Ccircle cx='4' cy='18' r='1.4'/%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'%3E%3Cpath d='M8 6h12M8 12h12M8 18h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='4' cy='6' r='1.4'/%3E%3Ccircle cx='4' cy='12' r='1.4'/%3E%3Ccircle cx='4' cy='18' r='1.4'/%3E%3C/svg%3E") center / contain no-repeat;
	}
	.hb-q__sumbtn-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	.hb-q__sumbtn-n {
		position: absolute;
		top: -3px;
		left: -3px;
		display: grid;
		place-items: center;
		min-width: 22px;
		height: 22px;
		padding: 0 6px;
		border: 2px solid var(--hb-white);
		border-radius: 999px;
		background: var(--q-sage);
		color: var(--hb-white);
		font-size: 12px;
		font-weight: 700;
	}
	.hb-q__sumbtn-n[hidden] { display: none; }
	.hb-q__sumbtn-n.is-tick { animation: hbq-num .35s var(--q-spring); }

	/* The dishes strip sits above the dock. */
	html.hb-q-js .hb-quote .hb-qb__tray { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }

	/* The summary becomes a bottom sheet. */
	html.hb-q-js .hb-quote .hb-quote__summary {
		position: fixed;
		inset-inline: 0;
		bottom: 0;
		z-index: 1070;
		max-height: min(78vh, 640px);
		overflow-y: auto;
		overscroll-behavior: contain;
		padding: 14px 20px calc(24px + env(safe-area-inset-bottom, 0px));
		border-radius: 28px 28px 0 0;
		box-shadow: 0 -18px 50px rgba(30, 24, 20, .22);
		visibility: hidden;
		transform: translateY(105%);
		transition: transform .42s cubic-bezier(.32, .72, 0, 1), visibility 0s .42s;
	}
	html.hb-q-js .hb-quote .hb-quote__summary::before { content: ""; display: block; width: 40px; height: 5px; margin: 0 auto 14px; border-radius: 5px; background: rgba(53, 43, 36, .18); }
	html.hb-q-sheet-open .hb-quote .hb-quote__summary { visibility: visible; transform: none; transition: transform .45s cubic-bezier(.32, .72, 0, 1), visibility 0s; }
	html.hb-q-js .hb-quote__sum-head { grid-template-columns: 1fr auto; }
	html.hb-q-js .hb-quote__sum-close {
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		margin: -6px -8px -6px 0;
		border: 0;
		border-radius: 50%;
		background: var(--hb-filter-bg);
		cursor: pointer;
	}
	html.hb-q-js .hb-quote__sum-close::before,
	html.hb-q-js .hb-quote__sum-close::after { content: ""; grid-area: 1 / 1; width: 16px; height: 2px; border-radius: 2px; background: var(--hb-ink-warm); transform: rotate(45deg); }
	html.hb-q-js .hb-quote__sum-close::after { transform: rotate(-45deg); }
	html.hb-q-js .hb-quote__sum-close:focus-visible { outline: 2px solid var(--hb-ink-warm); outline-offset: 2px; }
	.hb-q-scrim { position: fixed; inset: 0; z-index: 1065; background: rgba(30, 24, 20, .42); opacity: 0; visibility: hidden; transition: opacity .35s var(--q-out), visibility 0s .35s; }
	html.hb-q-sheet-open .hb-q-scrim { opacity: 1; visibility: visible; transition: opacity .35s var(--q-out), visibility 0s; }
	html.hb-q-sheet-open { overflow: hidden; }
	.hb-quote__edit { font-size: 13px; min-height: 32px; }
	html.hb-q-js .hb-quote .hb-quote__aside { gap: 0; }

	html.hb-q-js .hb-quote .hb-q.is-stepped .hb-q__nav { max-width: 640px; margin-inline: auto; }
	html.hb-q-js .hb-quote .hb-quote__summary { max-width: 720px; margin-inline: auto; }
}
@media (min-width: 768px) and (max-width: 960px) {
	/* FX-4: above the cookie notice by `translate` (bottom stays 10px + safe area), so the move is not a layout shift. */
	html.hb-cookie-on.hb-q-js .hb-quote .hb-q.is-stepped .hb-q__nav { translate: 0 calc(-1 * (var(--hb-cookie-h, 0px) + 18px - env(safe-area-inset-bottom, 0px))); }
}
@media (min-width: 961px) { .hb-q-scrim { display: none; } }

/* Reduced motion: everything lands at once. --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.hb-quote *, .hb-quote *::before, .hb-quote *::after, .hb-q-scrim { animation: none !important; transition: none !important; }
}

/* Category tabs that scroll sideways (desktop): fade the far edge so it reads as "more". */
@media (min-width: 768px) {
	.hb-quote .hb-qb__tabs { -webkit-mask-image: linear-gradient(to left, transparent 0, #000 36px); mask-image: linear-gradient(to left, transparent 0, #000 36px); padding-inline-end: 30px; }
}

/* ===================================================================================================
   Experience layer (16/10/2026): event photo cards, a guests slider and a usual count, dishes that fly into
   the tray, a picture summary, a review before sending, checks as you type, a small celebration per step.
   Behaviour: polish-quote.js §6–10. Nothing here changes what the form sends.
   =================================================================================================== */

/* Event type cards (the q_event radios) */
.hb-quote .hb-evc__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hb-quote .hb-evc { position: relative; display: block; padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.hb-quote .hb-evc input { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.hb-quote .hb-evc__card {
	display: grid; align-content: start; gap: 9px; height: 100%; padding: 6px 6px 12px;
	border: 1.5px solid rgba(53, 43, 36, .08); border-radius: 22px; background: var(--hb-white, #fff); color: var(--hb-ink-warm, #352b24);
	box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
	transition: border-color .22s var(--q-out), box-shadow .3s var(--q-out), transform .3s var(--q-out);
}
.hb-quote .hb-evc__img { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 16px; background: linear-gradient(135deg, #f3e3dc, #f1ebe2); }
.hb-quote .hb-evc__img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--q-out), filter .3s var(--q-out); }
.hb-quote .hb-evc__tick { position: absolute; top: 8px; left: 8px; width: 28px; height: 28px; border-radius: 50%; background: rgba(255, 255, 255, .92); box-shadow: 0 2px 8px rgba(0, 0, 0, .15); transform: scale(.8); transition: background-color .25s var(--q-out), transform .35s var(--q-spring); }
.hb-quote .hb-evc__tick::after { content: ""; position: absolute; inset: 0; margin: auto; width: 13px; height: 13px; background: #fff; -webkit-mask: var(--q-check) center / contain no-repeat; mask: var(--q-check) center / contain no-repeat; opacity: 0; transform: scale(.4); transition: opacity .2s, transform .35s var(--q-spring); }
.hb-quote .hb-evc__name { padding: 0 8px; font-weight: 700; font-size: 15.5px; line-height: 1.25; }
.hb-quote .hb-evc input:checked + .hb-evc__card { border-color: var(--hb-ink-warm, #352b24); box-shadow: 0 0 0 1.5px var(--hb-ink-warm, #352b24), 0 14px 30px rgba(53, 43, 36, .16); transform: translateY(-2px); }
.hb-quote .hb-evc input:checked + .hb-evc__card .hb-evc__img img { transform: scale(1.06); }
.hb-quote .hb-evc input:checked + .hb-evc__card .hb-evc__tick { background: var(--hb-ink-warm, #352b24); transform: scale(1.05); }
.hb-quote .hb-evc input:checked + .hb-evc__card .hb-evc__tick::after { opacity: 1; transform: none; }
.hb-quote .hb-evc__grid:has(input:checked) .hb-evc input:not(:checked) + .hb-evc__card .hb-evc__img img { filter: saturate(.75) brightness(.97); }
.hb-quote .hb-evc input:focus-visible + .hb-evc__card { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 3px; }
.hb-quote .hb-evc:active .hb-evc__card { transform: scale(.97); transition-duration: .08s; }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-evc:hover input:not(:checked) + .hb-evc__card { border-color: rgba(53, 43, 36, .2); transform: translateY(-3px); box-shadow: 0 14px 30px rgba(53, 43, 36, .12); }
	.hb-quote .hb-evc:hover .hb-evc__img img { transform: scale(1.05); }
}
.hb-quote .is-invalid .hb-evc__card { border-color: rgba(176, 55, 32, .55); }

/* Time of day: a rising sun, a noon sun and a moon after the label. */
.hb-quote :is(.hb-choice--morning, .hb-choice--noon, .hb-choice--evening) span::after {
	content: ""; display: inline-block; vertical-align: -3px; width: 17px; height: 17px; margin-inline-start: 8px; background: currentColor; opacity: .8;
	-webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat;
}
.hb-quote .hb-choice--morning { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M5 17a7 7 0 0 1 14 0M3 20h18M12 4v3M4.9 9.9l2.1 2.1M19.1 9.9 17 12'/%3E%3C/svg%3E"); }
.hb-quote .hb-choice--noon { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Cpath d='M12 2.5v2.5M12 19v2.5M2.5 12H5M19 12h2.5M5.3 5.3l1.8 1.8M16.9 16.9l1.8 1.8M18.7 5.3l-1.8 1.8M7.1 16.9l-1.8 1.8'/%3E%3C/svg%3E"); }
.hb-quote .hb-choice--evening { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M19.5 14.5A8 8 0 0 1 9.5 4.5a8 8 0 1 0 10 10z'/%3E%3C/svg%3E"); }

/* Guests: slider and the usual count */
.hb-quote .hb-q__range { --p: 0; display: grid; gap: 4px; width: min(100%, 520px); margin-top: -6px; }
.hb-quote .hb-q__range[hidden] { display: none; }
.hb-quote .hb-q__range input[type="range"] { width: 100%; height: 36px; margin: 0; padding: 0; border: 0; background: transparent; -webkit-appearance: none; appearance: none; cursor: pointer; touch-action: pan-y; box-shadow: none; }
.hb-quote .hb-q__range input[type="range"]::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(to left, var(--q-sage) calc(var(--p) * 100%), rgba(53, 43, 36, .12) calc(var(--p) * 100%)); }
.hb-quote .hb-q__range input[type="range"]::-moz-range-track { height: 8px; border-radius: 8px; background: rgba(53, 43, 36, .12); }
.hb-quote .hb-q__range input[type="range"]::-moz-range-progress { height: 8px; border-radius: 8px; background: var(--q-sage); }
.hb-quote .hb-q__range input[type="range"]::-webkit-slider-thumb { width: 30px; height: 30px; margin-top: -11px; border: 3px solid var(--q-sage); border-radius: 50%; background: #fff; box-shadow: 0 4px 12px rgba(53, 43, 36, .22); -webkit-appearance: none; appearance: none; transition: transform .2s var(--q-spring); }
.hb-quote .hb-q__range input[type="range"]::-moz-range-thumb { width: 24px; height: 24px; border: 3px solid var(--q-sage); border-radius: 50%; background: #fff; box-shadow: 0 4px 12px rgba(53, 43, 36, .22); }
.hb-quote .hb-q__range input[type="range"]:active::-webkit-slider-thumb { transform: scale(1.15); }
.hb-quote .hb-q__range input[type="range"]:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 4px; border-radius: 8px; }
.hb-quote .hb-q__range-scale { display: flex; justify-content: space-between; padding: 0 4px; font-size: 12.5px; font-variant-numeric: tabular-nums; color: var(--q-muted); }
.hb-quote .hb-q__typical { display: flex; align-items: flex-start; gap: 9px; margin: 2px 0 0; padding: 11px 14px; border-radius: 14px; background: rgba(101, 123, 99, .12); font-size: 14.5px; line-height: 1.45; color: #3c4e3b; animation: hbq-pop-in .35s var(--q-out); }
.hb-quote .hb-q__typical[hidden] { display: none; }
.hb-quote .hb-q__typical::before { content: ""; flex: none; width: 18px; height: 18px; margin-top: 1px; background: currentColor; -webkit-mask: var(--q-spark) center / contain no-repeat; mask: var(--q-spark) center / contain no-repeat; }
.hb-quote { --q-spark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.5l1.9 5.6 5.6 1.9-5.6 1.9L12 17.5l-1.9-5.6L4.5 10l5.6-1.9zM18.5 15l.9 2.6 2.6.9-2.6.9-.9 2.6-.9-2.6-2.6-.9 2.6-.9z'/%3E%3C/svg%3E"); }
@keyframes hbq-pop-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* The next button glows once when the step is ready. */
.hb-quote .hb-q__next.is-ready { animation: hbq-ready 1.4s var(--q-out) 1; }
@keyframes hbq-ready { 0% { box-shadow: 0 0 0 0 rgba(101, 123, 99, .55); } 70% { box-shadow: 0 0 0 14px rgba(101, 123, 99, 0); } 100% { box-shadow: 0 0 0 0 rgba(101, 123, 99, 0); } }

/* Composing the tray */
.hb-quote .hb-qb__tray-pic { flex: none; width: 28px; height: 28px; border: 2px solid rgba(255, 255, 255, .85); border-radius: 50%; object-fit: cover; }
.hb-quote .hb-qb__tray-list li.is-landing .hb-qb__tray-pic { opacity: 0; }
.hb-quote .hb-qb__tray-list li.is-landed .hb-qb__tray-pic { animation: hbq-land .45s var(--q-spring); }
@keyframes hbq-land { 0% { transform: scale(.6); } 60% { transform: scale(1.18); } 100% { transform: none; } }
.hb-qb__fly { position: fixed; z-index: 2000; margin: 0; object-fit: cover; pointer-events: none; transform-origin: 50% 50%; box-shadow: 0 14px 34px rgba(36, 28, 22, .3); will-change: transform; }

/* Summary: the picture of the event, and the dishes as a little tray of photos */
.hb-quote .hb-qs__hero { position: relative; height: 128px; margin: 4px 0 12px; overflow: hidden; border-radius: 20px; background: linear-gradient(135deg, #f3e3dc, #f1ebe2 70%); }
.hb-quote .hb-qs__hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.08); transition: opacity .6s var(--q-out), transform 1.2s var(--q-out); }
.hb-quote .hb-qs__hero img.is-on { opacity: 1; transform: none; }
.hb-quote .hb-qs__hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(28, 22, 18, .78), rgba(28, 22, 18, 0) 72%); opacity: 0; transition: opacity .5s var(--q-out); }
.hb-quote .hb-qs__hero.is-set::after { opacity: 1; }
.hb-quote .hb-qs__hero-txt { position: absolute; inset: auto 16px 12px; z-index: 1; display: grid; gap: 2px; color: var(--hb-ink-warm, #352b24); transition: color .4s; }
.hb-quote .hb-qs__hero.is-set .hb-qs__hero-txt { color: #fff; }
.hb-quote .hb-qs__hero-ev { font-weight: 700; font-size: 20px; line-height: 1.2; }
.hb-quote .hb-qs__hero-meta { font-size: 14px; opacity: .92; font-variant-numeric: tabular-nums; }
.hb-quote .hb-qs__mosaic { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.hb-quote .hb-qs__mosaic:empty { display: none; }
.hb-quote .hb-qs__mosaic img, .hb-quote .hb-qs__mosaic span { width: 40px; height: 40px; border-radius: 11px; object-fit: cover; animation: hbq-land .4s var(--q-spring); }
.hb-quote .hb-qs__mosaic span { display: grid; place-items: center; background: #f1ebe2; font-weight: 700; font-size: 13px; }

/* Review before sending */
.hb-quote .hb-q__review { padding: 18px 20px 10px; border-radius: 22px; background: #fff; box-shadow: 0 1px 2px rgba(53, 43, 36, .04), 0 12px 28px rgba(53, 43, 36, .07); }
.hb-quote .hb-q__review[hidden] { display: none; }
.hb-quote .hb-q__review-h { display: flex; align-items: center; gap: 9px; margin: 0 0 6px; font-weight: 700; font-size: 17px; color: var(--hb-ink-warm, #352b24); }
.hb-quote .hb-q__review-h::before { content: ""; flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--q-sage) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3l2.3 2.3 4.9-5.2' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.hb-quote .hb-q__review-list { display: grid; margin: 0; padding: 0; list-style: none; font-size: 15px; }
.hb-quote .hb-q__review-list li { display: grid; grid-template-columns: 104px minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; min-height: 44px; border-bottom: 1px dashed rgba(53, 43, 36, .12); }
.hb-quote .hb-q__review-list li:last-child { border-bottom: 0; }
.hb-quote .hb-q__review-k { color: var(--q-muted); }
.hb-quote .hb-q__review-v { font-weight: 700; color: var(--hb-ink-warm, #352b24); overflow-wrap: anywhere; }
.hb-quote .hb-q__review-edit { min-height: 36px; padding: 0 12px; border: 0; border-radius: 99px; background: transparent; color: #4f624d; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; transition: background-color .2s; }
.hb-quote .hb-q__review-edit:hover { background: #f1ebe2; }
.hb-quote .hb-q__review-edit:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 2px; }

/* Checks as you type: a calm tick in a field that is right. */
.hb-quote .is-valid input:not([type="radio"]):not([type="checkbox"]), .hb-quote input.is-valid {
	padding-left: 42px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23657b63'/%3E%3Cpath d='M5.8 10.3l2.7 2.7 5.6-6' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-position: left 14px center; background-size: 18px; background-repeat: no-repeat;
}

/* Celebration: sesame seeds from a finished step (and a bigger handful on success). */
.hb-q__burst { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.hb-q__burst i { position: absolute; top: 50%; left: 50%; width: 5px; height: 9px; margin: -4.5px 0 0 -2.5px; border-radius: 50%; background: #e3c78d; animation: hbq-seed .8s cubic-bezier(.2, .7, .3, 1) forwards; }
.hb-q__burst i:nth-child(3n) { background: #c9a24a; }
.hb-q__burst i:nth-child(3n+1) { background: #8da28b; }
.hb-q__burst--big i { width: 7px; height: 12px; margin: -6px 0 0 -3.5px; animation-duration: 1s; }
@keyframes hbq-seed {
	0% { transform: rotate(var(--a)) translateY(0) rotate(0); opacity: 1; }
	70% { opacity: 1; }
	100% { transform: rotate(var(--a)) translateY(calc(-1 * var(--d))) rotate(var(--r)); opacity: 0; }
}

@media (max-width: 1100px) { .hb-quote .hb-evc__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.hb-quote .hb-evc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.hb-quote .hb-evc__card { gap: 7px; padding: 5px 5px 10px; border-radius: 18px; }
	.hb-quote .hb-evc__img { aspect-ratio: 16 / 10; border-radius: 13px; }
	.hb-quote .hb-evc__name { padding: 0 6px; font-size: 14.5px; }
	.hb-quote .hb-evc__tick { top: 6px; left: 6px; width: 26px; height: 26px; }
	.hb-quote .hb-q__range { width: 100%; }
	.hb-quote .hb-q__review { padding: 16px 16px 6px; }
	.hb-quote .hb-q__review-list li { grid-template-columns: 82px minmax(0, 1fr) auto; font-size: 14.5px; }
	.hb-quote .hb-qs__hero { height: 112px; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-quote .hb-evc__card, .hb-quote .hb-evc__img img, .hb-quote .hb-qs__hero img, .hb-quote .hb-q__typical, .hb-quote .hb-q__next.is-ready { animation: none !important; transition: none !important; }
	.hb-q__burst, .hb-qb__fly { display: none !important; }
}

/* FX-3 (16/10/2026, fix wave) ------------------------------------------------------------------------ */
/* Step headings ("פרטי האירוע" …) rendered white on the pink card (1.5:1). Brand ink, 9.6:1. */
.hb-quote .hb-q__title, .hb-quote .hb-q__step > h2 { color: var(--hb-ink-warm); }
/* The form starts higher: the hero is a short band here (the hero filled 1280×800 and step 1 began at y≈580). */
.hb-quote .hb-about__hero--slim { min-height: 0; padding-block: 44px 0; }
.hb-quote .hb-about__hero--slim .hb-about__intro { padding-bottom: 8px; }
.hb-quote .hb-about__hero--slim .hb-about__hero-bagel { width: clamp(84px, 7vw, 108px); margin: 14px 0 -40px; }
@media (min-width: 768px) {
	.hb-quote .hb-about__hero--slim { min-height: 0; padding-block: 48px 0; }
}
@media (max-width: 767px) {
	.hb-quote .hb-about__hero--slim { padding-block: 36px 0; }
	.hb-quote .hb-about__hero--slim .hb-about__hero-bagel { width: 76px; margin: 10px 0 -30px; }
}
/* "מספר אחר" sits with the presets, the same chip. */
.hb-quote .hb-q__preset--other { padding-inline: 16px; }

/* ================================================================================================
   QW (16/10/2026): compact, alive wizard. Owner on step 1: "too long, not interactive enough".
   A short title band; the step names always visible; one question per step (h2 + one muted line); the
   event types as small tiles, four to a row on a phone, so the whole first step sits on one screen; the
   answers so far as chips above every step; a column on the computer with what the visitor can count on.
   ================================================================================================ */

/* Title band: same gutters, radius, overlay and centred title as every page hero, only shorter. */
.hb-quote .hb-quote__hero.hb-about__hero--slim { min-height: 0; padding: clamp(22px, 2.2vw, 30px) 20px clamp(20px, 2vw, 28px); justify-content: center; }
.hb-quote .hb-quote__hero .hb-about__intro { padding-bottom: 0; }
.hb-quote .hb-quote__hero .hb-about__title { font-size: clamp(30px, 3.4vw, 48px); line-height: 1.08; }
.hb-quote .hb-quote__hero .hb-about__lead { margin-top: 8px; font-size: clamp(15px, 1.2vw, 18px); line-height: 1.45; }
.hb-quote .hb-quote__hero .hb-about__hero-bagel { display: none; }
.hb-quote.hb-contact > .hb-quote__main { padding-top: clamp(14px, 2vw, 28px); }

/* One question per step: the question, one quiet line, then the answers. */
.hb-quote .hb-q__ask { display: grid; gap: 6px; }
.hb-quote .hb-q__ask .hb-q__title { margin: 0; }
.hb-quote .hb-q__sub { margin: 0; font-size: 15px; line-height: 1.45; color: var(--q-muted); }
.hb-quote .hb-q__step { gap: 22px; }
.hb-quote .hb-q__events { margin: 0; padding: 0; border: 0; min-width: 0; }

/* Step names: always readable, the current one bold, done ones show a check and can be tapped. */
.hb-quote .hb-q__steps li .hb-q__dot-label { opacity: 1 !important; transform: none !important; white-space: nowrap; }
.hb-quote .hb-q__steps li.is-reachable:hover .hb-q__dot-label { text-decoration: underline; text-underline-offset: 3px; }

/* The answers so far. */
.hb-q__answers { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.hb-q__answers[hidden] { display: none; }
.hb-q__ans {
	display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px 0 12px; border: 1px solid rgba(53, 43, 36, .14); border-radius: 999px;
	background: rgba(255, 255, 255, .78); color: var(--hb-ink-warm, #352b24); font: 600 14.5px/1.1 var(--hb-font); white-space: nowrap; cursor: pointer;
	animation: hbq-chip-in .32s var(--q-out) both; transition: border-color .2s var(--q-out), background-color .2s var(--q-out);
}
.hb-q__ans-pen { display: inline-grid; place-items: center; width: 14px; height: 14px; color: var(--q-muted); }
.hb-q__ans-pen:empty { background: currentColor; -webkit-mask: var(--q-pen) center / contain no-repeat; mask: var(--q-pen) center / contain no-repeat; }
.hb-q__ans-pen svg { width: 14px; height: 14px; }
.hb-q__ans.is-here { border-color: var(--q-sage); background: #fff; }
@media (hover: hover) and (pointer: fine) { .hb-q__ans:hover { border-color: rgba(53, 43, 36, .45); background: #fff; } }
.hb-q__ans:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 2px; }
@keyframes hbq-chip-in { from { opacity: 0; transform: translateY(4px) scale(.96); } to { opacity: 1; transform: none; } }

/* Event tiles: small photo, the name under it. A tap: the tile presses in, ticks, a few seeds, then the next question. */
.hb-quote .hb-evc__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hb-quote .hb-evc__card { gap: 8px; padding: 5px 5px 10px; border-radius: 20px; }
.hb-quote .hb-evc__img { aspect-ratio: 16 / 10; border-radius: 15px; }
.hb-quote .hb-evc__name { padding: 0 4px; font-size: 15px; text-align: center; text-wrap: balance; }
.hb-quote .hb-evc.is-picked .hb-evc__card { animation: hbq-pick .42s var(--q-spring); }
@keyframes hbq-pick { 0% { transform: scale(1); } 35% { transform: scale(.95); } 100% { transform: scale(1); } }
.hb-quote .hb-evc__tick { overflow: visible; }

/* Step 2: guests (number + the one scale), then when and where. */
.hb-quote .hb-q__guestbox { display: grid; gap: 12px; }
.hb-quote .hb-q__guestbox .hb-q__presets { margin-top: 0; }
.hb-quote .hb-q__guests .hb-stepper { max-width: 260px; }
.hb-quote .hb-q__when { margin: 0; }

/* Step 3: budget and service first, the dishes after a small heading. */
.hb-quote .hb-qb__head { display: grid; gap: 4px; padding-top: 18px; border-top: 1px solid var(--q-line); }
.hb-quote .hb-qb__lead { margin: 0; font-size: 19px; line-height: 1.25; color: var(--hb-ink-warm, #352b24); }
.hb-quote .hb-qb__head .hb-qb__intro { margin: 0; font-size: 15px; }

/* What the visitor can count on (computer: under the summary; phone: under the form). */
.hb-quote__trust { display: grid; gap: 0; margin: 0; padding: 6px 18px; border-radius: 24px; background: #fff; list-style: none; box-shadow: 0 1px 2px rgba(53, 43, 36, .04); }
.hb-quote__trust li { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid rgba(53, 43, 36, .12); }
.hb-quote__trust li:last-child { border-bottom: 0; }
.hb-quote__trust-ico { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #eef2ec; color: #4f624d; }
.hb-quote__trust li > span:last-child { display: grid; gap: 2px; }
.hb-quote__trust strong { font-size: 15px; line-height: 1.3; color: var(--hb-ink-warm, #352b24); }
.hb-quote__trust small { font-size: 13.5px; line-height: 1.35; color: #5b524d; }

@media (min-width: 961px) {
	/* The aside is a sticky column next to the form. */
	.hb-quote .hb-quote__aside { position: sticky; top: 112px; align-self: start; }
	.hb-quote .hb-qs__hero { height: 104px; }
}
@media (max-width: 767px) {
	.hb-quote .hb-quote__hero.hb-about__hero--slim { padding: 20px 16px 18px; border-radius: 28px; }
	.hb-quote .hb-quote__hero .hb-about__title { font-size: 27px; }
	.hb-quote .hb-quote__hero .hb-about__lead { margin-top: 6px; font-size: 14.5px; }
	.hb-quote .hb-quote__card { padding: 16px 12px 22px; border-radius: 28px; }
	.hb-quote .hb-q { gap: 16px; }
	.hb-quote .hb-q__progress { padding-bottom: 12px; }
	.hb-q__dot { width: 28px; height: 28px; font-size: 13px; }
	.hb-quote .hb-q__steps li { gap: 4px; }
	.hb-quote .hb-q__steps li .hb-q__dot-label { font-size: 12.5px; }
	.hb-quote .hb-q__steps li + li::before, .hb-quote .hb-q__steps li + li::after { top: 13px; }
	.hb-quote .hb-q__title { font-size: 22px; }
	.hb-quote .hb-q__sub { font-size: 14px; }
	.hb-quote .hb-q__step { gap: 16px; }
	/* Answers: one row that scrolls sideways, so it never pushes the question down. */
	.hb-q__answers { flex-wrap: nowrap; overflow-x: auto; margin: 10px -12px 0; padding: 0 12px 2px; scrollbar-width: none; -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 22px), transparent); mask-image: linear-gradient(to left, #000 calc(100% - 22px), transparent); }
	.hb-q__answers::-webkit-scrollbar { display: none; }
	.hb-q__ans { flex: none; padding: 0 12px 0 10px; font-size: 14px; }
	/* Four tiles to a row: all seven event types on the first screen. */
	.hb-quote .hb-evc__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
	.hb-quote .hb-evc__card { gap: 5px; padding: 3px 3px 7px; border-radius: 16px; }
	.hb-quote .hb-evc__img { aspect-ratio: 1 / 1; border-radius: 13px; }
	.hb-quote .hb-evc__name { padding: 0 2px; font-size: 13px; line-height: 1.2; }
	.hb-quote .hb-evc__tick { top: 4px; left: 4px; width: 22px; height: 22px; }
	.hb-quote .hb-evc__tick::after { width: 11px; height: 11px; }
	.hb-quote .hb-q__guests .hb-stepper { max-width: none; }
	/* The guest scale on two rows: 10 · 20 · 30 · 50 / 80 · 120 · מספר אחר, each a full 44px target. */
	.hb-quote .hb-q__guestbox .hb-q__presets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
	.hb-quote .hb-q__guestbox .hb-q__preset { width: 100%; white-space: nowrap; }
	.hb-quote .hb-q__guestbox .hb-q__preset--other { grid-column: span 2; }
	.hb-quote__trust { margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-q__ans, .hb-quote .hb-evc.is-picked .hb-evc__card { animation: none !important; }
}

/* ================================================================================================
   QW2 (16/10/2026): the dish picker (step 3). Owner: "improve the interface here".
   One sticky toolbar (search + category chips with icons and counts) that never lets a card show through; dish
   cards that are one big toggle with an unmistakable picked state (sage ring, sage check badge, a small lift);
   descriptions cut on a word; a closing tile so the last row is deliberate; the picks in a panel (computer: the
   side column; phones and tablets: a bar above the dock) with clear-all and undo; the service switch and the notes
   as the site's form rows. Behaviour: polish-quote.js section 13.
   ================================================================================================ */
.hb-quote { --q-sage-tint: #eef2ec; --q-sage-ink: #4f624d; --q-blush: #e5cec7; }
.hb-quote .hb-quote__card { --qb-bleed: clamp(24px, 3.2vw, 44px); }

/* Toolbar: sticky under the stuck header (polish-quote.js measures it into --qb-top), the card colour from edge
   to edge, and while stuck a cover above it up to the header, so no card shows through the gap. */
.hb-quote .hb-qb__tools {
	position: sticky; top: var(--qb-top, 92px); z-index: 6;
	display: flex; align-items: center; gap: 10px;
	width: auto; max-width: none; margin: 0 calc(-1 * var(--qb-bleed)) 16px; padding: 10px var(--qb-bleed);
	background: var(--q-blush);
	transition: box-shadow .2s var(--q-out);
}
.hb-quote .hb-qb__tools::before { content: ""; position: absolute; inset-inline: 0; bottom: 100%; height: calc(var(--qb-top, 92px) + 2px); background: var(--q-blush); visibility: hidden; pointer-events: none; }
.hb-quote .hb-qb__tools.is-stuck { box-shadow: 0 12px 18px -14px rgba(53, 43, 36, .35); }
.hb-quote .hb-qb__tools.is-stuck::before { visibility: visible; }
.hb-quote .hb-qb__filter { display: none !important; }
.hb-quote .hb-qb__search { flex: 0 0 176px; min-height: 46px; padding: 0 14px; border: 1.5px solid rgba(53, 43, 36, .1); background: var(--hb-white); color: #6b605a; transition: border-color .2s var(--q-out); }
.hb-quote .hb-qb__search:focus-within { border-color: var(--q-sage); box-shadow: 0 0 0 4px rgba(101, 123, 99, .2); color: var(--hb-ink-warm); }
.hb-quote .hb-qb__search svg { flex: none; }
.hb-quote .hb-qb__search input { height: 44px; font-size: 16px; }
.hb-quote .hb-qb__search input::placeholder { color: #6b605a; opacity: 1; }

/* The chip rail: chips scroll sideways; a fade on each side that has more and, with a mouse, an arrow there. */
.hb-quote .hb-qb__rail { position: relative; flex: 1 1 auto; min-width: 0; display: flex; align-items: center; }
.hb-quote .hb-qb__tabs {
	position: static; flex: 1 1 auto; min-width: 0; display: flex; gap: 8px; width: auto;
	gap: 6px; padding: 2px; margin: 0; overflow-x: auto; overflow-y: hidden; border-radius: 0; background: none; box-shadow: none;
	opacity: 1; visibility: visible; transform: none; scroll-padding-inline: 40px;
	-webkit-mask-image: none; mask-image: none;
}
.hb-quote .hb-qb__rail.is-more-start .hb-qb__tabs { -webkit-mask-image: linear-gradient(to left, transparent 0, #000 44px); mask-image: linear-gradient(to left, transparent 0, #000 44px); }
.hb-quote .hb-qb__rail.is-more-end .hb-qb__tabs { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 44px); mask-image: linear-gradient(to right, transparent 0, #000 44px); }
.hb-quote .hb-qb__rail.is-more-start.is-more-end .hb-qb__tabs { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%); mask-image: linear-gradient(to right, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%); }
.hb-quote .hb-qb__tab {
	flex: none; width: auto; justify-content: center; gap: 6px; min-height: 44px; padding: 0 13px 0 11px;
	border: 1.5px solid rgba(53, 43, 36, .1); border-radius: 999px; background: var(--hb-white); color: var(--hb-ink-warm);
	font: 500 15px/1 var(--hb-font); white-space: nowrap;
	transition: background-color .2s var(--q-out), border-color .2s var(--q-out), color .2s var(--q-out);
}
.hb-quote .hb-qb__tab-i { width: 18px; height: 18px; color: var(--q-sage-ink); }
.hb-quote .hb-qb__tab[aria-selected="true"] { border-color: var(--hb-ink-warm); background: var(--hb-ink-warm); color: var(--hb-white); font-weight: 600; }
.hb-quote .hb-qb__tab[aria-selected="true"] .hb-qb__tab-i { color: currentColor; }
.hb-quote .hb-qb.is-searching .hb-qb__tab[aria-selected="true"] { border-color: rgba(53, 43, 36, .1); background: var(--hb-white); color: var(--hb-ink-warm); }
.hb-quote .hb-qb.is-searching .hb-qb__tab[aria-selected="true"] .hb-qb__tab-i { color: var(--q-sage-ink); }
.hb-quote .hb-qb__tab-n { min-width: 22px; height: 22px; padding: 0 6px; border: 0; background: var(--q-sage); color: var(--hb-white); font-weight: 700; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.hb-quote .hb-qb__tab[aria-selected="true"] .hb-qb__tab-n { background: var(--hb-white); color: var(--hb-ink-warm); }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-qb__tab:not([aria-selected="true"]):hover { border-color: rgba(53, 43, 36, .45); } }
.hb-quote .hb-qb__tab:focus-visible { outline: 2px solid var(--hb-ink-warm); outline-offset: 2px; }
.hb-quote .hb-qb__arr { position: absolute; top: 50%; z-index: 2; margin-top: -22px; color: var(--hb-ink-warm); }
.hb-quote .hb-qb__arr::before { inset: 5px; background: var(--hb-white); box-shadow: 0 2px 10px rgba(53, 43, 36, .18); }
.hb-quote .hb-qb__arr--prev { right: -6px; }
.hb-quote .hb-qb__arr--next { left: -6px; }
.hb-quote .hb-qb__arr--next svg { transform: scaleX(-1); }
.hb-quote .hb-qb__arr[hidden] { display: none; }
@media (hover: none), (pointer: coarse) { .hb-quote .hb-qb__arr { display: none !important; } }

/* Dish grid: as many columns as fit (never thinner than 150px), equal cards. */
.hb-quote .hb-qb__grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.hb-quote .hb-qb__grid > li { display: flex; min-width: 0; }
.hb-quote .hb-qb__grid > li[hidden] { display: none; }
.hb-quote .hb-qb__dish {
	position: relative; display: flex; flex-direction: column; gap: 0; width: 100%; height: 100%;
	padding: 6px 6px 12px; border: 0; border-radius: 20px; background: var(--hb-white);
	box-shadow: 0 1px 2px rgba(53, 43, 36, .06);
	-webkit-tap-highlight-color: transparent; touch-action: manipulation;
	transition: box-shadow .22s var(--q-out), background-color .22s var(--q-out), transform .25s var(--q-out);
}
.hb-quote .hb-qb__dish-img { margin: 0 0 8px; border-radius: 15px; }
.hb-quote .hb-qb__dish-body { display: grid; gap: 3px; padding: 0 6px; min-width: 0; }
.hb-quote .hb-qb__dish-name { padding: 0; font-weight: 600; font-size: 15px; line-height: 1.3; color: var(--hb-ink-warm); overflow-wrap: anywhere; }
.hb-quote .hb-qb__dish-desc { display: block; min-height: calc(2 * 1.4em); max-height: calc(2 * 1.4em); overflow: hidden; padding: 0; font-size: 13px; line-height: 1.4; color: #5b524d; }
.hb-quote .hb-qb__dish-desc:not(.is-fit) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
/* The badge: "+" on white with a ring until picked, then a check on sage. */
.hb-quote .hb-qb__dish-check {
	top: 8px; left: 8px; display: grid; place-items: center; width: 32px; height: 32px;
	border: 1.5px solid rgba(53, 43, 36, .2); background: rgba(255, 255, 255, .95) none; color: var(--hb-ink-warm);
	box-shadow: 0 2px 8px rgba(30, 24, 20, .18); transform: none;
	transition: background-color .2s var(--q-out), border-color .2s var(--q-out), color .2s var(--q-out);
}
.hb-quote .hb-qb__dish-check svg { grid-area: 1 / 1; width: 16px; height: 16px; stroke-width: 2; transition: opacity .16s var(--q-out), transform .26s var(--q-spring); }
.hb-quote .hb-qb__ck-on { opacity: 0; transform: scale(.4); }
.hb-quote .hb-qb__dish[aria-pressed="true"] { background: #f6f9f5; box-shadow: 0 0 0 2.5px var(--q-sage), 0 12px 26px rgba(53, 43, 36, .14); transform: translateY(-2px); }
.hb-quote .hb-qb__dish[aria-pressed="true"] .hb-qb__dish-check { border-color: var(--q-sage); background: var(--q-sage); color: var(--hb-white); transform: none; animation: hbq-land .38s var(--q-spring); }
.hb-quote .hb-qb__dish[aria-pressed="true"] .hb-qb__ck-add { opacity: 0; transform: scale(.4) rotate(90deg); }
.hb-quote .hb-qb__dish[aria-pressed="true"] .hb-qb__ck-on { opacity: 1; transform: none; }
.hb-quote .hb-qb__dish[aria-pressed="true"] .hb-qb__dish-name { color: #2f3d2e; }
@media (hover: hover) and (pointer: fine) {
	.hb-quote .hb-qb__dish:not([aria-pressed="true"]):hover { border-color: transparent; box-shadow: 0 0 0 1.5px rgba(53, 43, 36, .22), 0 12px 26px rgba(53, 43, 36, .1); transform: translateY(-2px); }
	.hb-quote .hb-qb__dish:not([aria-pressed="true"]):hover .hb-qb__dish-check { border-color: var(--q-sage); color: var(--q-sage-ink); }
}
.hb-quote .hb-qb__dish:active { transform: scale(.98); transition-duration: var(--hb-t-press, 90ms); }
.hb-quote .hb-qb__dish:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 3px; }

/* The closing tile: fills what is left of the last row; alone on a row it is a slim strip. */
.hb-quote .hb-qb__more { min-width: 0; }
.hb-quote .hb-qb.is-searching .hb-qb__more { display: none; }
.hb-quote .hb-qb__more-btn {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 64px; height: 100%;
	padding: 14px; border: 1.5px dashed rgba(53, 43, 36, .3); border-radius: 20px; background: rgba(255, 255, 255, .4);
	color: var(--hb-ink-warm); font: inherit; text-align: center; cursor: pointer; transition: background-color .2s var(--q-out), border-color .2s var(--q-out);
}
.hb-quote .hb-qb__more.is-row .hb-qb__more-btn { flex-direction: row; justify-content: flex-start; text-align: start; padding: 10px 16px; }
.hb-quote .hb-qb__more-i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--hb-white); color: var(--q-sage-ink); flex: none; }
.hb-quote .hb-qb__more-t { display: grid; gap: 3px; }
.hb-quote .hb-qb__more-t strong { font-weight: 700; font-size: 15px; }
.hb-quote .hb-qb__more-t small { font-size: 13px; line-height: 1.4; color: #5b524d; }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-qb__more-btn:hover { border-color: var(--hb-ink-warm); background: rgba(255, 255, 255, .7); } }
.hb-quote .hb-qb__more-btn:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 3px; }

/* Service switch and notes: the site's form rows (an icon in a sage circle, a clear label, the switch at the end). */
.hb-quote .hb-qb__extras { display: block; margin-top: 22px; padding: 0; border-radius: 20px; background: var(--hb-white); box-shadow: 0 1px 2px rgba(53, 43, 36, .05); overflow: hidden; }
.hb-quote .hb-qb__toggle { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; width: 100%; min-height: 72px; padding: 14px 18px; border-radius: 0; }
.hb-quote .hb-qb__toggle-i, .hb-quote .hb-q__notes-i { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--q-sage-tint); color: var(--q-sage-ink); flex: none; }
.hb-quote .hb-qb__toggle-t { display: grid; gap: 3px; }
.hb-quote .hb-qb__ex-title { font-weight: 700; font-size: 16px; color: var(--hb-ink-warm); }
.hb-quote .hb-qb__toggle small { font-size: 13.5px; line-height: 1.45; color: #5b524d; }
.hb-quote .hb-qb__switch { width: 48px; height: 28px; margin: 0; background: rgba(53, 43, 36, .45); }
.hb-quote .hb-qb__switch::after { top: 3px; right: 3px; width: 22px; height: 22px; }
.hb-quote .hb-qb__toggle[aria-checked="true"] .hb-qb__switch { background: var(--q-sage); }
.hb-quote .hb-qb__toggle[aria-checked="true"] .hb-qb__switch::after { transform: translateX(-20px); }
.hb-quote .hb-qb__toggle:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: -3px; }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-qb__toggle:hover { background: #fbf8f6; } }
.hb-quote .hb-qb__stations:not([hidden]) { display: block; padding: 0 18px 16px; padding-inline-start: 76px; }
.hb-quote .hb-qb__ex-sub { font-weight: 600; font-size: 14.5px; color: var(--hb-ink-warm); }
.hb-quote .hb-qb__chip { min-height: 44px; padding: 0 16px; border: 1.5px solid rgba(53, 43, 36, .12); background: var(--hb-white); font-size: 14.5px; }
.hb-quote .hb-qb__chip[aria-pressed="true"] { border-color: var(--q-sage); background: var(--q-sage); color: var(--hb-white); }
.hb-quote .hb-qb__chip:focus-visible { outline: 2px solid var(--hb-ink-warm); outline-offset: 2px; }
.hb-quote .hb-q__notes { display: grid; gap: 10px; margin: 0; }
.hb-quote .hb-q__notes label { display: flex; align-items: center; gap: 12px; }
.hb-quote .hb-q__opt { font-weight: 500; font-size: 14px; color: #5b524d; }
.hb-quote .hb-q__notes textarea { min-height: 104px; padding: 14px 16px; background: var(--hb-white); line-height: 1.5; resize: vertical; }
.hb-quote .hb-q__notes.is-flash textarea { animation: hbq-ready 1.4s var(--q-out) 1; }

/* The old dark strip of picks is replaced by the panel below (main.js still fills it; it stays hidden). */
html.hb-q-js .hb-quote .hb-qb__tray { display: none !important; }

/* The picks panel ------------------------------------------------------------------------------------ */
.hb-qsel { display: grid; gap: 4px; min-width: 0; max-width: 100%; }
.hb-qsel[hidden] { display: none !important; }
.hb-qsel__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.hb-qsel__title { margin: 0; font-size: 19px; line-height: 1.25; color: var(--hb-ink-warm, #352b24); }
.hb-qsel__clear { position: relative; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px; margin-inline-end: -10px; border: 0; border-radius: 999px; background: transparent; color: var(--hb-ink-warm, #352b24); font: 600 14px var(--hb-font); cursor: pointer; }
.hb-qsel__clear[hidden] { display: none; }
@media (hover: hover) and (pointer: fine) { .hb-qsel__clear:hover { background: #f1ebe2; } }
.hb-qsel button:focus-visible { outline: 2px solid var(--hb-ink-warm, #352b24); outline-offset: 2px; }
.hb-qsel__n { margin: 0; font-weight: 600; font-size: 15px; color: var(--q-sage-ink, #4f624d); font-variant-numeric: tabular-nums; }
.hb-qsel__empty { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: #5b524d; }
.hb-qsel:not(.is-empty) .hb-qsel__empty { display: none; }
.hb-qsel__list { display: grid; gap: 2px; margin: 6px 0 0; padding: 0; list-style: none; }
.hb-qsel__list:empty { display: none; }
.hb-qsel__item { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 10px; padding: 4px 0; animation: hbq-chip-in .26s var(--q-out) both; }
.hb-qsel__item img, .hb-qsel__pic { display: block; width: 44px; height: 44px; border-radius: 12px; object-fit: cover; background: #f1ebe2; }
.hb-qsel__item.is-landing img { opacity: 0; }
.hb-qsel__item.is-landed img { animation: hbq-land .45s var(--q-spring); }
.hb-qsel__txt { display: grid; min-width: 0; }
.hb-qsel__name { font-weight: 600; font-size: 14.5px; line-height: 1.3; color: var(--hb-ink-warm, #352b24); }
.hb-qsel__cat { font-size: 12.5px; line-height: 1.3; color: #5b524d; }
.hb-qsel__undo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 6px 0 0; padding: 4px 4px 4px 4px; padding-inline-start: 14px; border-radius: 14px; background: var(--hb-ink-warm, #352b24); color: var(--hb-white, #fff); font-weight: 600; font-size: 14.5px; animation: hbq-chip-in .26s var(--q-out) both; }
.hb-qsel__undo[hidden] { display: none; }
.hb-qsel__undo button { min-height: 44px; padding: 0 16px; border: 0; border-radius: 10px; background: transparent; color: #f6d9a0; font: 700 14.5px var(--hb-font); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.hb-qsel .hb-qsel__undo button:focus-visible { outline-color: #fff; }

/* Computer: the first card of the side column, on step 3 only; the summary gets shorter there so both fit. */
@media (min-width: 961px) {
	.hb-quote .hb-qsel { padding: 20px 22px 16px; border-radius: 28px; background: var(--hb-white); box-shadow: 0 1px 2px rgba(53, 43, 36, .04), 0 18px 40px rgba(53, 43, 36, .08); }
	html:not([data-hbq-at="3"]) .hb-quote .hb-qsel { display: none; }
	.hb-quote .hb-qsel__list { max-height: max(150px, calc(100vh - 620px)); overflow-y: auto; overscroll-behavior: contain; margin-inline: -6px; padding-inline: 6px; scrollbar-width: thin; }
	html[data-hbq-at="3"] .hb-quote :is(.hb-quote__trust, .hb-quote__help, .hb-qs__hero, .hb-quote__picks-row) { display: none !important; }
	html[data-hbq-at="3"] .hb-quote .hb-quote__summary { padding-block: 18px 12px; }
}
/* Phones and tablets: one compact bar above the dock, only while something is picked (or just cleared). */
@media (max-width: 960px) {
	html.hb-q-js .hb-quote .hb-qsel {
		position: sticky; bottom: calc(92px + env(safe-area-inset-bottom, 0px)); z-index: 7;
		display: flex; align-items: center; gap: 8px;
		margin: 16px 0 0; padding: 7px;
		border: 1px solid rgba(53, 43, 36, .08); border-radius: 26px; background: rgba(255, 255, 255, .97);
		box-shadow: 0 10px 30px rgba(53, 43, 36, .2);
	}
	html.hb-q-js .hb-quote .hb-qsel.is-empty:not(.is-undo) { display: none; }
	html.hb-q-js .hb-quote .hb-qsel :is(.hb-qsel__title, .hb-qsel__empty) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-qsel__head { display: contents; }
	html.hb-q-js .hb-quote .hb-qsel__n { order: -1; flex: none; display: grid; place-items: center; min-height: 40px; padding: 0 12px; border-radius: 999px; background: var(--q-sage); color: var(--hb-white); font-size: 13.5px; white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-qsel__list { order: 0; flex: 1 1 auto; min-width: 0; display: flex; gap: 6px; margin: 0; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 18px), transparent); mask-image: linear-gradient(to left, #000 calc(100% - 18px), transparent); }
	html.hb-q-js .hb-quote .hb-qsel__list::-webkit-scrollbar { display: none; }
	html.hb-q-js .hb-quote .hb-qsel__item { flex: none; grid-template-columns: 32px auto 44px; gap: 4px; padding: 0 0 0 0; padding-inline-start: 4px; border-radius: 999px; background: #f6f1ec; }
	html.hb-q-js .hb-quote .hb-qsel__item img, html.hb-q-js .hb-quote .hb-qsel__pic { width: 32px; height: 32px; border-radius: 50%; }
	html.hb-q-js .hb-quote .hb-qsel__cat { display: none; }
	html.hb-q-js .hb-quote .hb-qsel__name { font-size: 13.5px; white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-qsel__item .hb-ibtn { width: 44px; height: 44px; }
	html.hb-q-js .hb-quote .hb-qsel__item .hb-ibtn::before { inset: 7px; background: rgba(53, 43, 36, .08); }
	html.hb-q-js .hb-quote .hb-qsel__clear { order: 1; flex: none; width: 44px; padding: 0; margin: 0; justify-content: center; background: #f6f1ec; border-radius: 50%; }
	html.hb-q-js .hb-quote .hb-qsel__clear span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
	html.hb-q-js .hb-quote .hb-qsel.is-undo { padding: 0; border: 0; background: none; box-shadow: 0 10px 30px rgba(53, 43, 36, .2); border-radius: 14px; }
	html.hb-q-js .hb-quote .hb-qsel.is-undo > :not(.hb-qsel__undo):not(.hb-qsel__head), html.hb-q-js .hb-quote .hb-qsel.is-undo .hb-qsel__clear { display: none; }
	html.hb-q-js .hb-quote .hb-qsel__undo { flex: 1 1 auto; margin: 0; }
}

/* Phones: the search folds into a round button next to the chips, and opens over them when tapped. */
@media (max-width: 767px) {
	.hb-quote .hb-quote__card { --qb-bleed: 12px; }
	.hb-quote .hb-qb__tools { gap: 8px; padding-block: 8px; }
	.hb-quote .hb-qb__search { flex: 0 0 46px; justify-content: center; padding: 0; gap: 0; border-radius: 999px; overflow: hidden; cursor: pointer; }
	.hb-quote .hb-qb__search input { flex: 0 0 0; width: 0; padding: 0; }
	.hb-quote .hb-qb__search:focus-within { flex: 1 1 auto; justify-content: flex-start; padding: 0 14px; gap: 8px; }
	.hb-quote .hb-qb__search:focus-within input { flex: 1 1 auto; width: 100%; }
	.hb-quote .hb-qb__search:has(input:not(:placeholder-shown)):not(:focus-within) { flex: 0 1 44%; justify-content: flex-start; padding: 0 12px; gap: 6px; }
	.hb-quote .hb-qb__search:has(input:not(:placeholder-shown)):not(:focus-within) input { flex: 1 1 auto; width: 100%; }
	.hb-quote .hb-qb__tools:has(.hb-qb__search:focus-within) .hb-qb__rail { display: none; }
	.hb-quote .hb-qb__tab { padding: 0 12px 0 11px; font-size: 14.5px; }
	/* main.css pulls the dishes 14px past the card padding; keep them (and the picked ring) inside the card. */
	.hb-quote .hb-qb__cats { margin-inline: -6px; }
	/* The accessibility button rises above the picks bar while it shows (it sat on the bar's clear button). */
	html.hb-q-js body:has(.hb-q.is-stepped):has(.hb-qsel:not(.is-empty), .hb-qsel.is-undo) .hb-a11y { translate: 0 -66px; } /* translate, not bottom: no layout shift */
}
/* Phones: a compact list (photo, name, two lines, the badge at the end) reads faster than tall photo cards. */
@media (max-width: 560px) {
	.hb-quote .hb-qb__grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
	.hb-quote .hb-qb__dish { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 12px; padding: 6px; padding-inline-end: 54px; border-radius: 18px; }
	.hb-quote .hb-qb__dish-img { position: static; width: 76px; height: 76px; aspect-ratio: auto; margin: 0; border-radius: 13px; }
	.hb-quote .hb-qb__dish-body { padding: 0; }
	.hb-quote .hb-qb__dish-check { top: 50%; left: 12px; margin-top: -16px; }
	.hb-quote .hb-qb__dish[aria-pressed="true"] { transform: none; }
	.hb-quote .hb-qb__dish:active { transform: scale(.985); }
	.hb-quote .hb-qb__more-btn { flex-direction: row; justify-content: flex-start; text-align: start; padding: 12px 14px; border-radius: 18px; }
	.hb-quote .hb-qb__toggle { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; padding: 14px; }
	.hb-quote .hb-qb__toggle-i, .hb-quote .hb-q__notes-i { width: 40px; height: 40px; }
	.hb-quote .hb-qb__stations:not([hidden]) { padding: 0 14px 14px; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-quote .hb-qb__dish, .hb-quote .hb-qb__dish-check, .hb-qsel__item, .hb-qsel__undo { animation: none !important; transition: none !important; }
	.hb-quote .hb-qb__dish[aria-pressed="true"] { transform: none; }
}

/* ================================================================================================
   QW2b (16/10/2026): no clouds of pills on steps 3 and 4 (owner: "לסדר כל התפזורות האלה").
   Budget = one row of 4 equal segments (the range, and under it the estimated total for the guests), with
   "עוד לא יודעים" as a small choice under the row; full service = one switch row; the way back to the visitor
   = 3 segments with icons; the answers so far = one framed line; every panel hugs its content.
   ================================================================================================ */

/* Segmented control (radios inside, same names and values) */
.hb-quote .hb-qseg {
	display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 4px; padding: 4px;
	border: 1.5px solid rgba(53, 43, 36, .1); border-radius: 18px; background: var(--hb-white); box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
}
.hb-quote .hb-qseg__opt {
	position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
	min-width: 0; min-height: 60px; padding: 8px 6px; border-radius: 14px; color: var(--hb-ink-warm); text-align: center; cursor: pointer;
	-webkit-tap-highlight-color: transparent; transition: background-color .2s var(--q-out), color .2s var(--q-out);
}
.hb-quote .hb-qseg__opt input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.hb-quote .hb-qseg__v { font-weight: 600; font-size: 15px; line-height: 1.25; white-space: nowrap; }
.hb-quote .hb-qseg__ic { order: -1; display: grid; place-items: center; color: var(--q-sage-ink); }
.hb-quote .hb-qseg__est { min-height: 1.35em; font-size: 12.5px; line-height: 1.35; color: #5b524d; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hb-quote .hb-qseg__ck {
	position: absolute; top: 6px; left: 6px; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%;
	background: var(--hb-white); color: var(--q-sage); opacity: 0; transform: scale(.4); transition: opacity .16s var(--q-out), transform .26s var(--q-spring);
}
.hb-quote .hb-qseg__ck svg { width: 12px; height: 12px; stroke-width: 2.4; }
.hb-quote .hb-qseg__opt:has(input:checked) { background: var(--q-sage); color: var(--hb-white); }
.hb-quote .hb-qseg__opt:has(input:checked) :is(.hb-qseg__est, .hb-qseg__ic) { color: var(--hb-white); }
.hb-quote .hb-qseg__opt:has(input:checked) .hb-qseg__ck { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-qseg__opt:not(:has(input:checked)):hover { background: #f6f1ec; } }
.hb-quote .hb-qseg__opt:active { transform: scale(.98); transition-duration: var(--hb-t-press, 90ms); }
.hb-quote .hb-qseg__opt:has(input:focus-visible) { outline: 3px solid var(--hb-ink-warm); outline-offset: 2px; }
.hb-quote .is-invalid .hb-qseg { border-color: rgba(176, 55, 32, .55); }
.hb-quote .hb-q__seg-group { min-width: 0; margin: 0; padding: 0; border: 0; }

/* "עוד לא יודעים": a small check-style choice under the budget row (one of the same radios). */
.hb-quote .hb-q__unsure { position: relative; display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 44px; margin-top: 8px; color: var(--hb-ink-warm); font-weight: 600; font-size: 15px; cursor: pointer; }
.hb-quote .hb-q__unsure input {
	flex: none; appearance: none; -webkit-appearance: none; width: 22px; height: 22px; margin: 0; border: 1.5px solid rgba(53, 43, 36, .45); border-radius: 7px; background: var(--hb-white) center / 14px no-repeat; cursor: pointer;
	transition: background-color .16s var(--q-out), border-color .16s var(--q-out);
}
.hb-quote .hb-q__unsure input:checked { border-color: var(--q-sage); background-color: var(--q-sage); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3l2.3 2.3 4.9-5.2' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.hb-quote .hb-q__unsure input:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 2px; }
.hb-quote .hb-q__unsure small { flex-basis: 100%; margin-top: -6px; padding-inline-start: 32px; font-weight: 500; font-size: 13px; color: #5b524d; }
.hb-quote .hb-q__est-note { margin: 4px 0 0; font-size: 13px; line-height: 1.45; color: #5b524d; }
.hb-quote .hb-q__est-note[hidden] { display: none; }

/* Full service: one switch row, like the site's form rows. */
.hb-quote .hb-q__svc { margin: 0; }
.hb-quote .hb-q__svc-row {
	display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 14px; width: 100%; min-height: 72px;
	padding: 14px 18px; border: 0; border-radius: 20px; background: var(--hb-white); box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
	color: var(--hb-ink-warm); font: inherit; text-align: start; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.hb-quote .hb-q__svc-i { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--q-sage-tint); color: var(--q-sage-ink); }
.hb-quote .hb-q__svc-t { display: grid; gap: 3px; }
.hb-quote .hb-q__svc-t strong { font-weight: 700; font-size: 16px; }
.hb-quote .hb-q__svc-t small { font-size: 13.5px; line-height: 1.45; color: #5b524d; }
.hb-quote .hb-q__svc-row[aria-checked="true"] .hb-qb__switch { background: var(--q-sage); }
.hb-quote .hb-q__svc-row[aria-checked="true"] .hb-qb__switch::after { transform: translateX(-20px); }
.hb-quote .hb-q__svc-row:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-q__svc-row:hover { background: #fbf8f6; } }

/* The answers so far: one framed line ("ברית · 20 אורחים · 16.10 ✎"); each part goes back to its question. */
.hb-quote .hb-q__answers {
	flex-wrap: nowrap; gap: 0; margin: 14px 0 0; padding: 0 6px; overflow-x: auto; overflow-y: hidden;
	border: 1px solid rgba(53, 43, 36, .12); border-radius: 16px; background: rgba(255, 255, 255, .72);
	scrollbar-width: none; overscroll-behavior-x: contain; -webkit-mask-image: none; mask-image: none;
}
.hb-quote .hb-q__answers::-webkit-scrollbar { display: none; }
.hb-quote .hb-q__answers.is-more-start { -webkit-mask-image: linear-gradient(to left, transparent 0, #000 32px); mask-image: linear-gradient(to left, transparent 0, #000 32px); }
.hb-quote .hb-q__answers.is-more-start.is-more-end { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 32px, #000 calc(100% - 32px), transparent); mask-image: linear-gradient(to right, transparent 0, #000 32px, #000 calc(100% - 32px), transparent); }
.hb-quote .hb-q__answers.is-more-end:not(.is-more-start) { -webkit-mask-image: linear-gradient(to right, transparent 0, #000 32px); mask-image: linear-gradient(to right, transparent 0, #000 32px); }
.hb-quote .hb-q__ans { flex: none; gap: 6px; min-height: 44px; padding: 0 8px; border: 0; border-radius: 10px; background: transparent; font-size: 14.5px; animation: none; }
.hb-quote .hb-q__ans + .hb-q__ans::before { content: "·"; margin-inline-end: 8px; color: #8a7f78; font-weight: 700; }
.hb-quote .hb-q__ans .hb-q__ans-pen { display: none; }
.hb-quote .hb-q__ans:last-child .hb-q__ans-pen { display: inline-grid; }
.hb-quote .hb-q__ans.is-here { border: 0; background: var(--q-sage-tint); }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-q__ans:hover { border: 0; background: #f6f1ec; text-decoration: underline; text-underline-offset: 3px; } }

/* Every panel hugs its content: the bottom padding equals the top; the dock's room is kept once, under the page. */
@media (max-width: 960px) {
	html.hb-q-js .hb-quote .hb-quote__card { padding-bottom: clamp(24px, 3.2vw, 44px); }
	html.hb-q-js .hb-quote .hb-quote__main { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
	html.hb-q-js.hb-q-sent .hb-quote .hb-quote__main { padding-bottom: 0; }
}
@media (max-width: 767px) {
	html.hb-q-js .hb-quote .hb-quote__card { padding-bottom: 16px; }
	.hb-quote .hb-qseg__v { font-size: 14px; }
	.hb-quote .hb-qseg__est { font-size: 12px; }
	.hb-quote .hb-qseg__opt { min-height: 58px; padding: 8px 3px; }
	.hb-quote .hb-q__seg-group--q_contact .hb-qseg__v { font-size: 13.5px; }
	.hb-quote .hb-q__svc-row { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; padding: 14px; }
	.hb-quote .hb-q__svc-i { width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) {
	.hb-quote .hb-qseg__opt, .hb-quote .hb-qseg__ck, .hb-quote .hb-q__unsure input { transition: none !important; }
}

/* QW2b: the guest scale is one row of six equal numbers (the same segment surface as the budget); another number
   is a small link under it that puts the cursor in the field. */
.hb-quote .hb-q__guestbox .hb-q__presets {
	display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; max-width: 460px; margin: 0; padding: 4px;
	border: 1.5px solid rgba(53, 43, 36, .1); border-radius: 18px; background: var(--hb-white); box-shadow: 0 1px 2px rgba(53, 43, 36, .05);
}
.hb-quote .hb-q__guestbox .hb-q__preset { width: 100%; min-width: 0; min-height: 44px; padding: 0 2px; border: 0; border-radius: 14px; background: transparent; white-space: nowrap; }
.hb-quote .hb-q__guestbox .hb-q__preset[aria-pressed="true"] { background: var(--q-sage); color: var(--hb-white); }
@media (hover: hover) and (pointer: fine) { .hb-quote .hb-q__guestbox .hb-q__preset:not([aria-pressed="true"]):hover { background: #f6f1ec; transform: none; } }
.hb-quote .hb-q__other {
	justify-self: start; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: -8px; padding: 0 2px; border: 0; background: none;
	color: var(--hb-ink-warm); font: 600 14.5px var(--hb-font); text-decoration: underline; text-decoration-color: rgba(53, 43, 36, .35); text-underline-offset: 4px; cursor: pointer;
}
.hb-quote .hb-q__other svg { color: var(--q-sage-ink); }
.hb-quote .hb-q__other[aria-pressed="true"] { text-decoration-color: var(--q-sage); }
.hb-quote .hb-q__other:focus-visible { outline: 3px solid var(--hb-ink-warm); outline-offset: 2px; border-radius: 8px; }


/* QW2b: every control on the quote page is at least 44px (the calendar arrows and the review "change" links were 36). */
.hb-quote .hb-date .hb-date__head .hb-date__nav { width: 44px; height: 44px; }
.hb-quote .hb-q__review-edit { min-height: 44px; }
/* The check sits on the selected segment's corner, outside the text (at 390 the range fills the segment). */
.hb-quote .hb-qseg__ck { top: -6px; left: -4px; z-index: 2; width: 20px; height: 20px; box-shadow: 0 0 0 2px var(--q-sage), 0 1px 3px rgba(53, 43, 36, .2); pointer-events: none; }
/* "עוד לא יודעים": the radio covers the whole 44px row (the target), the box is drawn beside the words. */
.hb-quote .hb-q__unsure input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; margin: 0; border: 0; border-radius: 10px; background: none; opacity: 0; }
.hb-quote .hb-q__unsure span { display: inline-flex; align-items: center; gap: 10px; }
.hb-quote .hb-q__unsure span::before {
	content: ""; flex: none; width: 22px; height: 22px; box-sizing: border-box; border: 1.5px solid rgba(53, 43, 36, .45); border-radius: 7px; background: var(--hb-white) center / 14px no-repeat;
	transition: background-color .16s var(--q-out), border-color .16s var(--q-out);
}
.hb-quote .hb-q__unsure input:checked + span::before { border-color: var(--q-sage); background-color: var(--q-sage); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.4 6.3l2.3 2.3 4.9-5.2' fill='none' stroke='%23fff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.hb-quote .hb-q__unsure:has(input:focus-visible) { outline: 3px solid var(--hb-ink-warm); outline-offset: 2px; border-radius: 10px; }
@media (prefers-reduced-motion: reduce) { .hb-quote .hb-q__unsure span::before { transition: none; } }
/* The summary photo's caption fills in after load: keep its box (two lines) from the start, so it does not move. */
.hb-quote .hb-qs__hero-txt { min-height: 47px; align-content: end; }

/* FX-7: step 3 had two service controls (the "שירות מלא באירוע" switch and the menu builder's "ניהול ופינוי האירוע").
   polish-quote.js keeps the first one visible and drives the second, which stays in the DOM, hidden. The card around it
   (it also holds the stations) shows only while the stations are open. */
.hb-quote .hb-q-svcmerge .hb-qb__toggle[data-hb-qb-service] { display: none; }
.hb-quote .hb-q-svcmerge .hb-qb__extras:not(:has(.hb-qb__stations:not([hidden]))) { display: none; }

/* 17/10 (last leftovers): the answers line wraps instead of scrolling sideways, so on step 4 at 390px the whole summary
   ("ברית · 50 אורחים · 20.12.2026 · ...") is visible, with no fade or clipped chip. */
html .hb-quote .hb-q__answers { flex-wrap: wrap; overflow: visible; padding: 2px 6px; -webkit-mask-image: none !important; mask-image: none !important; }
html .hb-quote .hb-q__ans { min-height: 40px; }

/* Owner 17/10/2026: four event cards in a phone row read "too small and crowded". Two per row on a phone, three on a tablet. */
@media (max-width: 1023px) { .hb-quote .hb-evc__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } }
@media (max-width: 599px) { .hb-quote .hb-evc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
@media (max-width: 599px) {
	.hb-quote .hb-evc__card { gap: 8px; padding: 6px 6px 12px; border-radius: 20px; }
	.hb-quote .hb-evc__img { aspect-ratio: 4 / 3; border-radius: 15px; }
	.hb-quote .hb-evc__name { font-size: 16px; line-height: 1.25; }
	.hb-quote .hb-evc__tick { top: 8px; left: 8px; width: 26px; height: 26px; }
}

/* Owner 17/10/2026: the answers summary above each step reads as a light recap: small tidy pills that wrap, no "·"
   separators left dangling at line starts, no tall rows. Tap a pill to go back to that step (unchanged). */
html .hb-quote .hb-q__answers { gap: 6px; padding: 10px; }
html .hb-quote .hb-q__ans { min-height: 34px; padding: 0 12px; border-radius: 999px; background: #f4eee9; box-shadow: inset 0 0 0 1px rgba(53, 43, 36, .08); font-size: 14px; font-weight: 600; }
html .hb-quote .hb-q__ans + .hb-q__ans::before { content: none; }
html .hb-quote .hb-q__ans.is-here { background: var(--q-sage-tint); }
/* Owner 17/10/2026 (2nd pass): no box around the recap, no side padding: the pills sit straight on the step panel,
   aligned with the question below, tight 6px rhythm. */
html .hb-quote .hb-q__answers { margin: 12px 0 0; padding: 0; gap: 6px; border: 0; border-radius: 0; background: none; }
html .hb-quote .hb-q__ans { min-height: 32px; padding: 0 11px; font-size: 13.5px; background: #fff; }

/* R11 (Sunday review, 17/10/2026): step 1 on one phone screen. The opening band on this page is compact (the title
   and one line; the crumbs go, the band bagel stays, owner), the step's helper line goes, and the event photos are a
   little shorter, so the first two rows of event cards sit above the "המשך" bar at 390x844. */
@media (max-width: 767px) {
	.hb-ob.hb-quote__hero { --hb-ob-h: 112px; }
	.hb-ob.hb-quote__hero .hb-ob__crumbs { display: none; }
	.hb-ob.hb-quote__hero .hb-ob__in { padding-top: 6px; }
	.hb-quote [data-hb-q-step="1"] .hb-q__sub { display: none; }
	.hb-quote.hb-contact > .hb-quote__main { padding-top: 0; }
	.hb-quote .hb-q__progress { padding-bottom: 10px; }
}
@media (max-width: 599px) {
	.hb-quote .hb-evc__img { aspect-ratio: 16 / 10; }
}
/* CJ 17/10: step 4 showed the answers three times (pills above the title, this recap, the side summary). The pills
   stay and edit each answer, so the recap goes and the send button moves up. */
.hb-q__review { display: none !important; }

/* Success screen: the PDF summary and the copy sent by email (holybagel-core/includes/quote-pdf.php, 25/10/2026). */
.hb-q__done-pdf { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 24px 0 0; }
.hb-q__done-pdf[hidden], .hb-q__done-pdf [hidden] { display: none !important; }
.hb-done .hb-q__done-pdf .hb-done__meta { margin: 0; }


/* ================================================================================================
   Event-page funnel as the catering-quote wizard (owner 29/10/2026). main.js fninWizard builds the questions with the
   quote markup inside .hb-fnin__steps.hb-quote, so the rules above (scoped by .hb-quote) style them; these only fit
   the three steps, the five concept cards and the page context. */
.hb-fnin .hb-fnw .hb-q__steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* The holiday's four steps, same flush-to-the-edge geometry as the three in polish-global. */
html body .hb-fnin .hb-fnw--season .hb-q__steps { grid-template-columns: repeat(4, minmax(0, 165px)) !important; margin-inline-start: -64px !important; }
@media (max-width: 760px) {
	html body .hb-fnin .hb-fnw--season .hb-q__steps { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; width: calc(133.33% - 53px) !important; margin-inline: calc((100% - 160px) / -6) 0 !important; }
}
.hb-fnin .hb-fnw .hb-q__progress { margin-bottom: 4px; }
.hb-fnin .hb-fnw .hb-q__step[hidden] { display: none !important; }
.hb-fnin .hb-fnw .hb-qseg { grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr)); }
.hb-fnin .hb-fnw .hb-q__next:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.hb-fnin .hb-fnw .hb-q__submit:not([hidden]) { display: inline-flex; }
.hb-fnin.has-wizard .hb-fnin__own { display: block; margin-top: 18px; text-align: center; font-size: 14.5px; line-height: 1.5; }
@media (min-width: 1025px) {
	.hb-fnin .hb-fnw .hb-evc__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
/* The holiday's first question: two cards. */
html body .hb-fnin .hb-fnw .hb-evc__grid.hb-fnw__kinds { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 620px; margin-inline: auto; }
@media (max-width: 767px) {
	/* No stacked gutters: the section's margin and padding go, the card keeps its own 16px. */
	.hb-fnin.has-wizard { margin-inline: 0 !important; padding-inline: 0 !important; }
	.hb-fnin.has-wizard .hb-fnin__mood { padding-inline: 12px; }
	.hb-fnin.has-wizard .hb-quote__card { padding: 22px 16px 20px; border-radius: 24px; }
	.hb-fnin .hb-fnw .hb-evc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.hb-fnin .hb-fnw .hb-qseg { --n: 2 !important; }
	.hb-fnin .hb-fnw .hb-q__nav { display: flex; gap: 8px; margin-top: 18px; }
	.hb-fnin .hb-fnw .hb-q__nav .hb-q__next, .hb-fnin .hb-fnw .hb-q__nav .hb-q__submit { flex: 1 1 auto; }
	/* "חזרה" is the round arrow button, as in the quote's dock (the word stays for screen readers). */
	.hb-fnin .hb-fnw .hb-q__back { flex: none; display: inline-grid; place-items: center; width: 56px; min-width: 56px; height: 56px; padding: 0; border-radius: 50%; }
	.hb-fnin .hb-fnw .hb-q__back[hidden] { display: none; }
	.hb-fnin .hb-fnw .hb-q__back-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* The same wizard in the order window (order-app.js fnForm): a white quote card on the window's background, four steps
   (event, guests, concept, budget). The quote rules apply through .hb-quote on .hba-fnq. */
.hba-fnq.hb-quote { max-width: 880px; margin-inline: auto; }
.hba-fnq .hb-quote__card { padding: 30px 34px 26px; }
.hba-fnq .hb-q__progress { margin-bottom: 6px; }
.hba-fnq .hb-q__ask { margin-bottom: 4px; }
.hba-fnq .hba-fnq__intro { margin-bottom: 8px; }
.hba-fnq .hba-fn__grp { margin-top: 14px; }
.hba-fnq .hba-fn__gl { margin: 0 0 8px; font-weight: 600; font-size: 14px; color: var(--q-muted, #6f625a); }
.hba-fnq .hba-fn__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.hba-fnq .hb-q__next:disabled, .hba-fnq .hb-q__submit:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.hba-fnq .hb-qseg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hba-fnq .hb-q__nav { display: flex; align-items: center; gap: 10px; margin-top: 22px; }
.hba-fnq .hb-q__nav .hb-q__next, .hba-fnq .hb-q__nav .hb-q__submit { flex: 1 1 auto; }
.hba-fnq .hba-cf__go { margin-top: 14px; text-align: center; }
@media (min-width: 900px) { .hba-fnq .hb-evc__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (max-width: 767px) {
	.hba-fnq.hb-quote { max-width: none; }
	.hba-fnq .hb-quote__card { padding: 20px 16px 18px; border-radius: 22px; }
	.hba-fnq .hb-evc__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.hba-fnq .hb-qseg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hba-fnq .hb-q__back { flex: none; display: inline-grid; place-items: center; width: 56px; min-width: 56px; height: 56px; padding: 0; border-radius: 50%; }
	.hba-fnq .hb-q__back-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
/* the window's own card colours lose to the quote card: white card, readable event chips, no focus frame on the title */
.hba-fnq .hba-cf__form.hb-quote__card { background: var(--hb-white, #fff); box-shadow: 0 24px 48px -32px rgba(53, 43, 36, .35); }
.hba-fnq .hba-chip { background: var(--hb-white, #fff); color: var(--hb-ink-warm, #352b24); border: 1.5px solid rgba(53, 43, 36, .12); }
.hba-fnq .hba-chip:hover { background: #f6f1ec; }
.hba-fnq .hba-chip[aria-pressed="true"] { background: var(--q-sage, #657b63); border-color: var(--q-sage, #657b63); color: var(--hb-white, #fff); }
.hba-fnq .hb-q__title:focus { outline: none; }
.hba-fnq .hb-q__title:focus, .hba-fnq .hb-q__title:focus-visible { outline: none !important; box-shadow: none !important; }
.hba-fnq .hba-cf__eye { color: var(--hb-ink-warm, #352b24); }
/* the window's buttons are white-on-sage by default: the quote's light controls get their ink back; the card fills the column */
.hba-fnq.hb-quote, .hba-fnq .hba-cf__form.hb-quote__card { width: 100%; box-sizing: border-box; }
.hba-fnq .hb-stepper__btn { color: var(--hb-ink-warm, #352b24); }
.hba-fnq .hb-q__preset { color: var(--hb-ink-warm, #352b24); }
.hba-fnq .hb-q__preset[aria-pressed="true"] { color: var(--hb-white, #fff); }
.hba-fnq .hb-q__back { color: var(--hb-ink-warm, #352b24); }
.hba-fnq .hba-link { color: var(--hb-ink-warm, #352b24); }
.hba-fnq .hb-q__preset { font-weight: 600; }
.hba-fnq .hba-cf__go { position: static; background: none; box-shadow: none; padding: 0; }

/* 29/10/2026 (owner: "exactly the catering page's colours"): the quote page's own colours (polish-global.css, page-id-169)
   for the same parts here: the steps not yet reached in rose, picture cards and fields in cream, the summary in blush. */
.hb-fnw .hb-q__steps li:not(.is-current):not(.is-done) > .hb-q__dot,
.hba-fnq .hb-q__steps li:not(.is-current):not(.is-done) > .hb-q__dot { background: #e5cec7 !important; border-color: #e5cec7 !important; color: #352b24 !important; }
.hb-fnw .hb-evc__card, .hba-fnq .hb-evc__card { background: #f9f4f0 !important; }
.hb-fnw .hb-stepper input, .hba-fnq .hb-stepper input { background: #f9f4f0 !important; }
.hb-fnin.has-wizard .hb-quote__summary { background: #ecdfd9 !important; }
.hb-fnin.has-wizard .hb-quote__card { background: #fff !important; }
/* "לא בא לכם על תפריטים מוכנים…" in the sage of the "המשך" button (it read too light). */
.hb-fnin.has-wizard .hb-fnin__own { color: var(--q-sage, #657b63) !important; text-decoration-color: currentColor; font-weight: 600; }
/* Eliyahu 06/11/2026: a sentence and a real button instead of an underlined line. The filled "הצגת החבילות" stays the main action. */
.hb-fnin.has-wizard .hb-fnin__own { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(58, 46, 42, .12); text-align: start; text-decoration: none; }
.hb-fnin .hb-fnin__own-btn { flex: none; }
@media (max-width: 640px) { .hb-fnin.has-wizard .hb-fnin__own { flex-direction: column; align-items: stretch; gap: 12px; } }
.hb-fnin .hb-fnin__own p { margin: 0; font-size: 15px; line-height: 1.5; font-weight: 500; color: #3f3633; }
.hb-fnin .hb-fnin__own-btn { --hbm-fill: #657b63; display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 10px 26px; border-color: #657b63 !important; color: #4f634d !important; text-decoration: none; }
.hb-fnin .hb-fnin__own-btn:hover, .hb-fnin .hb-fnin__own-btn:focus-visible { color: #fff !important; }

/* Budget as on the catering page (owner 29/10/2026): one row of segments; on phones three to a row. */
.hb-fnw .hb-qseg, .hba-fnq .hb-qseg { grid-template-columns: repeat(var(--fnq-cols, 6), minmax(0, 1fr)) !important; }
@media (max-width: 1024px) { .hb-fnw .hb-qseg, .hba-fnq .hb-qseg { --fnq-cols: 3; } }
.hb-fnw .hb-qseg__v, .hba-fnq .hb-qseg__v { font-size: 14.5px; }
@media (max-width: 767px) { .hb-fnw .hb-qseg__v, .hba-fnq .hb-qseg__v { font-size: 13.5px; } .hb-fnw .hb-qseg__est, .hba-fnq .hb-qseg__est { font-size: 11.5px; } }

/* Eliyahu 03/11/2026: the quote page's first step is two big tiles, private or business. */
html body .hb-quote .hb-evc__grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
html body .hb-quote .hb-evc__grid--two .hb-evc__img { aspect-ratio: 4 / 3; }
html body .hb-quote .hb-evc__grid--two .hb-evc__name { font-size: 18px; font-weight: 700; }
@media (max-width: 599px) {
	html body .hb-quote .hb-evc__grid--two { gap: 10px; }
	html body .hb-quote .hb-evc__grid--two .hb-evc__img { aspect-ratio: 1 / 1; }
	html body .hb-quote .hb-evc__grid--two .hb-evc__name { font-size: 16.5px; }
}

/* Owner 03/11/2026 (390 screenshot): the scale now has seven tiers (150+). Six columns pushed "100–130" past the
   frame and left 150+ alone on a second row. Seven equal columns on wide screens; on phones two even rows of four,
   the last tier two cells wide, so every cell is a full 44px target and nothing crosses the border. */
.hb-quote .hb-q__guestbox .hb-q__presets:has(> .hb-q__preset:nth-child(7)) { grid-template-columns: repeat(7, minmax(0, 1fr)); max-width: 620px; }
@media (max-width: 640px) {
	.hb-quote .hb-q__guestbox .hb-q__presets { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
	.hb-quote .hb-q__guestbox .hb-q__presets:has(> .hb-q__preset:nth-child(7)) { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: none; }
	.hb-quote .hb-q__guestbox .hb-q__presets:has(> .hb-q__preset:nth-child(7)) > .hb-q__preset:last-child:nth-child(7) { grid-column: span 2; }
	.hb-quote .hb-q__guestbox .hb-q__preset { padding: 0 4px; font-size: 15px; }
}

/* 04/11/2026 (handoff #66): English step names are longer than the Hebrew ones; on phones they ran into each other ("When and how many" over "Budget").
   English only: names wrap to two short lines under their dot instead of one long line. */
@media (max-width: 600px) {
	body.hb-lang-en .hb-quote .hb-q__steps li .hb-q__dot-label { white-space: normal !important; max-width: 74px; text-align: center; font-size: 11.5px; line-height: 1.2; overflow-wrap: break-word; }
}