/**
 * Theme-wide typography — heading/paragraph sizing, spacing, and the
 * fuse-accordion content styling that goes with it.
 *
 * Lives in @layer fuse-theme (see docs/adr/0002's layer order) since this is
 * hand-authored theme styling, not a Fuse token or component default.
 * Ported from business-frontend-astro's src/styles/theme-typography.css (see
 * that file's comment) — WP-enqueued plugin CSS never reaches that headless
 * app, so keep the two in sync by hand.
 *
 * .accordion-carousel-stat deliberately excluded: it's a business-site-only
 * content class, not generic Fuse theme typography, so it lives in the
 * carsbusiness theme (scss/_content.scss) instead of this shared plugin,
 * which also serves explore/trainingcc.
 */
@layer fuse-theme {
	.ep-theme-fuse {
		--fuse-font-size-heading-1-lg: clamp(2.5rem, -1.9677rem + 12.9032vw, 4rem);
		--fuse-font-size-heading-2-md: clamp(
			1.625rem,
			-0.2366rem + 5.3763vw,
			2.25rem
		);
		--fuse-font-size-heading-3-md: clamp(
			1.125rem,
			0.3804rem + 2.1505vw,
			1.375rem
		);
		--ep-accordion-headline-font-size: clamp(
			1.125rem,
			0.3804rem + 2.1505vw,
			1.375rem
		);
		h1 {
			font-size: var(
				--theme-heading-1-font-size,
				clamp(2.5rem, -1.9677rem + 12.9032vw, 4rem)
			);
			margin-top: var(--theme-heading-1-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-1-margin-bottom,
				var(--fuse-spacing-1-5)
			);
			letter-spacing: var(--theme-heading-1-letter-spacing, -0.03em);
		}
		h2 {
			font-size: var(
				--theme-heading-2-font-size,
				clamp(1.625rem, -0.2366rem + 5.3763vw, 2.25rem)
			);
			margin-top: var(--theme-heading-2-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-2-margin-bottom,
				var(--fuse-spacing-1-5)
			);
			letter-spacing: var(--theme-heading-2-letter-spacing, -0.03em);
		}
		h3 {
			font-size: var(
				--theme-heading-3-font-size,
				clamp(1.125rem, 0.3804rem + 2.1505vw, 1.375rem)
			);
			margin-top: var(--theme-heading-3-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-3-margin-bottom,
				var(--fuse-spacing-1-5)
			);
			letter-spacing: var(--theme-heading-2-letter-spacing, -0.03em);
		}
		h4 {
			margin-top: var(--theme-heading-4-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-4-margin-bottom,
				var(--fuse-spacing-1-5)
			);
		}
		h5 {
			margin-top: var(--theme-heading-5-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-5-margin-bottom,
				var(--fuse-spacing-1-5)
			);
		}
		h6 {
			margin-top: var(--theme-heading-6-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-heading-6-margin-bottom,
				var(--fuse-spacing-1-5)
			);
		}
		h1,
		h2,
		h3,
		h4,
		h5,
		h6 {
			font-family: var(
				--theme-heading-font-family,
				var(--fuse-_font-family-dm-sans)
			);
			font-weight: var(--theme-heading-font-weight, 700);
			line-height: var(--theme-heading-line-height, 1.2);
		}
		p {
			margin-top: var(--theme-paragraph-margin-top, var(--fuse-spacing-1-5));
			margin-bottom: var(
				--theme-paragraph-margin-bottom,
				var(--fuse-spacing-1-5)
			);
			font-family: var(
				--theme-paragraph-font-family,
				var(--fuse-_font-family-apercu-pro)
			);
			font-weight: var(--theme-paragraph-font-weight, 400);
			line-height: var(--theme-paragraph-line-height, 1.33);
		}
		blockquote {
			padding-left: var(--theme-blockquote-padding-left, 0);
			padding-right: var(--theme-blockquote-padding-right, 0);
			max-width: var(--theme-blockquote-max-width, 90%);
			margin-inline-start: var(--theme-blockquote-margin-left, auto);
			margin-inline-end: var(--theme-blockquote-margin-right, auto);
			h2 {
				max-width: min(100%, 75ch);
				margin-left: var(--theme-blockquote-h2-margin-left, auto);
				margin-right: var(--theme-blockquote-h2-margin-right, auto);
				line-height: var(--theme-blockquote-h2-line-height, 1.25);
				letter-spacing: var(--theme-blockquote-h2-letter-spacing, 0);
				margin-bottom: var(--theme-blockquote-h2-margin-bottom, 1.75rem);
			}
		}

		fuse-accordion::part(base) {
			--ep-accordion-padding: 1rem 1rem 0.5rem 1rem;
			margin-bottom: var(--theme-accordion-margin-bottom, 0.5rem);
		}
		fuse-accordion h3 {
			margin-top: 0;
			margin-bottom: 0;
		}
	}
}