/* ============================================
   SECCIÓN: Canvas nieve
   ============================================ */
#cuoh_snow_canvas {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 10;
}
#cuoh_snow_pile {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	height: 0;
	z-index: 9;
	pointer-events: none;
	/* mound base (se reemplaza por SVG si lo deseas) */
	background: radial-gradient(
			120% 60% at 50% -10%,
			rgba(255, 255, 255, 0.4) 0%,
			transparent 60%
		),
		linear-gradient(#fff, #f2f6ff);
	border-top-left-radius: 35% 18%;
	border-top-right-radius: 35% 18%;
	box-shadow: 0 -10px 40px rgba(255, 255, 255, 0.2) inset;
	transition: height 0.8s ease;
}
/* ============================================
   B.3 SECCIÓN: Nieve acumulada con SVG (3 olas) — data-URI CORREGIDAS
   ============================================ */
:root {
	/* 1440 × 300 */
	/* --cuoh-snow-svg-1440: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1440' height='300' viewBox='0 0 1440 300' preserveAspectRatio='none'><defs><linearGradient id='g' x1='0' x2='0' y1='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23f3f7ff'/></linearGradient></defs><rect width='1440' height='300' fill='url(%23g)'/><path d='M0,180 C240,140 360,190 540,170 C720,150 840,210 1050,180 C1230,155 1320,175 1440,160 L1440,300 L0,300Z' fill='%23ffffff' opacity='.9' stroke='%230a1229' stroke-opacity='0.10' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,210 C220,190 420,210 640,190 C860,170 1060,210 1200,200 C1320,192 1380,188 1440,185 L1440,300 L0,300Z' fill='%23ffffff' opacity='.75' stroke='%230a1229' stroke-opacity='0.08' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,235 C260,230 420,240 700,232 C980,224 1180,246 1440,238 L1440,300 L0,300Z' fill='%23ffffff' opacity='.6' stroke='%230a1229' stroke-opacity='0.06' stroke-width='2' vector-effect='non-scaling-stroke'/></svg>"); */

	/* 1920 × 320 */
	/* --cuoh-snow-svg-1920: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1920' height='320' viewBox='0 0 1920 320' preserveAspectRatio='none'><defs><linearGradient id='g2' x1='0' x2='0' y1='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eef4ff'/></linearGradient></defs><rect width='1920' height='320' fill='url(%23g2)'/><path d='M0,190 C320,160 520,210 760,185 C1000,160 1200,220 1480,195 C1680,178 1800,190 1920,175 L1920,320 L0,320Z' fill='%23ffffff' opacity='.9' stroke='%230a1229' stroke-opacity='0.10' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,220 C280,205 560,228 880,208 C1200,188 1460,230 1680,215 C1800,206 1870,202 1920,200 L1920,320 L0,320Z' fill='%23ffffff' opacity='.72' stroke='%230a1229' stroke-opacity='0.08' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,245 C360,240 640,250 980,242 C1320,234 1600,256 1920,248 L1920,320 L0,320Z' fill='%23ffffff' opacity='.58' stroke='%230a1229' stroke-opacity='0.06' stroke-width='2' vector-effect='non-scaling-stroke'/></svg>"); */

	/* 2560 × 360 */
	/* --cuoh-snow-svg-2560: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='2560' height='360' viewBox='0 0 2560 360' preserveAspectRatio='none'><defs><linearGradient id='g3' x1='0' x2='0' y1='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eaf2ff'/></linearGradient></defs><rect width='2560' height='360' fill='url(%23g3)'/><path d='M0,210 C420,180 720,230 1040,200 C1360,170 1680,235 2080,205 C2320,186 2460,195 2560,185 L2560,360 L0,360Z' fill='%23ffffff' opacity='.9' stroke='%230a1229' stroke-opacity='0.10' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,240 C400,225 820,248 1160,228 C1500,208 1860,250 2200,230 C2400,218 2480,214 2560,212 L2560,360 L0,360Z' fill='%23ffffff' opacity='.72' stroke='%230a1229' stroke-opacity='0.08' stroke-width='2' vector-effect='non-scaling-stroke'/><path d='M0,270 C520,265 900,275 1320,268 C1740,260 2100,282 2560,274 L2560,360 L0,360Z' fill='%23ffffff' opacity='.56' stroke='%230a1229' stroke-opacity='0.06' stroke-width='2' vector-effect='non-scaling-stroke'/></svg>"); */

	/* --cuoh-snow-svg-1440: url('../images/nieve1.svg');
	--cuoh-snow-svg-1920: url('../images/nieve2.svg');
	--cuoh-snow-svg-2560: url('../images/nieve3.svg'); */

	/* ============================================
     OLA 1440 × 300 — forma A (ondas marcadas)
     ============================================ */
	--cuoh-snow-svg-1440: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1440' height='300' viewBox='0 0 1440 300' preserveAspectRatio='none'><defs><linearGradient id='bgA' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eef3ff'/></linearGradient><linearGradient id='crestA1' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23f0f5ff'/></linearGradient><linearGradient id='crestA2' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23fbfdff'/><stop offset='100%25' stop-color='%23e9f1ff'/></linearGradient><linearGradient id='crestA3' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23f7fbff'/><stop offset='100%25' stop-color='%23e6f0ff'/></linearGradient></defs><rect width='1440' height='300' fill='none'/><path d='M0,172 C200,120 360,210 560,168 C760,126 940,226 1150,182 C1280,156 1360,170 1440,160 L1440,300 L0,300 Z' fill='url(%23crestA1)' opacity='0.92'/><path d='M0,205 C240,186 460,222 720,198 C980,174 1180,230 1360,212 C1400,208 1420,206 1440,205 L1440,300 L0,300 Z' fill='url(%23crestA2)' opacity='0.86'/><path d='M0,237 C260,232 500,246 820,236 C1140,226 1320,254 1440,246 L1440,300 L0,300 Z' fill='url(%23crestA3)' opacity='0.78'/></svg>");

	/* ============================================
     OLA 1920 × 320 — forma B (crestas más amplias)
     ============================================ */
	--cuoh-snow-svg-1920: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1920' height='320' viewBox='0 0 1920 320' preserveAspectRatio='none'><defs><linearGradient id='bgB' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23ecf3ff'/></linearGradient><linearGradient id='crestB1' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eef4ff'/></linearGradient><linearGradient id='crestB2' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23fbfdff'/><stop offset='100%25' stop-color='%23eaf1ff'/></linearGradient><linearGradient id='crestB3' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23f6fbff'/><stop offset='100%25' stop-color='%23e7f0ff'/></linearGradient></defs><rect width='1920' height='320' fill='none'/><path d='M0,188 C320,130 560,228 840,178 C1120,128 1360,236 1640,190 C1780,168 1860,182 1920,170 L1920,320 L0,320 Z' fill='url(%23crestB1)' opacity='0.92'/><path d='M0,222 C300,204 640,236 980,210 C1320,184 1580,234 1800,216 C1860,211 1890,208 1920,206 L1920,320 L0,320 Z' fill='url(%23crestB2)' opacity='0.84'/><path d='M0,250 C360,244 720,258 1120,246 C1520,234 1760,262 1920,254 L1920,320 L0,320 Z' fill='url(%23crestB3)' opacity='0.76'/></svg>");

	/* ============================================
     OLA 2560 × 360 — forma C (olas largas y profundas)
     ============================================ */
	--cuoh-snow-svg-2560: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='2560' height='360' viewBox='0 0 2560 360' preserveAspectRatio='none'><defs><linearGradient id='bgC' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eaf2ff'/></linearGradient><linearGradient id='crestC1' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23ffffff'/><stop offset='100%25' stop-color='%23eef4ff'/></linearGradient><linearGradient id='crestC2' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23fbfdff'/><stop offset='100%25' stop-color='%23e9f2ff'/></linearGradient><linearGradient id='crestC3' x1='0' y1='0' x2='0' y2='1'><stop offset='0%25' stop-color='%23f6faff'/><stop offset='100%25' stop-color='%23e5efff'/></linearGradient></defs><rect width='2560' height='360' fill='url(%23bgC)'/><path d='M0,206 C420,140 780,242 1120,184 C1460,126 1820,244 2220,194 C2400,172 2500,186 2560,176 L2560,360 L0,360 Z' fill='none' opacity='0.92'/><path d='M0,242 C400,226 880,252 1280,224 C1680,196 2060,248 2360,226 C2460,218 2510,214 2560,212 L2560,360 L0,360 Z' fill='url(%23crestC2)' opacity='0.83'/><path d='M0,272 C520,266 980,280 1440,268 C1900,256 2240,286 2560,278 L2560,360 L0,360 Z' fill='url(%23crestC3)' opacity='0.74'/></svg>");
}

/* Aplicación al montículo (sobrescribe fondo anterior con SVG + degradados) */
#cuoh_snow_pile {
	background-image: var(--cuoh-snow-svg-1440),
		radial-gradient(
			120% 60% at 50% -10%,
			rgba(251, 251, 251, 0.35) 0%,
			transparent 60%
		),
		linear-gradient(
			180deg,
			rgba(251, 251, 251, 0.5) 0%,
			rgba(161, 174, 255, 0.28) 40%,
			rgba(147, 152, 182, 0.44) 75%
		),
		linear-gradient(#fff, #f2f6ff); /* base clara al fondo */
	background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%;
	background-repeat: no-repeat;
}

/* Switch según ancho de viewport */
@media (min-width: 1200px) {
	#cuoh_snow_pile {
		background-image: var(--cuoh-snow-svg-1920),
			radial-gradient(
				120% 60% at 50% -10%,
				rgba(251, 251, 251, 0.35) 0%,
				transparent 60%
			),
			linear-gradient(
				180deg,
				rgba(251, 251, 251, 0.5) 0%,
				rgba(161, 174, 255, 0.28) 40%,
				rgba(147, 152, 182, 0.44) 75%
			),
			linear-gradient(#fff, #f2f6ff);
	}
}
@media (min-width: 1800px) {
	#cuoh_snow_pile {
		background-image: var(--cuoh-snow-svg-2560),
			radial-gradient(
				120% 60% at 50% -10%,
				rgba(251, 251, 251, 0.35) 0%,
				transparent 60%
			),
			linear-gradient(
				180deg,
				rgba(251, 251, 251, 0.5) 0%,
				rgba(161, 174, 255, 0.28) 40%,
				rgba(147, 152, 182, 0.44) 75%
			),
			linear-gradient(#fff, #f2f6ff);
	}
}
