/*!
 * «لأصحاب المطاعم» band (bfw_home_partner(), site/includes/shortcode-food.php):
 * blue panel + two plates + the order-ticket drawing. Used on the food home and
 * the About page. Handle: bsy-food-band (depends on bch-ui). Tokens: --bsy-*.
 */
.bfh-band { display: grid; gap: var(--bsy-space-4); padding-block-end: 0; overflow: hidden; }
.bfh-band__copy { display: flex; flex-direction: column; align-items: flex-start; gap: var(--bsy-space-3); min-width: 0; }
.bfh-band__label { margin: 0; font-size: var(--bsy-text-sm); font-weight: var(--bsy-fw-medium); color: var(--bsy-white); }
.bfh-band__t { margin: 0; font-size: var(--bsy-text-lg); font-weight: var(--bsy-fw-bold); line-height: 1.45; color: var(--bsy-white); }
.bfh-band__p { margin: 0; font-size: var(--bsy-text-base); line-height: 1.7; color: var(--bsy-white); }
.bfh-band__acts { display: flex; flex-direction: column; align-items: stretch; gap: var(--bsy-space-1); width: 100%; margin-block-start: var(--bsy-space-1); }
.bfh-band__how { justify-content: center; min-height: 44px; }
.bfh-band__art { position: relative; height: 236px; }
.bfh-band__plt {
	position: absolute;
	inset-block-start: var(--bsy-space-4);
	width: 96px; height: 96px;
	padding: 6px; box-sizing: border-box;
	border-radius: var(--bsy-radius-pill);
	background: var(--bsy-white);
}
.bfh-band__plt:first-child { inset-inline-start: 0; }
.bfh-band__plt + .bfh-band__plt { display: none; } /* phones + tablets: one plate beside the ticket */
.bfh-band__plt img { width: 100%; height: 100%; border-radius: var(--bsy-radius-pill); object-fit: cover; }
.bfh-band__art > .bfh-band__tk { position: absolute; inset-block-start: -8px; inset-inline-end: -20px; width: 270px; height: auto; max-width: none; }

@media (min-width: 641px) {
	.bfh-band__t { font-size: var(--bsy-text-2xl); max-width: 560px; }
	.bfh-band__p { font-size: var(--bsy-text-md); max-width: 520px; }
	.bfh-band__acts { flex-direction: row; align-items: center; gap: 28px; width: auto; }
	/* Tablet: keep the plate and the ticket together, centred. */
	.bfh-band__art { width: 100%; max-width: 420px; margin-inline: auto; }
}

@media (min-width: 961px) {
	.bfh-band { grid-template-columns: minmax(0, 1fr) 420px; min-height: 380px; padding-block-end: 56px; align-items: center; }
	.bfh-band__art { height: 100%; min-height: 268px; max-width: none; margin-inline: 0; }
	.bfh-band__plt { width: 132px; height: 132px; inset-block-start: var(--bsy-space-10); inset-inline-start: var(--bsy-space-10); }
	.bfh-band__plt + .bfh-band__plt { display: block; width: 116px; height: 116px; inset-block-start: 190px; inset-inline-start: 0; }
	.bfh-band__art > .bfh-band__tk { inset-block-start: 36px; inset-inline-end: -24px; width: 330px; }
}