/* Tema Dialéktico: estilos que theme.json no cubre. Valores copiados del diseño en Elementor (oct 2026). */

/* La fuente pixel también con su nombre original: las páginas y el kit de Elementor piden
   font-family "Determination", que en producción declaraba Elementor Pro (Fuentes personalizadas).
   Sin esto, al quitar Elementor Pro esos títulos caen a una sans-serif. Mismo archivo que la de theme.json. */
@font-face {
	font-family: "Determination";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/determination.ttf") format("truetype");
}

/* Las piezas del sitio van pegadas, sin hueco entre cabecera, contenido y pie. */
.wp-site-blocks > * { margin-block-start: 0; }

/* Cabecera fija (medidas de producción a 1920 px: alto 65, contenido de 1644 px centrado) */
.dk-cabecera-fija {
	position: sticky;
	top: 0;
	z-index: 100;
}
.admin-bar .dk-cabecera-fija { top: 32px; }
@media (max-width: 782px) { .admin-bar .dk-cabecera-fija { top: 46px; } }

.dk-cabecera {
	min-height: 65px;
	/* Contenido al 90 % del ancho, como máximo 1644 px (Elementor: contenedor en caja) */
	padding: 0 calc((100% - min(90%, 1644px)) / 2);
	align-items: flex-start !important;
	gap: 0 !important;
}
/* Columnas de Elementor: 23 % logo, 54 % menú (centrado, puede ocupar dos líneas), 23 % redes */
.dk-cabecera > .dk-logo { flex: 0 0 23%; padding-top: 12px; }
.dk-cabecera > .dk-menu { flex: 0 0 54%; padding-top: 15px; padding-bottom: 10px; }
.dk-cabecera > .dk-redes { flex: 0 0 23%; justify-content: flex-end; padding: 21px 5px 0 0; }
.dk-cabecera > * { margin: 0; }
.dk-logo img { height: 38px; width: auto; display: block; }

/* Entrada de la cabecera al cargar cada página, como en Elementor (animaciones "lentas" de 2 s):
   logo bounceInLeft, menú zoomIn (en tableta y móvil, su botón) y redes bounceIn. */
@media (prefers-reduced-motion: no-preference) {
	.dk-cabecera > .dk-logo { animation: dk-entrada-izquierda 2s both; }
	.dk-cabecera > .dk-menu,
	.dk-cabecera > .dk-menu-boton { animation: dk-entrada-zoom 2s both; }
	.dk-cabecera > .dk-redes { animation: dk-entrada-rebote 2s both; }
}
@keyframes dk-entrada-izquierda {
	0%, 60%, 75%, 90%, 100% { animation-timing-function: cubic-bezier(.215, .61, .355, 1); }
	0% { opacity: 0; transform: translate3d(-3000px, 0, 0); }
	60% { opacity: 1; transform: translate3d(25px, 0, 0); }
	75% { transform: translate3d(-10px, 0, 0); }
	90% { transform: translate3d(5px, 0, 0); }
	100% { transform: none; }
}
@keyframes dk-entrada-zoom {
	from { opacity: 0; transform: scale3d(.3, .3, .3); }
	50% { opacity: 1; }
}
@keyframes dk-entrada-rebote {
	0%, 20%, 40%, 60%, 80%, 100% { animation-timing-function: cubic-bezier(.215, .61, .355, 1); }
	0% { opacity: 0; transform: scale3d(.3, .3, .3); }
	20% { transform: scale3d(1.1, 1.1, 1.1); }
	40% { transform: scale3d(.9, .9, .9); }
	60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); }
	80% { transform: scale3d(.97, .97, .97); }
	100% { opacity: 1; transform: none; }
}

/* Menú: Rubik 14/600 mayúsculas, #212121, fondo rojo en el activo y al pasar el cursor */
.dk-menu .wp-block-navigation-item__content {
	color: var(--wp--preset--color--texto);
	padding: 3px 8px;
	line-height: 2.4;
	text-decoration: none;
	transition: background-color 0.3s, color 0.3s;
}
/* El fondo rojo va en el elemento completo para cubrir también la flecha del submenú
   (en Elementor la flecha está dentro del enlace). */
.dk-menu .wp-block-navigation__container > .wp-block-navigation-item {
	transition: background-color 0.3s;
}
.dk-menu .wp-block-navigation__container > .wp-block-navigation-item:hover,
.dk-menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item {
	background-color: var(--wp--preset--color--rojo);
}
.dk-menu .wp-block-navigation__container > .wp-block-navigation-item:hover > :is(.wp-block-navigation-item__content, .wp-block-navigation__submenu-icon),
.dk-menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item > :is(.wp-block-navigation-item__content, .wp-block-navigation__submenu-icon) {
	color: var(--wp--preset--color--blanco);
}
/* Flecha de submenú: triángulo sólido como el de Elementor (10 px antes, 8 px después: elemento de 80 px en "Curso") */
.dk-menu .wp-block-navigation__submenu-icon {
	width: 5.4px;
	height: 14px;
	margin: 0 8px 0 10px;
	display: inline-flex;
	align-items: center;
}
.dk-menu .wp-block-navigation__submenu-icon svg { display: none; }
.wp-site-blocks .dk-menu .wp-block-navigation__submenu-icon { background: none; border: 0; box-shadow: none; padding: 0; color: inherit; }
.dk-menu .wp-block-navigation__submenu-icon::before {
	content: "";
	border-left: 5px solid currentColor;
	border-top: 4px solid transparent;
	border-bottom: 4px solid transparent;
}
.dk-menu .has-child > .wp-block-navigation-item__content { padding-right: 0; }
/* Desplegable: fondo #181818, texto blanco 12/500 */
.dk-menu .wp-block-navigation__submenu-container {
	background-color: var(--wp--preset--color--carbon) !important;
	border: 0 !important;
	min-width: 220px !important;
}
.dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: var(--wp--preset--color--blanco);
	font-size: 12px;
	font-weight: 500;
	padding: 13px 20px;
	line-height: 20px;
}
/* En el desplegable, el activo y el que está bajo el cursor van en #AF4B00 (no rojo), como en Elementor */
.dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
.dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	background-color: #AF4B00;
}

/* Redes de la cabecera: cuadros de 32 px, ícono de 23 px negro; rojo oscuro al pasar el cursor */
.dk-redes.wp-block-social-links { gap: 11px; }
.dk-redes .wp-social-link {
	width: 32px;
	height: 32px;
	border-radius: 10%;
	transition: background-color 0.3s;
}
.dk-redes .wp-social-link a { width: 32px; height: 32px; padding: 0; display: flex; align-items: center; justify-content: center; }
.dk-redes .wp-social-link svg { width: 26px; height: 26px; }
.dk-redes .wp-social-link-tiktok svg, .dk-redes .wp-social-link-facebook svg { width: 23px; height: 23px; }
/* X: el logotipo sólido (como en producción) en lugar del contorno de WordPress */
.dk-redes .wp-social-link-x svg { visibility: hidden; }
.dk-redes .wp-social-link-x a { position: relative; }
.dk-redes .wp-social-link-x a::before {
	content: "";
	position: absolute;
	inset: 5px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dk-redes .wp-social-link:hover {
	background-color: var(--wp--preset--color--rojo-oscuro) !important;
	color: var(--wp--preset--color--blanco) !important;
	transform: none;
}

/* Pie (producción: bloque negro de 230 px con contenido de 1120 px; franja gris de 53 px) */
.dk-pie { font-size: 16px; line-height: 1.6; padding: 0 !important; }
.dk-pie > * { margin-block-start: 0; }
/* .wp-site-blocks sube la especificidad por encima del kit de Elementor (.elementor-kit-9 a). */
.wp-site-blocks .dk-pie a { color: var(--wp--preset--color--blanco); text-decoration: none; }
.dk-pie-principal {
	max-width: 1120px;
	margin: 0 auto;
	padding: 10px 0 20px;
}
.dk-pie-logo { margin: 0 auto 29px !important; }
.dk-pie-logo, .dk-pie-logo a { line-height: 0; display: block; }
.dk-pie-logo img { width: 123px; height: auto; display: block; margin: 0 auto; }
.dk-pie-columnas { gap: 0 !important; margin: 0 !important; align-items: flex-start !important; }
.dk-pie-correo { margin: 0; padding-left: 10px; display: flex; align-items: center; }
.dk-pie-correo::before {
	content: "";
	width: 17px;
	height: 17px;
	margin-right: 4px;
	background: #B2ACAC;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M464 64H48C21.5 64 0 85.5 0 112v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zm0 48v40.8c-22.4 18.3-58.2 46.7-134.6 106.5-16.8 13.2-50.2 45.1-73.4 44.7-23.2.4-56.6-31.5-73.4-44.7C106.2 199.5 70.4 171.1 48 152.8V112h416zM48 400V214.4c22.9 18.3 55.4 43.9 104.9 82.6 21.9 17.2 60.1 55.2 103.1 55 42.7.2 80.5-37.2 103.1-54.9 49.5-38.8 82-64.4 104.9-82.7V400H48z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M464 64H48C21.5 64 0 85.5 0 112v288c0 26.5 21.5 48 48 48h416c26.5 0 48-21.5 48-48V112c0-26.5-21.5-48-48-48zm0 48v40.8c-22.4 18.3-58.2 46.7-134.6 106.5-16.8 13.2-50.2 45.1-73.4 44.7-23.2.4-56.6-31.5-73.4-44.7C106.2 199.5 70.4 171.1 48 152.8V112h416zM48 400V214.4c22.9 18.3 55.4 43.9 104.9 82.6 21.9 17.2 60.1 55.2 103.1 55 42.7.2 80.5-37.2 103.1-54.9 49.5-38.8 82-64.4 104.9-82.7V400H48z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dk-pie-enlaces { list-style: none; margin: 0; padding: 0; text-align: center; }
.dk-pie-enlaces li { margin: 0; }
.dk-pie-enlaces a { display: block; padding: 13px 20px; font-size: 15px; font-weight: 600; line-height: 20px; }
.dk-pie-mensaje { margin: 6px 0 0; }
.wp-site-blocks .dk-pie-mensaje a { font-size: 14px; font-weight: 600; letter-spacing: 1px; text-decoration: underline; }
.dk-pie-franja { padding: 10px 0 0 !important; min-height: 53px; }
.dk-pie-franja-interior { max-width: 1120px; margin: 0 auto; align-items: flex-start !important; }
.dk-pie-derechos { margin: 0; font-size: 13px; font-weight: 300; line-height: 1; color: rgba(255, 255, 255, 0.82); }
.dk-redes-pie.wp-block-social-links { gap: 24px; margin: 9px 0 0; }
.wp-site-blocks .dk-redes-pie .wp-social-link, .wp-site-blocks .dk-redes-pie .wp-social-link a { color: rgba(255, 255, 255, 0.84) !important; }
.dk-redes-pie .wp-social-link a { padding: 0; }
.dk-redes-pie .wp-social-link svg { width: 17px; height: 17px; }
/* Facebook en el pie: la "f" sola (como en producción), no el círculo */
.dk-redes-pie .wp-social-link-facebook svg { visibility: hidden; }
.dk-redes-pie .wp-social-link-facebook a { position: relative; }
.dk-redes-pie .wp-social-link-facebook a::before {
	content: "";
	position: absolute;
	inset: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dk-redes-pie .wp-social-link:hover { color: #E39292 !important; transform: none; }
@media (max-width: 781px) {
	.dk-pie-correo { justify-content: center; padding-left: 0; }
	.dk-pie-franja-interior { justify-content: center !important; text-align: center; padding: 0 10px; }
}

/* ===== Lección (medidas de producción a 1920 px) ===== */

/* Portada: 972 px de alto (354 en móvil); caja negra al 73 % de 952 px con el título en pixel de 80 px */
@media (max-width: 767px) { .dk-portada-leccion { min-height: 354px !important; } }
.dk-portada-leccion { padding: 0 !important; }
.dk-portada-leccion .wp-block-cover__image-background { image-rendering: pixelated; }
.dk-titulo-caja {
	background-color: rgba(0, 0, 0, 0.73);
	max-width: 952px !important;
	margin: 0 auto;
	padding: 10px;
}
.dk-titulo-caja .wp-block-post-title {
	margin: 0;
	font-family: var(--wp--preset--font-family--pixel);
	font-size: 80px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 2.9px;
	text-transform: uppercase;
}
@media (max-width: 1024px) { .dk-titulo-caja .wp-block-post-title { font-size: 35px; } }
@media (max-width: 767px) { .dk-titulo-caja .wp-block-post-title { font-size: 22px; line-height: 1.3; } }

/* Márgenes laterales como en Elementor: 10 px + 1 % del ancho a cada lado (el contenido se limita a 1087 px) */
.dk-leccion { padding: 0 calc(10px + 1%) 3rem; }
.dk-leccion > * { margin-block-start: 0; }

/* Títulos con la fuente pixelada (Elementor los dibuja en negrita sintética: peso 600) */
.dk-titulo-pixel,
.dk-siguenos-titulo,
.dk-comentarios-titulo {
	font-family: var(--wp--preset--font-family--pixel);
	font-weight: 600;
}

/* Bloque "Síguenos": avatar de 100 px montado 44 px sobre la portada */
.dk-siguenos { gap: 0 !important; }
.dk-autor { margin: -44px 0 0 !important; position: relative; z-index: 2; }
.dk-autor img {
	width: 100px;
	height: 100px;
	border: 5px solid var(--wp--preset--color--blanco);
	border-radius: 50%;
	display: block;
}
.dk-siguenos-titulo {
	margin: 20px 0 0 !important;
	font-size: 30px;
	line-height: 1;
	letter-spacing: normal;
	color: var(--wp--preset--color--negro);
	max-width: 917px;
}
@media (max-width: 1024px) { .dk-siguenos-titulo { font-size: 25px; } }
.dk-siguenos .dk-redes { margin-top: 11px !important; justify-content: center; }
.dk-siguenos .dk-redes.wp-block-social-links { gap: 10px; }

/* Compartir: título Rubik 16/600; tres cuadros rojos de 45x42 separados 100 px */
.dk-compartir { margin: 21px 0 0; text-align: center; }
.dk-compartir-titulo { display: block; font-size: 16px; font-weight: 600; line-height: 1; color: var(--wp--preset--color--negro); }
.dk-compartir-botones { display: flex; justify-content: center; gap: 100px; margin-top: 14px; line-height: 0; }
.wp-site-blocks .dk-compartir-boton {
	width: 45px;
	height: 42px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--wp--preset--color--rojo);
	color: var(--wp--preset--color--blanco);
	transition: background-color 0.3s;
}
.dk-compartir-boton svg { height: 28px; width: auto; }
.wp-site-blocks .dk-compartir-boton:hover { background: #0C0C0C; }
@media (max-width: 767px) { .dk-compartir-botones { gap: 24px; } }

/* Índice: caja con borde negro de 1 px, título pixel de 27 px rojo, lista Rubik 16 px negra */
.dk-indice {
	border: 1px solid var(--wp--preset--color--negro);
	padding: 20px;
	margin: 8px calc(50% - 570px) 0 !important;
	max-width: none !important;
	width: 1140px;
	box-sizing: border-box;
}
.dk-indice summary {
	font-family: var(--wp--preset--font-family--pixel);
	font-weight: 600;
	color: var(--wp--preset--color--rojo);
	font-size: 27px;
	line-height: 1.2;
	letter-spacing: 1.7px;
	text-transform: uppercase;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.dk-indice summary::-webkit-details-marker { display: none; }
.dk-indice summary::after {
	content: "";
	flex: 0 0 auto;
	width: 0.9em;
	height: 1em;
	background: var(--wp--preset--color--negro);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M0 432V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48zm355.5-140.5l-123-123c-4.7-4.7-12.3-4.7-17 0l-123 123c-7.6 7.6-2.2 20.5 8.5 20.5h246c10.7 0 16.1-12.9 8.5-20.5z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M0 432V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48zm355.5-140.5l-123-123c-4.7-4.7-12.3-4.7-17 0l-123 123c-7.6 7.6-2.2 20.5 8.5 20.5h246c10.7 0 16.1-12.9 8.5-20.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dk-indice:not([open]) summary::after {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zM92.5 220.5l123 123c4.7 4.7 12.3 4.7 17 0l123-123c7.6-7.6 2.2-20.5-8.5-20.5H101c-10.7 0-16.1 12.9-8.5 20.5z'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M448 80v352c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V80c0-26.5 21.5-48 48-48h352c26.5 0 48 21.5 48 48zM92.5 220.5l123 123c4.7 4.7 12.3 4.7 17 0l123-123c7.6-7.6 2.2-20.5-8.5-20.5H101c-10.7 0-16.1 12.9-8.5 20.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.dk-indice ol { margin: 39px 0 0; padding-left: 19px; font-size: 16px; line-height: 1.6; color: var(--wp--preset--color--negro); }
.dk-indice li { margin: 0 0 7.6px; }
.dk-indice ol ol { margin: 7.6px 0 0; padding-left: 28px; list-style-type: decimal; }
.wp-site-blocks .dk-indice a { color: var(--wp--preset--color--negro); text-decoration: none; }
.wp-site-blocks .dk-indice a:hover { color: var(--wp--preset--color--rojo); text-decoration: underline; }
@media (max-width: 1180px) { .dk-indice { width: auto; margin-left: 0 !important; margin-right: 0 !important; } }
@media (max-width: 1024px) {
	.dk-indice summary { font-size: 20px; }
	.dk-indice li { font-size: 11px; }
}

/* Barra de progreso de lectura: pista gris de 17 px bajo la cabecera y relleno rojo ligado al scroll (solo CSS) */
.dk-progreso {
	position: sticky;
	top: 65px;
	z-index: 50;
	background: var(--wp--preset--color--blanco);
	padding: 10px 0 0;
	margin-top: 49px !important;
}
.admin-bar .dk-progreso { top: 97px; }
.dk-progreso-pista { height: 17px; background: #EEEEEE; border-radius: 4px; overflow: hidden; }
.dk-progreso-barra {
	height: 100%;
	background: var(--wp--preset--color--rojo);
	border-radius: 4px;
	transform-origin: 0 50%;
	transform: scaleX(0);
}
@supports (animation-timeline: scroll()) {
	.dk-progreso-barra { animation: dk-progreso linear both; animation-timeline: scroll(root); }
}
@keyframes dk-progreso { to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .dk-progreso { display: none; } }

/* Contenido: Rubik 20/32 negro, 1087 px */
/* 1.6em (no 1.6): como en Elementor, los bloques internos heredan 32 px fijos de interlineado */
.dk-contenido { font-size: 20px; line-height: 1.6em; color: var(--wp--preset--color--negro); margin-top: 0 !important; }
/* Espaciado igual que en producción (medido en 5 lecciones): párrafos y figuras 0/20 px; listas, separadores,
   KaTeX, código y espaciadores 0; títulos 8/16 px. El resto de bloques (p. ej. Quiz Maker) conserva sus propios márgenes. */
.dk-contenido > :is(p, figure) { margin-block: 0 20px !important; }
.dk-contenido > :is(ul, ol, hr, .wp-block-separator, .wp-block-spacer) { margin-block: 0; }
.dk-contenido > :is(h1, h2, h3, h4, h5, h6) { margin-block: 8px 16px; }
.dk-contenido > :first-child { margin-top: 20px !important; }
/* Alineación "ancha" como en Hello Elementor: 80 px fuera del texto por cada lado */
.dk-contenido > .alignwide { max-width: none !important; width: auto; margin-left: -80px !important; margin-right: -80px !important; }
@media (max-width: 1260px) { .dk-contenido > .alignwide { margin-left: 0 !important; margin-right: 0 !important; } }
/* Incrustaciones (tarjetas de otras lecciones, videos): a todo el ancho del texto, como en producción */
.dk-contenido .wp-block-embed iframe { width: 100%; max-width: 100%; }
/* Tablas: reglas de Hello Elementor con especificidad mínima (los estilos del bloque Tabla mandan, como en producción) */
:where(.dk-contenido) table { border-collapse: collapse; border-spacing: 0; font-size: 0.9em; width: 100%; margin-block-end: 15px; }
:where(.dk-contenido) :is(td, th) { border: 1px solid hsla(0, 0%, 50%, 0.502); line-height: 1.5; padding: 15px; vertical-align: top; }
:where(.dk-contenido) th { font-weight: 700; }
:where(.dk-contenido) tbody > tr:nth-child(odd) > :is(td, th) { background-color: hsla(0, 0%, 50%, 0.07); }
:where(.dk-contenido) tbody tr:hover > :is(td, th) { background-color: hsla(0, 0%, 50%, 0.1); }
/* En producción las celdas de encabezado de las tablas con franjas conservan el borde gris de Hello Elementor */
.dk-contenido .wp-block-table.is-style-stripes th { border-color: hsla(0, 0%, 50%, 0.502); }
/* Pies de imagen y de tabla: itálica 16/22.4 px #333, regla de Hello Elementor (WordPress los pone a 13 px) */
.dk-contenido :is(figcaption, .wp-element-caption) { font-size: 16px; font-style: italic; font-weight: 400; line-height: 1.4; color: var(--wp--preset--color--tinta); }
.dk-contenido :is(h2, h3)[id] { scroll-margin-top: 110px; }

/* Cierre: enlaces Fuentes / Índice, "Síguenos", separador y título de comentarios */
.dk-cierre-enlaces { margin-top: 40px !important; }
.dk-cierre-enlaces p { margin: 0 0 20px; font-size: 16px; font-weight: 500; line-height: 0.7; }
.dk-siguenos-cierre { margin-top: 39px !important; }
.dk-siguenos-cierre .dk-siguenos-titulo { margin-top: 0 !important; }
.wp-site-blocks .dk-separador {
	border: 0;
	border-top: 1.8px solid #727272;
	background: none;
	margin: 153px auto 0 !important;
	max-width: 1120px !important;
	opacity: 1;
}
.dk-comentarios-titulo {
	margin: 36px auto 0 !important;
	font-size: 59px;
	line-height: 1;
	letter-spacing: 2.5px;
	color: var(--wp--preset--color--rojo);
	max-width: 1120px !important;
}
@media (max-width: 1024px) { .dk-comentarios-titulo { font-size: 55px; } }
@media (max-width: 767px) { .dk-comentarios-titulo { font-size: 32px; } }
.dk-comentarios { margin-top: 40px !important; }

/* ===== Estilos globales heredados del kit de Elementor (para que el sitio se vea igual sin Elementor) ===== */
/* Páginas aún hechas con Elementor: márgenes del reset de Hello Elementor, con su misma especificidad
   (selector de elemento) para que las reglas de Elementor sigan mandando. Sin esto, cada bloque de texto
   crece 16 px y los títulos dentro del texto toman el margen del navegador (53 px en un h4). */
:where(.elementor) p { margin-block-start: 0; }
:where(.elementor) :is(h1, h2, h3, h4, h5, h6) { margin-block-start: .5rem; margin-block-end: 1rem; }
:where(.elementor) :is(dl, dt, dd, ol, ul, li) { margin-block-start: 0; margin-block-end: 0; }
@media (max-width: 767px) {
	h2 { font-size: 38px; }
	h3 { font-size: 32px; }
	h4 { font-size: 27px; }
	h5 { font-size: 25px; }
	h6 { font-size: 28px; }
}
:where(.dk-contenido, .dk-leccion) :is(button, input[type="button"], input[type="submit"]) {
	background-color: #000;
	color: #FFF;
	box-shadow: 4px 4px 4px -1px rgb(0 0 0 / 0.78);
}
@media (max-width: 767px) {
	:where(.dk-contenido, .dk-leccion) :is(button, input[type="button"], input[type="submit"]) {
		background-color: #9E0505;
		box-shadow: none;
	}
}

/* ===== Cabecera en tableta y móvil (≤ 1024 px): botón de menú y menú desplegable, como en Elementor ===== */
.dk-menu-boton { display: none; }
@media (max-width: 1024px) {
	.dk-cabecera {
		flex-wrap: wrap !important;
		align-items: flex-start !important;
		min-height: 87px;
		padding: 0 !important;
	}
	.dk-cabecera > .dk-logo { flex: 0 0 auto; order: 1; padding: 6px 0 0 6px; }
	.dk-cabecera > .dk-menu-boton { order: 2; }
	.dk-cabecera > .dk-redes { flex: 0 0 auto; order: 3; padding: 11px 6px 0 0; }
	.dk-cabecera > .dk-menu { order: 4; flex: 0 0 calc(100% - 20px); margin: 10px 10px 0; padding: 0; display: none; }
	.dk-cabecera.dk-menu-abierto > .dk-menu { display: block; }
	/* Aquí el menú se muestra y oculta con display: sin esto, el zoom de entrada se repetiría en cada apertura */
	.dk-cabecera > .dk-menu { animation: none !important; }

	.dk-menu-boton {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 33px;
		height: 33px;
		margin-top: 3px;
		padding: 0;
		border: 0;
		border-radius: 3px;
		background: var(--wp--preset--color--negro) !important;
		color: var(--wp--preset--color--blanco) !important;
		box-shadow: none !important;
		cursor: pointer;
	}
	.dk-menu-boton svg { width: 22px; height: 22px; }
	.dk-menu-boton .dk-icono-cerrar,
	.dk-menu-abierto .dk-menu-boton .dk-icono-abrir { display: none; }
	.dk-menu-abierto .dk-menu-boton .dk-icono-cerrar { display: block; }

	/* Menú abierto: lista vertical sobre #181818, elementos de 49 px, 12/500 mayúsculas */
	.dk-cabecera .dk-menu .wp-block-navigation__container {
		flex-direction: column;
		align-items: stretch !important;
		gap: 0 !important;
		background: var(--wp--preset--color--carbon);
		width: 100%;
	}
	.dk-cabecera .dk-menu .wp-block-navigation-item { width: 100%; flex-wrap: wrap; }
	.dk-cabecera .dk-menu .wp-block-navigation-item__content {
		color: var(--wp--preset--color--blanco);
		font-size: 12px;
		font-weight: 500;
		padding: 10px 20px !important;
		line-height: 29px;
	}
	.dk-cabecera .dk-menu .has-child > .wp-block-navigation-item__content { padding-right: 0 !important; }
	/* Activo y bajo el cursor: la fila entera (enlace y flecha) en #AF4B00, como el desplegable de Elementor */
	.dk-cabecera .dk-menu .wp-block-navigation__container > .wp-block-navigation-item:hover,
	.dk-cabecera .dk-menu .wp-block-navigation__container > .wp-block-navigation-item.current-menu-item,
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item:hover,
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item.current-menu-item {
		background-color: #AF4B00;
	}
	.dk-cabecera .dk-menu .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
	.dk-cabecera .dk-menu .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
		background-color: transparent;
	}
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-icon { color: var(--wp--preset--color--blanco); margin: 0 8px 0 9px; }
	/* Submenús: dentro del flujo, se abren al tocar la flecha */
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-container {
		position: static !important;
		width: 100% !important;
		min-width: 0 !important;
		opacity: 1 !important;
		visibility: visible !important;
		height: auto !important;
		display: none !important;
		background: #1F1F1F !important;
	}
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-icon[aria-expanded="true"] + .wp-block-navigation__submenu-container { display: block !important; }
	.dk-cabecera .dk-menu .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding-left: 40px !important; }
}
@media (max-width: 767px) {
	.dk-cabecera { flex-direction: column; align-items: center !important; min-height: 161px; }
	.dk-cabecera > .dk-logo { padding: 6px 0 0; }
	.dk-cabecera > .dk-logo a { display: block; width: 172px; text-align: center; }
	.dk-cabecera > .dk-logo img { height: 32px !important; width: 156px !important; object-fit: contain; display: inline-block; }
	.dk-cabecera > .dk-menu-boton { margin-top: 16px; margin-bottom: 0; }
	.dk-cabecera > .dk-menu { order: 3; flex: none; width: calc(100% - 20px); }
	.dk-cabecera > .dk-redes { order: 4; justify-content: center; padding: 31px 0 11px; margin: 0 !important; }
	.dk-cabecera.dk-menu-abierto > .dk-redes { padding-top: 10px; }
}

/* ===== Lección en tableta y móvil ===== */
@media (max-width: 767px) {
	.dk-portada-leccion .wp-block-cover__inner-container { padding: 0 !important; width: 100% !important; max-width: none !important; }
	.dk-titulo-caja { padding: 10px 15px; max-width: none !important; width: 100%; }
	.dk-titulo-caja .wp-block-post-title { letter-spacing: 2.9px; }
	.dk-siguenos-titulo { font-size: 21px; margin-top: 28px !important; }
	.dk-compartir { margin-top: 27px; }
	.dk-compartir-botones { justify-content: space-between; gap: 0; width: 100vw; margin: 15px 0 0 calc(50% - 50vw); padding: 0 35px 0 10px; box-sizing: border-box; }
	.wp-site-blocks .dk-compartir-boton { width: 59px; height: 33px; }
	.dk-compartir-boton svg { height: 26px; }
	.dk-indice { width: 100vw; margin: 15px 0 0 calc(50% - 50vw) !important; padding: 15px 20px; }
	.dk-indice summary { font-size: 31px; }
}

/* ===== CSS adicional heredado ===== */
/* Copiado del "CSS adicional" que había en Apariencia → Personalizar para Hello Elementor (post custom_css 317).
   Ese CSS va ligado al tema, así que se mueve aquí para no perderlo al cambiar de tema. */

/* Campos de formulario en Rubik, como hacía Olympus Google Fonts (ajuste ogf_inputs_font del tema anterior) */
:where(input, textarea, select, button) { font-family: var(--wp--preset--font-family--rubik); }

/* Botones de Quiz Maker (cuestionario 5) */
#ays-quiz-container-5 input#ays-submit, #ays-quiz-container-5 #ays_finish_quiz_5 .action-button, div#ays-quiz-container-5 #ays_finish_quiz_5 .action-button.ays_restart_button {
	background: none;
	background-color: #9e0505;
	color: #ffffff;
	font-size: 17px;
	padding: 10px 20px;
	border-radius: 3px;
	height: auto;
	letter-spacing: 1.5px;
	box-shadow: unset;
}

/* Imágenes con la clase "mi-imagen-pulsa": crecen al pasar el cursor */
.mi-imagen-pulsa img { transition: transform 0.2s; }
.mi-imagen-pulsa img:hover { transform: scale(1.1); }

.wp-block-table.aligncenter figcaption.wp-element-caption { text-align: center; }

/* Fórmulas KaTeX en móviles y tabletas: desplazables y con espacio para la etiqueta de la ecuación */
@media only screen and (max-width: 768px) {
	.katex-display {
		width: 100%;
		position: relative;
		overflow-x: auto;
		padding-top: 40px;
	}
	.katex-display .tag {
		position: absolute;
		left: 0;
		top: -25px;
		font-size: 0.7em;
		margin-top: 0;
		text-align: left;
		display: block;
	}
}

/* Patrón: cuadro de diálogo RPG */
.dk-dialogo {
	position: relative;
	background: var(--wp--preset--color--negro);
	border: 3px solid var(--wp--preset--color--rojo-logo);
	color: var(--wp--preset--color--blanco);
	font-family: var(--wp--preset--font-family--pixel);
	padding: 2.25rem 1.5rem 1.5rem;
	margin-top: 2.5rem;
	max-width: 760px;
}
.dk-dialogo .dk-dialogo-nombre {
	position: absolute;
	top: -1.6rem;
	left: -3px;
	margin: 0;
	background: var(--wp--preset--color--negro);
	border: 3px solid var(--wp--preset--color--rojo-logo);
	border-bottom: 0;
	padding: 0.25rem 1rem;
	font-size: 1.25rem;
	text-transform: uppercase;
}
.dk-dialogo .dk-dialogo-texto { margin: 0; font-size: 1.35rem; line-height: 1.5; }

/* Patrón: inventario recomendado */
.dk-inventario {
	background: var(--wp--preset--color--pergamino);
	border-left: 6px solid var(--wp--preset--color--rojo);
	padding: 1rem 1.5rem;
}
.dk-inventario h3 { margin-top: 0; }

/* Tarjetas de archivo */
.dk-tarjeta .wp-block-post-featured-image img { border-radius: 4px; }
.dk-tarjeta .wp-block-post-title a { color: var(--wp--preset--color--negro); text-decoration: none; }
.dk-tarjeta .wp-block-post-title a:hover { color: var(--wp--preset--color--rojo); }

/* ===== Pie con vida (0.11.0): brillo del logo, enlaces que se iluminan con un subrayado pixel y redes que saltan ===== */
.dk-pie-principal { position: relative; overflow: hidden; }
.dk-pie-principal::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; background: radial-gradient(1px 1px at 12% 30%, #fff8 50%, transparent 0), radial-gradient(1px 1px at 82% 22%, #fff6 50%, transparent 0), radial-gradient(2px 2px at 64% 70%, #e8b04b88 50%, transparent 0), radial-gradient(1px 1px at 30% 80%, #fff5 50%, transparent 0), radial-gradient(2px 2px at 92% 64%, #3fe0d066 50%, transparent 0); animation: dk-pie-estrellas 4s steps(2) infinite; }
@keyframes dk-pie-estrellas { 50% { opacity: .15; } }
.dk-pie-logo img { transition: transform .25s steps(3), filter .25s; animation: dk-pie-logo 5s ease-in-out infinite; }
@keyframes dk-pie-logo { 50% { filter: drop-shadow(0 0 8px rgb(232 176 75 / .45)); } }
.dk-pie-logo a:hover img, .dk-pie-logo a:focus-visible img { transform: translateY(-3px) scale(1.04); }
.wp-site-blocks .dk-pie-enlaces a, .wp-site-blocks .dk-pie-correo a, .wp-site-blocks .dk-pie-mensaje a { position: relative; display: inline-block; transition: color .2s, transform .2s steps(2); }
.dk-pie-enlaces a::after, .dk-pie-correo a::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: 8px; height: 3px; background: repeating-linear-gradient(90deg, #e8b04b 0 6px, transparent 6px 9px); transform: scaleX(0); transform-origin: left; transition: transform .3s steps(6); }
.dk-pie-correo a::after { left: 0; right: 0; bottom: -4px; }
.dk-pie-enlaces a::before { content: "▸"; position: absolute; left: 2px; top: 50%; color: #e8b04b; opacity: 0; transform: translate(-6px, -50%); transition: opacity .2s, transform .2s steps(2); }
.wp-site-blocks .dk-pie-enlaces a:hover, .wp-site-blocks .dk-pie-enlaces a:focus-visible, .wp-site-blocks .dk-pie-correo a:hover, .wp-site-blocks .dk-pie-correo a:focus-visible, .wp-site-blocks .dk-pie-mensaje a:hover, .wp-site-blocks .dk-pie-mensaje a:focus-visible { color: #e8b04b; transform: translateY(-2px); }
.dk-pie-enlaces a:hover::after, .dk-pie-enlaces a:focus-visible::after, .dk-pie-correo a:hover::after, .dk-pie-correo a:focus-visible::after { transform: scaleX(1); }
.dk-pie-enlaces a:hover::before, .dk-pie-enlaces a:focus-visible::before { opacity: 1; transform: translate(0, -50%); }
.wp-site-blocks .dk-pie-mensaje a { animation: dk-pie-mensaje 2.6s steps(2) infinite; }
@keyframes dk-pie-mensaje { 50% { color: #ffd98a; } }
.dk-redes-pie .wp-social-link { transition: transform .2s steps(3); }
.wp-site-blocks .dk-redes-pie .wp-social-link:hover, .wp-site-blocks .dk-redes-pie .wp-social-link:focus-within { transform: translateY(-5px) rotate(-8deg); color: #e8b04b !important; }
.wp-site-blocks .dk-redes-pie .wp-social-link:hover a, .wp-site-blocks .dk-redes-pie .wp-social-link:focus-within a { color: #e8b04b !important; }
@media (prefers-reduced-motion: reduce) { .dk-pie-principal::before, .dk-pie-logo img, .wp-site-blocks .dk-pie-mensaje a { animation: none; } .dk-pie *, .dk-pie *::before, .dk-pie *::after { transition: none !important; } }