/* ==========================================================================
   Spensa Elements — Global CSS & Resets
   Plugin for SMP Negeri 1 Cirebon | reyraverse.com
   ========================================================================== */

/* ── CSS Custom Properties (Brand Defaults) ── */
:root {
	--spensa-blue:       #0F52BA;
	--spensa-dark-blue:  #0A387E;
	--spensa-accent:     #F59E0B;
	--spensa-light:      #F3F4F6;
	--spensa-dark:       #111827;
	--spensa-text:       #374151;
	--spensa-muted:      #6B7280;
	--spensa-border:     #E5E7EB;
	--spensa-radius:     0.75rem;
	--spensa-radius-lg:  1.25rem;
	--spensa-transition: 0.3s ease;
}

/* ── Universal Component Box Sizing & Font Family Reset ── */
.spensa-topbar,
.spensa-navbar,
.spensa-hero-slider,
.spensa-stats-counter,
.spensa-about-section,
.spensa-features,
.spensa-achievements,
.spensa-gallery,
.spensa-blog-posts,
.spensa-contact,
.spensa-footer {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	box-sizing: border-box;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

.spensa-topbar *,
.spensa-navbar *,
.spensa-hero-slider *,
.spensa-stats-counter *,
.spensa-about-section *,
.spensa-features *,
.spensa-achievements *,
.spensa-gallery *,
.spensa-blog-posts *,
.spensa-contact *,
.spensa-footer * {
	box-sizing: border-box;
}

/* ── Reset links from theme override ── */
.spensa-topbar a,
.spensa-navbar a,
.spensa-hero-slider a,
.spensa-stats-counter a,
.spensa-about-section a,
.spensa-features a,
.spensa-achievements a,
.spensa-gallery a,
.spensa-blog-posts a,
.spensa-contact a,
.spensa-footer a {
	text-decoration: none;
	color: inherit;
	transition: all 0.25s ease;
}

/* ── Section heading shared style ── */
.spensa-section-label {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--spensa-blue);
	margin-bottom: 0.5rem;
}

.spensa-section-title {
	font-size: clamp(1.6rem, 3.5vw, 2.25rem);
	font-weight: 800;
	color: var(--spensa-dark);
	line-height: 1.25;
	margin: 0 0 1rem;
	letter-spacing: -0.015em;
}

.spensa-section-desc {
	font-size: 0.9375rem;
	color: var(--spensa-muted);
	line-height: 1.7;
	margin: 0;
}

/* ── Badge pill ── */
.spensa-badge {
	display: inline-block;
	padding: 0.25rem 0.85rem;
	border-radius: 9999px;
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ── Utility: Screen Reader Only ── */
.spensa-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border-width: 0;
}

/* ── Universal Icon Support for Elementor (SVG + FontAwesome) ── */
.spensa-topbar svg,
.spensa-navbar svg,
.spensa-hero-slider svg,
.spensa-hero-stats svg,
.spensa-stats-counter svg,
.spensa-about-section svg,
.spensa-features svg,
.spensa-achievements svg,
.spensa-gallery svg,
.spensa-blog-posts svg,
.spensa-contact svg,
.spensa-footer svg {
	fill: currentColor;
	max-width: 100%;
}

.spensa-topbar i,
.spensa-navbar i,
.spensa-hero-slider i,
.spensa-hero-stats i,
.spensa-stats-counter i,
.spensa-about-section i,
.spensa-features i,
.spensa-achievements i,
.spensa-gallery i,
.spensa-blog-posts i,
.spensa-contact i,
.spensa-footer i {
	line-height: 1;
	display: inline-block;
}