/**
 * Classiera design tokens.
 *
 * These are the exact values from the source page's `:root` block, re-exposed as
 * custom properties. Elementor's global colours (see
 * inc/class-classiera-demo-elementor.php) hold the same values so that colours
 * remain editable from the UI; these variables exist for the few decorative
 * rules in landing.css that Elementor cannot express.
 *
 * The original stylesheet contained a typo (`--prmiary`) and declared
 * `--success-bg-faded` twice. Both are corrected here; the second declaration
 * (#F5FFFF) was the one that actually applied, so it is the one kept.
 */

:root {
	/* Brand */
	--cle-primary: #766df4;
	--cle-primary-hover: #5549f1;
	--cle-primary-badge: #ccc9f8;
	--cle-primary-faded: #edebff;

	--cle-danger: #f74f78;
	--cle-danger-badge: #fcd5de;
	--cle-danger-faded: #fdf2f5;

	--cle-success: #15c694;
	--cle-success-badge: #d8fff4;
	--cle-success-faded: #f5ffff;
	--cle-success-blob: #eafff9;

	--cle-warning: #f5b65a;
	--cle-warning-faded: #fff7eb;

	--cle-elementor-bg: #93063c;
	--cle-bluish-gray: #f5f7f9;
	--cle-footer-bottom: #323347;

	/* Neutrals */
	--cle-text: #444444;
	--cle-text-strong: #222222;
	--cle-muted: #6c757d;
	--cle-hairline: #e0e0e0;

	/* Type */
	--cle-font-heading: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--cle-font-body: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

	/* Elevation */
	--cle-shadow-card: 0 6px 16px 0 rgba(0, 0, 0, 0.1);

	/* Chrome offsets used by the sticky nav and scroll tools. */
	--cle-header-height: 76px;
}

/**
 * Optional accessible palette — commented out by default.
 *
 * The values above reproduce the Classiera brand exactly. A WCAG 2.1 AA audit
 * of the landing page found the pairs below fall short. None of them are
 * regressions introduced by this conversion; they exist in the source design.
 *
 *   pair                                   ratio   AA normal   AA large
 *   ---------------------------------------------------------------------
 *   white on --cle-success                  2.20      fail        fail
 *   white on --cle-warning                  1.79      fail        fail
 *   --cle-warning text on white             1.79      fail        fail
 *   --cle-primary on --cle-primary-badge    2.52      fail        fail
 *   --cle-danger on --cle-danger-badge      2.48      fail        fail
 *   --cle-success on --cle-success-badge    2.05      fail        fail
 *   white on --cle-danger                   3.31      fail        pass
 *   white on --cle-primary                  3.99      fail        pass
 *   --cle-muted on --cle-bluish-gray        4.37      fail        pass
 *
 * "AA large" applies at 24px, or 18.7px when bold — most headings and buttons
 * on this page qualify, which is why the last three are usable as-is.
 *
 * To adopt the accessible values, uncomment the block below. It only changes
 * the tokens used *behind white text* and the chip text colours, so section
 * backgrounds and illustrations keep the original brand feel. Elementor's
 * global colours in Site Settings are the other half of this: update the
 * matching entries there so widget-level colours follow.
 */

/*
:root {
	--cle-success: #0E8F6A;
	--cle-warning: #A56A15;
	--cle-muted: #5A6169;
	--cle-primary-badge: #4B3FD1;
	--cle-danger-badge: #B4113C;
	--cle-success-badge: #0B6B50;
}
*/

/* Accessible skip link, visually hidden until focused. */
.screen-reader-text {
	position: absolute !important;
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
}

.screen-reader-text:focus {
	clip-path: none;
	z-index: 100000;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	padding: 12px 20px;
	border-radius: 4px;
	background: #fff;
	color: var(--cle-primary);
	font-size: 1rem;
	text-decoration: none;
	box-shadow: var(--cle-shadow-card);
}

/* Honour the user's motion preference for every animation this theme adds. */
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto !important;
	}

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