/**
 * base.css
 * ---------------------------------------------------------------------------
 * Element-level defaults, accessibility helpers and typographic rhythm.
 * No component styling here — keep this about raw HTML elements.
 */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
	color: var(--bb-text);
	background: var(--bb-surface);
	font-family: var(--wp--preset--font-family--figtree);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden; /* guard against unintended horizontal scroll */
}

/* Prevent any single element from forcing horizontal overflow */
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
svg { height: auto; }

:where(h1, h2, h3, h4, h5, h6) { text-wrap: balance; }
:where(p, li) { text-wrap: pretty; }

a { color: var(--bb-stage-collect); text-underline-offset: 0.15em; }

/* Visible, consistent focus for keyboard users only */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: none;
	box-shadow: var(--bb-focus);
	border-radius: var(--bb-radius-sm);
}
.bb-on-dark :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	box-shadow: var(--bb-focus-on-dark);
}

/* Skip link */
.bb-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 1000;
	padding: 0.75rem 1.25rem;
	background: var(--bb-ink);
	color: var(--bb-text-inverse);
	border-radius: 0 0 var(--bb-radius-md) 0;
	font-weight: 600;
}
.bb-skip-link:focus {
	left: 0;
	box-shadow: var(--bb-focus-on-dark);
}

/* Screen-reader-only utility */
.screen-reader-text,
.bb-visually-hidden {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	width: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	word-wrap: normal !important;
}
.bb-visually-hidden:focus {
	clip: auto;
	clip-path: none;
	height: auto;
	width: auto;
	position: static !important;
}

/* Selection */
::selection { background: var(--bb-accent); color: var(--bb-ink); }

/* Reduced motion: neutralize transitions/animations globally */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* Sensible default measure for long-form text inside content width */
.bb-prose > * { max-width: 68ch; }
.bb-prose > *:where(.alignwide, .alignfull, figure, .wp-block-image) { max-width: none; }