/**
 * Base — Starter: front-end base styles.
 *
 * theme.json owns the design system. Keep this file for rules theme.json
 * cannot express: accessibility affordances, focus states, motion preferences.
 * Reference theme.json tokens via CSS custom properties
 * (e.g. var(--wp--preset--color--primary)).
 */

/* Visible keyboard focus everywhere, using the theme's primary color. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary, #2563eb);
	outline-offset: 2px;
}

/* Screen-reader-only text, visible when focused (skip links, hidden headings). */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--wp--preset--color--base, #ffffff);
	clip: auto !important;
	clip-path: none;
	color: var(--wp--preset--color--contrast, #111111);
	display: block;
	font-size: 1rem;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* Smooth in-page jumps (disabled under reduced-motion below). */
html {
	scroll-behavior: smooth;
}

/* Give anchor targets breathing room when linked to — and clearance for a
   sticky header if a site adds one. Low specificity (:where) so it's easy to
   override or retune per project. */
:where([id]) {
	scroll-margin-top: var(--wp--preset--spacing--50, 1.5rem);
}

/* WordPress injects margin-block-start on #wp--skip-link--target via its flow
   layout blockGap rules; collapse it so full-bleed sections flush to the top. */
#wp--skip-link--target {
	margin-top: 0 !important;
}

.priorities-grid {
	.wp-block-group.is-style-card {
		padding: 2rem !important;
	}
}

@media (min-width: 768px) {
	.priorities-grid {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* WCAG 2.5.8 (target size, AA): core/social-links renders compact icon anchors
   (~16px) that fall below the 24px minimum. Pad the clickable anchor so the
   target is conformant at any icon size, wherever social links appear. */
.wp-block-social-links .wp-block-social-link-anchor {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	min-height: 24px;
}

/* Disclaimer in footer */
footer {
	.wp-block-site-title {
		text-transform: uppercase;
	}

	.disclaimer {
		padding: 1rem;
		line-height: 1.35;
		width: 100%;
		height: auto;
		max-width: 400px;
		color: var(--wp--preset--color--base);
		opacity: 0.75;

		a {
			color: var(--wp--preset--color--muted);
		}
	}

}

/* Respect reduced-motion preferences globally. */
@media (prefers-reduced-motion: reduce) {

	*,
	::before,
	::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* HOME */
.hero-text-col {
	padding-right: 4rem !important;
	
	p,
	h1 {
		text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.65);
	}
}

@media (max-width: 781px) {
	.hero-text-col {
		text-align: center;
		padding: 0 2rem !important;
	}
}

.learn-more-section {
	div.wp-block-group.is-style-card {
		padding: 3rem;
	}
}