/* ============================================================================
 * Briefly — balanced grids. v2.12.29.
 *
 * The Hub's own classic themes never load the Premium
 * Suite's render-guards.css, so the identical rules live here too. That is a
 * duplicated STYLESHEET, not a duplicated RULE: both files are generated from
 * the same table, and a free-tier site would otherwise keep the three-across-
 * and-one-below layout this release exists to remove.
 * ========================================================================== */

/* ── 5. BALANCED GRIDS — never three across and one below ────────────────────
 *
 * v1.25.17. THE DEFECT, in the owner's words: "when pages produce anything in
 * groups such as how it works they are in a 4 pack yet the page is split in 3
 * and 1 below. this looks like a poor designer job."
 *
 * He is right and it is systemic. All 236 grids in the library were written as
 *
 *     grid-template-columns: repeat(auto-fit, minmax(NNNpx, 1fr))
 *
 * which means the column count is whatever happens to fit the container. Nobody
 * ever chose it, and nothing ever consulted the number of items. Meanwhile the
 * generator's own JSON skeleton asks for exactly FOUR of nearly everything —
 * four features, four services, four stats, four FAQs — and four is the worst
 * number in that system:
 *
 *     46 grids with a >=280px floor  ->  4 items render 3 + 1 ON DESKTOP
 *    131 grids at 220-260px          ->  4 items render 3 + 1 at tablet width
 *     55 grids at <=200px            ->  4 items render 3 + 1 on a small tablet
 *
 * So at some viewport width, essentially every group in every theme orphans an
 * item. It reads as carelessness because it IS carelessness — just nobody's in
 * particular.
 *
 * THE FIX IS THE ITEM COUNT, WHICH CSS CAN NOW SEE. :has() lets the container
 * respond to how many children it has, so the column count is chosen per group
 * rather than per container width. The rule is simply: NEVER LEAVE EXACTLY ONE
 * ITEM ALONE ON THE LAST ROW. Four goes 4-across or 2x2, never 3+1. Five goes
 * 3+2. Six goes 3+3. Seven goes 4+3.
 *
 * Where a count makes an orphan unavoidable at a given width (seven items in
 * three columns), THE LAST ITEM SPANS THE FULL ROW instead. A full-width final
 * card reads as a deliberate finish; a lonely third-width card reads as a bug.
 *
 * WHY THIS IS CSS AND NOT PHP: the alternative was passing an item count out of
 * 236 call sites in 35 themes, which is 236 chances to miss one and a permanent
 * obligation on every future section. The container already knows how many
 * children it has. Let it.
 *
 * The whole block is inside @supports, so a browser without :has() gets exactly
 * today's behaviour rather than a broken one.
 * -------------------------------------------------------------------------- */

.ewpk-g {
	display: grid;
	/* The pre-:has() fallback IS today's behaviour, with each grid's own
	   density floor carried across as a custom property — so a browser
	   without :has() renders exactly what it renders now, never worse. */
	grid-template-columns: repeat( auto-fit, minmax( var( --ewpk-min, 240px ), 1fr ) );
}

@supports selector(:has(*)) {

	/* Phone: one column, always. Two columns of anything meaningful below
	   640px produces a card too narrow to read, and the orphan question does
	   not arise in a single column. */
	.ewpk-g, [class*="briefly-"] [class*="-grid-2"], [class*="briefly-"] [class*="-grid-3"], [class*="briefly-"] [class*="-grid-4"], [class*="briefly-"] [class*="-grid-5"] {
		grid-template-columns: minmax(0, 1fr);
	}

	@media (min-width: 640px) {
		/* Tablet */
		.ewpk-g:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(1):last-child) {
			grid-template-columns: repeat(1, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(2):last-child) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(3):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(4):last-child) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(5):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(6):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(7):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(7):last-child) > :last-child,
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(7):last-child) > :last-child,
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(7):last-child) > :last-child,
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(7):last-child) > :last-child,
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(7):last-child) > :last-child {
			grid-column: 1 / -1;
		}
		.ewpk-g:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(8):last-child) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(9):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(10):last-child) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(11):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(12):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
	}

	@media (min-width: 1024px) {
		/* Desktop */
		.ewpk-g:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(1):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(1):last-child) {
			grid-template-columns: repeat(1, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(2):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(2):last-child) {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(3):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(3):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(4):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(4):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(5):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(5):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(6):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(6):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(7):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(7):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(8):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(8):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(9):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(9):last-child) {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(10):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(10):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(11):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(11):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
		.ewpk-g:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-2"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-3"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-4"]:has(> :nth-child(12):last-child),
		[class*="briefly-"] [class*="-grid-5"]:has(> :nth-child(12):last-child) {
			grid-template-columns: repeat(4, minmax(0, 1fr));
		}
	}
}

/* ── 6. INLINE FIXED COLUMNS — the layouts §5 could never reach ──────────────
 *
 * v3.8.17. Reported as "text in image misalignment".
 *
 * Section §5 above governs .ewpk-g and the -grid-N classes, which is 236 of
 * the library's grids. It reaches none of the remaining 14, because those
 * write their track list as an INLINE STYLE:
 *
 *     <div style="display:grid;grid-template-columns:1fr 1fr;gap:3rem">
 *
 * An inline declaration beats every stylesheet rule that is not !important,
 * so these fourteen are the only layouts in the suite immune to all of the
 * responsive work — pr_hero_split, pr_product_detail, pr_private_enquiry,
 * pr_footer_full, cl_hero_clinical, cl_booking_location, cl_footer,
 * dr_chef_profile, dr_location, dr_footer, me_about_heritage (x2), me_footer.
 * They are the classic themes, and almost all of them are an IMAGE in one
 * track and TEXT in the other. At 1fr 1fr a phone gives each half the
 * viewport, so the copy sets in a ~180px column beside a photo and reads as
 * broken alignment. The footers are worse: 2fr 1fr 1fr never stops being
 * three columns.
 *
 * The tell that this was already known and half-fixed: pr_footer_full carries
 * its own inline <style> block with exactly this rule and an !important, for
 * that one section. The rule below covers every other section.
 *
 * WHY THIS IS CSS AND NOT FOURTEEN EDITS: the track lists are frozen into
 * post_content on every page already built. Editing the renderers fixes pages
 * built afterwards and nothing that is live today — the same reason the
 * anchor resolver runs at render time. The renderers are worth fixing too,
 * but second, and this is the half that reaches your site tonight.
 *
 * THE SELECTOR IS EXACT, NOT A GUESS. It requires all three of: a Briefly
 * theme wrapper, an inline `display:grid`, and a track list containing "fr "
 * — a space after a track unit, which a fixed list always has ("1fr 1fr")
 * and a responsive one never does ("minmax(240px,1fr))" ends the unit on a
 * bracket). So auto-fit grids are untouched and keep §5's behaviour.
 *
 * 760px to match .ewpk-grid, so a page never reflows at two
 * different widths.
 * -------------------------------------------------------------------------- */

@media (max-width: 760px) {
	[class*="briefly-"][style*="display:grid"][style*="fr "],
	[class*="briefly-"] [style*="display:grid"][style*="fr "] {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Tablet: a four-track footer is still four tracks at 900px. Two is the most
   a footer column list can carry legibly before the desktop layout applies. */
@media (min-width: 761px) and (max-width: 900px) {
	[class*="briefly-"][style*="display:grid"][style*="fr 1fr 1fr"],
	[class*="briefly-"] [style*="display:grid"][style*="fr 1fr 1fr"] {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

/* v3.41.2 — the figures band's dividers and side padding are drawn for four
   across. Below 1024px the grid is two-by-two or one column, and the same
   padding stepped each figure further in than the last ("staircase" on a
   phone). Below that width the figures sit flush, with space between rows. */
@media (max-width: 1023px) {
	.ewpk-statband { row-gap: 2rem !important; column-gap: 2rem !important; }
	.ewpk-statband > div { padding-left: 0 !important; padding-right: 0 !important; border-right: 0 !important; }
}

/* v3.46.1 — AN EMPTY PHOTO CARD NEVER SHOWS AS A BLANK BOX, IN ANY DESIGN.
   Visitors see an unfilled photo space as .bfy-img-empty (owners, logged in,
   still see the "add a photo" prompt). Lumen's hero already hid its empty
   media column (hero-shapes.css); other designs wrap the space in their own
   card — Keystone's hero card, a Terrace bento tile — which showed as a white
   box beside the headline. A wrapper whose only content is the empty space
   is hidden, and a grid that loses its photo column gives the text the row. */
[data-briefly-section] :is(div, figure, a, li)[class]:has(> .bfy-img-empty:only-child):not(.bfy-hero__media) {
	display: none !important;
}
[data-briefly-section] :is(div, section)[class]:has(> :is(div, figure)[class] > .bfy-img-empty:only-child) {
	grid-template-columns: minmax(0, 1fr) !important;
}