/* ============================================================
   WRC Base — design tokens + utilities
   Loaded site-wide. Don't put component styles here.
   ============================================================ */

:root {
	/* Colors */
	--wrc-bg:           #faf6f3;
	--wrc-ink:          #241830;
	--wrc-muted:        #6e5e7a;
	--wrc-card:         #ffffff;
	--wrc-teal:         #3699A6;
	--wrc-teal-soft:    #cfe6e9;
	--wrc-purple:       #8C53A6;
	--wrc-purple-soft:  #e0d2e8;
	--wrc-amber:        #d99a4c;

	/* The Glow gradient */
	--wrc-gradient: linear-gradient(135deg, var(--wrc-teal), var(--wrc-purple));

	/* Radii */
	--r-pill:       999px;
	--r-card-sm:    14px;
	--r-card:       20px;
	--r-card-lg:    28px;
	--r-feature:    32px;
	--r-hero:       36px;

	/* Shadows */
	--shadow-card:     0 8px 32px -16px rgba(36,24,48,0.12);
	--shadow-card-lg:  0 12px 36px -20px rgba(36,24,48,0.15);
	--shadow-hero:     0 30px 80px -20px rgba(36,24,48,0.25);
	--shadow-floating: 0 24px 60px -16px rgba(36,24,48,0.55), 0 8px 20px -8px rgba(36,24,48,0.35);
	--shadow-cta:      0 10px 24px -8px rgba(140,83,166,0.33);

	/* Glass surface */
	--glass-bg:     rgba(255, 255, 255, 0.7);
	--glass-border: 1px solid rgba(36, 24, 48, 0.06);
	--glass-blur:   blur(10px);

	/* Page gutter */
	--page-gutter: 56px;
}

@media (max-width: 768px) {
	:root { --page-gutter: 24px; }
}

/* ---- Reset & base type ---- */

html, body {
	background: var(--wrc-bg);
	color: var(--wrc-ink);
	font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

::selection { background: rgba(54,153,166,0.25); }

/* Headings inherit Plus Jakarta Sans; Elementor Global Fonts will size them. */
h1, h2, h3, h4, h5, h6 {
	font-family: inherit;
	color: var(--wrc-ink);
	letter-spacing: -0.025em;
	margin: 0;
}

/* ---- Utility classes ---- */

.wrc-gradient-text {
	background: var(--wrc-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}

.wrc-eyebrow {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--wrc-muted);
	display: inline-block;
}

.wrc-glass {
	background: var(--glass-bg);
	-webkit-backdrop-filter: var(--glass-blur);
	backdrop-filter: var(--glass-blur);
	border: var(--glass-border);
}

.wrc-pill {
	border-radius: var(--r-pill);
}

/* Pulsing dot used in crisis CTAs and announcement bar */
@keyframes wrcPulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50%      { transform: scale(1.4); opacity: 0.6; }
}
.wrc-pulse-dot {
	display: inline-block;
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background: #fff;
	box-shadow: 0 0 0 4px rgba(255,255,255,0.25);
	animation: wrcPulse 1.6s infinite;
	vertical-align: middle;
}

/* Decorative glow blob (rendered by [wrc_glow_blob] shortcode) */
.wrc-glow-blob {
	position: absolute;
	border-radius: 50%;
	filter: blur(40px);
	pointer-events: none;
}

/* Section helper: relative + overflow-clipped so glow blobs stay inside */
.wrc-section { position: relative; overflow: hidden; }

/* Default link styling — keep neutral; Elementor controls page-level links. */
a { color: inherit; text-decoration: none; }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
	.wrc-pulse-dot { animation: none; }
	* { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}