/* Lens §2 — Copy + ruled stats (dark). Figma node 2427:13677 in frame
 * 2427:13660, file SO8J0OKWo5wIM44YgqbgG0. No handoff document exists for this
 * page; the node is the sole authority.
 *
 * Base pattern: patterns/product-studio-why.php
 * Base styles:  assets/css/sections/product-studio-why.css
 * This pattern: patterns/lens-stats.php
 *
 * AN OVERRIDE FILE, NOT A SECOND COPY. patterns/lens-stats.php wraps in
 * .infinitus-section--product-studio-why and reuses that section's element
 * classes, so the geometry that both comps share — the 1240 measure cap, the
 * columns row, the 50px stat-to-stat rhythm, the 30px value-to-rule gap, the
 * 10px value-to-label gap, the 2px separator, the tablet split and the mobile
 * stack — is inherited. Only what node 2427:13677 measures differently is here.
 * product-studio-why.css is NOT edited: every selector below compounds
 * .infinitus-section--lens-stats with the base section class, so two classes
 * outweigh the base's one-class rules regardless of source order. That matters
 * concretely — infinitus_section_stylesheets() glob()s alphabetically, so this
 * file is enqueued BEFORE product-studio-why.css, and a single-class rule here
 * would lose.
 *
 * WHAT CHANGES, AND WHY. The base pairs a 499px illustration with a 604px stat
 * column across a 137px gutter, under a full-width headline. This comp has no
 * illustration: the left column carries the headline and the body copy at
 * 605px, the stats sit at 535px, and the gutter is 100px (605 + 100 + 535 =
 * 1240, the same content width). Three of the base's four measures are custom
 * properties the base rules already read, so redefining them on the section is
 * the whole override — no geometry is restated.
 *
 * Type comes from the theme's own --fs-* / --lh-* ladder, never from the
 * theme.json font-size presets (those are 100vw step expressions that drift
 * below the 768 / 1025 breakpoints).
 *
 * Colours are palette presets on the blocks and are deliberately absent here so
 * they stay editable — the ground, the white headline and body, the Neutral 300
 * stat labels and the Neutral 600 rules are all block attributes.
 *
 * ⚑ DESIGN QA — statistics 1 and 3 are plain paragraphs, not counters. See the
 * flag in patterns/lens-stats.php: there is no integer for the counting block
 * to ramp. They are set to the same 56px Light rung as the counter so the three
 * read as one row of statistics.
 */

.infinitus-section--lens-stats.infinitus-section--product-studio-why {
	/* Node 2427:13678 (copy) and 2427:13685 (stats), gutter from the section's
	   own 100px flex gap. The base rules read all three as custom properties,
	   so this block is the entire desktop override. */
	--product-studio-why-image-measure: 605px;
	--product-studio-why-stats-measure: 535px;
	--product-studio-why-lower-gap: 100px;

	/* The headline lives INSIDE the copy column here rather than spanning the
	   section, so its own measure is the column's. Restated rather than left
	   at the base's 711px: an override file that spells out its own geometry
	   cannot be broken from a distance. */
	--product-studio-why-heading-measure: 605px;

	/* Copy-column flow rhythm. Node 2427:13678 sets a 30px gap between the
	   headline and the body, and the blank line inside text node 2427:13683 is
	   one 20/30 line box — the same 30px — so both gaps are one value. Not the
	   column's blockGap: the column carries no `layout` attribute, so core
	   never emits is-layout-flow and a blockGap there would collapse to zero
	   silently. */
	--lens-stats-copy-rhythm: 30px;
}

/* Tops aligned, not centred. The base centres its stat column against a
   fixed-height illustration; node 2427:13677 is items-start and the two
   columns are drawn the same height, so centring here would only move one of
   them when the copy rewraps. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .product-studio-why__stats {
	align-self: flex-start;
}

/* Owl rhythm, END margins only: a blanket `margin: 0` on a child cancels the
   top margin this rule is trying to give it. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__copy > * {
	margin-block-end: 0;
}

.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__copy > *:first-child {
	margin-block-start: 0;
}

.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__copy > * + * {
	margin-block-start: var(--lens-stats-copy-rhythm);
}

/* Desktop/Body Default — the DS's 20px rung, which the theme publishes as
   --fs-body-xl and steps to 18px below 1025 where the DS has no mobile body
   ladder. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__intro {
	font-size: var(--fs-body-xl);
	line-height: var(--lh-body-xl);
}

/* The non-counting statistics. infinitus/stat-counter renders its own
   value-over-label flex column with the same 10px gap; this is that shape for
   the two statistics that have no integer to count, built from core blocks so
   every string stays an editor field. The gap reads the base's own property so
   the three statistics cannot drift apart. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__figure {
	display: flex;
	flex-direction: column;
	gap: var(--product-studio-why-value-label-gap);
}

/* Desktop/H2 56 Light — the same rung the stat-counter block sets on its own
   value, read from the theme ladder rather than duplicated as a number. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__value {
	font-size: var(--fs-h2);
	font-weight: 300;
	letter-spacing: 0;
	line-height: var(--lh-h2);
	margin: 0;
}

/* Desktop/Body Large 24/36, matching the rung product-studio-why.css already
   sets on the counter's own label. */
.infinitus-section--lens-stats.infinitus-section--product-studio-why .lens-stats__label {
	font-size: var(--fs-body-2xl);
	line-height: var(--lh-body-2xl);
	margin: 0;
}

/* Tablet. The base splits 40.24 / 48.71 off its own 499 / 604 columns; these
 * are 605 / 535 of the same 1240, and the leftover is the row's sp-8 gutter.
 * The .wp-block-column hop and the !important are the base's, kept so this
 * rule lands at the same cascade level rather than needing a heavier one. This
 * band was never mocked; the proportions are the desktop ratio held. */
@media (min-width: 768px) and (max-width: 1024.98px) {
	.infinitus-section--lens-stats.infinitus-section--product-studio-why
		.product-studio-why__lower
		> .wp-block-column.product-studio-why__visual {
		flex: 1 1 48.79% !important;
	}

	.infinitus-section--lens-stats.infinitus-section--product-studio-why
		.product-studio-why__lower
		> .wp-block-column.product-studio-why__stats {
		flex: 1 1 43.15% !important;
	}
}