/*
Theme Name: Blocksy Child AVUDS
Template: blocksy
Version: 2.0
Description: Child theme para AVUDS — Asociación de Vecinos contra el Ruido
Author: AVUDS
Text Domain: blocksy-child
*/

/* ============================================
   VARIABLES GLOBALES AVUDS
   ============================================ */

:root {
	/* Paleta AVUDS */
	--avuds-blue-dark:    #0d3b6e;
	--avuds-blue:         #1565c0;
	--avuds-blue-mid:     #1976d2;
	--avuds-blue-light:   #e3f2fd;
	--avuds-blue-xlight:  #f0f7ff;
	--avuds-text:         #1a2332;
	--avuds-text-muted:   #4a5568;
	--avuds-border:       #dde8f4;
	--avuds-white:        #ffffff;
	--avuds-bg:           #f8fafc;

	/* Override paleta Blocksy → azules AVUDS */
	--theme-palette-color-1: #1565c0;
	--theme-palette-color-2: #0d3b6e;
	--theme-palette-color-3: #1976d2;
	--theme-palette-color-4: #0a2d5a;
	--theme-palette-color-5: #e3f2fd;
	--theme-palette-color-6: #f0f7ff;
	--theme-palette-color-7: #f8fafc;
	--theme-palette-color-8: #ffffff;

	/* Tipografía */
	--avuds-font:         'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	--avuds-radius:       12px;
	--avuds-radius-lg:    20px;
	--avuds-shadow:       0 4px 20px rgba(13, 59, 110, 0.10);
	--avuds-shadow-lg:    0 10px 40px rgba(13, 59, 110, 0.16);
	--avuds-transition:   0.25s ease;
}

/* ============================================
   TIPOGRAFÍA GLOBAL
   ============================================ */

body,
.ct-main-content,
.entry-content {
	font-family: var(--avuds-font) !important;
	color: var(--avuds-text);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: var(--avuds-font) !important;
	font-weight: 700;
	color: var(--avuds-blue-dark);
	line-height: 1.2;
	letter-spacing: -0.02em;
}

h1 { font-size: clamp(2rem, 5vw, 3.25rem); }
h2 { font-size: clamp(1.5rem, 3.5vw, 2.25rem); }
h3 { font-size: clamp(1.15rem, 2.5vw, 1.5rem); }

p { color: var(--avuds-text-muted); line-height: 1.75; }

a {
	color: var(--avuds-blue);
	text-decoration: none;
	transition: color var(--avuds-transition);
}
a:hover { color: var(--avuds-blue-dark); }

/* ============================================
   HEADER / NAVEGACIÓN
   ============================================ */

/* :not(.ct-panel) — el offcanvas del menú móvil también lleva la clase
   ct-header y forzarle sticky lo deja anclado fuera del viewport */
.ct-header:not(.ct-panel),
header#header {
	background: var(--avuds-white) !important;
	box-shadow: 0 1px 0 var(--avuds-border), 0 2px 12px rgba(13,59,110,0.06) !important;
	position: sticky !important;
	top: 0;
	z-index: 1000;
}

/* Ocultar texto del sitio (nombre + descripción) */
.site-title-container,
span.site-title,
.ct-site-title,
.site-title,
.ct-site-name,
.site-description,
.ct-site-description {
	display: none !important;
}

/* Logo: el tamaño se controla desde Blocksy (logoMaxHeight en el header
   builder) para que contenedor e imagen midan lo mismo — forzar la altura
   por CSS hacía que la imagen desbordara el header */

/* Nav links */
.ct-nav-links > li > a,
.primary-nav > ul > li > a,
#menu-main-menu > li > a,
.nav-menu > li > a {
	font-family: var(--avuds-font) !important;
	font-size: 0.9rem !important;
	font-weight: 600 !important;
	color: var(--avuds-text) !important;
	letter-spacing: 0.01em;
	padding: 0.5rem 0.75rem !important;
	border-radius: 8px;
	transition: all var(--avuds-transition);
}

.ct-nav-links > li > a:hover,
.primary-nav > ul > li > a:hover,
#menu-main-menu > li > a:hover,
.nav-menu > li > a:hover,
.ct-nav-links > li.current-menu-item > a,
#menu-main-menu > li.current-menu-item > a {
	color: var(--avuds-blue) !important;
	background: var(--avuds-blue-xlight) !important;
}


/* ============================================
   FOOTER
   ============================================ */

.ct-footer,
#footer,
footer {
	background: var(--avuds-blue-dark) !important;
	color: rgba(255,255,255,0.85) !important;
	border-top: none !important;
}

.ct-footer *,
#footer *,
footer * {
	color: rgba(255,255,255,0.85) !important;
}

.ct-footer a,
#footer a,
footer a {
	color: rgba(255,255,255,0.85) !important;
	transition: color var(--avuds-transition);
}
.ct-footer a:hover,
#footer a:hover,
footer a:hover {
	color: var(--avuds-white) !important;
}

/* Quitar fondo oscuro del bottom-row (franja separada) */
.ct-footer [data-row="bottom"],
footer [data-row="bottom"] {
	background: transparent !important;
	border-top: 1px solid rgba(255,255,255,0.1) !important;
}

/* Centrar contenido del copyright en ambos ejes */
.ct-footer-copyright,
.ct-footer [data-column="copyright"] {
	background: transparent !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	padding: 1.5rem 1rem !important;
	width: 100% !important;
}

/* Centrar el <p> de copyright (tiene estilos inline, necesitamos forzar) */
.ct-footer-copyright p {
	text-align: center !important;
	width: 100% !important;
}

/* Iconos sociales en el footer */
.ct-footer .avuds-footer-socials,
.ct-footer-copyright .avuds-footer-socials,
.ct-copyright-text .avuds-footer-socials,
.footer-socket .avuds-footer-socials,
.avuds-footer-socials {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 1.25rem !important;
	margin: 0.75rem auto 0 !important;
	flex-wrap: nowrap !important;
	width: 100% !important;
}

/* Eliminar márgenes de <p> wrapper que WordPress puede insertar */
.ct-footer p:has(.avuds-footer-social-link),
.ct-footer-copyright p:has(.avuds-footer-social-link) {
	margin: 0 !important;
	padding: 0 !important;
	display: flex !important;
	justify-content: center !important;
	width: 100% !important;
}


.ct-footer .avuds-footer-social-link,
.avuds-footer-social-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	min-width: 40px !important;
	background: rgba(255,255,255,0.12) !important;
	border: 1px solid rgba(255,255,255,0.22) !important;
	border-radius: 50% !important;
	color: rgba(255,255,255,0.85) !important;
	transition: all var(--avuds-transition) !important;
	text-decoration: none !important;
}

.ct-footer .avuds-footer-social-link:hover,
.avuds-footer-social-link:hover {
	background: rgba(255,255,255,0.25) !important;
	color: #ffffff !important;
	border-color: rgba(255,255,255,0.45) !important;
	transform: translateY(-2px) !important;
}

/* ============================================
   HERO NOCTURNO — "La ventana del vecino"
   La escena recorre en 32s los 4 focos de ruido:
   avión (6-19%), tráfico (31-44%), fuegos (56-69%)
   y botellón (81-94%); el medidor y las ventanas
   que se encienden van sincronizados con esas
   franjas — si cambias una, cambia todas.
   ============================================ */

.avuds-hero--night {
	background:
		radial-gradient(1100px 520px at 76% 14%, rgba(48, 112, 200, 0.32), transparent 62%),
		linear-gradient(168deg, #071a33 0%, #0d3b6e 60%, #14549c 100%);
}

.avuds-hero__inner--split {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.85fr);
	gap: 64px;
	align-items: center;
	text-align: left;
	max-width: 1140px;
}

.avuds-hero__inner--split > * {
	min-width: 0;
}

.avuds-hero.avuds-hero--night h1 {
	font-size: clamp(2.2rem, 4.3vw, 3.3rem) !important;
	line-height: 1.14;
}

/* Subrayado de onda sonora bajo la palabra clave (pintado a altura de
   baseline para no invadir la línea siguiente con line-height apretado) */
.avuds-squiggle {
	font-style: normal;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='110' height='10' viewBox='0 0 110 10'%3E%3Cpath d='M0 6 Q 9 1 18 6 T 36 6 T 54 6 T 72 6 T 90 6 T 108 6' fill='none' stroke='%237db8ff' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x left 0.98em;
	background-size: auto 0.16em;
}

.avuds-hero--night .avuds-hero__subtitle {
	max-width: 46ch;
	margin-left: 0;
	margin-right: 0;
}

.avuds-hero--night .avuds-hero__ctas {
	justify-content: flex-start;
}

/* La ventana: cielo nocturno + medidor */
.avuds-window {
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: 22px;
	background: rgba(255, 255, 255, 0.045);
	padding: 14px 14px 8px;
	box-shadow: 0 30px 60px rgba(2, 12, 28, 0.45);
}

.avuds-window__sky {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	height: 240px;
	background: linear-gradient(180deg, #04101f 0%, #0a2647 76%, #12386b 100%);
}

.avuds-window__stars {
	position: absolute;
	top: 0; left: 0;
	width: 2px; height: 2px;
	border-radius: 50%;
	background: transparent;
	box-shadow:
		24px 36px #fff, 70px 90px rgba(255,255,255,0.7), 120px 28px #fff,
		168px 110px rgba(255,255,255,0.6), 210px 50px #fff, 256px 140px rgba(255,255,255,0.75),
		300px 34px #fff, 342px 96px rgba(255,255,255,0.6), 388px 60px #fff,
		418px 150px rgba(255,255,255,0.7), 90px 160px #fff, 150px 196px rgba(255,255,255,0.55),
		238px 200px #fff, 330px 180px rgba(255,255,255,0.6), 44px 120px rgba(255,255,255,0.8),
		396px 116px rgba(255,255,255,0.5);
	opacity: 0.85;
}

/* Luna creciente como la del logo (box-shadow inset recorta el disco) */
.avuds-window__moon {
	position: absolute;
	top: 24px; right: 34px;
	width: 42px; height: 42px;
	border-radius: 50%;
	background: transparent;
	box-shadow:
		inset -11px 7px 0 0 #ecf3fb,
		0 0 30px rgba(220, 235, 255, 0.28);
}

/* Estrella de 4 puntas junto a la luna, también del logo */
.avuds-window__spark {
	position: absolute;
	top: 56px; right: 86px;
	width: 11px; height: 11px;
	background: #eaf3ff;
	clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
	animation: avudsTwinkle 4.5s ease-in-out infinite;
}

@keyframes avudsTwinkle {
	0%, 100% { opacity: 0.45; transform: scale(0.8); }
	50%      { opacity: 1; transform: scale(1.1); }
}

/* Silueta de tejados al pie de la ventana (la calle del barrio) */
.avuds-skyline {
	position: absolute;
	bottom: 0; left: 0;
	width: 100%;
	height: 34px;
	display: block;
}

/* Ventanas de vecinos que se encienden con cada episodio de ruido */
.avuds-window__lit {
	position: absolute;
	width: 4px; height: 5px;
	border-radius: 1px;
	background: #ffd9a0;
	box-shadow: 0 0 6px rgba(255, 217, 160, 0.8);
	opacity: 0;
	animation: avudsWake 32s ease-in-out infinite;
}

.avuds-window__lit--1 { left: 15%; bottom: 7px; }
.avuds-window__lit--2 { left: 67%; bottom: 9px; animation-delay: 0.7s; }

@keyframes avudsWake {
	0%, 7%    { opacity: 0; }
	10%, 17%  { opacity: 1; }
	20%, 32%  { opacity: 0; }
	35%, 42%  { opacity: 1; }
	45%, 57%  { opacity: 0; }
	60%, 67%  { opacity: 1; }
	70%, 82%  { opacity: 0; }
	85%, 92%  { opacity: 1; }
	95%, 100% { opacity: 0; }
}

/* Episodio 1 — avión a baja altura */
.avuds-plane {
	position: absolute;
	top: 54px; left: -76px;
	opacity: 0;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4));
	animation: avudsFly 32s linear infinite;
}

/* El recorrido anima `left` en % para adaptarse al ancho real del cielo
   (con translateX fijo el avión/coche cruzaba antes de acabar su franja) */
@keyframes avudsFly {
	0%, 6%    { left: -76px; transform: translateY(0); opacity: 0; }
	7.5%      { opacity: 1; }
	17.5%     { opacity: 1; }
	19%, 100% { left: 100%; transform: translateY(14px); opacity: 0; }
}

.avuds-plane__beacon {
	animation: avudsBeacon 1.1s steps(1) infinite;
}

@keyframes avudsBeacon {
	0%, 55%   { opacity: 1; }
	56%, 100% { opacity: 0.15; }
}

/* Episodio 2 — tráfico (cruza la calle de derecha a izquierda) */
.avuds-car {
	position: absolute;
	bottom: 3px; left: 100%;
	opacity: 0;
	animation: avudsDrive 32s linear infinite;
}

@keyframes avudsDrive {
	0%, 31%   { left: 100%; opacity: 0; }
	32.5%     { opacity: 1; }
	42.5%     { opacity: 1; }
	44%, 100% { left: -90px; opacity: 0; }
}

/* Episodio 3 — fuegos artificiales (dos explosiones de partículas) */
.avuds-burst {
	position: absolute;
	width: 4px; height: 4px;
	border-radius: 50%;
	opacity: 0;
	transform: scale(0.15);
	pointer-events: none;
}

.avuds-burst--a {
	top: 32%; left: 22%;
	background: #ffd9a0;
	box-shadow:
		26px 0 #ffd28a, 22px 13px #ff9d76, 13px 22px #ffd28a, 0 26px #ff9d76,
		-13px 22px #ffd28a, -22px 13px #ff9d76, -26px 0 #ffd28a, -22px -13px #ff9d76,
		-13px -22px #ffd28a, 0 -26px #ff9d76, 13px -22px #ffd28a, 22px -13px #ff9d76;
	animation: avudsBurstA 32s ease-out infinite;
}

.avuds-burst--b {
	top: 17%; left: 54%;
	background: #cfe6ff;
	box-shadow:
		20px 0 #b7d7ff, 17px 10px #9ecbff, 10px 17px #b7d7ff, 0 20px #9ecbff,
		-10px 17px #b7d7ff, -17px 10px #9ecbff, -20px 0 #b7d7ff, -17px -10px #9ecbff,
		-10px -17px #b7d7ff, 0 -20px #9ecbff, 10px -17px #b7d7ff, 17px -10px #9ecbff;
	animation: avudsBurstB 32s ease-out infinite;
}

@keyframes avudsBurstA {
	0%, 56.5% { transform: scale(0.15); opacity: 0; }
	58%       { opacity: 1; }
	61.5%     { transform: scale(1.15); opacity: 0; }
	62%, 100% { transform: scale(0.15); opacity: 0; }
}

@keyframes avudsBurstB {
	0%, 61.5% { transform: scale(0.15); opacity: 0; }
	63%       { opacity: 1; }
	66.5%     { transform: scale(1.15); opacity: 0; }
	67%, 100% { transform: scale(0.15); opacity: 0; }
}

/* Episodio 4 — botellón (resplandor en la calle + música) */
.avuds-street-glow {
	position: absolute;
	bottom: 0; left: 12%;
	width: 130px; height: 44px;
	background: radial-gradient(ellipse at 50% 100%, rgba(255, 186, 92, 0.5), transparent 70%);
	opacity: 0;
	animation: avudsGlow 32s ease-in-out infinite;
	pointer-events: none;
}

@keyframes avudsGlow {
	0%, 81%   { opacity: 0; }
	84%, 91%  { opacity: 1; }
	94%, 100% { opacity: 0; }
}

.avuds-note {
	position: absolute;
	bottom: 28px;
	font-size: 19px;
	line-height: 1;
	color: #ffe3b0;
	text-shadow: 0 0 10px rgba(255, 186, 92, 0.85);
	opacity: 0;
	animation: avudsNote 32s ease-out infinite;
}

.avuds-note--1 { left: 16%; }
.avuds-note--2 { left: 23%; font-size: 15px; animation-delay: 1s; }
.avuds-note--3 { left: 30%; font-size: 17px; animation-delay: 2s; }

@keyframes avudsNote {
	0%, 82%   { transform: translateY(10px) rotate(0deg); opacity: 0; }
	84.5%     { opacity: 1; }
	89%, 100% { transform: translateY(-28px) rotate(-8deg); opacity: 0; }
}

.avuds-meter {
	display: flex;
	align-items: flex-end;
	gap: 18px;
	padding: 14px 8px 8px;
}

.avuds-meter__bars {
	display: flex;
	align-items: flex-end;
	gap: 4px;
	height: 44px;
	flex: 1 1 60px;
	min-width: 0;
	overflow: hidden;
}

.avuds-meter__bars i {
	width: 5px;
	border-radius: 2px;
	background: #5d9be0;
	height: var(--h, 14px);
	transform-origin: bottom;
	animation: avudsSpike 32s ease-in-out infinite;
	animation-delay: var(--d, 0s);
}

.avuds-meter__bars i:nth-child(1)  { --h: 12px; --s: 2.2; --d: 0.10s; }
.avuds-meter__bars i:nth-child(2)  { --h: 18px; --s: 1.9; --d: 0.04s; }
.avuds-meter__bars i:nth-child(3)  { --h: 10px; --s: 2.8; --d: 0.14s; }
.avuds-meter__bars i:nth-child(4)  { --h: 22px; --s: 1.8; --d: 0.02s; }
.avuds-meter__bars i:nth-child(5)  { --h: 14px; --s: 2.6; --d: 0.12s; }
.avuds-meter__bars i:nth-child(6)  { --h: 26px; --s: 1.6; --d: 0.06s; }
.avuds-meter__bars i:nth-child(7)  { --h: 12px; --s: 3.2; --d: 0.16s; }
.avuds-meter__bars i:nth-child(8)  { --h: 20px; --s: 2.1; --d: 0.08s; }
.avuds-meter__bars i:nth-child(9)  { --h: 15px; --s: 2.7; --d: 0.03s; }
.avuds-meter__bars i:nth-child(10) { --h: 24px; --s: 1.7; --d: 0.13s; }
.avuds-meter__bars i:nth-child(11) { --h: 11px; --s: 3.0; --d: 0.07s; }
.avuds-meter__bars i:nth-child(12) { --h: 19px; --s: 2.0; --d: 0.11s; }
.avuds-meter__bars i:nth-child(13) { --h: 13px; --s: 2.5; --d: 0.05s; }
.avuds-meter__bars i:nth-child(14) { --h: 21px; --s: 1.9; --d: 0.09s; }

@keyframes avudsSpike {
	0%, 6%, 19%, 31%, 44%, 56%, 69%, 81%, 94%, 100% { transform: scaleY(1); }
	10%, 15% { transform: scaleY(var(--s, 2)); }
	35%, 40% { transform: scaleY(calc(var(--s, 2) * 0.85)); }
	60%, 65% { transform: scaleY(calc(var(--s, 2) * 1.1)); }
	85%, 90% { transform: scaleY(calc(var(--s, 2) * 0.78)); }
}

/* Los spans se apilan en la misma celda de grid: la caja reserva el ancho
   del texto más largo y las barras (flex:1, overflow:hidden) se encogen —
   con position:absolute la caja medía 0 y el texto pisaba las barras en móvil */
.avuds-meter__read {
	display: grid;
	flex-shrink: 0;
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
}

.avuds-meter__read span {
	grid-area: 1 / 1;
	justify-self: end;
	align-self: center;
	white-space: nowrap;
}

.avuds-meter__calm {
	color: #bcd7f7;
	animation: avudsCalm 32s linear infinite;
}

.avuds-meter__peak {
	color: #ff8a73;
	opacity: 0;
	animation: avudsPeak1 32s linear infinite;
}

.avuds-meter__peak--1 { animation-name: avudsPeak1; }
.avuds-meter__peak--2 { animation-name: avudsPeak2; }
.avuds-meter__peak--3 { animation-name: avudsPeak3; }
.avuds-meter__peak--4 { animation-name: avudsPeak4; }

@keyframes avudsCalm {
	0%, 7%    { opacity: 1; }
	9%, 16%   { opacity: 0; }
	18%, 32%  { opacity: 1; }
	34%, 41%  { opacity: 0; }
	43%, 57%  { opacity: 1; }
	59%, 66%  { opacity: 0; }
	68%, 82%  { opacity: 1; }
	84%, 91%  { opacity: 0; }
	93%, 100% { opacity: 1; }
}

@keyframes avudsPeak1 {
	0%, 7%    { opacity: 0; }
	9%, 16%   { opacity: 1; }
	18%, 100% { opacity: 0; }
}

@keyframes avudsPeak2 {
	0%, 32%   { opacity: 0; }
	34%, 41%  { opacity: 1; }
	43%, 100% { opacity: 0; }
}

@keyframes avudsPeak3 {
	0%, 57%   { opacity: 0; }
	59%, 66%  { opacity: 1; }
	68%, 100% { opacity: 0; }
}

@keyframes avudsPeak4 {
	0%, 82%   { opacity: 0; }
	84%, 91%  { opacity: 1; }
	93%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.avuds-plane,
	.avuds-plane__beacon,
	.avuds-car,
	.avuds-burst,
	.avuds-street-glow,
	.avuds-note,
	.avuds-window__lit,
	.avuds-window__spark,
	.avuds-meter__bars i,
	.avuds-meter__calm,
	.avuds-meter__peak,
	.wave-anim-1, .wave-anim-2, .wave-anim-3 {
		animation: none !important;
	}
	.avuds-plane,
	.avuds-car,
	.avuds-burst,
	.avuds-street-glow,
	.avuds-note,
	.avuds-window__lit,
	.avuds-meter__peak { opacity: 0; }
	.avuds-meter__calm { opacity: 1; }
}

@media (max-width: 999px) {
	.avuds-hero__inner--split {
		grid-template-columns: 1fr;
		gap: 40px;
		text-align: center;
	}

	.avuds-hero--night .avuds-hero__subtitle {
		margin-left: auto;
		margin-right: auto;
	}

	.avuds-hero--night .avuds-hero__ctas {
		justify-content: center;
	}

	.avuds-window {
		max-width: 440px;
		margin: 0 auto;
		width: 100%;
	}

	.avuds-window__sky { height: 190px; }
}

/* ============================================
   HERO — SECCIÓN PRINCIPAL AVUDS
   ============================================ */

.avuds-hero {
	position: relative;
	background: linear-gradient(135deg, var(--avuds-blue-dark) 0%, var(--avuds-blue) 55%, var(--avuds-blue-mid) 100%);
	color: white;
	overflow: hidden;
	padding: 100px 24px 140px;
	min-height: 85vh;
	display: flex;
	align-items: center;
}

.avuds-hero__inner {
	position: relative;
	z-index: 3;
	max-width: 860px;
	margin: 0 auto;
	text-align: center;
}

.avuds-hero__badge {
	display: inline-block;
	background: rgba(255,255,255,0.15);
	border: 1px solid rgba(255,255,255,0.3);
	color: white;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 6px 18px;
	border-radius: 50px;
	margin-bottom: 1.5rem;
	backdrop-filter: blur(8px);
}

.avuds-hero h1 {
	color: white !important;
	font-size: clamp(2.2rem, 6vw, 3.8rem) !important;
	font-weight: 800 !important;
	text-shadow: 0 2px 20px rgba(0,0,0,0.2);
	margin-bottom: 1.5rem;
	letter-spacing: -0.03em;
}

.avuds-hero__subtitle {
	font-size: clamp(1rem, 2.5vw, 1.25rem);
	color: rgba(255,255,255,0.9) !important;
	line-height: 1.7;
	max-width: 620px;
	margin: 0 auto 2.5rem;
}

.avuds-hero__ctas {
	display: flex;
	gap: 16px;
	justify-content: center;
	flex-wrap: wrap;
}

/* ============================================
   ONDAS ANIMADAS
   ============================================ */

.avuds-waves-container {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	z-index: 2;
}

.avuds-waves-container svg {
	position: relative;
	display: block;
	width: calc(200% + 2px);
}

.wave-anim-1 { animation: waveMove 8s linear infinite; }
.wave-anim-2 { animation: waveMove 12s linear infinite reverse; }
.wave-anim-3 { animation: waveMove 6s linear infinite; }

@keyframes waveMove {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* Partículas flotantes decorativas en hero */
.avuds-hero::before {
	content: '';
	position: absolute;
	top: -50%;
	right: -20%;
	width: 600px;
	height: 600px;
	background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
	border-radius: 50%;
	z-index: 1;
	pointer-events: none;
}

/* Logos de asociaciones aliadas (tarjeta Alianzas y red) */
.avuds-alianzas-logos {
	display: flex;
	gap: 12px;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 18px;
}

.avuds-alianzas-logos a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #ffffff;
	border: 1px solid rgba(13, 59, 110, 0.12);
	border-radius: 10px;
	padding: 8px 14px;
	height: 56px;
	transition: transform var(--avuds-transition);
}

.avuds-alianzas-logos a:hover {
	transform: translateY(-2px);
}

.avuds-alianzas-logos img {
	max-height: 40px;
	width: auto;
	display: block;
}

/* Chips de referencia de decibelios (página Ruido y ley) */
.avuds-db-chips {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 14px;
	margin: 28px 0;
}

.avuds-db-chip {
	background: var(--avuds-white);
	border-radius: var(--avuds-radius);
	box-shadow: var(--avuds-shadow);
	padding: 18px 12px 14px;
	text-align: center;
	border-top: 4px solid var(--avuds-blue);
}

.avuds-db-chip--ok { border-top-color: #2e9e5b; }
.avuds-db-chip--warn { border-top-color: #e6a817; }
.avuds-db-chip--bad { border-top-color: #d64545; }

.avuds-db-chip__num {
	display: block;
	font-size: 1.7rem;
	font-weight: 800;
	color: var(--avuds-blue-dark);
	line-height: 1.1;
}

.avuds-db-chip__num small { font-size: 0.85rem; font-weight: 600; }

.avuds-db-chip__label {
	display: block;
	margin-top: 4px;
	font-size: 0.82rem;
	color: var(--avuds-text-muted);
	font-weight: 500;
}

/* Tarjetas de estadística sobre fondo oscuro (sección OMS) */
.avuds-stat-card {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: var(--avuds-radius-lg);
	padding: 28px 24px;
	text-align: center;
	color: #ffffff;
}

.avuds-stat-card__num {
	display: block;
	font-size: 2.6rem;
	font-weight: 800;
	line-height: 1.1;
	color: #ffffff;
}

.avuds-stat-card__src {
	display: block;
	margin-top: 6px;
	font-weight: 700;
	font-size: 1rem;
	color: #ffffff;
}

.avuds-stat-card__sub {
	display: block;
	margin-top: 4px;
	font-size: 0.88rem;
	color: rgba(255, 255, 255, 0.75);
}

/* Callout destacado (dato clave) */
.avuds-callout {
	background: var(--avuds-blue-xlight);
	border-left: 4px solid var(--avuds-blue);
	border-radius: var(--avuds-radius);
	padding: 20px 24px;
	margin: 24px 0;
	font-size: 1.02rem;
}

/* QRs de descarga de apps (página Ruido y ley) */
.avuds-qr-apps {
	display: flex;
	gap: 32px;
	justify-content: center;
	flex-wrap: wrap;
	margin: 24px 0;
}

.avuds-qr-apps figure {
	margin: 0;
	text-align: center;
	background: #ffffff;
	border: 1px solid var(--avuds-border);
	border-radius: 12px;
	padding: 16px 20px 12px;
}

.avuds-qr-apps img {
	width: 150px;
	height: 150px;
	display: block;
	margin: 0 auto;
}

.avuds-qr-apps figcaption {
	margin-top: 8px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--avuds-text-muted);
}

/* Tablas de niveles de ruido (página Ruido y ley) */
.avuds-tabla-ruido table {
	border-collapse: collapse;
	width: 100%;
	font-size: 0.95rem;
}

.avuds-tabla-ruido th {
	background: var(--avuds-blue-dark);
	color: #ffffff;
	padding: 12px 14px;
	text-align: left;
}

.avuds-tabla-ruido td {
	padding: 11px 14px;
	border-bottom: 1px solid var(--avuds-border);
}

.avuds-tabla-ruido tbody tr:nth-child(even) {
	background: rgba(21, 101, 192, 0.05);
}

/* ============================================
   SECCIONES DE CONTENIDO
   ============================================ */

.avuds-section {
	padding: 80px 24px;
}

.avuds-section--light {
	background: var(--avuds-white);
}

.avuds-section--soft {
	background: var(--avuds-bg);
}

.avuds-section--blue {
	background: var(--avuds-blue-xlight);
	border-top: 4px solid var(--avuds-blue);
}

.avuds-section--dark {
	background: linear-gradient(135deg, var(--avuds-blue-dark) 0%, #0a2d5a 100%);
	color: white;
}

.avuds-container {
	max-width: 1100px;
	margin: 0 auto;
}

.avuds-section-label {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--avuds-blue);
	background: var(--avuds-blue-light);
	padding: 5px 14px;
	border-radius: 50px;
	margin-bottom: 1rem;
}

.avuds-section--dark .avuds-section-label {
	color: white;
	background: rgba(255,255,255,0.15);
}

.avuds-section-title {
	font-size: clamp(1.6rem, 3.5vw, 2.4rem);
	font-weight: 800;
	color: var(--avuds-blue-dark);
	line-height: 1.2;
	letter-spacing: -0.025em;
	margin-bottom: 1rem;
}

.avuds-section--dark .avuds-section-title {
	color: white !important;
}

.avuds-section-subtitle {
	font-size: 1.05rem;
	color: var(--avuds-text-muted);
	line-height: 1.75;
	max-width: 640px;
}

.avuds-section--dark .avuds-section-subtitle {
	color: rgba(255,255,255,0.8) !important;
}

/* ============================================
   GRID DE CARDS
   ============================================ */

.avuds-grid {
	display: grid;
	gap: 24px;
}

.avuds-grid--2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }

/* 2×2 fijo: para grupos de exactamente 4 cards (auto-fit metía 3 columnas
   y dejaba la cuarta card sola con dos huecos) */
.avuds-grid--2x2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 768px) {
	.avuds-grid--2x2 { grid-template-columns: 1fr; }
}
.avuds-grid--3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.avuds-grid--4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

.avuds-card {
	background: var(--avuds-white);
	border-radius: var(--avuds-radius-lg);
	padding: 36px 32px;
	box-shadow: var(--avuds-shadow);
	border-top: 4px solid var(--avuds-blue);
	transition: transform var(--avuds-transition), box-shadow var(--avuds-transition);
	position: relative;
	overflow: hidden;
}

.avuds-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--avuds-blue) 0%, var(--avuds-blue-mid) 100%);
}

.avuds-card:hover {
	transform: translateY(-6px);
	box-shadow: var(--avuds-shadow-lg);
}

.avuds-card__icon {
	font-size: 2.8rem;
	line-height: 1;
	margin-bottom: 1.25rem;
	display: block;
}

.avuds-card__title {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--avuds-blue-dark) !important;
	margin-bottom: 0.75rem;
	line-height: 1.3;
}

.avuds-card__text {
	font-size: 0.95rem;
	color: var(--avuds-text-muted) !important;
	line-height: 1.7;
	margin: 0;
}

/* Card variante oscura */
.avuds-card--dark {
	background: rgba(255,255,255,0.06);
	border-top: none;
	border: 1px solid rgba(255,255,255,0.12);
	backdrop-filter: blur(10px);
}
.avuds-card--dark::before { display: none; }
.avuds-card--dark .avuds-card__title { color: white !important; }
.avuds-card--dark .avuds-card__text  { color: rgba(255,255,255,0.75) !important; }
.avuds-card--dark:hover {
	background: rgba(255,255,255,0.1);
	border-color: rgba(255,255,255,0.25);
}

/* ============================================
   LISTA DE OBJETIVOS / CHECKMARKS
   ============================================ */

.avuds-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.avuds-list li {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 20px;
	background: var(--avuds-blue-xlight);
	border-radius: var(--avuds-radius);
	border-left: 3px solid var(--avuds-blue);
	font-size: 0.97rem;
	color: var(--avuds-text) !important;
	font-weight: 500;
	transition: background var(--avuds-transition);
}

.avuds-list li:hover {
	background: var(--avuds-blue-light);
}

.avuds-list li::before {
	content: '✓';
	color: var(--avuds-blue);
	font-weight: 800;
	font-size: 0.9rem;
	flex-shrink: 0;
	margin-top: 1px;
}

/* ============================================
   BOTONES
   ============================================ */

.avuds-btn,
.avuds-btn-primary,
.avuds-btn-secondary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--avuds-font) !important;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none !important;
	border-radius: 50px;
	padding: 14px 32px;
	transition: all var(--avuds-transition);
	cursor: pointer;
	letter-spacing: 0.01em;
}

.avuds-btn-primary {
	background: var(--avuds-blue);
	color: white !important;
	box-shadow: 0 4px 20px rgba(21,101,192,0.35);
}
.avuds-btn-primary:hover {
	background: var(--avuds-blue-dark);
	color: white !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 30px rgba(21,101,192,0.45);
}

.avuds-btn-secondary {
	background: transparent;
	color: white !important;
	border: 2px solid rgba(255,255,255,0.65);
}
.avuds-btn-secondary:hover {
	background: rgba(255,255,255,0.12);
	border-color: white;
	color: white !important;
}

.avuds-btn-outline {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--avuds-font) !important;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none !important;
	border-radius: 50px;
	padding: 13px 32px;
	border: 2px solid var(--avuds-blue);
	color: var(--avuds-blue) !important;
	background: transparent;
	transition: all var(--avuds-transition);
}
.avuds-btn-outline:hover {
	background: var(--avuds-blue);
	color: white !important;
	transform: translateY(-2px);
}

/* ============================================
   STAT / NÚMERO DESTACADO
   ============================================ */

.avuds-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 24px;
	text-align: center;
}

.avuds-stat__number {
	display: block;
	font-size: 2.8rem;
	font-weight: 800;
	color: var(--avuds-blue);
	line-height: 1;
	margin-bottom: 6px;
}

.avuds-stat__label {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--avuds-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ============================================
   SECCIÓN CTA
   ============================================ */

.avuds-cta-block {
	background: linear-gradient(135deg, var(--avuds-blue-dark) 0%, var(--avuds-blue) 100%);
	border-radius: var(--avuds-radius-lg);
	padding: 60px 40px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.avuds-cta-block::after {
	content: '';
	position: absolute;
	top: -40%;
	right: -10%;
	width: 400px;
	height: 400px;
	background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
	border-radius: 50%;
	pointer-events: none;
}

.avuds-cta-block h2 {
	color: white !important;
	margin-bottom: 1rem;
}

.avuds-cta-block p {
	color: rgba(255,255,255,0.85) !important;
	font-size: 1.05rem;
	margin-bottom: 2rem;
	max-width: 520px;
	margin-left: auto;
	margin-right: auto;
}

/* ============================================
   FORMULARIOS
   ============================================ */

.ff-el-input--content input,
.ff-el-input--content textarea,
.ff-el-input--content select,
.frm_forms input,
.frm_forms textarea {
	font-family: var(--avuds-font) !important;
	border: 2px solid var(--avuds-border) !important;
	border-radius: var(--avuds-radius) !important;
	padding: 12px 16px !important;
	font-size: 0.95rem !important;
	transition: border-color var(--avuds-transition), box-shadow var(--avuds-transition) !important;
	background: var(--avuds-white) !important;
	color: var(--avuds-text) !important;
}

.ff-el-input--content input:focus,
.ff-el-input--content textarea:focus {
	border-color: var(--avuds-blue) !important;
	box-shadow: 0 0 0 4px rgba(21,101,192,0.12) !important;
	outline: none !important;
}

.ff-btn-submit,
.ff-btn {
	font-family: var(--avuds-font) !important;
	background: var(--avuds-blue) !important;
	color: white !important;
	border-radius: 50px !important;
	padding: 13px 32px !important;
	font-weight: 700 !important;
	border: none !important;
	cursor: pointer !important;
	transition: all var(--avuds-transition) !important;
}

.ff-btn-submit:hover,
.ff-btn:hover {
	background: var(--avuds-blue-dark) !important;
	transform: translateY(-2px) !important;
}

/* ============================================
   PÁGINAS INTERIORES
   ============================================ */

.entry-title,
.page-title {
	font-size: clamp(1.8rem, 4vw, 2.8rem) !important;
	font-weight: 800 !important;
	color: var(--avuds-blue-dark) !important;
	letter-spacing: -0.03em;
}

/* Hero interior simple */
.avuds-page-hero {
	background: linear-gradient(135deg, var(--avuds-blue-dark) 0%, var(--avuds-blue) 100%);
	padding: 70px 24px 80px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.avuds-page-hero::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: 0;
	width: 100%;
	height: 60px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60'%3E%3Cpath fill='%23f8fafc' d='M0,40 C480,70 960,10 1440,40 L1440,60 L0,60Z'/%3E%3C/svg%3E") no-repeat bottom;
	background-size: cover;
}

.avuds-page-hero h1 {
	color: white !important;
	margin-bottom: 0.75rem;
}

.avuds-page-hero p {
	color: rgba(255,255,255,0.85) !important;
	font-size: 1.1rem;
	max-width: 520px;
	margin: 0 auto;
}

/* ============================================
   PÁGINA NOTICIAS — bloque asociación + prensa
   ============================================ */

.avuds-news-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 28px;
	margin-top: 2.5rem;
}

.avuds-news-card {
	background: var(--avuds-white);
	border-radius: var(--avuds-radius-lg);
	overflow: hidden;
	box-shadow: var(--avuds-shadow);
	transition: transform var(--avuds-transition), box-shadow var(--avuds-transition);
	display: flex;
	flex-direction: column;
}

.avuds-news-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--avuds-shadow-lg);
}

.avuds-news-card__img {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.avuds-news-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.avuds-news-card__body {
	padding: 22px 24px 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}

.avuds-news-card__fecha {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--avuds-blue);
}

.avuds-news-card__titulo {
	font-size: 1.12rem;
	line-height: 1.35;
	margin: 0;
}

.avuds-news-card__titulo a {
	color: var(--avuds-blue-dark);
}

.avuds-news-card__resumen {
	font-size: 0.92rem;
	margin: 0;
	flex: 1;
}

.avuds-news-card__leer {
	font-size: 0.9rem;
	font-weight: 700;
	margin-top: 4px;
}

/* Recortes de prensa: tarjetas compactas que enlazan al periódico */
.avuds-prensa-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
	gap: 18px;
	margin-top: 2.5rem;
}

.avuds-prensa-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: var(--avuds-white);
	border: 1px solid var(--avuds-border);
	border-left: 4px solid var(--avuds-blue);
	border-radius: var(--avuds-radius);
	padding: 18px 20px;
	overflow: hidden;
	transition: transform var(--avuds-transition), box-shadow var(--avuds-transition);
}

/* Miniatura del artículo (imagen destacada subida por el monitor); los
   márgenes negativos la llevan a sangre y el overflow:hidden de la
   tarjeta recorta las esquinas con el radio del borde */
.avuds-prensa-card__img {
	display: block;
	margin: -18px -20px 6px;
	height: 132px;
	overflow: hidden;
}

.avuds-prensa-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform var(--avuds-transition);
}

.avuds-prensa-card:hover .avuds-prensa-card__img img {
	transform: scale(1.04);
}

.avuds-prensa-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--avuds-shadow);
}

.avuds-prensa-card__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.avuds-prensa-card__fuente {
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--avuds-blue);
	background: var(--avuds-blue-light);
	padding: 3px 10px;
	border-radius: 50px;
}

.avuds-prensa-card__fecha {
	font-size: 0.78rem;
	color: var(--avuds-text-muted);
	white-space: nowrap;
}

.avuds-prensa-card__titulo {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.35;
	color: var(--avuds-blue-dark);
}

.avuds-prensa-card__resumen {
	font-size: 0.88rem;
	line-height: 1.6;
	color: var(--avuds-text-muted);
	flex: 1;
}

.avuds-prensa-card__leer {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--avuds-blue);
	margin-top: 2px;
}

.avuds-bloque-vacio {
	margin-top: 2rem;
	padding: 24px;
	background: var(--avuds-blue-xlight);
	border-radius: var(--avuds-radius);
	text-align: center;
}

/* ============================================
   SEPARADORES / DIVIDERS
   ============================================ */

.avuds-divider {
	border: none;
	height: 4px;
	background: linear-gradient(90deg, var(--avuds-blue) 0%, var(--avuds-blue-mid) 50%, transparent 100%);
	border-radius: 2px;
	margin: 48px 0;
	max-width: 80px;
}

.avuds-divider--center {
	margin-left: auto;
	margin-right: auto;
}

/* ============================================
   BADGE / ETIQUETA
   ============================================ */

.avuds-badge {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 5px 14px;
	border-radius: 50px;
}

.avuds-badge--blue {
	background: var(--avuds-blue-light);
	color: var(--avuds-blue);
}

.avuds-badge--dark {
	background: rgba(255,255,255,0.15);
	color: white;
}

/* ============================================
   BLOCKSY OVERRIDES — Ajustes del tema base
   ============================================ */

/* Contenido principal */
.ct-container {
	max-width: 1180px;
}

/* Posts / blog */
.ct-post-card {
	border-radius: var(--avuds-radius-lg) !important;
	overflow: hidden;
	box-shadow: var(--avuds-shadow) !important;
	transition: transform var(--avuds-transition), box-shadow var(--avuds-transition) !important;
}

.ct-post-card:hover {
	transform: translateY(-4px) !important;
	box-shadow: var(--avuds-shadow-lg) !important;
}

/* Paginación */
.ct-pagination .page-numbers {
	border-radius: 8px !important;
	font-weight: 600 !important;
}

.ct-pagination .page-numbers.current {
	background: var(--avuds-blue) !important;
	color: white !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
	.avuds-hero {
		padding: 80px 20px 120px;
		min-height: auto;
	}

	.avuds-section {
		padding: 56px 20px;
	}

	.avuds-card {
		padding: 28px 24px;
	}

	.avuds-cta-block {
		padding: 48px 24px;
	}

	.avuds-hero__ctas {
		flex-direction: column;
		align-items: center;
	}

	.avuds-btn,
	.avuds-btn-primary,
	.avuds-btn-secondary,
	.avuds-btn-outline {
		width: 100%;
		justify-content: center;
		max-width: 320px;
	}
}

@media (max-width: 480px) {
	.avuds-hero h1 {
		font-size: 2rem !important;
	}

	.avuds-meter__read { font-size: 0.76rem; }

	.avuds-grid--3,
	.avuds-grid--4 {
		grid-template-columns: 1fr;
	}
}