/* ==========================================================================
   HackDevNet · sistema de diseño
   Monocromo (misma paleta que los documentos corporativos) + DM Sans.
   Las reglas van con dos clases (.hdn-x .hdn-y) para ganar a los estilos globales
   de Astra, que se cargan después.
   ========================================================================== */

@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans.woff2") format("woff2");
	font-weight: 400 700;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "DM Sans";
	src: url("../fonts/DMSans-Italic.woff2") format("woff2");
	font-weight: 400 700;
	font-style: italic;
	font-display: swap;
}

/* JetBrains Mono (SIL OFL 1.1), subconjunto latino: detalles «de código» (Inicio, blog). Se descarga solo donde se usa. */
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "JetBrains Mono"; src: url("../fonts/JetBrainsMono-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

/* --- Tokens --------------------------------------------------------------- */
:root {
	--hdn-carbon: #262626;
	--hdn-tinta: #1A1A1A;
	--hdn-texto: #333333;
	--hdn-gris: #6B6B6B;
	--hdn-gris2: #9A9A9A;
	--hdn-panel: #F2F2F2;
	--hdn-linea: #D9D9D9;
	--hdn-blanco: #FFFFFF;
	--hdn-sobre-oscuro: #CFCFCF;          /* texto secundario sobre carbón */
	--hdn-linea-oscura: rgba(255, 255, 255, .14);

	--hdn-fuente: "DM Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--hdn-t-xs: .8125rem;   /* 13 */
	--hdn-t-s: .9375rem;    /* 15 */
	--hdn-t-m: 1.0625rem;   /* 17 */
	--hdn-t-l: 1.375rem;    /* 22 */
	--hdn-t-xl: clamp(1.75rem, 1.2rem + 2vw, 2.5rem);
	--hdn-t-xxl: clamp(2.25rem, 1.4rem + 3.6vw, 4rem);

	--hdn-e1: .25rem; --hdn-e2: .5rem; --hdn-e3: .75rem; --hdn-e4: 1rem;
	--hdn-e5: 1.5rem; --hdn-e6: 2rem; --hdn-e7: 3rem; --hdn-e8: 4.5rem; --hdn-e9: 6rem;

	--hdn-ancho: 1200px;
	--hdn-margen: clamp(1rem, .5rem + 2vw, 2rem);
	--hdn-radio: 2px;
	--hdn-sombra: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .08);
	--hdn-alto-cabecera: 76px;
	--hdn-transicion: .18s ease;
}
@media (max-width: 1023px) {
	:root { --hdn-alto-cabecera: 64px; }
}

/* --- Base de los bloques del tema --------------------------------------- */
.hdn-cabecera, .hdn-pie, .hdn-whatsapp, .hdn-pagina, .hdn-llamado {
	font-family: var(--hdn-fuente);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.hdn-cabecera *, .hdn-pie *, .hdn-pagina *, .hdn-llamado * { box-sizing: border-box; }
.hdn-contenedor {
	width: 100%;
	max-width: calc(var(--hdn-ancho) + 2 * var(--hdn-margen));
	margin-inline: auto;
	padding-inline: var(--hdn-margen);
}
.hdn-ico { width: 1.25em; height: 1.25em; flex: none; display: inline-block; vertical-align: middle; }

/* Foco visible y consistente (teclado). */
.hdn-cabecera :focus-visible, .hdn-pie :focus-visible, .hdn-pagina :focus-visible, .hdn-llamado :focus-visible, .hdn-whatsapp:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
	border-radius: var(--hdn-radio);
}

/* --- Botones -------------------------------------------------------------- */
.hdn .hdn-boton {
	display: inline-flex; align-items: center; justify-content: center; gap: .55em;
	min-height: 46px; padding: 0 1.35rem;
	font: 600 var(--hdn-t-s)/1 var(--hdn-fuente); letter-spacing: .01em;
	color: var(--hdn-blanco); background: var(--hdn-carbon);
	border: 1px solid var(--hdn-carbon); border-radius: var(--hdn-radio);
	text-decoration: none; cursor: pointer;
	transition: background var(--hdn-transicion), color var(--hdn-transicion), border-color var(--hdn-transicion);
}
.hdn .hdn-boton:hover { background: var(--hdn-tinta); border-color: var(--hdn-tinta); color: var(--hdn-blanco); }
.hdn .hdn-boton .hdn-ico { width: 1.1em; height: 1.1em; transition: transform var(--hdn-transicion); }
.hdn .hdn-boton:hover .hdn-ico:last-child { transform: translateX(3px); }   /* la flecha; no el ícono inicial */
.hdn .hdn-boton--contorno { background: transparent; color: var(--hdn-tinta); }
.hdn .hdn-boton--contorno:hover { background: var(--hdn-tinta); color: var(--hdn-blanco); }
.hdn .hdn-boton--blanco { background: var(--hdn-blanco); color: var(--hdn-tinta); border-color: var(--hdn-blanco); }
.hdn .hdn-boton--blanco:hover { background: var(--hdn-panel); border-color: var(--hdn-panel); color: var(--hdn-tinta); }
.hdn .hdn-boton--fantasma { background: transparent; color: var(--hdn-blanco); border-color: rgba(255, 255, 255, .4); }
.hdn .hdn-boton--fantasma:hover { background: var(--hdn-blanco); color: var(--hdn-tinta); border-color: var(--hdn-blanco); }

/* --- Franja «EN VIVO» (un webinar transmitiéndose; inc/webinars.php) ------- */
.hdn .hdn-franja-vivo {
	display: flex; align-items: center; justify-content: center; gap: .6rem; flex-wrap: wrap;
	padding: .55rem var(--hdn-margen); background: var(--hdn-tinta); color: var(--hdn-blanco);
	font: 400 var(--hdn-t-xs)/1.3 var(--hdn-fuente); text-decoration: none;
}
.hdn .hdn-franja-vivo:hover { color: var(--hdn-blanco); }
.hdn .hdn-franja-vivo strong { font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hdn .hdn-franja-vivo__titulo { color: var(--hdn-sobre-oscuro); }
.hdn .hdn-franja-vivo__ir { display: inline-flex; align-items: center; gap: .3em; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.hdn .hdn-franja-vivo .hdn-ico { width: 1em; height: 1em; }
.hdn-punto-vivo {
	display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #E5484D; vertical-align: .05em;
	box-shadow: 0 0 0 0 rgba(229, 72, 77, .6); animation: hdn-vivo 1.8s ease-out infinite;
}
@keyframes hdn-vivo { 70% { box-shadow: 0 0 0 8px rgba(229, 72, 77, 0); } 100% { box-shadow: 0 0 0 0 rgba(229, 72, 77, 0); } }
@media (prefers-reduced-motion: reduce) { .hdn-punto-vivo { animation: none; } }

/* --- Cabecera ------------------------------------------------------------- */
.hdn-cabecera {
	position: sticky; top: 0; z-index: 1000;
	background: var(--hdn-blanco);
	border-bottom: 1px solid var(--hdn-linea);
	transition: box-shadow var(--hdn-transicion);
}
.admin-bar .hdn-cabecera { top: 32px; }
@media (max-width: 782px) { .admin-bar .hdn-cabecera { top: 46px; } }
@media (max-width: 600px) { .admin-bar .hdn-cabecera { top: 0; } }
.hdn-cabecera.es-desplazada { box-shadow: 0 6px 20px rgba(0, 0, 0, .07); }

.hdn-cabecera .hdn-cabecera__fila {
	display: flex; align-items: center; justify-content: space-between; gap: var(--hdn-e6);
	height: var(--hdn-alto-cabecera);
}
.hdn-cabecera .hdn-cabecera__logo { display: block; flex: none; line-height: 0; }
.hdn-cabecera .hdn-cabecera__logo img { height: 38px; width: auto; }
@media (max-width: 1023px) { .hdn-cabecera .hdn-cabecera__logo img { height: 32px; } }

/* Reinicio de botones (Astra les da fondo, borde y relleno). */
.hdn-cabecera button.hdn-cabecera__abrir,
.hdn-cabecera button.hdn-menu__cerrar,
.hdn-cabecera button.hdn-menu__enlace {
	appearance: none; background: none; border: 0; border-radius: 0; box-shadow: none;
	padding: 0; margin: 0; color: inherit; font: inherit; letter-spacing: inherit; text-transform: none;
	cursor: pointer;
}
.hdn-cabecera button.hdn-cabecera__abrir:hover,
.hdn-cabecera button.hdn-menu__cerrar:hover,
.hdn-cabecera button.hdn-menu__enlace:hover { background: none; color: inherit; }
.hdn-cabecera button.hdn-menu__enlace { padding: 0 .85rem; }   /* mismo relleno que los enlaces del menú */

/* Menú — escritorio */
.hdn-cabecera .hdn-menu { display: flex; align-items: center; gap: var(--hdn-e6); }
.hdn-cabecera .hdn-menu__cabeza, .hdn-cabecera .hdn-menu__pie, .hdn-cabecera .hdn-cabecera__abrir { display: none; }
.hdn-cabecera .hdn-menu__lista { display: flex; align-items: center; gap: var(--hdn-e1); list-style: none; margin: 0; padding: 0; }
.hdn-cabecera .hdn-menu__item { position: relative; margin: 0; }
.hdn-cabecera .hdn-menu__enlace {
	display: inline-flex; align-items: center; gap: .3em;
	height: var(--hdn-alto-cabecera); padding: 0 .85rem;
	font: 500 var(--hdn-t-s)/1 var(--hdn-fuente); color: var(--hdn-texto);
	text-decoration: none; position: relative;
}
.hdn-cabecera .hdn-menu__enlace::after {
	content: ""; position: absolute; left: .85rem; right: .85rem; bottom: 22px; height: 2px;
	background: var(--hdn-carbon); transform: scaleX(0); transform-origin: left;
	transition: transform var(--hdn-transicion);
}
.hdn-cabecera .hdn-menu__enlace:hover, .hdn-cabecera .es-actual > .hdn-menu__enlace { color: var(--hdn-tinta); }
.hdn-cabecera .hdn-menu__enlace:hover::after, .hdn-cabecera .es-actual > .hdn-menu__enlace::after { transform: scaleX(1); }
.hdn-cabecera .hdn-menu__flecha { width: 1em; height: 1em; transition: transform var(--hdn-transicion); }
.hdn-cabecera [aria-expanded="true"] > .hdn-menu__flecha { transform: rotate(180deg); }
.hdn-cabecera .hdn-menu__cta { margin-left: var(--hdn-e2); }

/* Submenú — panel desplegable */
.hdn-cabecera .hdn-submenu {
	position: absolute; top: calc(100% - 8px); left: -.5rem; z-index: 10;
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hdn-e1);
	width: 560px; margin: 0; padding: var(--hdn-e3); list-style: none;
	background: var(--hdn-blanco); border: 1px solid var(--hdn-linea); border-radius: var(--hdn-radio);
	box-shadow: var(--hdn-sombra);
	opacity: 0; visibility: hidden; transform: translateY(6px);
	transition: opacity var(--hdn-transicion), transform var(--hdn-transicion), visibility var(--hdn-transicion);
}
.hdn-cabecera .hdn-submenu li { margin: 0; }
.hdn-cabecera .hdn-menu__item--sub:hover > .hdn-submenu,
.hdn-cabecera .hdn-menu__item--sub:focus-within > .hdn-submenu,
.hdn-cabecera .hdn-menu__item--sub.esta-abierto > .hdn-submenu { opacity: 1; visibility: visible; transform: none; }
.hdn-cabecera .hdn-submenu__enlace {
	display: block; padding: var(--hdn-e3) var(--hdn-e4); border-radius: var(--hdn-radio);
	text-decoration: none; transition: background var(--hdn-transicion);
}
.hdn-cabecera .hdn-submenu__enlace:hover, .hdn-cabecera .hdn-submenu__enlace[aria-current] { background: var(--hdn-panel); }
.hdn-cabecera .hdn-submenu__titulo { display: block; font: 600 var(--hdn-t-s)/1.3 var(--hdn-fuente); color: var(--hdn-tinta); }
.hdn-cabecera .hdn-submenu__desc { display: block; margin-top: .25rem; font: 400 var(--hdn-t-xs)/1.4 var(--hdn-fuente); color: var(--hdn-gris); }

/* Mega menú de servicios: panel ancho alineado a la derecha de la cabecera. */
.hdn-cabecera .hdn-cabecera__fila { position: relative; }
.hdn-cabecera .hdn-menu__item--mega { position: static; }
.hdn-cabecera .hdn-submenu.hdn-mega {
	grid-template-columns: minmax(0, 1fr); left: auto; right: var(--hdn-margen);
	width: min(880px, calc(100% - 2 * var(--hdn-margen))); padding: var(--hdn-e5) var(--hdn-e6);
}
.hdn-cabecera .hdn-mega__grupos {
	display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: var(--hdn-e5);
	list-style: none; margin: 0; padding: 0;
}
.hdn-cabecera .hdn-mega__grupo { margin: 0; }
.hdn-cabecera .hdn-mega__grupo ul { display: grid; gap: 2px; list-style: none; margin: 0; padding: 0; }
.hdn-cabecera .hdn-mega__grupo li { margin: 0; }
.hdn-cabecera .hdn-mega__titulo {
	display: block; margin-bottom: var(--hdn-e3);
	font: 600 .75rem/1.2 var(--hdn-fuente); letter-spacing: .14em; text-transform: uppercase;
	color: var(--hdn-gris); text-decoration: none;
}
.hdn-cabecera .hdn-mega__titulo:hover { color: var(--hdn-tinta); }
.hdn-cabecera .hdn-mega__enlace {
	display: block; margin-inline: -.6rem; padding: .45rem .6rem; border-radius: var(--hdn-radio);
	font: 500 var(--hdn-t-s)/1.35 var(--hdn-fuente); color: var(--hdn-tinta); text-decoration: none;
	transition: background var(--hdn-transicion);
}
.hdn-cabecera .hdn-mega__enlace:hover, .hdn-cabecera .hdn-mega__enlace[aria-current] { background: var(--hdn-panel); }
.hdn-cabecera .hdn-mega__todos {
	display: flex; align-items: center; gap: .4em; margin-top: var(--hdn-e5); padding-top: var(--hdn-e4);
	border-top: 1px solid var(--hdn-linea);
	font: 600 var(--hdn-t-s)/1 var(--hdn-fuente); color: var(--hdn-tinta); text-decoration: none;
}
.hdn-cabecera .hdn-mega__todos .hdn-ico { width: 1em; height: 1em; transition: transform var(--hdn-transicion); }
.hdn-cabecera .hdn-mega__todos:hover .hdn-ico { transform: translateX(3px); }

/* Menú — móvil y tableta: panel a pantalla completa */
@media (max-width: 1023px) {
	.hdn-cabecera .hdn-cabecera__abrir {
		display: inline-grid; place-items: center; width: 44px; height: 44px; margin-right: -10px; color: var(--hdn-tinta);
	}
	.hdn-cabecera .hdn-cabecera__abrir .hdn-ico { width: 26px; height: 26px; }

	.hdn-cabecera .hdn-menu {
		position: fixed; inset: 0; z-index: 1001;
		flex-direction: column; align-items: stretch; gap: 0;
		padding: 0 var(--hdn-margen) var(--hdn-e6);
		background: var(--hdn-carbon); color: var(--hdn-blanco);
		overflow-y: auto; overscroll-behavior: contain;
		opacity: 0; visibility: hidden; transform: translateY(-8px);
		transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
	}
	.hdn-cabecera .hdn-menu.esta-abierto { opacity: 1; visibility: visible; transform: none; }
	.admin-bar .hdn-cabecera .hdn-menu { top: 46px; }

	.hdn-cabecera .hdn-menu__cabeza {
		display: flex; align-items: center; justify-content: space-between;
		height: var(--hdn-alto-cabecera); border-bottom: 1px solid var(--hdn-linea-oscura);
	}
	.hdn-cabecera .hdn-menu__cabeza img { height: 32px; width: auto; }
	.hdn-cabecera .hdn-menu__cerrar { display: inline-grid; place-items: center; width: 44px; height: 44px; margin-right: -10px; color: var(--hdn-blanco); }
	.hdn-cabecera button.hdn-menu__cerrar:hover { color: var(--hdn-blanco); }
	.hdn-cabecera .hdn-menu__cerrar .hdn-ico { width: 26px; height: 26px; }

	.hdn-cabecera .hdn-menu__lista { flex-direction: column; align-items: stretch; gap: 0; padding: var(--hdn-e4) 0; }
	.hdn-cabecera .hdn-menu__item { border-bottom: 1px solid var(--hdn-linea-oscura); }
	.hdn-cabecera .hdn-menu__enlace {
		width: 100%; height: auto; justify-content: space-between; padding: 1.1rem 0;
		font-size: 1.375rem; font-weight: 500; color: var(--hdn-blanco);
	}
	.hdn-cabecera button.hdn-menu__enlace { padding: 1.1rem 0; font-size: 1.375rem; font-weight: 500; }   /* el reinicio de botones les quitaba el tamaño */
	.hdn-cabecera button.hdn-menu__enlace:hover { color: var(--hdn-blanco); }
	.hdn-cabecera .hdn-menu__enlace:hover, .hdn-cabecera .es-actual > .hdn-menu__enlace { color: var(--hdn-blanco); }
	.hdn-cabecera .hdn-menu__enlace::after { display: none; }
	.hdn-cabecera .hdn-menu__flecha { width: 1.1em; height: 1.1em; }

	.hdn-cabecera .hdn-submenu {
		position: static; display: none; width: auto; grid-template-columns: 1fr;
		padding: 0 0 var(--hdn-e4); background: none; border: 0; box-shadow: none;
		opacity: 1; visibility: visible; transform: none;
	}
	.hdn-cabecera .hdn-menu__item--sub:hover > .hdn-submenu { display: none; }
	.hdn-cabecera .hdn-menu__item--sub.esta-abierto > .hdn-submenu { display: grid; }
	.hdn-cabecera .hdn-submenu__enlace { padding: var(--hdn-e3) 0; }
	.hdn-cabecera .hdn-submenu__enlace:hover, .hdn-cabecera .hdn-submenu__enlace[aria-current] { background: none; }
	.hdn-cabecera .hdn-submenu__titulo { color: var(--hdn-blanco); font-size: var(--hdn-t-m); }
	.hdn-cabecera .hdn-submenu__desc { color: var(--hdn-gris2); }

	/* Mega menú en el panel móvil: grupos apilados. */
	.hdn-cabecera .hdn-submenu.hdn-mega { right: auto; width: auto; padding: 0 0 var(--hdn-e4); }
	.hdn-cabecera .hdn-mega__grupos { grid-template-columns: 1fr; gap: var(--hdn-e5); }
	.hdn-cabecera .hdn-mega__titulo { color: var(--hdn-gris2); }
	.hdn-cabecera .hdn-mega__titulo:hover { color: var(--hdn-blanco); }
	.hdn-cabecera .hdn-mega__enlace { margin: 0; padding: .5rem 0; font-size: var(--hdn-t-m); color: var(--hdn-blanco); }
	.hdn-cabecera .hdn-mega__enlace:hover, .hdn-cabecera .hdn-mega__enlace[aria-current] {
		background: none; color: var(--hdn-blanco); text-decoration: underline; text-underline-offset: 4px;
	}
	.hdn-cabecera .hdn-mega__todos { border-top-color: var(--hdn-linea-oscura); color: var(--hdn-blanco); }

	.hdn .hdn-cabecera .hdn-menu__cta {
		margin: var(--hdn-e6) 0 0; min-height: 52px;
		background: var(--hdn-blanco); color: var(--hdn-tinta); border-color: var(--hdn-blanco);
	}
	.hdn-cabecera .hdn-menu__pie {
		display: grid; gap: var(--hdn-e3); margin-top: auto; padding-top: var(--hdn-e6);
	}
	.hdn-cabecera .hdn-menu__pie a {
		display: inline-flex; align-items: center; gap: .6em;
		font: 400 var(--hdn-t-s)/1.4 var(--hdn-fuente); color: var(--hdn-sobre-oscuro); text-decoration: none;
	}
	html.hdn-sin-scroll, html.hdn-sin-scroll body { overflow: hidden; }
}

/* --- Pie ----------------------------------------------------------------- */
.hdn-pie { background: var(--hdn-carbon); color: var(--hdn-sobre-oscuro); font-size: var(--hdn-t-s); line-height: 1.6; }
.hdn-pie .hdn-pie__rejilla {
	display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.3fr; gap: var(--hdn-e7) var(--hdn-e6);
	padding-block: var(--hdn-e8) var(--hdn-e7);
}
.hdn-pie .hdn-pie__marca img { width: 150px; height: auto; }
.hdn-pie .hdn-pie__lema {
	margin: var(--hdn-e5) 0 0; font: 300 var(--hdn-t-l)/1.3 var(--hdn-fuente); color: var(--hdn-blanco);
}
.hdn-pie .hdn-pie__titulo {
	margin: 0 0 var(--hdn-e4); padding: 0;
	font: 600 .75rem/1.2 var(--hdn-fuente); letter-spacing: .16em; text-transform: uppercase; color: var(--hdn-gris2);
}
.hdn-pie .hdn-pie__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--hdn-e2); }
.hdn-pie .hdn-pie__col li { margin: 0; }
.hdn-pie .hdn-pie__col a, .hdn-pie .hdn-pie__redes a {
	color: var(--hdn-sobre-oscuro); text-decoration: none; transition: color var(--hdn-transicion);
}
.hdn-pie .hdn-pie__col a:hover, .hdn-pie .hdn-pie__redes a:hover { color: var(--hdn-blanco); }
.hdn-pie .hdn-pie__contacto a, .hdn-pie .hdn-pie__contacto span { display: inline-flex; align-items: center; gap: .6em; }
.hdn-pie .hdn-pie__contacto .hdn-ico { width: 1.1em; height: 1.1em; opacity: .8; }

.hdn-pie .hdn-pie__legal { border-top: 1px solid var(--hdn-linea-oscura); font-size: var(--hdn-t-xs); color: var(--hdn-gris2); }
.hdn-pie .hdn-pie__legal-fila {
	display: flex; align-items: center; justify-content: space-between; gap: var(--hdn-e4);
	flex-wrap: wrap; padding-block: var(--hdn-e5);
}
.hdn-pie .hdn-pie__legal p { margin: 0; }
.hdn-pie .hdn-pie__legal p a { color: var(--hdn-gris2); text-decoration: underline; text-underline-offset: 3px; }
.hdn-pie .hdn-pie__legal p a:hover { color: var(--hdn-blanco); }
.hdn-pie .hdn-pie__redes { display: flex; gap: var(--hdn-e2); list-style: none; margin: 0; padding: 0; }
.hdn-pie .hdn-pie__redes a { display: inline-grid; place-items: center; width: 36px; height: 36px; }
.hdn-pie .hdn-pie__redes .hdn-ico { width: 18px; height: 18px; }

@media (max-width: 1023px) {
	.hdn-pie .hdn-pie__rejilla { grid-template-columns: 1fr 1fr; padding-block: var(--hdn-e7); }
	.hdn-pie .hdn-pie__marca { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
	.hdn-pie .hdn-pie__rejilla { grid-template-columns: 1fr; gap: var(--hdn-e6); }
	.hdn-pie .hdn-pie__marca img { width: 120px; }
	.hdn-pie .hdn-pie__legal-fila { flex-direction: column; align-items: flex-start; }
}

/* --- WhatsApp flotante (solo en páginas que no traen el suyo) ------------ */
.hdn-whatsapp {
	position: fixed; right: clamp(1rem, 2vw, 1.75rem); bottom: clamp(1rem, 2vw, 1.75rem); z-index: 999;
	display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%;
	background: var(--hdn-carbon); color: var(--hdn-blanco);
	box-shadow: 0 6px 20px rgba(0, 0, 0, .22);
	transition: transform var(--hdn-transicion), background var(--hdn-transicion);
}
.hdn-whatsapp:hover { background: var(--hdn-tinta); color: var(--hdn-blanco); transform: translateY(-2px); }
.hdn-whatsapp .hdn-ico { width: 26px; height: 26px; }

@media (prefers-reduced-motion: reduce) {
	.hdn-cabecera *, .hdn-pie *, .hdn-whatsapp { transition: none !important; }
}

/* Con el menú móvil abierto, la cabecera queda sobre todo (incluido el botón de WhatsApp). */
html.hdn-sin-scroll .hdn-cabecera { z-index: 100000; }
.hdn-cabecera button.hdn-cabecera__abrir:focus-visible,
.hdn-cabecera button.hdn-menu__cerrar:focus-visible { outline-offset: -2px; }

/* Botón «volver arriba» de Astra, en la paleta del sitio. */
.hdn #ast-scroll-top {
	width: 44px; height: 44px; line-height: 44px; padding: 0;
	background: var(--hdn-carbon); color: var(--hdn-blanco); border-radius: var(--hdn-radio);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .18);
}
.hdn #ast-scroll-top:hover { background: var(--hdn-tinta); }
.hdn #ast-scroll-top .ast-icon svg { fill: currentColor; width: 1em; }
.hdn-con-whatsapp #ast-scroll-top { bottom: calc(clamp(1rem, 2vw, 1.75rem) + 68px); right: calc(clamp(1rem, 2vw, 1.75rem) + 6px); }

/* Aviso de cookies de analítica (inc/analitica.php). Queda a la izquierda del botón de WhatsApp. */
.hdn-cookies {
	position: fixed; left: clamp(1rem, 2vw, 1.75rem); bottom: clamp(1rem, 2vw, 1.75rem); z-index: 1000;
	width: min(440px, calc(100% - 2rem - 72px));
	padding: var(--hdn-e5); border-top: 4px solid var(--hdn-blanco);
	background: var(--hdn-carbon); color: var(--hdn-sobre-oscuro);
	box-shadow: 0 10px 32px rgba(0, 0, 0, .28);
	font-size: var(--hdn-t-s); line-height: 1.55;
}
.hdn-cookies[hidden] { display: none; }
.hdn-cookies p { margin: 0 0 var(--hdn-e4); }
.hdn-cookies a { color: var(--hdn-blanco); text-decoration: underline; text-underline-offset: 3px; }
.hdn-cookies__botones { display: flex; flex-wrap: wrap; gap: var(--hdn-e3); }
.hdn-cookies__botones .hdn-boton { padding-block: .6rem; }
@media (max-width: 600px) {
	.hdn-cookies { left: 1rem; width: calc(100% - 2rem); bottom: calc(1rem + 56px + 1rem); }
}
.hdn-pie__cookies { background: none; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }