/* ── The dark ground's orange glow (1 Oct meeting: site goes dark) ─────────────
   The page ground is flat Deep Grey, set by theme.json (styles.color.background →
   contrast). The one treatment on it is this radial glow, rising from the bottom
   of the page — it starts ABOVE the footer, which stays a solid band and simply
   paints over the glow's lowest reach (Todd's call on the footer colour is
   pending; nothing here touches it).

   Every dimension of the glow is a theme.json token under settings.custom.glow
   (color / width / height / x / y / stop), so Todd's tuning after the background
   conversation is a values change in theme.json, not a CSS edit. Height is in vh
   on purpose: a page-relative % would scale the glow with content length.

   On BODY, not <main>: templates close <main> above their lower bands (the
   product page does), and body is the one element that spans every page. A band
   or card painted in the editor sits on top and covers it, which is the point. */

body {
	background-image: radial-gradient(
		var(--wp--custom--glow--width) var(--wp--custom--glow--height)
			at var(--wp--custom--glow--x) var(--wp--custom--glow--y),
		var(--wp--custom--glow--color) 0%,
		transparent var(--wp--custom--glow--stop)
	);
	background-repeat: no-repeat;
}

/* ── Light-painted surfaces restore their ink ──────────────────────────────────
   The dark experiment's `.has-background` lesson, the other way up: the root text
   is light ink now, and it INHERITS into any band or card an editor painted with
   a light preset, where it vanishes (measured: the learning-article head band,
   grey-bright with a near-white H1). So the light surfaces set dark ink back as
   their inherited colour, and headings with it — the element default prints at
   0,1,0 (`:root :where(h1…)`), so the class+element here out-specifies it.
   An explicit editor colour still wins: the has-*-color utilities are printed
   with !important, and per-block styles print below these. */

:is(.has-base-background-color, .has-grey-bright-background-color, .has-grey-light-gradient-background) {
	color: var(--wp--preset--color--contrast);
}
:is(.has-base-background-color, .has-grey-bright-background-color, .has-grey-light-gradient-background) :is(h1, h2, h3, h4, h5, h6) {
	color: var(--wp--preset--color--contrast);
}

/* ── Header images melt into the ground (Wayne, 12 Oct) ─────────────────────────
   Every top-of-page image ends on the page colour, so no header photo shows a hard bottom
   edge. Covers are set up per page, and their own overlays disagree: some carry the page-blend
   gradient at 50% opacity (so it finishes at half strength), older ones end on #0a1921, a
   shade off the ground. Rather than chase each page's settings, the FIRST cover on a page —
   placed by a template or stored in the page — gets a fade layer of its own that always
   finishes on exactly the ground colour, whatever its overlay says. The plugin's own heroes
   (series / case-study cover, product photo hero) finish on the ground in blocks.css.
   The fade sits above the photo and the cover's overlay, below the cover's content. */
:is(main > .wp-block-cover:first-child, main > :first-child > .wp-block-cover:first-child)::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: min(45%, 360px);
	z-index: 1;
	background: linear-gradient(180deg, transparent 0%, var(--wp--preset--color--contrast) 100%);
	pointer-events: none;
}
:is(main > .wp-block-cover:first-child, main > :first-child > .wp-block-cover:first-child) > .wp-block-cover__inner-container {
	z-index: 2;
}