/* ==========================================================================
   AAS Group - shared "eyebrow badge" (small sub-heading label above every
   section heading, e.g. "WHY CHOOSE US", "HOW WE WORK"). Defined once
   here, loaded on every page, so it looks identical across ALL AAS
   widgets instead of relying on each widget's own CSS to repeat it
   (some didn't set the font/size at all, so it fell back to the
   browser default look).
   ========================================================================== */

.aas-badge {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
}
.aas-badge-dash {
	display: inline-block;
	width: 30px;
	height: 3px;
	background: var(--e-global-color-accent, #FE212A);
	flex-shrink: 0;
}
.aas-badge-text {
	font-family: var(--e-global-typography-primary-font-family, "Space Grotesk", sans-serif);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--e-global-color-primary, #0D0D0D);
}

/* ==========================================================================
   AAS Group - letter-by-letter scroll reveal for section headings.
   Every element with the "aas-heading" class (used by ALL AAS custom
   widgets) is split into individual character spans by aas-scroll-
   reveal.js (GSAP + ScrollTrigger) and animated in with a stagger the
   first time it scrolls into view.
   ========================================================================== */

/* Each word is one atomic inline-block unit, so the browser can only
   break a line between words, never in the middle of one - the letters
   inside still animate independently via GSAP. */
.aas-heading .aas-word {
	display: inline-block;
}
.aas-heading .aas-char {
	display: inline-block;
	will-change: transform, opacity;
}

/* Respect users who've asked the OS for reduced motion: skip the split/
   animation entirely (handled in JS) and just show the text normally. */
@media (prefers-reduced-motion: reduce) {
	.aas-heading .aas-char {
		opacity: 1 !important;
		transform: none !important;
	}
}
