/** Fluid typography primitives. */

:where(h1, h2, h3, h4, .oz-display, .oz-h1, .oz-h2, .oz-h3, .oz-h4) {
	color: var(--oz-color-heading);
	font-family: var(--oz-font-family-heading);
	font-weight: var(--oz-font-weight-bold);
	letter-spacing: -0.025em;
	line-height: var(--oz-line-height-heading);
}

:where(h1) { font-size: var(--oz-font-size-h1); }
:where(h2) { font-size: var(--oz-font-size-h2); }
:where(h3) { font-size: var(--oz-font-size-h3); }
:where(h4) { font-size: var(--oz-font-size-h4); }

/* Role classes intentionally override the native heading level when combined. */
.oz-display,
body[class*="elementor-kit-"] .oz-display { font-size: var(--oz-font-size-display); font-weight: var(--oz-font-weight-black); }
.oz-h1,
body[class*="elementor-kit-"] .oz-h1 { font-size: var(--oz-font-size-h1); }
.oz-h2,
body[class*="elementor-kit-"] .oz-h2 { font-size: var(--oz-font-size-h2); }
.oz-h3,
body[class*="elementor-kit-"] .oz-h3 { font-size: var(--oz-font-size-h3); }
.oz-h4,
body[class*="elementor-kit-"] .oz-h4 { font-size: var(--oz-font-size-h4); }

:where(p, li, dd) { line-height: var(--oz-line-height-body); }

.oz-lead { font-size: var(--oz-font-size-lead); line-height: 1.5; }
.oz-small { font-size: var(--oz-font-size-small); }

.oz-eyebrow {
	color: var(--oz-color-primary);
	font-size: var(--oz-font-size-eyebrow);
	font-weight: var(--oz-font-weight-bold);
	letter-spacing: 0.12em;
	line-height: 1.35;
	text-transform: uppercase;
}