/**
 * VU Theme Base
 *
 * Reset and element-level defaults for the VU visual system, scoped
 * under a reusable `.vu-site` root (derived from a-2's base rules:
 * universal box-sizing reset, body base styles, link reset). Scoping to
 * `.vu-site` keeps these rules from altering Kadence or future plugin
 * markup outside the VU component system. `.vu-site` is not applied to
 * any WordPress/body markup in this task — WEB-04/WEB-05 will decide
 * where that root is consumed.
 *
 * Two accessibility rules not present in a-2 are added and marked below.
 */

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

.vu-site {
	background: var(--vu-color-bg);
	color: var(--vu-color-white);
	font-family: var(--vu-font-body);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

.vu-site a {
	text-decoration: none;
	color: inherit;
}

/*
 * Accessibility addition (not present in a-2): the mockup defines no
 * focus styling at all. Visible keyboard-focus indicator on interactive
 * elements, using the brand red.
 */
.vu-site a:focus-visible,
.vu-site button:focus-visible,
.vu-site .vu-btn:focus-visible {
	outline: 2px solid var(--vu-color-red);
	outline-offset: 2px;
}

/*
 * Accessibility addition (not present in a-2): the mockup's hero badge
 * uses an infinite blink animation with no reduced-motion consideration.
 * This disables looping/animated motion for users who request it.
 */
@media (prefers-reduced-motion: reduce) {
	.vu-site *,
	.vu-site *::before,
	.vu-site *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}