/* ==========================================================================
   Animated Gradient SVG Backgrounds
   Heatwave ripple via SVG path morphing (JS-driven)
   ========================================================================== */

.has-animated-gradient {
	position: relative;
	overflow: hidden;
}

.animated-gradient-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

.animated-gradient-bg svg {
	width: 100%;
	height: 100%;
	display: block;
	transform: scale(1.01);
}

/* ---- Rotation + stripe density ---- */
/* Rotation and scaleX transforms are computed by JS (animated-gradient-observer.js)
   based on actual container dimensions — true object-fit:cover behavior.
   JS reads data-rotation and data-scale-factor attributes from the div,
   measures the container, and applies exact pixel sizing + transforms. */

/* ---- Stats & Problem sub-panels ---- */

/* Content above animated gradient background */
.panel-stats-problem .stats-panel.has-animated-gradient > *:not(.animated-gradient-bg):not(.stats-panel-bg) {
	position: relative;
	z-index: 1;
}

/* Suppress CSS background-image when ACF graphic element is set */
.panel-stats-problem .stats-panel.no-bg-image {
	background-image: none !important;
}

/* Stats panel background images (ACF-driven, replaces hardcoded CSS backgrounds) */
.panel-stats-problem .stats-panel-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
}

.panel-stats-problem .stats-panel-bg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ---- Full-panel content layering ---- */
/* Ensure content sits above animated gradient on non-hero panels */
.has-animated-gradient:not(.panel-hero) > *:not(.animated-gradient-bg) {
	position: relative;
	z-index: 1;
}

/* ---- Full-panel overrides ---- */
/* Hero panel: do NOT clip overflow (news drawer needs to extend beyond) */
.panel-hero.has-animated-gradient {
	overflow: visible;
}
