/**
 * Site-wide corrections that sit on top of Kadence.
 *
 * Marker.io IP-121 — page titles break mid-word as the window narrows
 * ("Experien / ce", "Differenc / e").
 *
 * Measured on /about/ at a 1100px viewport: the h1 computed to 85.5px while its
 * column was only 367px wide, so the single word "Experience" needed 411px and
 * Kadence's overflow-wrap:break-word chopped it.
 *
 * The sizes were already fluid, so adding breakpoints would not have helped.
 * The actual fault is the growth rate of Kadence's xxxl token — 7.065vw — which
 * is tuned for full-width text but is applied to hero titles sitting in a
 * half-width column. Retuning the token fixes every page at once (what the
 * ticket asked for) and avoids fighting the per-block CSS on specificity, since
 * that CSS already reads these variables.
 *
 * Bounds are unchanged at the extremes: the large-screen cap stays 6rem and the
 * small-screen floor stays 2.75rem; only the middle of the curve is gentler.
 *
 * html:root rather than :root so this wins regardless of whether Kadence's
 * global variables are printed before or after this stylesheet.
 */

html:root {
	/* was: clamp(2.75rem, 0.489rem + 7.065vw, 6rem) */
	--global-kb-font-size-xxxl: clamp(2.75rem, 0.489rem + 5.4vw, 6rem);
	/* was: clamp(2.5rem, 1.456rem + 3.26vw, 4rem) */
	--global-kb-font-size-xxl: clamp(2.25rem, 1.456rem + 2.6vw, 4rem);
}

/*
 * Never hyphenate or split inside a word. overflow-wrap:break-word is kept as a
 * last-resort guard so a pathological unbroken string cannot overflow the
 * viewport, but with the retuned sizes above it should not trigger for titles.
 */
h1.wp-block-kadence-advancedheading,
h2.wp-block-kadence-advancedheading {
	word-break: normal;
	hyphens: none;
}

/**
 * Marker.io IP-174 — bios inside Kadence modals rendered white-on-white.
 *
 * A modal lives in the DOM inside the column that holds the team cards. That
 * section sets white text, and the colour inherits straight through the overlay
 * into .kt-modal-content — but the modal panel itself is white. Nobody noticed
 * while the modals were empty; the moment real content went in it was invisible.
 * The close button inherits the same colour, so it was invisible too.
 *
 * Modal panels are light, so state the text colour rather than inherit it.
 */
.kt-modal-container {
	color: var(--global-palette4, #2d3748);
}

.kt-modal-container .kt-modal-content :is(h1, h2, h3, h4, h5, h6) {
	color: var(--global-palette3, #1a202c);
}

/* Give the migrated bios some breathing room inside the panel. */
.kt-modal-container .kt-modal-content :is(h3, h4) {
	margin-top: 1.25em;
	margin-bottom: 0.35em;
}
