/* Cabecera de página de Eduma (.top_heading, estilo «heading 2») con la marca Powest:
   degradado animado, luces flotantes, trama de puntos, título con entrada y borde inferior curvo.
   Se carga en todas las páginas con esta cabecera salvo la portada nueva y las fichas de curso
   (ver pah_assets()). */

.style_heading_2_out { --pahc-curva: clamp(28px, 4vw, 56px); position: relative; isolation: isolate; }

/* Fondo: la imagen de Eduma queda debajo y el borde inferior se curva */
.style_heading_2_out .top_site_main {
	position: relative;
	overflow: hidden;
	background-color: #1d1d1b !important;
	background-size: cover !important;
	background-position: center !important;
	padding-bottom: var(--pahc-curva);
	clip-path: ellipse(140% 100% at 50% 0);
}

/* Capa de color de marca que se desplaza lentamente */
.style_heading_2_out .top_site_main .overlay-top-header {
	position: absolute;
	inset: 0;
	z-index: 0;
	opacity: 1 !important;
	background: linear-gradient(115deg, rgba(29, 29, 27, .94) 0%, rgba(29, 29, 27, .82) 40%, rgba(120, 14, 13, .82) 70%, rgba(225, 31, 29, .85) 100%) !important;
	background-size: 220% 220% !important;
	animation: pahc-degradado 16s ease-in-out infinite alternate;
}

/* Luz roja que flota (derecha) */
.style_heading_2_out .top_site_main .overlay-top-header::before {
	content: "";
	position: absolute;
	width: clamp(260px, 34vw, 520px);
	aspect-ratio: 1;
	right: -6%;
	top: -30%;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(255, 74, 61, .55), rgba(225, 31, 29, 0) 70%);
	filter: blur(6px);
	animation: pahc-flotar 11s ease-in-out infinite alternate;
}

/* Trama de puntos que se desplaza, difuminada hacia los bordes */
.style_heading_2_out .top_site_main .overlay-top-header::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(255, 255, 255, .22) 1px, transparent 1.4px);
	background-size: 22px 22px;
	-webkit-mask-image: radial-gradient(70% 90% at 30% 40%, #000 20%, transparent 75%);
	mask-image: radial-gradient(70% 90% at 30% 40%, #000 20%, transparent 75%);
	animation: pahc-trama 30s linear infinite;
}

/* Anillos y luz blanca (izquierda), sobre la capa de color y bajo el texto */
.style_heading_2_out .page-title-wrapper { position: relative; z-index: 1; }
.style_heading_2_out .page-title-wrapper::before {
	content: "";
	position: absolute;
	z-index: -1;
	width: clamp(220px, 26vw, 380px);
	aspect-ratio: 1;
	left: 2%;
	top: 85%; /* más abajo, para no cruzar el logo */
	border-radius: 50%;
	border: 1px solid rgba(255, 255, 255, .16);
	box-shadow: 0 0 0 28px rgba(255, 255, 255, .03), 0 0 0 56px rgba(255, 255, 255, .02);
	transform: translateY(-50%);
	animation: pahc-girar 40s linear infinite;
	pointer-events: none;
}
.style_heading_2_out .page-title-wrapper::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 14px;
	height: 14px;
	left: calc(2% + clamp(220px, 26vw, 380px) * .85);
	top: 55%;
	border-radius: 50%;
	background: #ff4a3d;
	box-shadow: 0 0 18px 4px rgba(255, 74, 61, .6);
	animation: pahc-flotar 7s ease-in-out infinite alternate-reverse;
	pointer-events: none;
}

/* Título: entra subiendo y una línea roja crece debajo */
.style_heading_2_out .top_site_main .page-title {
	font-family: "Barlow", Helvetica, Arial, sans-serif !important;
	font-weight: 800 !important;
	letter-spacing: -.02em;
	line-height: 1.05;
	text-shadow: 0 6px 30px rgba(0, 0, 0, .35);
	animation: pahc-entrada .9s cubic-bezier(.2, .7, .2, 1) both;
}
.style_heading_2_out .top_site_main .page-title::after {
	content: "";
	display: block;
	width: 72px;
	height: 4px;
	margin: 16px auto 0;
	border-radius: 4px;
	background: linear-gradient(90deg, #e11f1d, #ff4a3d);
	transform-origin: center;
	animation: pahc-linea .8s .35s cubic-bezier(.2, .7, .2, 1) both;
}

/* Migas de pan: cápsula translúcida por encima de la curva */
.style_heading_2_out .breadcrumbs-wrapper {
	bottom: calc(var(--pahc-curva) + 10px) !important; /* Eduma la fija con más prioridad */
	z-index: 2;
	animation: pahc-entrada .9s .2s cubic-bezier(.2, .7, .2, 1) both;
}
.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs {
	display: inline-flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 2px 0;
	margin: 0;
	padding: 7px 18px !important;
	border: 1px solid rgba(255, 255, 255, .18) !important;
	border-radius: 999px;
	background: rgba(255, 255, 255, .1);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	font-family: "Barlow", Helvetica, Arial, sans-serif;
	font-weight: 600;
	font-size: 14px;
}
.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs li { color: #fff !important; }
.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs li a { color: rgba(255, 255, 255, .75) !important; }
.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs li a:hover { color: #fff !important; }
.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs li a::after { color: rgba(255, 255, 255, .45) !important; }

/* Galería de videos (página Videos, elementos atómicos de Elementor 4). Las filas venían con un margen
   fijo de 100 px y cada video con ancho fijo de 1920 px: se descuadraban en escritorio y desbordaban
   en móvil. Se reordenan en una cuadrícula fluida: 2 columnas en escritorio y 1 en móvil. */
.elementor .e-flexbox-base:has(> .e-youtube-base) {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
	gap: clamp(16px, 2.5vw, 28px);
	width: 100%;
	max-width: 1140px;
	margin: 0 auto clamp(16px, 2.5vw, 28px) !important;
	padding: 0 !important;
}
.elementor > .e-flexbox-base:has(> .e-youtube-base):first-child { margin-top: clamp(8px, 2vw, 24px) !important; }
.elementor .e-flexbox-base > .e-youtube-base {
	width: 100% !important;
	max-width: 100%;
	height: auto !important;
	aspect-ratio: 16 / 9;
	padding: 0 !important;
	border-radius: 16px;
	overflow: hidden;
	background: #000;
	box-shadow: 0 1px 2px rgba(29, 29, 27, .06), 0 10px 26px -14px rgba(29, 29, 27, .35);
}
.elementor .e-youtube-base iframe { display: block; width: 100% !important; height: 100% !important; }

@keyframes pahc-degradado { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } }
@keyframes pahc-flotar { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(-40px, 30px) scale(1.12); } }
@keyframes pahc-trama { to { background-position: 220px 110px; } }
@keyframes pahc-girar { to { transform: translateY(-50%) rotate(360deg); } }
@keyframes pahc-entrada { from { opacity: 0; transform: translateY(18px); } }
@keyframes pahc-linea { from { transform: scaleX(0); } }

@media (max-width: 767px) {
	.style_heading_2_out .page-title-wrapper::before,
	.style_heading_2_out .page-title-wrapper::after { display: none; }
	.style_heading_2_out .breadcrumbs-wrapper #breadcrumbs { font-size: 13px; padding: 6px 14px !important; }
}

@media (prefers-reduced-motion: reduce) {
	.style_heading_2_out *,
	.style_heading_2_out *::before,
	.style_heading_2_out *::after { animation: none !important; }
}
