/* =============================================================================
   Sustainable Ply — Typography
   Source: 02-UI-SPEC.md §Typography (lines 63-75), §Animated Link Underline (lines 545-560)
   Inter type scale at 1.25 ratio; body 18px / 1.6; H1 56px / 600 / 1.1.
   All sizes/weights are duplicated from theme.json — theme.json drives Site Editor
   defaults; this file enforces the same scale on hand-written class hooks.
   ============================================================================= */

/* --------------------------------------------------------------------------- */
/* Body baseline                                                                */
/* --------------------------------------------------------------------------- */

body {
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--base);
	line-height: 1.6;
	color: var(--color-text);
}

/* --------------------------------------------------------------------------- */
/* Heading scale — class-based hooks for use outside Site Editor contexts       */
/* (Site-Editor-rendered headings already pick up theme.json styles.elements.h*)*/
/* --------------------------------------------------------------------------- */

.has-display-font-size {
	font-size: var(--wp--preset--font-size--display);
	font-weight: 600;
	line-height: 1.1;
}

.has-xl-font-size {
	font-size: var(--wp--preset--font-size--xl);
	font-weight: 600;
	line-height: 1.2;
}

.has-lg-font-size {
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 500;
	line-height: 1.25;
}

.has-md-font-size {
	font-size: var(--wp--preset--font-size--md);
	font-weight: 500;
	line-height: 1.3;
}

.has-base-font-size {
	font-size: var(--wp--preset--font-size--base);
	line-height: 1.6;
}

.has-sm-font-size {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	line-height: 1.4;
}

.has-xs-font-size {
	font-size: var(--wp--preset--font-size--xs);
	line-height: 1.5;
}

/* --------------------------------------------------------------------------- */
/* Content link underline animation                                             */
/* Per UI-SPEC lines 548-560 — animated text-decoration-color on hover.         */
/* D2-15: every transition wrapped in prefers-reduced-motion: no-preference.    */
/* --------------------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
	.wp-block-post-content a:not(.wp-block-button__link) {
		text-decoration: underline;
		text-decoration-color: transparent;
		text-underline-offset: 3px;
		transition: text-decoration-color 150ms ease-out;
	}

	.wp-block-post-content a:not(.wp-block-button__link):hover,
	.wp-block-post-content a:not(.wp-block-button__link):focus-visible {
		text-decoration-color: var(--color-accent);
	}
}

/* Reduced motion: show underline statically on hover/focus — no transition.    */
@media (prefers-reduced-motion: reduce) {
	.wp-block-post-content a:not(.wp-block-button__link) {
		text-decoration: underline;
		text-decoration-color: transparent;
		text-underline-offset: 3px;
	}

	.wp-block-post-content a:not(.wp-block-button__link):hover,
	.wp-block-post-content a:not(.wp-block-button__link):focus-visible {
		text-decoration-color: var(--color-accent);
	}
}