/* ========================================
   EDSTRUMENTS — CUSTOM CSS (Layer 2)
   Elementor handles: typography, padding, alignment, colors (Layer 1).
   This file handles only what Elementor can't:
     /* JS-DRIVEN */        paired with JS class toggles
     /* ELEMENTOR QUIRK FIX */ !important overrides on Elementor internals
     /* ENHANCEMENT */      clamp() / features beyond Elementor
     /* STRUCTURAL */       overflow, max-width, position
     /* FALLBACK */         safety net duplicating Elementor
   ======================================== */

/* Design tokens — extracted from Figma "Edstruments (External)" / About page.
   Mirror of the Elementor Global Kit. Elementor controls remain source of truth;
   these are for Layer 2 CSS that can't reach kit variables. */
:root {
	/* Colors */
	--content-primary:   #0D0F11; /* headings + dark body */
	--content-secondary: #4B5768; /* muted body */
	--bg-primary:        #F9F9F9; /* light section bg */
	--white:             #FAFAFA;
	--magenta-primary:   #662756; /* brand accent / primary action */
	--brand-dark-start:  #386276; /* dark section gradient start */
	--brand-dark-end:    #0F191F; /* dark section gradient end */
	--border-tertiary:   #E7EAEE;
	--border-tertiary-2: #D9DDE3;
	--brand-dark-gradient: linear-gradient(180deg, #386276 0%, #0F191F 100%);

	/* Type family */
	--font-primary: "Golos Text", sans-serif;

	/* Spacing scale (px) */
	--space-16: 16px; --space-18: 18px; --space-20: 20px; --space-24: 24px;
	--space-32: 32px; --space-40: 40px; --space-52: 52px; --space-56: 56px;
	--space-60: 60px; --space-80: 80px;
}

/* JS-DRIVEN — Page loader. A full-screen spinner shown while navigating to the
   next page (initPageLoader adds .is-on). Sits above everything, including the
   mobile menu overlay. */
.eds-loader {
	position: fixed;
	inset: 0;
	z-index: 2147483000;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.86);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.2s ease, visibility 0s linear 0.2s;
}
.eds-loader.is-on {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity 0.15s ease;
}
.eds-loader__spinner {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 4px solid rgba(102, 39, 86, 0.18);
	border-top-color: var(--magenta-primary, #662756);
	animation: eds-loader-spin 0.7s linear infinite;
}
.eds-loader__sr {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
@keyframes eds-loader-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
	.eds-loader__spinner { animation-duration: 1.4s; }
}
/* Mobile only — the loader is for the hamburger-menu navigation (≤1180px, where
   the nav is an overlay). On desktop the nav is inline, so no spinner. */
@media (min-width: 1181px) {
	.eds-loader { display: none !important; }
}