/* ═══════════════════════════════════════════════════════════════════
   CORRECCIONES DE LA COPIA LOCAL — Vértice
   Todo lo que arreglemos de estilo va AQUÍ, en un solo sitio.
   Se carga el último, así que gana a lo que venga antes.
   ═══════════════════════════════════════════════════════════════════ */


/* ── 7-sep-2026 · LOS BOTONES CON CÍRCULO BLANCO
   Tres familias en la web: .btn1 (90), .btn-white-blue (18) y .btn3 (3).
   ────────────────────────────────────────────────────────────────────
   QUÉ PASABA
   1. La flecha no se veía. El sitio trae la regla
        .elementor-button .elementor-button-icon svg { fill:#fff!important }
      que pinta TODAS las flechas de blanco. Sobre el círculo blanco,
      desaparecían. Y varias reglas por botón repetían el blanco al
      pasar el ratón.
   2. Al pasar el ratón, un script ensanchaba el círculo hasta cubrir
      casi todo el botón, y el texto blanco quedaba encima del blanco.

   QUÉ SE HACE
   La flecha pasa a azul marino —el color de la marca— en los dos
   estados: se ve sobre el círculo blanco tanto si el botón es azul
   como si es azul oscuro. Y el círculo conserva su forma y su sitio,
   con el relleno exacto que tenía (12px 10px 10px 13px).

   OJO si alguien retoca esto: NO poner el relleno del icono a cero.
   Ese relleno es lo que le da la forma redonda; al anularlo el círculo
   se convierte en un óvalo de 15x37. Ya pasó una vez.
   ──────────────────────────────────────────────────────────────────── */

/* el círculo se queda quieto en las tres familias */
.btn1 .elementor-button-icon,
.btn1 .elementor-button:hover .elementor-button-icon,
.btn-white-blue .elementor-button-icon,
.btn-white-blue .elementor-button:hover .elementor-button-icon,
.btn3 .elementor-button-icon,
.btn3 .elementor-button:hover .elementor-button-icon,
.elementor-element-3f6cb04f .elementor-button-icon,
.elementor-element-3f6cb04f .elementor-button:hover .elementor-button-icon{
	padding: 12px 10px 10px 13px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: 46px !important;
	box-sizing: border-box !important;
	transition: none !important;
}

/* la flecha: azul marino sobre el círculo blanco, siempre visible */
.btn1 .elementor-button-icon svg,
.btn1 .elementor-button-icon i,
.btn1 .elementor-button:hover .elementor-button-icon svg,
.btn1 .elementor-button:hover .elementor-button-icon i,
.btn-white-blue .elementor-button-icon svg,
.btn-white-blue .elementor-button-icon i,
.btn-white-blue .elementor-button:hover .elementor-button-icon svg,
.btn-white-blue .elementor-button:hover .elementor-button-icon i,
.btn3 .elementor-button-icon svg,
.btn3 .elementor-button-icon i,
.btn3 .elementor-button:hover .elementor-button-icon svg,
.btn3 .elementor-button:hover .elementor-button-icon i,
.elementor-element-3f6cb04f .elementor-button-icon svg,
.elementor-element-3f6cb04f .elementor-button:hover .elementor-button-icon svg{
	fill: #0B1236 !important;
	color: #0B1236 !important;
}

/* el texto nunca se confunde con el fondo */
.btn1 .elementor-button .elementor-button-text,
.btn1 .elementor-button:hover .elementor-button-text,
.elementor-element-3f6cb04f .elementor-button .elementor-button-text,
.elementor-element-3f6cb04f .elementor-button:hover .elementor-button-text{
	color: #FFFFFF !important;
	text-shadow: none !important;
	position: relative;
	z-index: 2;
}

/* la flecha avanza y vuelve mientras el ratón está encima */
.btn1 .elementor-button:hover .elementor-button-icon svg,
.btn-white-blue .elementor-button:hover .elementor-button-icon svg,
.btn3 .elementor-button:hover .elementor-button-icon svg,
.elementor-element-3f6cb04f .elementor-button:hover .elementor-button-icon svg{
	animation: uny-flecha-vaiven .9s ease-in-out infinite;
}

@keyframes uny-flecha-vaiven{
	0%, 100% { transform: translateX(0); }
	50%      { transform: translateX(4px); }
}

@media (prefers-reduced-motion: reduce){
	.btn1 .elementor-button:hover .elementor-button-icon svg,
	.btn-white-blue .elementor-button:hover .elementor-button-icon svg,
	.btn3 .elementor-button:hover .elementor-button-icon svg,
	.elementor-element-3f6cb04f .elementor-button:hover .elementor-button-icon svg{
		animation: none;
	}
}


/* ── 7-sep-2026 · Botón "Inscríbete Ahora!" cortado (inicio)
   Está justo después de la sección de sedes. Su contenedor (62e848ce)
   tenía z-index 2 y la sección de encima (340c9346) tiene z-index 4,
   así que le pasaba por delante y lo cortaba por la mitad.
   Se le sube la capa para que quede por delante.
   ──────────────────────────────────────────────────────────────────── */
.elementor-element-62e848ce{
	z-index: 5 !important;
	position: relative;
}


/* ── 7-sep-2026 · Fichas de Gobierno Universitario: franjas desiguales
   ────────────────────────────────────────────────────────────────────
   La franja blanca de cada tarjeta crecía o menguaba según cuántas
   líneas ocupara el nombre y el cargo: medían 66, 84 y 86 px, y la
   fila quedaba descuadrada.
   Se le da una altura mínima común, la del caso más largo con holgura,
   y el texto se centra dentro. Así todas las franjas miden igual sin
   importar la longitud del nombre.
   ──────────────────────────────────────────────────────────────────── */

.gob-card__info{
	min-height: 96px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
}

@media (max-width: 1024px){
	.gob-card__info{ min-height: 92px; }
}

@media (max-width: 600px){
	.gob-card__info{ min-height: 86px; }
}


/* ── 7-sep-2026 · BOTONES DE CERRAR (la X)
   ────────────────────────────────────────────────────────────────────
   Había cuatro estilos distintos repartidos por la web:
     .uny-pv-cerrar     visor de brochures y documentos  (125 usos)
     .uny-oc__close     menú de móvil                    (64 usos)
     .gob-modal__close  fichas de Gobierno Universitario
     .tal-modal__close  fichas de Talento Humano
   El del visor era un círculo relleno de color fuerte con borde grueso:
   pesaba mucho para lo que es, un botón secundario.

   Ahora todos comparten el mismo criterio: un círculo discreto y un
   aspa fina dibujada con dos líneas (no con una tipografía, que se ve
   distinta en cada sistema). Al pasar el ratón el círculo se marca un
   poco y el aspa gira un pelín. Sobrio y consistente.
   ──────────────────────────────────────────────────────────────────── */

.uny-pv-cerrar,
.uny-oc__close,
.uny-oc .uny-oc__close,
.tal-modal__close{
	position: relative !important;
	width: 38px !important;
	height: 38px !important;
	min-width: 38px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: rgba(11, 18, 54, .07) !important;
	color: #0B1236 !important;
	cursor: pointer;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	font-size: 0 !important;          /* se oculta la × de la tipografía */
	line-height: 0 !important;
	transition: background-color .22s ease, transform .22s ease;
	-webkit-appearance: none;
	appearance: none;
}

/* el aspa, dibujada con dos líneas finas */
.uny-pv-cerrar::before,
.uny-pv-cerrar::after,
.uny-oc__close::before,
.uny-oc__close::after,
.uny-oc .uny-oc__close::before,
.uny-oc .uny-oc__close::after,
.tal-modal__close::before,
.tal-modal__close::after{
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 15px;
	height: 1.8px;
	border-radius: 2px;
	background: currentColor;
}
.uny-pv-cerrar::before,
.uny-oc__close::before,
.uny-oc .uny-oc__close::before,
.tal-modal__close::before{ transform: translate(-50%,-50%) rotate(45deg); }

.uny-pv-cerrar::after,
.uny-oc__close::after,
.uny-oc .uny-oc__close::after,
.tal-modal__close::after{ transform: translate(-50%,-50%) rotate(-45deg); }

.uny-pv-cerrar:hover,
.uny-oc__close:hover,
.uny-oc .uny-oc__close:hover,
.tal-modal__close:hover{
	background: rgba(11, 18, 54, .13) !important;
	color: #0B1236 !important;
	transform: rotate(90deg);
}

.uny-pv-cerrar:focus-visible,
.uny-oc__close:focus-visible,
.uny-oc .uny-oc__close:focus-visible,
.tal-modal__close:focus-visible{
	outline: 2px solid #0071E3;
	outline-offset: 2px;
}

/* el de Gobierno Universitario va sobre la foto, en oscuro:
   mismo criterio pero en claro, y ese sí lleva su propio SVG dentro */
.gob-modal__close{
	width: 38px !important;
	height: 38px !important;
	background: rgba(255,255,255,.16) !important;
	border: 0 !important;
	transition: background-color .22s ease, transform .22s ease;
}
.gob-modal__close:hover{
	background: rgba(255,255,255,.3) !important;
	transform: rotate(90deg);
}
.gob-modal__close svg{
	width: 15px !important;
	height: 15px !important;
	stroke: #fff !important;
	stroke-width: 2 !important;
}

@media (prefers-reduced-motion: reduce){
	.uny-pv-cerrar, .uny-oc .uny-oc__close, .tal-modal__close, .gob-modal__close{ transition: none; }
	.uny-pv-cerrar:hover, .uny-oc .uny-oc__close:hover, .tal-modal__close:hover, .gob-modal__close:hover{ transform: none; }
}


/* ── 7-sep-2026 · DESCARGA DE DOCUMENTOS CON PROGRESO
   Los estilos de lo que monta correcciones.js. Dos piezas:
   la ventana centrada (para enlaces y recuadros) y el botón del visor
   que se ensancha. Paleta de la UNY.
   ──────────────────────────────────────────────────────────────────── */

/* ── la ventana centrada ── */
.uny-dl{
	position: fixed; inset: 0; z-index: 999999;
	background: rgba(11,18,54,.62);
	-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
	display: flex; align-items: center; justify-content: center;
	opacity: 0; pointer-events: none;
	transition: opacity .28s ease;
}
.uny-dl.ver{ opacity: 1; pointer-events: auto; }

.uny-dl__panel{
	background: #fff; border-radius: 24px;
	padding: 42px 38px 30px; width: min(420px, 90vw);
	text-align: center; box-shadow: 0 30px 80px rgba(0,0,0,.36);
	transform: translateY(14px) scale(.97);
	transition: transform .35s cubic-bezier(.34,1.4,.64,1);
	font-family: Montserrat, -apple-system, BlinkMacSystemFont, sans-serif;
}
.uny-dl.ver .uny-dl__panel{ transform: none; }

.uny-dl__n{ font-size: 14px; font-weight: 700; color: #0B1236; margin-bottom: 4px; line-height: 1.35; }
.uny-dl__p{ font-size: 12.5px; color: #77809b; margin-bottom: 30px; word-break: break-all; }

.uny-dl__aro{
	position: relative; width: 76px; height: 76px; margin: 0 auto;
	transition: width .5s cubic-bezier(.65,0,.35,1), height .5s cubic-bezier(.65,0,.35,1);
}
.uny-dl__b{
	position: absolute; inset: 0;
	border: 3px solid #0071E3; border-radius: 50%;
	transition: border-radius .5s cubic-bezier(.65,0,.35,1),
	            border-width .5s cubic-bezier(.65,0,.35,1),
	            background-color .3s ease;
}
.uny-dl__f{
	position: absolute; left: 0; top: 0; bottom: 0; width: 0;
	border-radius: 99px; opacity: 0;
	background: linear-gradient(90deg,#0071E3,#3f8bf5);
	transition: opacity .3s ease;
}
.uny-dl__i{
	position: absolute; left: 50%; top: 50%;
	transform: translate(-50%,-50%);
	width: 26px; height: 26px; transition: opacity .25s ease;
}
.uny-dl__i path{ fill: #0071E3; }
.uny-dl__para{
	position: absolute; top: -44px; width: 34px; height: 38px;
	opacity: 0; transform: translateX(-50%); pointer-events: none;
	transition: opacity .3s ease;
}
.uny-dl__para path{ fill: #0071E3; }
.uny-dl__ok{
	position: absolute; left: 50%; top: 50%;
	width: 30px; height: 30px; opacity: 0;
	transform: translate(-50%,-50%) scale(.4);
	transition: opacity .3s ease .05s, transform .4s cubic-bezier(.34,1.56,.64,1) .05s;
}
.uny-dl__ok path{ stroke:#0071E3; stroke-width:2.6; fill:none; stroke-linecap:round; stroke-linejoin:round; }

.uny-dl__aro.va{ width: min(300px, 72vw); height: 8px; }
.uny-dl__aro.va .uny-dl__b{ border-radius: 99px; border-width: 0; background: #E3E8F2; }
.uny-dl__aro.va .uny-dl__f{ opacity: 1; }
.uny-dl__aro.va .uny-dl__i{ opacity: 0; }
.uny-dl__aro.va .uny-dl__para{ opacity: 1; }
.uny-dl__aro.ok .uny-dl__ok{ opacity: 1; transform: translate(-50%,-50%) scale(1); }
.uny-dl__aro.ok .uny-dl__b{ background: rgba(0,113,227,.09); }

.uny-dl__pct{ margin-top: 26px; font-size: 15px; font-weight: 800; color: #0071E3; font-variant-numeric: tabular-nums; }
.uny-dl__est{ margin-top: 5px; font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #8a93ac; }
.uny-dl__salir{ margin-top: 20px; font-size: 12px; color: #98a1b9; line-height: 1.6; }
.uny-dl__salir b{ color: #5a6480; }

/* ── el botón «Descargar» del visor, que se ensancha ── */
.uny-pv-accion.uny-dl-va,
.uny-pv-accion.uny-dl-ok{
	position: relative;
	overflow: hidden;
	font-variant-numeric: tabular-nums;
	transition: min-width .4s cubic-bezier(.65,0,.35,1), color .25s ease, background-color .25s ease;
}
.uny-pv-accion.uny-dl-va{
	min-width: 128px;
	color: #0071E3 !important;
	border-color: #0071E3 !important;
}
.uny-pv-accion.uny-dl-va::before{
	content: "";
	position: absolute; left: 0; top: 0; bottom: 0;
	width: var(--uny-p, 0%);
	background: rgba(0,113,227,.16);
	z-index: 0;
	transition: width .12s linear;
}
.uny-pv-accion.uny-dl-ok{
	color: #0071E3 !important;
	border-color: #0071E3 !important;
	background: #EAF4FE !important;
}

@media (prefers-reduced-motion: reduce){
	.uny-dl, .uny-dl__panel, .uny-dl__aro, .uny-dl__b, .uny-dl__f,
	.uny-dl__i, .uny-dl__para, .uny-dl__ok, .uny-pv-accion{ transition: none !important; }
}


/* ── 8-sep-2026 · Hueco enorme en blanco en el inicio, en móvil
   ────────────────────────────────────────────────────────────────────
   Entre el botón «Inscríbete» y el bloque «EL CAMINO HACIA TUS SUEÑOS»
   aparecía en el teléfono una franja vacía de pantalla y media.

   Causa: la sección 2b60bb58 está marcada para ocultarse en móvil
   (lleva la clase elementor-hidden-mobile), pero el sitio traía una
   regla que la forzaba a mostrarse igualmente:

       @media (max-width:767px){
         .elementor-element-2b60bb58.elementor-hidden-mobile{
           display:flex !important }
       }

   Como su contenido sí queda oculto, la sección se mostraba vacía y
   solo aportaba altura. La regla venía del propio servidor de la UNY,
   así que el hueco también sale en la web original.

   Aquí se respeta lo que la sección declara: si está marcada para no
   verse en móvil, no se ve, y no deja hueco.
   ──────────────────────────────────────────────────────────────────── */

@media (max-width: 767px){
	.elementor-element-2b60bb58.elementor-hidden-mobile{
		display: none !important;
	}
}


/* ── 8-sep-2026 · Iconos de redes sociales y de WhatsApp
   ────────────────────────────────────────────────────────────────────
   En el pie, los cinco iconos estaban resueltos de tres formas
   distintas: Facebook y YouTube con una tipografía de iconos que no
   llega a cargar (salían cuadrados vacíos), Instagram con otra
   tipografía y un carácter equivocado (salía un símbolo raro), y solo
   TikTok y X con SVG, que eran los únicos que se veían bien.

   Los tres rotos pasan a SVG, como los que funcionaban: así no
   dependen de ninguna tipografía externa.

   Y el icono del botón flotante de WhatsApp estaba dibujado a mano y
   se veía tosco; se sustituye por el trazo oficial de la marca.

   Aquí solo va el ajuste de tamaño y color; el cambio de icono está
   hecho en el HTML de cada página.
   ──────────────────────────────────────────────────────────────────── */

/* los del pie: mismo tamaño y color, vengan de donde vengan */
footer a[href*="facebook"] svg,
footer a[href*="instagram"] svg,
footer a[href*="youtube"] svg,
footer a[href*="tiktok"] svg,
footer a[href*="x.com"] svg,
a[href*="facebook"] > svg,
a[href*="instagram"] > svg,
a[href*="youtube"] > svg{
	width: 1em;
	height: 1em;
	vertical-align: middle;
}

/* Instagram va de trazo: su marco y el objetivo son líneas, no manchas.
   Puesto macizo, a tamaño pequeño el interior se empasta y no se
   reconoce. Estas dos reglas evitan que una regla general de relleno
   se lo estropee. */
a[href*="instagram"] svg[stroke]{
	fill: none !important;
	stroke: currentColor !important;
}
a[href*="instagram"] svg[stroke] circle[fill]{
	fill: currentColor !important;
	stroke: none !important;
}

/* el flotante de WhatsApp: el trazo bien centrado en su círculo */
#luma-wa svg{
	width: 30px;
	height: 30px;
	fill: currentColor;
	display: block;
}


/* ── 8-sep-2026 · MODELO EDUCATIVO: los espacios de la imagen del modelo académico
   ────────────────────────────────────────────────────────────────────
   Elio: «se ve muy separada del texto de arriba y muy pegada a los textos
   de abajo». Medido a 1004 px de ancho, tenía razón y los números eran feos:

     arriba de la imagen  = 20 px (gap del contenedor) + 18 px (margen propio) = 38 px
     abajo de la imagen   = 8 px (margen propio) + 20 px (gap) − 30 px (margen
                            negativo del bloque siguiente) = −2 px, o sea SOLAPADO

   Se anulan los dos márgenes y queda el gap de 20 px por ambos lados.
   Ninguno de esos márgenes era nuestro: vienen del CSS del sitio. */
.elementor-4343 .elementor-element.elementor-element-bd63cca > .elementor-widget-container{
	margin: 0 !important;
}
.elementor-4343 .elementor-element.elementor-element-0696e6f{
	margin-top: 0 !important;
}


/* ── 8-sep-2026 · LOS BOTONES CON CÍRCULO: la flecha se mueve al pasar por encima
   ────────────────────────────────────────────────────────────────────
   Elio: «cuando me paro encima no hace la animación que tiene el botón».

   CORRECCIÓN DE MI PRIMER DIAGNÓSTICO: dije que no existía ninguna regla de
   hover. Era falso — sí existe, y funciona:

       .elementor-button:hover{ transform:translateY(-3px)!important;
                                box-shadow:0 10px 26px rgba(10,30,90,.28)!important }

   Lo que pasa es que **está escrita dentro del HTML de cada página**, no en el
   CSS, y mi primera búsqueda solo miró los archivos .css. Aviso para la próxima:
   en esta web hay estilos repartidos en los dos sitios.

   Lo que Elio no veía era otra cosa: estaba mirando web.uny.edu.ve, donde este
   archivo no se carga, así que la flecha salía blanca sobre el círculo blanco.
   En la copia está bien desde el 7-sep.

   Aquí solo se añade lo que de verdad faltaba: que la flecha avance dentro del
   círculo, y que el foco del teclado se vea (regla obligatoria de la UNY).

   OJO: no se toca el padding del icono. Ese relleno es lo que le da la forma
   redonda al círculo; ya se rompió una vez por ponerlo a cero. */

.btn1 .elementor-button-icon svg,
.btn2 .elementor-button-icon svg,
.btn3 .elementor-button-icon svg,
.btn-white-blue .elementor-button-icon svg{
	transition: transform .22s ease !important;
}
.btn1 .elementor-button:hover .elementor-button-icon svg,
.btn2 .elementor-button:hover .elementor-button-icon svg,
.btn3 .elementor-button:hover .elementor-button-icon svg,
.btn-white-blue .elementor-button:hover .elementor-button-icon svg{
	transform: translateX(3px);
}

/* el foco del teclado tiene que verse */
.btn1 .elementor-button:focus-visible,
.btn2 .elementor-button:focus-visible,
.btn3 .elementor-button:focus-visible,
.btn-white-blue .elementor-button:focus-visible{
	outline: 3px solid #0B1236;
	outline-offset: 3px;
}


/* ── 8-sep-2026 · EL ROSA QUE SALTA AL PASAR POR ENCIMA DE CUALQUIER BOTÓN
   ────────────────────────────────────────────────────────────────────
   Elio, sobre el vídeo de Historia: «no me gusta que cuando me paro encima
   se ponga eso de youtube y rosado».

   La causa no era el vídeo. El CSS del sitio trae esta regla suelta:

       [type=button]:hover, [type=submit]:focus, [type=submit]:hover,
       button:focus, button:hover { background-color:#c36; color:#fff }

   `#c36` es `#CC3366`, un rosa fucsia, y pinta **cualquier <button> de la web**
   al pasar por encima o al enfocarlo con el teclado. En el vídeo se notaba
   muchísimo porque su botón de reproducir ocupa todo el recuadro, así que el
   rosa tapaba la portada entera.

   Los botones que ya traen su fondo con !important están a salvo
   (uny-pv-cerrar, uny-oc__close, uny-burger). Estos tres no lo traían, así que
   su fondo normal es transparente y aquí se conserva tal cual. */

.uny-nav-burger:hover, .uny-nav-burger:focus,
.uny-ig-cab:hover,     .uny-ig-cab:focus,
.lcc-x:hover,          .lcc-x:focus{
	background-color: transparent !important;
}


/* ── 8-sep-2026 · ESTRUCTURA: el texto de Consejo Superior era más ancho
   ────────────────────────────────────────────────────────────────────
   Elio: «el cuadro de texto de consejo superior está más estirado o es más
   ancho que los otros cuadros de texto de rectorado, vicerrectorado
   académico, etc.». Medido en /estructura/, tenía razón:

       Consejo Superior          596 px
       Rectorado                 530 px
       Vicerrectorado Académico  530 px
       Dirección de Investigación 530 px
       Vicerrectorado Admin.     530 px
       Secretaría General        530 px

   La causa: su contenedor (56854ae) lleva `--width:55%` sobre los 1120 px
   disponibles = 616 px, mientras los demás quedan en 550. Se iguala a 550,
   que deja el texto en los mismos 530 que el resto.

   Solo en escritorio: por debajo de 1025 px todo se apila a ancho completo
   y no hay nada que igualar. */
@media (min-width: 1025px){
	.elementor-element.elementor-element-56854ae{
		/* el !important hace falta: Elementor define --width:55% con un selector
		   mas especifico (le antepone la clase de la pagina) */
		--width: 550px !important;
	}
}


/* ── 8-sep-2026 · «¿POR QUÉ ESTUDIAR EN LA UNY?»: portada descuadrada
   ────────────────────────────────────────────────────────────────────
   Elio: «está bugueada toda la portada, el título está en diferentes
   tamaños... el mensaje de la derecha su recuadro está muy pequeño y me
   imagino que por eso se pone así en vertical raro... el fondo es blanco
   y en realidad el fondo correspondiente es un gris claro».

   Medido, y las tres cosas eran ciertas:

   1) EL TÍTULO son DOS elementos distintos, y el de abajo va más pequeño
      en TODOS los tamaños:

         ancho 390   arriba 34 px   abajo 28 px
         ancho 820   arriba 44 px   abajo 34 px
         ancho 1209  arriba 64 px   abajo 40 px

      Se iguala el de abajo al de arriba en cada tramo.

   2) LA CAJA DE LA FRASE solo se estrecha en escritorio: lleva
      `--width:27%`, que sobre 1109 px da 226. En las demás portadas
      (comprobado en /historia/) mide 340, y por eso ahí el texto no sale
      en columna. En móvil (350) y tablet (720) ya estaba bien, así que
      solo se toca de 1025 px hacia arriba.

   3) EL FONDO de las secciones era `#fbfcfe`, casi blanco, en vez del
      gris `#F4F4F4` que usa el resto de la web (es el color del body).
      Las tarjetas se quedan en blanco, que es lo que les da el relieve. */

/* 1 · las dos líneas del título, al mismo tamaño */
.elementor-element.elementor-element-3b6110c h2,
.elementor-element.elementor-element-3b6110c .elementor-heading-title{
	font-size: 34px !important;
	line-height: 1.06 !important;
}
@media (min-width: 768px){
	.elementor-element.elementor-element-3b6110c h2,
	.elementor-element.elementor-element-3b6110c .elementor-heading-title{
		font-size: 44px !important;
	}
}
@media (min-width: 1025px){
	.elementor-element.elementor-element-3b6110c h2,
	.elementor-element.elementor-element-3b6110c .elementor-heading-title{
		font-size: 64px !important;
	}
	/* 2 · la caja de la frase, al ancho de las demás portadas.
	   El flex-shrink es necesario: con --width sola, el contenedor flex
	   la seguía comprimiendo y se quedaba en 250 px de los 340 pedidos. */
	.elementor-element.elementor-element-de2c495{
		--width: 340px !important;
		flex-shrink: 0 !important;
		min-width: 340px !important;
	}
}

/* 3 · el fondo gris de la web, no blanco */
.pq-razones-section,
.pq-fac-section{
	background: #F4F4F4 !important;
}
body.page-id-7196 .page-header{
	background: #F4F4F4 !important;
}

/* 4 · la franja azul, pegada a la foto como en el inicio
   ────────────────────────────────────────────────────────────────────
   Elio: «esa franja está pegada a la parte de abajo de la foto de portada
   y yo acá la veo separada aún».

   Medido: quedaba un hueco de 32 px entre la foto (termina en 623) y la
   franja (empieza en 655). Sale del `gap:32px` del contenedor 3629b30.
   Ese contenedor tiene SOLO DOS hijos —la foto y la franja—, así que
   poner el hueco a cero no afecta a nada más. En el inicio esos
   contenedores no llevan separación ninguna. */
.elementor-element.elementor-element-3629b30{
	gap: 0 !important;
}

/* Y no basta con pegarla: en el inicio la franja va DENTRO del recuadro de
   la foto. Medido allí: la franja (.uny-fh__marq) y la caja de la foto
   (.uny-fh__box) terminan en el MISMO punto —bottom 713 las dos— y la
   franja lleva las esquinas de abajo redondeadas siguiendo la caja.

   ESTO NO SE PUEDE HACER DESDE AQUÍ: un script del sitio le escribe al
   elemento un estilo EN LÍNEA con 'margin-top:0 !important;
   overflow:visible !important', y un estilo en línea gana a cualquier
   hoja de estilos. Se comprobó: de esta misma regla se aplicaba el
   border-radius pero NO el margin-top.

   Está hecho en correcciones.js, al final. */

/* 8-sep-2026 · los botones «Descargar…» pierden el href a propósito (ver
   correcciones.js), y sin href el CSS del sitio les aplica pointer-events:none.
   Elio: «no agarra el botón de descarga». Se les devuelve el clic. */
a[data-uny-pdf-directo],
a[data-uny-pdf-directo] *{
	pointer-events: auto !important;
	cursor: pointer !important;
}


/* ═══ 9-sep-2026 · AJUSTES PEDIDOS POR LUIS EN /acreditacion-de-saberes/ ═══
   Tres cosas concretas, medidas en la página antes y después:

     1. arriba, entre la portada y el recuadro azul ... 101 px → 43 px
     2. abajo, entre el recuadro azul y el pie ........  27 px → 102 px
     3. el enlace «¿Prefieres hacerlo por WhatsApp?» pasa a botón

   El botón NO lleva medidas inventadas: son las de los botones del hero
   del propio sitio, medidas ahí mismo — Montserrat 700 a 15 px, borde de
   2 px, radio 40, altura 51, padding 12/26. Antes puse otras (63 px de
   alto, borde de 1,5) y Luis lo vio: «no parecen a los otros».

   El icono es el logotipo de WhatsApp de verdad. El primero lo dibujé mal
   y no se reconocía.

   El color sigue saliendo de `currentColor`, que es el que mide el script
   del HTML según el fondo real: blanco en las secciones azules, azul
   oscuro en las claras. Por eso el hover rellena con un velo del propio
   color en vez de invertir: si se invirtiera habría que cambiar el color
   del texto, y ese lo fija ese script en línea con !important.
   ─────────────────────────────────────────────────────────────────────── */

.uny-tram-caja{ margin-bottom: 155px !important; }
.uny-tram-caja-p{ margin-top: -58px !important; }

@media (max-width: 767px){
	.uny-tram-caja{ margin-bottom: 90px !important; }
	.uny-tram-caja-p{ margin-top: -30px !important; }
}

a.uny-wa-btn{
	/* mismo patrón que los botones del inicio: pastilla de contorno, borde
	   de 2 px, Montserrat 700 a 15 px, radio 40. Nada de rellenos ni velos:
	   el intento anterior llevaba un velo con `currentColor` y salía un
	   gris sucio que Luis vio enseguida. */
	display: inline-flex !important;
	align-items: center;
	gap: 11px;
	margin-top: 0 !important;
	padding: 9px 24px;
	min-height: 48px;          /* más fino, lo pidió Luis */
	border: 2px solid currentColor;
	border-radius: 40px;
	background-color: transparent;
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none !important;
	transition: background-color .18s ease;
}
/* el hover rellena con el azul marino de la marca y NO toca el color del
   texto: ese lo fija en línea y con !important el script que mide el fondo,
   así que no se puede cambiar desde aquí. Blanco sobre #25409E = 9:1. */
a.uny-wa-btn:hover,
a.uny-wa-btn:focus{ background-color: #25409E; }

a.uny-wa-btn .uny-wa-btn__ic{

	width: 19px;
	height: 19px;
	flex: none;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M380.9%2097.1C339%2055.1%20283.2%2032%20223.9%2032c-122.4%200-222%2099.6-222%20222%200%2039.1%2010.2%2077.3%2029.6%20111.1L0%20480l117.7-30.9c32.4%2017.7%2068.9%2027.1%20106.1%2027.1h.1c122.3%200%20224.1-99.6%20224.1-222%200-59.3-25.2-115-67.1-157zm-157%20341.6c-33.2%200-65.7-8.9-94-25.7l-6.7-4-69.8%2018.3L72%20359.2l-4.4-6.9c-18.5-29.4-28.2-63.3-28.2-98.2%200-101.7%2082.8-184.5%20184.6-184.5%2049.3%200%2095.6%2019.2%20130.4%2054.1%2034.8%2034.9%2056.2%2081.2%2056.1%20130.5%200%20101.8-84.9%20184.6-186.6%20184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5%202.8-3.7%205.6-14.3%2018-17.6%2021.8-3.2%203.7-6.5%204.2-12%201.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8%205.7-9.1%2016.3-30.3%201.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7%200-9.7%201.4-14.8%206.9-5.1%205.6-19.4%2019-19.4%2046.3%200%2027.3%2019.9%2053.7%2022.6%2057.4%202.8%203.7%2039.1%2059.7%2094.8%2083.8%2035.2%2015.2%2049%2016.5%2066.6%2013.9%2010.7-1.6%2032.8-13.4%2037.4-26.4%204.6-13%204.6-24.1%203.2-26.4-1.3-2.5-5-3.9-10.5-6.6z%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M380.9%2097.1C339%2055.1%20283.2%2032%20223.9%2032c-122.4%200-222%2099.6-222%20222%200%2039.1%2010.2%2077.3%2029.6%20111.1L0%20480l117.7-30.9c32.4%2017.7%2068.9%2027.1%20106.1%2027.1h.1c122.3%200%20224.1-99.6%20224.1-222%200-59.3-25.2-115-67.1-157zm-157%20341.6c-33.2%200-65.7-8.9-94-25.7l-6.7-4-69.8%2018.3L72%20359.2l-4.4-6.9c-18.5-29.4-28.2-63.3-28.2-98.2%200-101.7%2082.8-184.5%20184.6-184.5%2049.3%200%2095.6%2019.2%20130.4%2054.1%2034.8%2034.9%2056.2%2081.2%2056.1%20130.5%200%20101.8-84.9%20184.6-186.6%20184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5%202.8-3.7%205.6-14.3%2018-17.6%2021.8-3.2%203.7-6.5%204.2-12%201.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8%205.7-9.1%2016.3-30.3%201.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7%200-9.7%201.4-14.8%206.9-5.1%205.6-19.4%2019-19.4%2046.3%200%2027.3%2019.9%2053.7%2022.6%2057.4%202.8%203.7%2039.1%2059.7%2094.8%2083.8%2035.2%2015.2%2049%2016.5%2066.6%2013.9%2010.7-1.6%2032.8-13.4%2037.4-26.4%204.6-13%204.6-24.1%203.2-26.4-1.3-2.5-5-3.9-10.5-6.6z%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

@media (max-width: 767px){
	a.uny-wa-btn{ width: 100%; justify-content: center; }
}


/* ── 9-sep-2026 (2) · EL BOTÓN DE TRÁMITE SE REHACE DE CERO ───────────
   Lo decidió Luis después de tres intentos de domar el botón original:
   «borra ese botón de acreditación, duplica el de WhatsApp, cámbiale el
   nombre y que el icono sea la flecha».

   Y tiene razón: el botón de Elementor arrastra la clase `btn-white-blue`
   del tema, que le mete su propio degradado, su relleno y un transform al
   pasar el ratón. Cada vez que se apagaba una de esas cosas aparecía otra.
   Es más limpio esconderlo y poner al lado uno nuevo con la misma pinta
   que el de WhatsApp, que ya está bien.

   El nuevo copia del original lo que importa: el enlace, el target y el
   texto —el texto NO se escribe a mano porque en /equivalencias/ y en
   /validacion-de-titulos/ ese botón dice otra cosa.
   ─────────────────────────────────────────────────────────────────────── */

.uny-tram-cta{
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
}

/* el de Elementor se esconde, no se borra: si algún día hay que volver
   atrás basta con quitar esta clase */
.uny-tram-oculto{ display: none !important; }

/* la flecha, del mismo modo que el logo de WhatsApp: una máscara que toma
   el color del texto, así sigue al color que mide el script según el fondo */
a.uny-tram-nuevo .uny-tram-nuevo__ic{
	width: 15px;
	height: 15px;
	flex: none;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat;
}

/* ── 9-sep-2026 (3) · LA PORTADA DE ACREDITACIÓN, ENCUADRE ─────────────
   Luis: «se le está tapando la cara a la estudiante con el menú».

   La portada es un pase de tres fotos (fondo de Elementor, no <img>) y en
   la de la estudiante —DSC05399— la cara cae justo a la altura de la barra
   del menú. Con `cover` y el centro por defecto sobraban solo 71 px de
   recorte vertical: no daba para bajarla. Se amplía un poco el encuadre y
   se ancla arriba, con lo que la cara baja por debajo de la barra.

   Solo en esta página (page-id-5292).
   ─────────────────────────────────────────────────────────────────────── */



/* ── 9-sep-2026 (4) · LOS TEXTOS DE ESA SECCIÓN NO SE MUEVEN ───────────
   Luis: «estos textos cuando muevo el mouse se mueven, quita eso».

   Buscado a fondo antes de tocar: no hay `motion_fx` activo, no hay regla
   `:hover` con transform que les afecte (comprobado recorriendo TODAS las
   hojas contra esos 13 elementos) y tilt.js está cargado pero ningún
   elemento de la página lo activa. Como el origen no aparece por ninguna
   de esas vías, se corta el efecto en el destino: en esta sección el texto
   no se transforma ni se anima, pase lo que pase.

   Los botones quedan fuera: su hover sí tiene que seguir funcionando.
   ─────────────────────────────────────────────────────────────────────── */

.uny-tram-caja .elementor-widget-text-editor,
.uny-tram-caja .elementor-widget-text-editor *,
.uny-tram-caja .elementor-widget-heading,
.uny-tram-caja .elementor-widget-heading *,
.uny-tram-caja h1, .uny-tram-caja h2, .uny-tram-caja h3, .uny-tram-caja p{
	transform: none !important;
	transition: none !important;
	animation: none !important;
	will-change: auto !important;
	perspective: none !important;
}

/* ── 9-sep-2026 (5) · LA PORTADA, UNA SOLA FOTO ────────────────────────
   Luis: «no me gusta que la portada sea un carrusel de fotos; deja una de
   estudiantes y ya, nada de carruseles en las portadas».

   La portada es un contenedor de Elementor con `background: slideshow` y
   tres fotos (auditorio, estudiante con la carpeta, acto de grado). Se
   apaga el pase y se deja fija la de la estudiante con la carpeta, que es
   la que corresponde al trámite.

   Los dos puntitos de al lado del título (`uny-ph__dots`) son decorativos
   —no controlan nada, son dos <i> fijos— pero hacen creer que hay pase.
   Se ocultan aquí también.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5292 .elementor-element-c7fa317 .elementor-background-slideshow{
	display: none !important;
}
body.page-id-5292 .elementor-element-c7fa317{
	background-image: url("/wp-content/uploads/2026/02/DSC05399-scaled.jpg") !important;
}

/* QUIEN PINTA LA PORTADA NO ES EL CONTENEDOR DE ELEMENTOR: ese mide 0 de
   alto. Es `.uny-ph__bg`, el componente propio del sitio, que copia la foto
   y la pinta con `cover` y el foco en 50% 36%. Ahí es donde hay que tocar:
   subiendo el foco al borde superior, la cara de la estudiante baja unos
   80 px y deja de quedar debajo de la barra del menú. */
body.page-id-5292 .uny-ph__bg{
	background-image: url("/wp-content/uploads/2026/02/DSC05399-scaled.jpg") !important;
	background-size: cover !important;
	background-position: 50% 0% !important;
}
body.page-id-5292 .uny-ph__dots{ display: none !important; }

/* ── 9-sep-2026 (6) · LA SECCIÓN DE ACREDITACIÓN, REORGANIZADA ─────────
   Ver el comentario largo en correcciones.js. En resumen: sin la foto, el
   reparto en dos columnas dejaba media sección vacía. Ahora es una sola
   columna de lectura, con el ancho del texto limitado para que las líneas
   no se hagan interminables.
   ─────────────────────────────────────────────────────────────────────── */

.uny-acre-fila{
	flex-direction: column !important;
	gap: 26px !important;
	align-items: stretch !important;
}
.uny-acre-fila > .uny-acre-izq,
.uny-acre-fila > .uny-acre-der{
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 auto !important;
}
/* el texto no se estira de lado a lado: se lee mejor en medida corta */
.uny-acre-fila .elementor-widget-text-editor{
	max-width: 880px;
}
/* la tarjeta de requisitos deja de ser una pastilla estrecha */
.uny-acre-izq > .elementor-element:last-child{
	max-width: 880px;
}
/* los botones, al final y a la izquierda */
.uny-acre-der{
	align-items: flex-start !important;
	justify-content: flex-start !important;
}

/* ── 9-sep-2026 (7) · LA SECCIÓN, CENTRADA ─────────────────────────────
   Luis: «por lo menos centra todo, porque así de lado se ve horrible».

   Se centra el bloque entero: título, entrada, tarjeta y botones. El texto
   deja de ir justificado SOLO aquí: centrado + justificado abre huecos
   enormes entre palabras. El justificado de las demás páginas —el que pidió
   Nereida— no se toca.

   La regla del justificado la inyecta un <style> del propio HTML DESPUÉS de
   esta hoja, así que hace falta más especificidad para ganarle: por eso van
   encadenadas con `.uny-acre-fila`.
   ─────────────────────────────────────────────────────────────────────── */

.uny-acre-fila{
	align-items: center !important;
}
.uny-acre-fila > .uny-acre-izq,
.uny-acre-fila > .uny-acre-der{
	align-items: center !important;
	justify-content: center !important;
}
.uny-acre-fila .elementor-widget-heading,
.uny-acre-fila .elementor-heading-title{
	text-align: center !important;
	width: 100%;
}
.uny-acre-fila .elementor-widget-text-editor,
.uny-acre-fila .elementor-widget-text-editor p{
	text-align: center !important;
	text-justify: auto !important;
}
.uny-acre-fila .elementor-widget-text-editor{
	margin-left: auto !important;
	margin-right: auto !important;
}
/* la tarjeta de requisitos, centrada y con su texto centrado */
.uny-acre-izq > .elementor-element:last-child{
	margin-left: auto !important;
	margin-right: auto !important;
}
/* los dos botones, al centro */
.uny-acre-der .uny-tram-cta{
	justify-content: center !important;
	width: 100%;
}

/* ── 9-sep-2026 · /validacion-de-titulos/ · LAS VENTAJAS, REDISEÑADAS ──
   Luis, tres veces: no quería que quitara cosas, quería otro diseño.

   Lo que había: cuatro pastillas blancas iguales, apiladas en una columna
   de 490 px, cada una con una frase corta y media caja vacía.

   Lo que hay ahora: las cuatro salen de la columna, ocupan el ancho de la
   sección y se ordenan en 2×2. Cada una lleva su número —01 a 04, puestos
   por el contador de CSS, no por texto nuevo—, un filete azul que crece al
   pasar el ratón y una elevación suave. La viñeta redonda original pasa a
   ser el acento de color.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5302 .uny-val-ventajas{
	counter-reset: uny-vent;
	display: block !important;
	width: 100% !important;
}
/* el título de las ventajas cruza las dos columnas */
body.page-id-5302 .uny-val-ventajas > *:not(.uny-val-tarjeta){
	margin: 0 0 6px 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
}

body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta{
	position: relative;
	margin-bottom: 14px !important;
	overflow: hidden;
	margin: 0 !important;
	padding: 26px 26px 26px 30px !important;
	background-color: #ffffff !important;
	border: 1px solid #e4e9f2 !important;
	border-radius: 18px !important;
	box-shadow: 0 4px 18px rgba(11, 18, 54, .07) !important;
	transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
/* el filete azul de la izquierda: crece al pasar el ratón */
body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta::before{
	content: "";
	position: absolute;
	left: 0; top: 0; bottom: 0;
	width: 4px;
	background: linear-gradient(180deg, #0071E3, #25409E);
	transform: scaleX(1);
	transform-origin: left;
	transition: width .22s ease;
}
body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta:hover{
	transform: translateY(-4px);
	box-shadow: 0 14px 34px rgba(11, 18, 54, .14) !important;
	border-color: #cfd9ec !important;
}
body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta:hover::before{ width: 7px; }

/* el número: lo pone el contador, no es texto añadido */
body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta::after{
	counter-increment: uny-vent;
	content: "0" counter(uny-vent);
	position: absolute;
	right: 22px;
	top: 18px;
	font: 800 30px/1 "Montserrat", sans-serif;
	color: rgba(37, 64, 158, .12);
	letter-spacing: -.02em;
	transition: color .22s ease;
}
body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta:hover::after{
	color: rgba(37, 64, 158, .28);
}

body.page-id-5302 .uny-val-ventajas .elementor-icon-list-item{
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	align-items: flex-start !important;
}
body.page-id-5302 .uny-val-ventajas .elementor-icon-list-text,
body.page-id-5302 .uny-val-ventajas .elementor-icon-list-text *{
	text-align: left !important;
	font-size: 16.5px !important;
	line-height: 1.55 !important;
	color: #0B1236 !important;
	font-weight: 600 !important;
	padding-right: 40px;
}
body.page-id-5302 .uny-val-ventajas .elementor-icon-list-icon{ margin-top: 5px; }

@media (max-width: 900px){
	body.page-id-5302 .uny-val-ventajas > .uny-val-tarjeta{ padding: 20px 20px 20px 24px !important; }
}

/* ── 9-sep-2026 · /validacion-de-titulos/ · SEGUNDA SECCIÓN ────────────
   Mismo patrón que el bloque de arriba —el que ya funciona— con el orden
   invertido: texto a la derecha, foto a la izquierda.

   El primer intento usaba la foto a sangre con `position:absolute`, y la
   foto se salía del bloque y la columna de texto se quedaba tan estrecha
   que el título se partía palabra por palabra. Se descarta.
   ─────────────────────────────────────────────────────────────────────── */

.uny-val3{ padding: 26px 0 40px; }

.uny-val3__caja{
	max-width: 1180px;
	margin: 0 auto;
	padding: 58px 60px 54px;
	border-radius: 28px;
	background:
		radial-gradient(110% 130% at 12% 0%, rgba(0,113,227,.34) 0%, rgba(0,113,227,0) 56%),
		linear-gradient(220deg, #0B1236 0%, #17245c 52%, #25409E 100%);
	color: #fff;
}
.uny-val3__grid{
	display: grid;
	grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
	gap: 52px;
	align-items: center;
}
.uny-val3__foto{ position: relative; }
.uny-val3__foto::after{
	content: "";
	position: absolute;
	inset: 18px -18px -18px 18px;
	border: 2px solid rgba(77,163,255,.45);
	border-radius: 22px;
	z-index: 0;
}
.uny-val3__foto img{
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 380px;
	object-fit: cover;
	border-radius: 22px;
}
.uny-val3__col{ padding: 0; }

.uny-val3__tit{
	margin: 0 0 18px;
	font: 800 clamp(24px, 2.4vw, 34px)/1.14 "Montserrat", sans-serif;
	letter-spacing: -.02em;
	color: #fff;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
}
.uny-val3__txt{
	margin: 0 0 24px;
	font: 400 16.5px/1.72 "Montserrat", sans-serif;
	color: rgba(255,255,255,.82);
}
.uny-val3__cita{
	margin: 0 0 28px;
	padding: 4px 0 4px 22px;
	border-left: 3px solid #4DA3FF;
	background: transparent;
}
.uny-val3__cita p{
	margin: 0;
	font: 400 15.5px/1.7 "Montserrat", sans-serif;
	color: rgba(255,255,255,.72);
}

@media (max-width: 900px){
	.uny-val3__caja{ padding: 36px 24px 34px; border-radius: 22px; }
	.uny-val3__grid{ grid-template-columns: 1fr; gap: 28px; }
	.uny-val3__foto::after{ inset: 12px -12px -12px 12px; }
	.uny-val3__foto img{ height: 240px; }
}


/* ═══ 9-sep-2026 · /validacion-de-titulos/ · BLOQUE 1 (RESTAURADO) ═════
   Este bloque se perdió al borrar las reglas que rompían el pie: iban
   pegadas en el archivo y me llevé las dos. Queda anotado para no volver a
   cortar por bloques contiguos sin comprobar qué hay en medio.

   El HTML lo construye correcciones.js con los textos que ya estaban.
   ═══════════════════════════════════════════════════════════════════════ */

.uny-val2{ padding: 0 0 6px; }

.uny-val2__caja{
	max-width: 1180px;
	margin: 0 auto;
	padding: 60px 60px 54px;
	border-radius: 28px;
	background:
		radial-gradient(120% 140% at 82% 0%, rgba(0,113,227,.38) 0%, rgba(0,113,227,0) 58%),
		linear-gradient(140deg, #0B1236 0%, #17245c 52%, #25409E 100%);
	color: #fff;
}
.uny-val2__top{
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, .92fr);
	gap: 54px;
	align-items: center;
}
.uny-val2__kicker{
	margin: 0 0 14px;
	font: 700 12px/1 "Montserrat", sans-serif;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #4DA3FF;
}
.uny-val2__kicker::before{
	content: "";
	display: inline-block;
	width: 26px; height: 2px;
	background: #4DA3FF;
	vertical-align: middle;
	margin-right: 10px;
}
.uny-val2__tit{
	margin: 0 0 18px;
	font: 800 clamp(34px, 4vw, 54px)/1.02 "Montserrat", sans-serif;
	letter-spacing: -.02em;
	color: #fff;
}
.uny-val2__intro{
	margin: 0 0 30px;
	max-width: 520px;
	font: 400 17px/1.7 "Montserrat", sans-serif;
	color: rgba(255,255,255,.82);
}
.uny-val2__cta{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 15px 30px;
	border-radius: 999px;
	background: #fff;
	color: #0B1236 !important;
	font: 700 15px/1 "Montserrat", sans-serif;
	text-decoration: none !important;
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.uny-val2__cta i{
	width: 16px; height: 16px; display: block;
	background-color: currentColor;
	/* el data URI va directo: con variable la máscara no resolvía y la
	   flecha salía como un cuadrado negro */
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	transition: transform .2s ease;
}
.uny-val2__cta:hover{ background: #0071E3; color: #fff !important; transform: translateY(-2px); }
.uny-val2__cta:hover i{ transform: translateX(4px); }

.uny-val2__foto{ position: relative; }
.uny-val2__foto::after{
	content: "";
	position: absolute;
	inset: 18px -18px -18px 18px;
	border: 2px solid rgba(77,163,255,.45);
	border-radius: 22px;
	z-index: 0;
}
.uny-val2__foto img{
	position: relative;
	z-index: 1;
	display: block;
	width: 100%;
	height: 340px;
	object-fit: cover;
	border-radius: 22px;
}

.uny-val2__vent{ margin-top: 54px; }
.uny-val2__ventTit{
	margin: 0 0 6px;
	font: 700 clamp(18px, 2vw, 22px)/1.25 "Montserrat", sans-serif;
	color: #fff;
	letter-spacing: -.01em;
}
.uny-val2__lista{
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 46px;
}
.uny-val2__item{
	display: flex;
	align-items: baseline;
	gap: 18px;
	padding: 20px 6px 20px 0;
	border-top: 1px solid rgba(255,255,255,.16);
	transition: padding-left .22s ease;
}
.uny-val2__item:hover{ padding-left: 8px; }
.uny-val2__num{
	flex: none;
	font: 800 26px/1 "Montserrat", sans-serif;
	color: rgba(77,163,255,.55);
	letter-spacing: -.03em;
	transition: color .22s ease;
}
.uny-val2__item:hover .uny-val2__num{ color: #4DA3FF; }
.uny-val2__txt{
	font: 500 16.5px/1.5 "Montserrat", sans-serif;
	color: rgba(255,255,255,.92);
}

.uny-val2, .uny-val2 *{ text-align: left !important; }

@media (max-width: 900px){
	.uny-val2__caja{ padding: 40px 24px 36px; border-radius: 22px; }
	.uny-val2__top{ grid-template-columns: 1fr; gap: 30px; }
	.uny-val2__foto::after{ inset: 12px -12px -12px 12px; }
	.uny-val2__foto img{ height: 240px; }
	.uny-val2__lista{ grid-template-columns: 1fr; gap: 0; }
	.uny-val2__cta{ width: 100%; justify-content: center; }
}

/* separación entre los dos bloques: ni el hueco enorme de antes ni pegados */
.uny-val3{ padding: 26px 0 24px !important; }

/* separación entre los dos bloques: se aplica al propio recuadro, que es lo
   que se ve. Sobre el contenedor no bastaba: quedaban pegados. */
.uny-val3__caja{ margin-top: 48px !important; }

/* ── 9-sep-2026 · EL FONDO DE LOS BLOQUES, COMO EL DEL PIE ─────────────
   Luis: «quiero que el degradado de los fondos sea parecido al del pie».
   El pie y el resto de piezas del sitio usan el mismo patrón: del azul UNY
   al azul marino. Se adopta ese en lugar del marino profundo que tenía.

   Al aclararse el fondo, los acentos en #4DA3FF perdían contraste: pasan a
   blanco con transparencia.
   ─────────────────────────────────────────────────────────────────────── */

.uny-val2__caja,
.uny-val3__caja{
	background: linear-gradient(160deg, #0071E3 0%, #25409E 100%) !important;
}
.uny-val2__kicker{ color: rgba(255,255,255,.88) !important; }
.uny-val2__kicker::before{ background: rgba(255,255,255,.88) !important; }
.uny-val2__num{ color: rgba(255,255,255,.55) !important; }
.uny-val2__item:hover .uny-val2__num{ color: #fff !important; }
.uny-val2__item{ border-top-color: rgba(255,255,255,.22) !important; }
.uny-val2__foto::after,
.uny-val3__foto::after{ border-color: rgba(255,255,255,.45) !important; }
.uny-val3__cita{ border-left-color: rgba(255,255,255,.55) !important; }
.uny-val2__intro,
.uny-val3__txt{ color: rgba(255,255,255,.9) !important; }
.uny-val3__cita p{ color: rgba(255,255,255,.82) !important; }

/* dos botones en fila; el segundo, de contorno */
.uny-val2__botones{ display: flex; flex-wrap: wrap; gap: 12px; }
.uny-val2__cta--2{
	background: transparent !important;
	border: 2px solid rgba(255,255,255,.75);
	color: #fff !important;
}
.uny-val2__cta--2:hover{ background: #fff !important; color: #25409E !important; border-color: #fff; }
@media (max-width: 900px){
	.uny-val2__botones{ flex-direction: column; }
	.uny-val2__botones .uny-val2__cta{ width: 100%; justify-content: center; }
}

/* aire entre el último bloque y el pie */
body.page-id-5307 .uny-val2{ padding-bottom: 46px !important; }
/* el botón de WhatsApp lleva su logo, no la flecha */
.uny-val2__cta--2 i{
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M380.9%2097.1C339%2055.1%20283.2%2032%20223.9%2032c-122.4%200-222%2099.6-222%20222%200%2039.1%2010.2%2077.3%2029.6%20111.1L0%20480l117.7-30.9c32.4%2017.7%2068.9%2027.1%20106.1%2027.1h.1c122.3%200%20224.1-99.6%20224.1-222%200-59.3-25.2-115-67.1-157zm-157%20341.6c-33.2%200-65.7-8.9-94-25.7l-6.7-4-69.8%2018.3L72%20359.2l-4.4-6.9c-18.5-29.4-28.2-63.3-28.2-98.2%200-101.7%2082.8-184.5%20184.6-184.5%2049.3%200%2095.6%2019.2%20130.4%2054.1%2034.8%2034.9%2056.2%2081.2%2056.1%20130.5%200%20101.8-84.9%20184.6-186.6%20184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5%202.8-3.7%205.6-14.3%2018-17.6%2021.8-3.2%203.7-6.5%204.2-12%201.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8%205.7-9.1%2016.3-30.3%201.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7%200-9.7%201.4-14.8%206.9-5.1%205.6-19.4%2019-19.4%2046.3%200%2027.3%2019.9%2053.7%2022.6%2057.4%202.8%203.7%2039.1%2059.7%2094.8%2083.8%2035.2%2015.2%2049%2016.5%2066.6%2013.9%2010.7-1.6%2032.8-13.4%2037.4-26.4%204.6-13%204.6-24.1%203.2-26.4-1.3-2.5-5-3.9-10.5-6.6z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M380.9%2097.1C339%2055.1%20283.2%2032%20223.9%2032c-122.4%200-222%2099.6-222%20222%200%2039.1%2010.2%2077.3%2029.6%20111.1L0%20480l117.7-30.9c32.4%2017.7%2068.9%2027.1%20106.1%2027.1h.1c122.3%200%20224.1-99.6%20224.1-222%200-59.3-25.2-115-67.1-157zm-157%20341.6c-33.2%200-65.7-8.9-94-25.7l-6.7-4-69.8%2018.3L72%20359.2l-4.4-6.9c-18.5-29.4-28.2-63.3-28.2-98.2%200-101.7%2082.8-184.5%20184.6-184.5%2049.3%200%2095.6%2019.2%20130.4%2054.1%2034.8%2034.9%2056.2%2081.2%2056.1%20130.5%200%20101.8-84.9%20184.6-186.6%20184.6zm101.2-138.2c-5.5-2.8-32.8-16.2-37.9-18-5.1-1.9-8.8-2.8-12.5%202.8-3.7%205.6-14.3%2018-17.6%2021.8-3.2%203.7-6.5%204.2-12%201.4-32.6-16.3-54-29.1-75.5-66-5.7-9.8%205.7-9.1%2016.3-30.3%201.8-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30.1-17.1-41.2-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.6-.2-3.7%200-9.7%201.4-14.8%206.9-5.1%205.6-19.4%2019-19.4%2046.3%200%2027.3%2019.9%2053.7%2022.6%2057.4%202.8%203.7%2039.1%2059.7%2094.8%2083.8%2035.2%2015.2%2049%2016.5%2066.6%2013.9%2010.7-1.6%2032.8-13.4%2037.4-26.4%204.6-13%204.6-24.1%203.2-26.4-1.3-2.5-5-3.9-10.5-6.6z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	width: 18px; height: 18px;
}
.uny-val2__cta--2:hover i{ transform: none; }

/* aire entre el último recuadro y el pie: 46 px se quedaban cortos */
body.page-id-5307 .uny-val2{ padding-bottom: 96px !important; }
body.page-id-5302 .uny-val3{ padding-bottom: 96px !important; }
@media (max-width: 900px){
	body.page-id-5307 .uny-val2,
	body.page-id-5302 .uny-val3{ padding-bottom: 60px !important; }
}

/* ── 9-sep-2026 · /pasantias/ · LOS RECUADROS, EN AZUL ─────────────────
   Luis: «los recuadros de algunos textos deberían ir con el degradado azul
   que estamos usando, porque se ve todo blanco y dificulta la lectura».

   La página era gris claro con cajas blancas encima: sin contraste entre
   fondo y contenido, todo se leía como una sola mancha. Los bloques pasan
   al degradado de la marca —el mismo del pie y del resto de páginas— y lo
   que va dentro se adapta: las fichas se vuelven translúcidas y los rótulos
   pasan a blanco.

   Acotado a esta página (page-id-5323).
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5323 .uny-pg--azul{
	background: linear-gradient(160deg, #0071E3 0%, #25409E 100%) !important;
	border: 0 !important;
	color: #fff !important;
	box-shadow: 0 10px 30px rgba(11, 18, 54, .14) !important;
}
body.page-id-5323 .uny-pg--azul,
body.page-id-5323 .uny-pg--azul p,
body.page-id-5323 .uny-pg--azul li,
body.page-id-5323 .uny-pg--azul span,
body.page-id-5323 .uny-pg--azul strong,
body.page-id-5323 .uny-pg--azul h2,
body.page-id-5323 .uny-pg--azul h3,
body.page-id-5323 .uny-pg--azul h4{
	color: #fff !important;
}
/* el rótulo de cada bloque, en blanco con algo de transparencia */
body.page-id-5323 .uny-pg--azul .uny-bu-rot{
	color: rgba(255,255,255,.82) !important;
}

/* las fichas de dentro: translúcidas, no blancas */
body.page-id-5323 .uny-pg-tarjeta{
	background: rgba(255,255,255,.12) !important;
	border: 1px solid rgba(255,255,255,.22) !important;
	box-shadow: none !important;
	backdrop-filter: none !important;
}
body.page-id-5323 .uny-pg-k{ color: #BBD9FF !important; }
body.page-id-5323 .uny-pg-v{ color: #fff !important; }

/* el número de cada etapa: círculo blanco con la cifra en azul */
body.page-id-5323 .uny-pg-num{
	background: #fff !important;
	color: #25409E !important;
	border: 0 !important;
}

/* enlaces dentro de los bloques */
body.page-id-5323 .uny-pg--azul a{ color: #BBD9FF !important; }
body.page-id-5323 .uny-pg--azul a:hover{ color: #fff !important; }

/* el número dentro del círculo: el color lo lleva un hijo, no el círculo,
   y quedaba blanco sobre blanco (regla del proyecto: el icono nunca del
   color de su círculo) */
body.page-id-5323 .uny-pg-num,
body.page-id-5323 .uny-pg-num *{
	color: #25409E !important;
	-webkit-text-fill-color: #25409E !important;
}


/* ── 9-sep-2026 · /pasantias/ (2) · ALTERNANCIA Y CAJAS CLARAS ─────────
   Los bloques pares se quedan sin recuadro, directamente sobre el gris de
   la página, para que el azul no sea un muro continuo. Y las cajas claras
   que viven DENTRO de un bloque azul recuperan el texto oscuro: tenían
   texto blanco sobre fondo blanco.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5323 .uny-pg--limpio{
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}
body.page-id-5323 .uny-pg--limpio .uny-bu-rot{ color: #25409E !important; }
body.page-id-5323 .uny-pg--limpio .uny-pg-tarjeta{
	background: #fff !important;
	border: 1px solid #e4e9f2 !important;
}
body.page-id-5323 .uny-pg--limpio .uny-pg-k{ color: #0071E3 !important; }
body.page-id-5323 .uny-pg--limpio .uny-pg-v{ color: #0B1236 !important; }
body.page-id-5323 .uny-pg--limpio .uny-pg-num{
	background: #25409E !important;
}
body.page-id-5323 .uny-pg--limpio .uny-pg-num,
body.page-id-5323 .uny-pg--limpio .uny-pg-num *{
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}

/* cajas claras dentro de un bloque azul: texto oscuro, no blanco */
body.page-id-5323 .uny-pg-interior-claro,
body.page-id-5323 .uny-pg-interior-claro *{
	color: #0B1236 !important;
	-webkit-text-fill-color: #0B1236 !important;
}
body.page-id-5323 .uny-pg-interior-claro a,
body.page-id-5323 .uny-pg-interior-claro a *{
	color: #0071E3 !important;
	-webkit-text-fill-color: #0071E3 !important;
}

/* ── 9-sep-2026 · /pasantias/ (3) · ETAPAS Y REQUISITOS ────────────────
   Luis: «este cuadro de 3 etapas puedes diseñarlo de otra forma más cool»
   y «los requisitos organízalos de otra forma, ponle iconos».

   Etapas: dejan de ser tres renglones apilados y pasan a una línea de
   tiempo de tres columnas, con el número en un círculo blanco grande y un
   hilo que los une.

   Requisitos: dejan de ser viñetas y pasan a fichas en dos columnas, cada
   una con su marca de verificación.

   La caja del aviso (`uny-pg-nota`) va sobre fondo claro: su texto en azul
   marino, que es lo que estaba ilegible.
   ─────────────────────────────────────────────────────────────────────── */

/* ── línea de tiempo de las tres etapas ── */
body.page-id-5323 .uny-pg--azul .uny-pg-pasos{
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 30px !important;
	position: relative;
	margin-top: 26px !important;
}
/* el hilo que une los círculos */
body.page-id-5323 .uny-pg--azul .uny-pg-pasos::before{
	content: "";
	position: absolute;
	/* el hilo va del centro del primer círculo al del último, no hasta el
	   borde del bloque: con 3 columnas, el último centro cae a un tercio
	   del ancho desde la derecha */
	left: 26px;
	right: calc(33.333% - 26px);
	top: 26px;
	height: 2px;
	background: rgba(255,255,255,.28);
}
body.page-id-5323 .uny-pg--azul .uny-pg-pasos li{
	display: block !important;
	position: relative;
	z-index: 1;
}
body.page-id-5323 .uny-pg--azul .uny-pg-pasos .uny-pg-num{
	width: 52px !important;
	height: 52px !important;
	flex: none !important;
	margin-bottom: 16px;
	background: #fff !important;
	font-size: 19px !important;
	box-shadow: 0 0 0 7px rgba(255,255,255,.14);
}
body.page-id-5323 .uny-pg--azul .uny-pg-pasos .uny-pg-num,
body.page-id-5323 .uny-pg--azul .uny-pg-pasos .uny-pg-num *{
	color: #25409E !important;
	-webkit-text-fill-color: #25409E !important;
}
body.page-id-5323 .uny-pg--azul .uny-pg-pasos strong{
	font-size: 17.5px !important;
	color: #fff !important;
	margin-bottom: 8px !important;
	letter-spacing: -.01em;
}
body.page-id-5323 .uny-pg--azul .uny-pg-pasos p{
	color: rgba(255,255,255,.86) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
}

/* ── requisitos con marca de verificación ── */
body.page-id-5323 .uny-pg--azul .uny-pg-lista{
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
	margin-top: 18px !important;
}
body.page-id-5323 .uny-pg--azul .uny-pg-lista li{
	padding: 15px 18px 15px 52px !important;
	background: rgba(255,255,255,.10);
	border: 1px solid rgba(255,255,255,.20);
	border-radius: 14px;
	color: #fff !important;
	font-size: 15px !important;
	transition: background-color .2s ease, transform .2s ease;
}
body.page-id-5323 .uny-pg--azul .uny-pg-lista li:hover{
	background: rgba(255,255,255,.16);
	transform: translateY(-2px);
}
body.page-id-5323 .uny-pg--azul .uny-pg-lista li::before{
	content: "✓" !important;
	left: 16px !important;
	top: 14px !important;
	width: 24px !important;
	height: 24px !important;
	background: #fff !important;
	color: #25409E !important;
	-webkit-text-fill-color: #25409E !important;
	font: 800 13px/24px "Montserrat", sans-serif !important;
	text-align: center;
	border-radius: 50% !important;
}

/* la caja del aviso: fondo claro, texto oscuro */
body.page-id-5323 .uny-pg-nota,
body.page-id-5323 .uny-pg-nota *{
	color: #0B1236 !important;
	-webkit-text-fill-color: #0B1236 !important;
}

@media (max-width: 900px){
	body.page-id-5323 .uny-pg--azul .uny-pg-pasos{
		grid-template-columns: 1fr !important;
		gap: 20px !important;
	}
	body.page-id-5323 .uny-pg--azul .uny-pg-pasos::before{ display: none; }
	body.page-id-5323 .uny-pg--azul .uny-pg-lista{ grid-template-columns: 1fr !important; }
}

/* ── 9-sep-2026 · /proyecto-de-becas/ · LA ENTRADILLA, MÁS CONTENIDA ───
   Luis: «estos textos del inicio están muy grandes».

   Medido: el párrafo `.uny-bc-decl` iba a 32,5 px, en negrita y justificado
   sobre 720 px de ancho. A ese cuerpo, un párrafo de cuatro líneas compite
   con el título de la página, y el justificado abría huecos entre palabras.

   Pasa a 21 px, seminegrita y alineado a la izquierda: sigue leyéndose como
   entrada destacada, pero deja de gritar.
   ─────────────────────────────────────────────────────────────────────── */

.uny-bc-decl{
	font-size: 21px !important;
	font-weight: 600 !important;
	line-height: 1.55 !important;
	text-align: left !important;
	max-width: 640px;
}
@media (max-width: 767px){
	.uny-bc-decl{ font-size: 18.5px !important; }
}

/* ── 9-sep-2026 · /proyecto-de-becas/ · LA COLUMNA DERECHA, MÁS ABAJO ──
   Luis: «el texto de la derecha sigue mal, ponlo más abajo».

   Intenté alinearlo por JS con la entradilla de la izquierda y no había
   forma: en el HTML hay más de una copia de ese bloque y la que se puede
   medir no es la que se ve. Aquí va directo, sobre el contenedor concreto
   y solo en esta página.
   ─────────────────────────────────────────────────────────────────────── */

/* NOTA: la regla apuntaba a `elementor-element-be7b17d`, que resultó ser una
   COPIA OCULTA del bloque (mide 0 de alto). Se retira para no dejar reglas
   muertas. El bloque visible no he conseguido identificarlo desde aquí. */


/* ── 9-sep-2026 · /test-vocacional/ · ANCHO DE LA ENTRADA ──────────────
   Luis: «el primer texto debería estar alineado con el recuadro de abajo,
   porque se corta a la derecha».

   Medido: el párrafo de entrada llevaba `max-width: 900px` y terminaba en
   1004, mientras que el recuadro de abajo llega a 1196. Se le quita el
   tope para que los dos cierren en la misma línea.

   Acotado a esta página: la clase `uny-pg-entrada` también se usa en
   Pasantías y allí nadie ha pedido cambiarlo.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-3839 .uny-pg-entrada{
	max-width: none !important;
}

/* NOTA (9-sep): aquí hubo un bloque que cambiaba el punto de recorte de las
   fotos de /culturales/. Se probó al 30 %, al 15 % y anclado arriba, y en cada
   pasada quedaba mal alguna foto distinta: el marco es fijo (4:3) y las fotos
   tienen composiciones muy diferentes, así que un solo punto de recorte no
   sirve para todas. Luis pidió dejarlo como estaba y se retira entero.
   Lo que SÍ se queda: las 21 fotos que faltaban y el fondo unificado. */

/* ── 9-sep-2026 · /culturales/ · UN SOLO FONDO ─────────────────────────
   Luis: «hay dos fondos distintos, uno se ve como arena y otro blanco, y
   los dos deben ser gris claro como las otras páginas».

   Medido: las secciones `#uny-galcul` (la galería) y `#uny-grupos` van en
   #F6F8FD, un blanco azulado que no es el gris de la web. Pasan a #F4F4F4,
   que es el fondo de página del proyecto.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5466 #uny-galcul,
body.page-id-5466 #uny-grupos,
body.page-id-5466 .uny-gc-seccion{
	background: #F4F4F4 !important;
	background-color: #F4F4F4 !important;
}


/* ── 9-sep-2026 · /culturales/ · UNA FOTO CONCRETA ─────────────────────
   Luis señaló esta: la tarjeta «Actividad cultural UNY» le corta la cara a
   la cantante.

   Se ajusta SOLO esa imagen, por su nombre de archivo. Antes intenté
   arreglarlo cambiando el encuadre de toda la galería y en cada pasada
   estropeaba otra distinta; foto a foto es lo que funciona aquí.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5466 img[src*="culturales-1-c"]{
	object-position: center 8% !important;
}

/* ── 9-sep-2026 · /culturales/ · ENCUADRE FOTO A FOTO ──────────────────
   Luis: «no puedes dejar unas como te digo y otras de la otra forma?».
   Sí, y es lo correcto aquí.

   Miré las fotos una por una. Las de los grupos culturales son VERTICALES
   y con la cara en el tercio superior, así que el recorte centrado del
   marco 4:3 se las come. Las del orfeón son horizontales de coro y con el
   centro se ven bien, así que esas NO se tocan.

   Cada valor sale de mirar dónde está la cara en esa foto concreta:
     culturales-1  vestido de ondas, cara muy arriba .......  10 %
     culturales-2  pelo rizado con guitarra ................  22 %
     culturales-3  camisa de cuadros .......................  14 %
     culturales-4  chico y chica cantando ..................  16 %
     culturales-5  chaqueta vaquera ........................  18 %
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5466 img[src*="culturales-1.jpg"]{ object-position: center 10% !important; }
body.page-id-5466 img[src*="culturales-2.jpg"]{ object-position: center 22% !important; }
body.page-id-5466 img[src*="culturales-3.jpg"]{ object-position: center 14% !important; }
body.page-id-5466 img[src*="culturales-4.jpg"]{ object-position: center 16% !important; }
body.page-id-5466 img[src*="culturales-5.jpg"]{ object-position: center 18% !important; }

/* por si esas fotos se pintan como fondo y no como <img> */
body.page-id-5466 [style*="culturales-1.jpg"]{ background-position: center 10% !important; }
body.page-id-5466 [style*="culturales-2.jpg"]{ background-position: center 22% !important; }
body.page-id-5466 [style*="culturales-3.jpg"]{ background-position: center 14% !important; }
body.page-id-5466 [style*="culturales-4.jpg"]{ background-position: center 16% !important; }
body.page-id-5466 [style*="culturales-5.jpg"]{ background-position: center 18% !important; }

/* ── 9-sep-2026 · /deporte/ · EL CIERRE, CON DISEÑO ────────────────────
   Mismo lenguaje que el resto de la web: tarjeta blanca sobre el gris,
   titulares en azul marino con el tamaño de los rótulos del sitio, texto
   alineado a la izquierda —el justificado abría huecos— y el correo en
   azul UNY en vez del rojo subrayado que traía.
   ─────────────────────────────────────────────────────────────────────── */

/* el recuadro va con el degradado de la marca, como el resto de bloques
   que hemos hecho hoy; y la sección, sobre el gris de la web */
body.page-id-5491 .uny-dep-seccion{
	background: #F4F4F4 !important;
	padding-bottom: 90px !important;
}
body.page-id-5491 .uny-dep-cierre{
	background: linear-gradient(160deg, #0071E3 0%, #25409E 100%) !important;
	border: 0 !important;
	border-radius: 22px;
	padding: 40px 44px 36px;
	box-shadow: 0 12px 34px rgba(11, 18, 54, .16);
	color: #fff !important;
}
body.page-id-5491 .uny-dep-cierre h1,
body.page-id-5491 .uny-dep-cierre h2,
body.page-id-5491 .uny-dep-cierre h3,
body.page-id-5491 .uny-dep-cierre h4{
	color: #ffffff !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	margin: 28px 0 12px !important;
	padding-top: 22px;
	border-top: 1px solid rgba(255,255,255,.22);
}
body.page-id-5491 .uny-dep-cierre > :first-child h2,
body.page-id-5491 .uny-dep-cierre h2:first-child,
body.page-id-5491 .uny-dep-cierre h3:first-child{
	margin-top: 0 !important;
	padding-top: 0;
	border-top: 0;
}
body.page-id-5491 .uny-dep-cierre p{
	color: rgba(255,255,255,.9) !important;
	font-size: 15.5px !important;
	line-height: 1.72 !important;
	text-align: left !important;
	margin: 0 0 12px !important;
}
body.page-id-5491 .uny-dep-cierre strong{ color: #ffffff !important; }
body.page-id-5491 .uny-dep-cierre a{
	color: #ffffff !important;
	text-decoration: none !important;
	font-weight: 700 !important;
	border-bottom: 1px solid rgba(255,255,255,.5);
}
body.page-id-5491 .uny-dep-cierre a:hover{ border-bottom-color: #fff; }

@media (max-width: 767px){
	body.page-id-5491 .uny-dep-cierre{ padding: 24px 20px 20px; border-radius: 14px; }
}

/* ── 9-sep-2026 · /deporte/ · UN SOLO FONDO ────────────────────────────
   Luis: «hay 2 clases de fondo otra vez, uno color arena y otro blanco, y
   todo debe ser gris claro como el resto».

   Mismo caso que en /culturales/: las secciones de galería y de grupos van
   en #F6F8FD, un blanco azulado. Pasan al gris #F4F4F4 del proyecto.
   ─────────────────────────────────────────────────────────────────────── */

body.page-id-5491 #uny-galcul,
body.page-id-5491 #uny-grupos,
body.page-id-5491 .uny-gr-caja,
body.page-id-5491 .uny-dep-seccion{
	background: #F4F4F4 !important;
	background-color: #F4F4F4 !important;
}

/* ── 9-sep-2026 · /lo-que-pasa-en-la-uny/ · RETÍCULA DE NOTAS ──────────
   El HTML lo arma correcciones.js. Cuatro tarjetas iguales en 2×2: foto a
   la misma altura, título y resumen recortados a las mismas líneas, botón
   siempre abajo. En el teléfono, una columna.
   ─────────────────────────────────────────────────────────────────────── */

.uny-news{ max-width: 1180px; margin: 0 auto; padding: 10px 22px 70px; }
.uny-news__grid{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 28px;
}
.uny-news__card{
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid #e4e9f2;
	border-radius: 20px;
	overflow: hidden;
	box-shadow: 0 4px 18px rgba(11, 18, 54, .06);
	transition: transform .22s ease, box-shadow .22s ease;
}
.uny-news__card:hover{ transform: translateY(-4px); box-shadow: 0 16px 36px rgba(11, 18, 54, .14); }
.uny-news__foto{ display: block; }
.uny-news__foto img{
	display: block;
	width: 100%;
	height: 250px;
	object-fit: cover;
	transition: transform .35s ease;
}
.uny-news__card:hover .uny-news__foto img{ transform: scale(1.03); }
.uny-news__cuerpo{ display: flex; flex-direction: column; flex: 1; padding: 22px 24px 24px; }
.uny-news__tit{
	margin: 0 0 10px !important;
	font: 700 20px/1.3 "Montserrat", sans-serif !important;
	color: #25409E !important;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.uny-news__res{
	margin: 0 0 18px !important;
	font: 400 15px/1.65 "Montserrat", sans-serif !important;
	color: #4a5270 !important;
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.uny-news__btn{
	margin-top: auto;
	align-self: flex-start;
	display: inline-flex; align-items: center; gap: 10px;
	padding: 12px 22px;
	border-radius: 999px;
	background: #0071E3;
	color: #fff !important;
	font: 700 14px/1 "Montserrat", sans-serif;
	text-decoration: none !important;
	transition: background-color .2s ease;
}
.uny-news__btn:hover{ background: #25409E; }
.uny-news__btn i{
	width: 13px; height: 13px; display: block; background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20448%20512%27%3E%3Cpath%20d%3D%27M190.5%2066.9l22.2-22.2c9.4-9.4%2024.6-9.4%2033.9%200L441%20239c9.4%209.4%209.4%2024.6%200%2033.9L246.6%20467.3c-9.4%209.4-24.6%209.4-33.9%200l-22.2-22.2c-9.5-9.5-9.3-25%20.4-34.3L311.4%20296H24c-13.3%200-24-10.7-24-24v-32c0-13.3%2010.7-24%2024-24h287.4L190.9%20101.2c-9.8-9.3-10-24.8-.4-34.3z%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
}
@media (max-width: 860px){
	.uny-news__grid{ grid-template-columns: 1fr; gap: 20px; }
	.uny-news__foto img{ height: 210px; }
	.uny-news__btn{ align-self: stretch; justify-content: center; }
}

/* ── 9-sep-2026 · NOTAS DE PRENSA · TRATAMIENTO EDITORIAL ──────────────
   Ver el bloque del mismo nombre en correcciones.js (quién marca qué).
   Columna de lectura de 780 px, texto a la izquierda, entradilla más
   grande, foto de portada contenida, galería en mosaico 4 columnas con la
   primera foto a doble tamaño.
   ─────────────────────────────────────────────────────────────────────── */

body.uny-nota .uny-nota__tit{
	font-size: clamp(26px, 3.2vw, 40px) !important;
	line-height: 1.15 !important;
	letter-spacing: -.01em !important;
	max-width: 900px;
}
body.uny-nota .uny-nota__portada img{
	width: 100% !important;
	height: clamp(300px, 42vw, 520px) !important;
	object-fit: cover !important;
	border-radius: 22px !important;
}

/* cuerpo: columna de lectura */
body.uny-nota .uny-nota__parrafo{
	max-width: 780px !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
/* la tipografía de los párrafos y la entradilla la escribe correcciones.js
   en línea (ver allí por qué): aquí solo queda la columna de lectura */

/* galería en mosaico */
body.uny-nota .uny-nota__galTit{
	text-align: center !important;
	color: #25409E !important;
	margin: 46px 0 22px !important;
}
body.uny-nota .uny-nota__galeria{
	max-width: 1180px;
	margin: 0 auto 30px;
	padding: 0 22px;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-rows: 210px;
	grid-auto-flow: dense;
	gap: 14px;
}
body.uny-nota .uny-nota__foto{
	display: block;
	overflow: hidden;
	border-radius: 16px;
	background: #e9edf5;
}
body.uny-nota .uny-nota__foto:first-child{ grid-column: span 2; grid-row: span 2; }
body.uny-nota .uny-nota__foto img{
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .35s ease;
}
body.uny-nota .uny-nota__foto:hover img{ transform: scale(1.04); }

@media (max-width: 860px){
	body.uny-nota .uny-nota__galeria{ grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 160px; gap: 10px; }
	body.uny-nota .uny-nota__foto:first-child{ grid-column: span 2; grid-row: span 1; }
	body.uny-nota .uny-nota__parrafo p{ font-size: 16px !important; }
	body.uny-nota .uny-nota__lead p:first-of-type{ font-size: 18px !important; }
}
/* subtítulos dentro del cuerpo de la nota: misma columna de lectura */
body.uny-nota .uny-nota__sub{
	max-width: 780px !important;
	margin: 30px auto 8px !important;
}
body.uny-nota .uny-nota__sub .elementor-heading-title{
	font-size: 22px !important;
	line-height: 1.3 !important;
	color: #25409E !important;
	text-align: left !important;
}

/* ── 9-sep-2026 · /lo-que-pasa-en-la-uny/ · LA PORTADA NO SE «LEVANTA» ──
   Luis: «cuando me paro encima de la portada hace zoom, y la portada no es
   un post de prensa».

   Medido: no es un zoom de la foto. La página trae una regla propia,
   `.elementor-5496 .e-con-full:hover { transform: translateY(-6px);
   box-shadow: … }`, pensada para levantar las tarjetas de las notas, pero
   escrita sobre CUALQUIER contenedor de ancho completo — y la portada es
   uno. Las tarjetas nuevas ya llevan su propio hover, así que en esta
   página esa regla se apaga entera. Acotado a page-id-5496.
   ─────────────────────────────────────────────────────────────────────── */
body.page-id-5496 .e-con-full:hover,
body.page-id-5496 .elementor-5496 .e-con-full:hover{
	transform: none !important;
	box-shadow: none !important;
}

/* ── 9-sep-2026 · /lo-que-pasa-en-la-uny/ · LA PORTADA SIN MARCO ───────
   Luis: «tiene un recuadro blanco alrededor y una sombra paralela; quita
   eso de la portada y deja el fondo gris».

   Esta página viste TODOS sus contenedores de ancho completo como
   tarjeta (fondo blanco, esquinas, sombra, relleno) y la portada cae en
   uno de ellos. Al contenedor que envuelve la portada se le quita el
   marco entero. Acotado a page-id-5496.
   ─────────────────────────────────────────────────────────────────────── */
body.page-id-5496 .uny-fh__marco{
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
}

/* ── 9-sep-2026 · /egresados/ · COMPONENTES COPIADOS DE BIENESTAR ──────
   Valores medidos en el CSS de Bienestar (uny-bu-*): panel blanco radio 26
   con borde #E6ECF8 y sombra suave; cabecera con icono de 54 px en
   degradado; rótulo 12,5 px espaciado en #7C89A8; título con las últimas
   palabras en azul; panel azul 102° #1B3488→#25409E→#2D6BE0; fichas con
   barra superior en degradado, número en la esquina e icono en círculo
   #E4EDFC. El HTML lo arma correcciones.js.
   ─────────────────────────────────────────────────────────────────────── */
.uny-eg{ max-width: 1180px; margin: 0 auto; padding: 8px 22px 70px; font-family: "Montserrat", sans-serif; }
.uny-eg__intro{ max-width: 860px; margin: 0 auto 30px !important; font-size: 17.5px !important; line-height: 1.7 !important; color: #2b3a55 !important; }
.uny-eg__area{
	position: relative; background: #fff; border: 1px solid #E6ECF8; border-radius: 26px;
	padding: 30px 30px 26px; margin-bottom: 22px; box-shadow: 0 8px 26px rgba(17,34,102,.07); overflow: hidden;
}
.uny-eg__cab{ display: flex; align-items: center; gap: 16px; padding-bottom: 16px; margin-bottom: 20px; border-bottom: 2px solid #E9EFFA; }
.uny-eg__ico{ flex: 0 0 54px; width: 54px; height: 54px; border-radius: 15px; background: linear-gradient(135deg,#0071E3,#25409E); color: #fff; display: flex; align-items: center; justify-content: center; }
.uny-eg__ico svg{ width: 26px; height: 26px; }
.uny-eg__tit{ margin: 0 !important; font-size: clamp(21px,2vw,27px) !important; line-height: 1.2 !important; font-weight: 700 !important; color: #0B1236 !important; text-transform: none !important; }
.uny-eg__eye{ color: #0071E3; }
.uny-eg__rot{ display: flex; align-items: center; gap: 9px; margin: 0 0 11px !important; font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: .19em; text-transform: uppercase; color: #7C89A8 !important; }
.uny-eg__rot::before{ content: ""; width: 5px; height: 14px; border-radius: 3px; background: linear-gradient(180deg,#0071E3,#25409E); }
.uny-eg__panel{
	border-radius: 22px; padding: 22px 28px; color: #fff; font-size: 16px; line-height: 1.7;
	background: linear-gradient(102deg,#1B3488 0%,#25409E 44%,#2D6BE0 100%); box-shadow: 0 12px 30px rgba(17,34,102,.20);
}
.uny-eg__txt{ margin: 0 0 6px !important; font-size: 16px !important; line-height: 1.7 !important; color: #2b3a55 !important; max-width: 900px; }
.uny-eg__fns{ display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; margin-top: 20px; }
.uny-eg__fns--4{ grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.uny-eg__fn, .uny-eg__reel{
	position: relative; display: flex; flex-direction: column; align-items: center; text-align: center !important;
	padding: 26px 18px 20px; border: 1px solid #E6ECF8; border-radius: 18px; background: #fff;
	text-decoration: none !important; transition: transform .2s ease, box-shadow .2s ease;
}
.uny-eg__fn:hover, .uny-eg__reel:hover{ transform: translateY(-3px); box-shadow: 0 10px 20px rgba(11,18,54,.10); }
.uny-eg__fn::before, .uny-eg__reel::before{ content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 44px; height: 4px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg,#0071E3,#25409E); }
.uny-eg__num{ position: absolute; top: 11px; right: 14px; font-size: 11.5px; font-weight: 700; color: #C3CFE6; letter-spacing: .06em; }
.uny-eg__fico{ width: 60px; height: 60px; border-radius: 50%; background: #E4EDFC; color: #1B3488; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.uny-eg__fico svg{ width: 26px; height: 26px; }
.uny-eg__fnT{ display: block; font-size: 15.5px; font-weight: 700; color: #0B1236; margin-bottom: 6px; text-align: center !important; }
.uny-eg__fnD{ display: block; font-size: 14.5px; line-height: 1.55; color: #4a5270; text-align: center !important; }
.uny-eg__reel .uny-eg__fnD{ color: #25409E; font-weight: 700; }
.uny-eg__reels{ display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-top: 18px; }
.uny-eg__cierre{
	margin-top: 28px; padding: 42px 40px; border-radius: 26px; text-align: center !important; color: #fff;
	background: linear-gradient(160deg,#0071E3 0%,#25409E 100%); box-shadow: 0 12px 30px rgba(17,34,102,.20);
}
.uny-eg__cierreTit{ margin: 0 0 20px !important; font-size: clamp(22px,2.4vw,30px) !important; font-weight: 800 !important; color: #fff !important; text-align: center !important; text-transform: none !important; }
.uny-eg__cta{ display: inline-block; padding: 15px 32px; border-radius: 999px; background: #fff; color: #0B1236 !important; font-weight: 700; font-size: 15px; text-decoration: none !important; transition: transform .2s ease, background-color .2s ease; }
.uny-eg__cta:hover{ transform: translateY(-2px); background: #EAF2FF; }
@media (max-width: 767px){
	.uny-eg__area{ padding: 22px 18px 20px; border-radius: 20px; }
	.uny-eg__cierre{ padding: 30px 22px; }
	.uny-eg__cta{ display: block; }
}

/* ── 9-sep-2026 · /egresados/ · LA INTRO, AL ANCHO DEL PANEL Y CON AIRE ─
   Luis: «el texto está muy pegado a la portada, y debe estar estirado al
   mismo ancho que la sección que le sigue». Se le quita el tope de 860 px
   —ocupa lo mismo que el panel de abajo— y se separa 44 px de la franja. */
.uny-eg{ padding-top: 44px !important; }
.uny-eg__intro{
	max-width: none !important;
	width: 100% !important;
	margin: 0 0 30px !important;
}
@media (max-width: 767px){ .uny-eg{ padding-top: 28px !important; } }

/* ── 9-sep-2026 · /egresados/ · LOS REELS, INCRUSTADOS ─────────────────
   Reproductor oficial de Instagram dentro de cada ficha (formato
   vertical), cuatro por fila en escritorio, dos en tablet, uno en el
   teléfono. Debajo, el enlace original. */
.uny-eg__reel--video{ padding: 18px 12px 14px; align-items: stretch; }
.uny-eg__embed{ width: 100%; border-radius: 12px; overflow: hidden; background: #F4F6FB; }
.uny-eg__embed iframe{ display: block; width: 100%; height: 600px; border: 0; }
.uny-eg__reelLink{
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	margin-top: 12px; font-size: 13.5px; font-weight: 700; color: #25409E !important; text-decoration: none !important;
}
.uny-eg__reelLink svg{ width: 18px; height: 18px; }
.uny-eg__reelLink:hover{ text-decoration: underline !important; }
@media (max-width: 1100px){ .uny-eg__reels{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 600px){ .uny-eg__reels{ grid-template-columns: 1fr !important; } .uny-eg__embed iframe{ height: 640px; } }

/* ── 9-sep-2026 · /egresados/ · CARRUSEL DE REELS (coverflow) ──────────
   El activo al frente a tamaño completo; los vecinos detrás, a los lados,
   más pequeños y atenuados; los lejanos ocultos. Flechas a los lados y
   puntos debajo. Sin librerías: posición absoluta + transform + transición. */
.uny-eg__cov{ position: relative; margin-top: 22px; padding: 0 60px 44px; }
.uny-eg__covPista{ position: relative; height: 700px; }
.uny-eg__covItem{
	position: absolute; left: 50%; top: 0; width: 340px; margin-left: -170px;
	display: flex; flex-direction: column; align-items: stretch;
	padding: 18px 12px 14px; border: 1px solid #E6ECF8; border-radius: 18px; background: #fff;
	box-shadow: 0 10px 30px rgba(11,18,54,.10);
	transition: transform .5s cubic-bezier(.22,.8,.25,1), opacity .5s ease, filter .5s ease;
	will-change: transform;
}
.uny-eg__covItem::before{ content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 44px; height: 4px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg,#0071E3,#25409E); }
.uny-eg__covItem.is-act{ transform: translateX(0) scale(1); opacity: 1; z-index: 3; filter: none; }
.uny-eg__covItem.is-der{ transform: translateX(72%) scale(.82); opacity: .55; z-index: 2; filter: saturate(.6); }
.uny-eg__covItem.is-izq{ transform: translateX(-72%) scale(.82); opacity: .55; z-index: 2; filter: saturate(.6); }
.uny-eg__covItem.is-lejos{ transform: translateX(0) scale(.6); opacity: 0; z-index: 1; pointer-events: none; }
.uny-eg__covItem .uny-eg__embed iframe{ height: 560px; }
/* tapa transparente sobre los vecinos: captura el clic que el iframe se tragaría */
.uny-eg__covCap{ position: absolute; inset: 0; border: 0; background: transparent; cursor: pointer; border-radius: 18px; }
.uny-eg__covItem.is-act .uny-eg__covCap{ display: none; }
.uny-eg__covBtn{
	position: absolute; top: 300px; z-index: 5; width: 46px; height: 46px; border-radius: 50%; border: 0; cursor: pointer;
	background: linear-gradient(135deg,#0071E3,#25409E); color: #fff; font-size: 30px; line-height: 44px;
	box-shadow: 0 8px 20px rgba(17,34,102,.28); transition: transform .2s ease;
}
.uny-eg__covBtn:hover{ transform: scale(1.08); }
.uny-eg__covBtn--izq{ left: 0; } .uny-eg__covBtn--der{ right: 0; }
.uny-eg__covDots{ position: absolute; left: 0; right: 0; bottom: 8px; display: flex; justify-content: center; gap: 8px; }
.uny-eg__covDot{ width: 10px; height: 10px; border-radius: 6px; border: 0; padding: 0; background: #C3CFE6; cursor: pointer; transition: width .25s ease, background-color .25s ease; }
.uny-eg__covDot.is-act{ width: 26px; background: #0071E3; }
@media (max-width: 900px){
	.uny-eg__cov{ padding: 0 0 44px; }
	.uny-eg__covPista{ height: 690px; }
	.uny-eg__covItem.is-der, .uny-eg__covItem.is-izq{ opacity: 0; pointer-events: none; }
	.uny-eg__covBtn{ top: auto; bottom: 0; width: 42px; height: 42px; line-height: 40px; }
	.uny-eg__covBtn--izq{ left: 8px; } .uny-eg__covBtn--der{ right: 8px; }
}
@media (max-width: 420px){ .uny-eg__covItem{ width: 300px; margin-left: -150px; } }
/* menos aire muerto bajo la ficha activa del carrusel */
.uny-eg__covPista{ height: 648px !important; }
@media (max-width: 900px){ .uny-eg__covPista{ height: 660px !important; } }

/* ── 9-sep-2026 · /relaciones-interinstitucionales/ · menos hueco ──────
   164 px entre el texto y «Nuestras instituciones aliadas»: se acercaba la
   sección 72 px con un margen negativo.
   11-sep-2026: Luis lo vio a 1470 px: «los textos se ven uno encima de
   otro». A ese ancho el párrafo termina más abajo y el margen negativo lo
   pisaba con el título. El margen negativo se quita: la separación real
   entre el texto y la sección la fija el propio bloque. */
body.page-id-5591 .uny-rel__aliadas{ margin-top: 0 !important; }
/* al subir la sección quedaba DEBAJO del bloque anterior, que la tapaba con
   su fondo y se comía el título: se pone por encima en el apilamiento */
body.page-id-5591 .uny-rel__aliadas{ position: relative !important; z-index: 3 !important; }

/* ── 9-sep-2026 · /egresados/ · flechas centradas y carga perezosa ────
   Las flechas eran caracteres de texto (‹ ›) y en Montserrat caían bajos
   dentro del círculo: pasan a SVG centrado con flex. Y mientras un reel no
   ha cargado, su hueco muestra el icono de Instagram sobre gris claro. */
.uny-eg__covBtn{ display: flex !important; align-items: center; justify-content: center; padding: 0 !important; font-size: 0 !important; line-height: 0 !important; }
.uny-eg__covBtn svg{ width: 22px; height: 22px; display: block; }
.uny-eg__embed--esp{ position: relative; min-height: 560px; background: #EEF2FA; display: flex; align-items: center; justify-content: center; }
.uny-eg__espIco{ width: 64px; height: 64px; border-radius: 50%; background: #fff; color: #25409E; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(11,18,54,.10); }
.uny-eg__espIco svg{ width: 30px; height: 30px; }
.uny-eg__embed--esp iframe{ position: absolute; inset: 0; }

/* ── 9-sep-2026 · /egresados/ · HOVER DE LOS BOTONES DEL CARRUSEL ──────
   Luis: «cuando me paro encima se ponen en rojo». Es la regla del sitio
   que pinta de rosa #c36 cualquier <button> en hover (ya cazada el 8-sep).
   Flechas y puntos llevan su propio hover con prioridad —azul más claro,
   «sobreexpuesto»— y la tapa transparente sobre los reels vecinos se queda
   transparente, que era lo que teñía la tarjeta de rosa. */
.uny-eg__covBtn:hover,
.uny-eg__covBtn:focus{
	background: linear-gradient(135deg,#3B8DEB,#2F5BD1) !important;
	background-color: #3B8DEB !important;
	color: #fff !important;
	box-shadow: 0 10px 24px rgba(0,113,227,.35) !important;
}
.uny-eg__covCap,
.uny-eg__covCap:hover,
.uny-eg__covCap:focus{
	background: transparent !important;
	background-color: transparent !important;
	box-shadow: none !important;
}
.uny-eg__covDot:hover,
.uny-eg__covDot:focus{ background: #7FB3F0 !important; background-color: #7FB3F0 !important; color: transparent !important; }
.uny-eg__covDot.is-act:hover{ background: #0071E3 !important; background-color: #0071E3 !important; }

/* ── 9-sep-2026 · /talento-humano/ · COMPONENTES COPIADOS DE BIENESTAR ─
   Mismos valores que en Egresados (medidos en Bienestar): panel blanco
   radio 26 con borde #E6ECF8 y sombra suave, icono de 54 px en degradado,
   rótulo 12,5 px espaciado en #7C89A8, panel azul 102° #1B3488→#25409E→
   #2D6BE0, fichas con número en la esquina e icono en círculo #E4EDFC.
   El HTML lo arma correcciones.js.
   ─────────────────────────────────────────────────────────────────────── */
.uny-th{ font-family: "Montserrat", sans-serif; }
.uny-th--dir{ margin: 4px 0 26px; }
.uny-th--roles{ margin: 30px 0 42px; }
.uny-th__area{
	position: relative; background: #fff; border: 1px solid #E6ECF8; border-radius: 26px;
	padding: 26px; box-shadow: 0 8px 26px rgba(17,34,102,.07); overflow: hidden;
}
.uny-th__grid{ display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 30px; align-items: stretch; }
.uny-th__grid--sinFoto{ grid-template-columns: 1fr; }
.uny-th__foto{ margin: 0; border-radius: 20px; overflow: hidden; min-height: 320px; background: #E4EDFC; }
.uny-th__foto img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.uny-th__cuerpo{ display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.uny-th__cab{ display: flex; align-items: center; gap: 16px; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 2px solid #E9EFFA; }
.uny-th__ico{ flex: 0 0 54px; width: 54px; height: 54px; border-radius: 15px; background: linear-gradient(135deg,#0071E3,#25409E); color: #fff; display: flex; align-items: center; justify-content: center; }
.uny-th__ico svg{ width: 26px; height: 26px; }
.uny-th__lead{ font-size: 18.5px; line-height: 1.5; font-weight: 600; color: #0B1236; }
.uny-th__rot{ display: flex; align-items: center; gap: 9px; margin: 0 0 11px; font-size: 12.5px; font-weight: 700; letter-spacing: .19em; text-transform: uppercase; color: #7C89A8; }
.uny-th__rot::before{ content: ""; width: 5px; height: 14px; border-radius: 3px; background: linear-gradient(180deg,#0071E3,#25409E); }
.uny-th__rot--c{ justify-content: center; margin-bottom: 8px; }
.uny-th__panel{
	border-radius: 22px; padding: 22px 28px; color: #fff; font-size: 16px; line-height: 1.7;
	background: linear-gradient(102deg,#1B3488 0%,#25409E 44%,#2D6BE0 100%); box-shadow: 0 12px 30px rgba(17,34,102,.20);
}
.uny-th__txt{ margin-top: 18px; font-size: 16px; line-height: 1.7; color: #2b3a55; }

/* «Quieres unirte…» y su subtítulo se quedan; el subtítulo, centrado */
.uny-th__sub .uny-th__subT{ display: block; text-align: center !important; font-size: 17px; color: #2b3a55; }

/* las tres vacantes */
.uny-th__roles{ display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.uny-th__rol{
	position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid #E6ECF8;
	border-radius: 24px; overflow: hidden; box-shadow: 0 8px 26px rgba(17,34,102,.07);
	transition: transform .2s ease, box-shadow .2s ease;
}
.uny-th__rol:hover{ transform: translateY(-4px); box-shadow: 0 14px 30px rgba(11,18,54,.12); }
.uny-th__rolFoto{ position: relative; height: 230px; background: #E4EDFC center/cover no-repeat; }
.uny-th__num{ position: absolute; top: 12px; right: 14px; padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,.92); font-size: 11.5px; font-weight: 700; color: #25409E; letter-spacing: .08em; }
.uny-th__rolIco{
	position: absolute; left: 22px; bottom: -28px; width: 60px; height: 60px; border-radius: 50%;
	background: #E4EDFC; color: #1B3488; display: flex; align-items: center; justify-content: center;
	box-shadow: 0 0 0 5px #fff;
}
.uny-th__rolIco svg{ width: 26px; height: 26px; }
.uny-th__rolCuerpo{ display: flex; flex-direction: column; flex: 1 1 auto; padding: 42px 22px 24px; text-align: center !important; }
.uny-th__rolTit{ font-size: 20px; font-weight: 800; line-height: 1.2; color: #0B1236; margin-bottom: 12px; }
.uny-th__rolTxt{ font-size: 14.5px; line-height: 1.6; color: #4a5270; margin-bottom: 10px; }
.uny-th__cta{
	display: block; margin-top: auto; padding: 14px 24px; border-radius: 999px; text-align: center !important;
	background: linear-gradient(135deg,#0071E3,#25409E); color: #fff !important; font-weight: 700; font-size: 15px;
	text-decoration: none !important; transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.uny-th__rolTxt:last-of-type{ margin-bottom: 18px; }   /* el botón baja al fondo (margin-top:auto) y así quedan los tres a la misma altura */
.uny-th__cta:hover{ transform: translateY(-2px); background: linear-gradient(135deg,#3B8DEB,#2F5BD1); color: #fff !important; box-shadow: 0 10px 22px rgba(0,113,227,.28); }
@media (max-width: 1024px){
	.uny-th__roles{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 767px){
	.uny-th__area{ padding: 18px; border-radius: 20px; }
	.uny-th__grid{ grid-template-columns: 1fr; gap: 18px; }
	.uny-th__foto{ min-height: 0; height: 220px; }
	.uny-th__roles{ grid-template-columns: 1fr; }
	.uny-th__rolFoto{ height: 200px; }
}

/* ── 9-sep-2026 · MENÚ MÓVIL Y TABLET POR PANTALLAS (hasta 1024 px) ─────
   El panel del sitio se conserva (velo, hamburguesa que se vuelve ✕);
   dentro va .uny-mm con pantallas que se deslizan. Entre 900 y 1024 se
   replican las reglas móviles que el sitio solo tenía hasta 899.
   ─────────────────────────────────────────────────────────────────────── */
.uny-mm{ display: none; }
@media (max-width: 1024px){
	.uny-nav-burger{ display: flex !important; }
	.uny-nav-menu{ position: fixed !important; inset: 0 !important; left: 0 !important; top: 0 !important; width: auto !important; max-width: none !important; transform: none !important; padding: 0 !important; display: block !important; background: rgba(9,16,48,.55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .25s, visibility 0s .25s; z-index: 99995 !important; pointer-events: auto !important; }
	.uny-nav-menu.uny-nav--abierto{ opacity: 1; visibility: visible; transition: opacity .25s; }
	.uny-nav-menu > ul{ display: none !important; }
	/* el sitio fija #uny-nav con selectores largos (html body .uny-ph .uny-ph__bg>#uny-nav): hay que superarlos */
	html.uny-nav-abierto #uny-nav, html.uny-nav-abierto body .uny-ph .uny-ph__bg > #uny-nav, html.uny-nav-abierto body .luma-hero > #uny-nav, html.uny-nav-abierto body main #uny-nav{ position: fixed !important; inset: 0 !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; padding: 0 !important; margin: 0 !important; z-index: 99999 !important; pointer-events: none; }
	html.uny-nav-abierto .uny-nav-caja{ position: static !important; }
	html.uny-nav-abierto .uny-nav-logo{ opacity: 0; pointer-events: none; }
	/* la ✕ (la hamburguesa del sitio) va arriba a la izquierda del panel, centrada en la barra del logo; el sitio le pone márgenes con selectores muy largos, por eso se repiten aquí */
	html.uny-nav-abierto .uny-nav-burger, html.uny-nav-abierto body .uny-ph .uny-ph__bg > #uny-nav .uny-nav-burger, html.uny-nav-abierto body .luma-hero > #uny-nav .uny-nav-burger{ position: absolute !important; top: 10px !important; right: calc(min(88vw, 400px) - 56px) !important; margin: 0 !important; transform: none !important; pointer-events: auto; background: transparent !important; box-shadow: none !important; }
	html.uny-nav-abierto .uny-nav-burger span{ background: #0B1236 !important; }

	.uny-mm{
		display: flex; flex-direction: column; position: absolute; top: 0; right: 0; height: 100%; width: min(88vw, 400px);
		background: #fff; box-shadow: -10px 0 34px rgba(11,18,54,.20); transform: translateX(100%); transition: transform .3s ease;
		font-family: "Montserrat", sans-serif; overscroll-behavior: contain;
	}
	.uny-nav-menu.uny-nav--abierto .uny-mm{ transform: none; }
	.uny-mm__top{ flex: 0 0 auto; height: 62px; display: flex; align-items: center; justify-content: flex-end; padding: 0 18px 0 64px; border-bottom: 1px solid #EDF1FA; }
	.uny-mm__logo{ height: 40px; width: auto; display: block; }
	.uny-mm__pista{ position: relative; flex: 1 1 auto; overflow: hidden; }
	.uny-mm__pan{
		position: absolute; inset: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; background: #fff; padding: 6px 0 28px;
		transform: translateX(100%); opacity: 1; transition: transform .3s ease, opacity .3s ease;
	}
	.uny-mm__pan.is-act{ transform: none; }
	.uny-mm__pan.is-atras{ transform: translateX(-28%); opacity: 0; pointer-events: none; }
	.uny-mm__pan.is-adelante{ transform: translateX(100%); }

	/* «Estás en …» */
	.uny-mm__ubic{ display: flex; align-items: center; gap: 10px; margin: 8px 12px 10px; padding: 10px 12px; border-radius: 14px; background: #F1F5FE; color: #25409E; text-decoration: none !important; }
	.uny-mm__ubicI{ flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: #0071E3; display: flex; align-items: center; justify-content: center; }
	.uny-mm__ubicI svg{ width: 16px; height: 16px; }
	.uny-mm__ubicTx{ display: flex; flex-direction: column; gap: 2px; min-width: 0; }
	.uny-mm__ubicL{ font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #7C89A8; }
	.uny-mm__ubicT{ font-size: 13px; font-weight: 700; color: #25409E; line-height: 1.3; }
	.uny-mm__ubicT b{ color: #9AA8C7; font-weight: 400; margin: 0 2px; }
	.uny-mm__ubic .uny-mm__chev{ margin-left: auto; color: #0071E3; }

	.uny-mm__lista{ list-style: none; margin: 0; padding: 0 10px; }
	.uny-mm__lista li{ border-bottom: 1px solid #EDF1FA; }
	.uny-mm__lista li:last-child{ border-bottom: 0; }
	.uny-mm__it{
		display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 12px 10px 12px 14px; border-radius: 12px;
		color: #0B1236 !important; font-size: 15px; font-weight: 600; line-height: 1.3; text-decoration: none !important; -webkit-tap-highlight-color: transparent;
		transition: background .15s;
	}
	.uny-mm__it--0{ font-size: 16.5px; font-weight: 700; min-height: 56px; }
	.uny-mm__it:hover, .uny-mm__it:active{ background: #F1F5FE; color: #0071E3 !important; }
	.uny-mm__lbl{ display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
	.uny-mm__fin{ margin-left: auto; display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; }
	.uny-mm__n{ font-size: 11.5px; font-weight: 700; color: #25409E; background: #E4EDFC; border-radius: 999px; padding: 3px 8px; }
	.uny-mm__chev{ width: 16px; height: 16px; color: #0071E3; flex: 0 0 auto; }
	.uny-mm__ext{ font-size: 14px; color: #7C89A8; }
	.uny-mm__pto{ width: 7px; height: 7px; border-radius: 50%; background: #0071E3; display: inline-block; }
	.uny-mm__it.is-actual{ background: #F1F5FE; color: #0071E3 !important; position: relative; }
	.uny-mm__it.is-actual::before{ content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 4px; border-radius: 4px; background: #0071E3; }

	/* cabecera de cada pantalla interior */
	.uny-mm__cab{ position: sticky; top: 0; z-index: 2; background: #fff; padding: 8px 16px 14px; border-bottom: 1px solid #EDF1FA; margin-bottom: 6px; }
	.uny-mm__volver{ display: inline-flex; align-items: center; gap: 6px; margin-left: -6px; padding: 8px 12px 8px 6px; border-radius: 10px; color: #0071E3 !important; font-size: 14px; font-weight: 700; text-decoration: none !important; }
	.uny-mm__volver svg{ width: 18px; height: 18px; }
	.uny-mm__volver:hover, .uny-mm__volver:active{ background: #F1F5FE; }
	.uny-mm__migas{ margin-top: 8px; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #7C89A8; line-height: 1.5; }
	.uny-mm__migas span{ color: #C3CFE6; margin: 0 3px; }
	.uny-mm__tit{ margin-top: 4px; font-size: 20px; font-weight: 800; color: #0B1236; line-height: 1.2; }
	.uny-mm__ir{ display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; padding: 9px 15px; border-radius: 999px; background: linear-gradient(135deg,#0071E3,#25409E); color: #fff !important; font-size: 13px; font-weight: 700; text-decoration: none !important; }
	.uny-mm__ir:hover{ background: linear-gradient(135deg,#3B8DEB,#2F5BD1); }
	.uny-mm__inicio{ display: flex; align-items: center; gap: 8px; margin: 16px 16px 0; padding-top: 14px; border-top: 1px solid #EDF1FA; color: #25409E !important; font-size: 14px; font-weight: 700; text-decoration: none !important; }
	.uny-mm__inicio svg{ width: 18px; height: 18px; }
}
@media (max-width: 767px){
	.uny-mm{ width: min(88vw, 360px); }
	html.uny-nav-abierto .uny-nav-burger, html.uny-nav-abierto body .uny-ph .uny-ph__bg > #uny-nav .uny-nav-burger, html.uny-nav-abierto body .luma-hero > #uny-nav .uny-nav-burger{ right: calc(min(88vw, 360px) - 56px) !important; }
}

/* ── el menú por pantallas dentro del segundo panel del sitio (.uny-oc) ── */
@media (max-width: 1024px){
	.uny-oc{ display: flex !important; flex-direction: column !important; }
	.uny-oc .uny-mm-oculto{ display: none !important; }
	.uny-oc .uny-oc__body{ display: flex !important; flex-direction: column !important; padding-bottom: 0 !important; }
	.uny-mm--oc{ position: relative; top: auto; right: auto; width: 100%; height: auto; flex: 1 1 auto; min-height: 0; transform: none !important; box-shadow: none; }
	.uny-mm--oc .uny-mm__pista{ min-height: 60vh; }
}

/* ═══ 9-sep-2026 · MÓVIL Y TABLET · ARREGLOS GLOBALES ═══════════════════
   Luis: «sin movimientos a los lados cuando se esté desplazando en móvil».
   Medido a 390 px: en /proyecto-de-becas/ y /relaciones-interinstitucionales/
   el documento medía 427 y 496 px porque la fila de botones de la portada
   (.uny-ph__btns) no parte y empuja el contenido fuera de la caja; y las
   animaciones de entrada de Elementor (fadeInLeft/Right) sacan elementos
   fuera de la ventana un instante, que en iOS basta para que la página se
   pueda arrastrar de lado. Se recorta el desbordamiento horizontal en
   html/body (clip no crea zona de scroll; hidden es el respaldo) y la fila
   de botones parte en varias líneas.
   ─────────────────────────────────────────────────────────────────────── */
@media (max-width: 1024px){
	html, body{ overflow-x: hidden; overflow-x: clip; }
	.uny-ph__content, .uny-ph__title, .uny-ph__quote, .uny-ph__btns{ min-width: 0 !important; max-width: 100% !important; }
	.uny-ph__btns{ flex-wrap: wrap !important; gap: 10px !important; }
	.uny-ph__btns a{ white-space: normal !important; text-align: center; }
	.uny-ph__title h1{ overflow-wrap: normal; word-break: normal; hyphens: manual; }   /* la palabra no se parte: correcciones.js encoge la letra hasta que quepa (Luis: «la S se va abajo») */
}

/* ── Cuadrículas de Elementor en móvil/tablet: filas a su contenido ─────
   Medido en /contaduria-publica-2/ y /gerencia-agroindustrial-2/ a 390 px:
   la cuadrícula de la ruta de aprendizaje traía filas «1fr» y, con una
   sola columna, todas las filas se estiraban a la altura de la más alta
   (5.642 px cada una → la página medía 36.000 px, casi todo vacío). */
@media (max-width: 1024px){
	.e-con.e-grid, .e-grid{ grid-template-rows: none !important; grid-auto-rows: auto !important; }
	.e-con.e-grid > .e-con{ min-height: 0 !important; }
}

/* ── Talento Humano: menos hueco antes del pie en móvil (medido: 206 px) ── */
@media (max-width: 767px){
	.uny-th--roles{ margin-bottom: 8px; }
}

/* ── Animaciones de entrada de Elementor en móvil/tablet: fuera ─────────
   Luis: «sin errores de animaciones… sin movimientos a los lados».
   Medido en /gerencia-en-salud/ (y las demás de postgrado): el título
   «INFORMACIÓN GENERAL» lleva la clase elementor-invisible con la
   animación slideInLeft y se queda en visibility:hidden cuando el aviso
   de Elementor no llega a dispararse; y los slideIn/fadeInLeft/Right
   arrastran bloques desde fuera de la ventana. En pantallas táctiles el
   contenido aparece directamente. */
@media (max-width: 1024px){
	.elementor-invisible{ visibility: visible !important; opacity: 1 !important; }
	.elementor-invisible.animated, .elementor-element.animated{ animation: none !important; }
}

/* ── Inicio · «La experiencia UNY»: el párrafo salía DOS veces en teléfono ─
   Medido a 390 px: el bloque 2d5798e (versión de escritorio, sin clase de
   ocultación) y el f28d8b5 (copia para móvil, hidden-desktop/tablet) se
   veían los dos, uno debajo del otro. En teléfono queda solo la copia móvil. */
@media (max-width: 767px){
	.elementor-element-2d5798e{ display: none !important; }
}

/* ═══ 9-sep-2026 · INICIO · CONTADORES (#luma-cifras) ═══════════════════
   Luis: «hay mucho espacio de separación y no me gusta el diseño de esos
   contadores; organicémoslo de otra forma en PC, tablet y teléfono».
   Medido: entre la última tarjeta («Apoyo y bienestar estudiantil») y los
   contadores había 289 px en PC, 314 en tablet y 324 en teléfono: un
   contenedor de 140 px que solo lleva estilos/guiones (16c5594) + un
   espaciador de 40/60 px + el margen de 30 px de los contadores. Los
   números iban sueltos, en azul sobre gris, sin marco.
   Ahora: panel con el degradado del pie (160°, #0071E3→#25409E), radio 26,
   cuatro celdas en PC con separadores finos, 2×2 en tablet y teléfono;
   número blanco grande y rótulo en mayúsculas espaciadas. La animación de
   conteo del sitio sigue igual (solo cambia el vestido). El contenedor
   vacío de 140 px se pliega.
   ─────────────────────────────────────────────────────────────────────── */
.elementor-element-16c5594{ display: none !important; }
html body #luma-cifras{
	max-width: 1180px !important; margin: 10px auto 60px !important; padding: 34px 28px !important; box-sizing: border-box;
	display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 0 !important; text-align: center !important;
	border-radius: 26px; background: linear-gradient(160deg,#0071E3 0%,#25409E 100%); box-shadow: 0 14px 34px rgba(17,34,102,.22);
	font-family: "Montserrat", sans-serif;
}
html body #luma-cifras > div{ padding: 6px 18px; border-left: 1px solid rgba(255,255,255,.18); }
html body #luma-cifras > div:first-child{ border-left: 0; }
html body #luma-cifras > div::before{ content: ""; display: block; width: 34px; height: 4px; border-radius: 4px; margin: 0 auto 14px; background: rgba(255,255,255,.55); }
html body #luma-cifras .lc-n{ font: 800 clamp(40px, 4.2vw, 58px) / 1 "Montserrat", sans-serif !important; color: #fff !important; letter-spacing: -.01em; }
html body #luma-cifras .lc-t{ font: 700 12.5px / 1.35 "Montserrat", sans-serif !important; color: rgba(255,255,255,.82) !important; opacity: 1 !important; margin-top: 10px !important; text-transform: uppercase !important; letter-spacing: .12em !important; }
@media (max-width: 1024px){
	html body #luma-cifras{ margin: 0 20px 50px !important; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 22px 0 !important; padding: 28px 16px !important; }
	html body #luma-cifras > div:nth-child(3){ border-left: 0; }
	.elementor-element-72e7285{ height: 24px !important; min-height: 0 !important; }
	.elementor-element-a4dc0ac{ padding-bottom: 20px !important; }
}
@media (max-width: 767px){
	html body #luma-cifras{ margin: 0 16px 44px !important; padding: 24px 10px !important; border-radius: 22px; }
	html body #luma-cifras > div{ padding: 4px 8px; }
	html body #luma-cifras .lc-n{ font-size: 38px !important; }
	html body #luma-cifras .lc-t{ font-size: 11px !important; letter-spacing: .09em !important; }
}

/* ── Barra fija al bajar (.uny-barra): logo a la izquierda, hamburguesa a la derecha ─
   La crea correcciones.js; entra deslizándose (is-on) al bajar más de 140 px
   cuando el botón del sitio ya no está a la vista, y se retira al subir. */
.uny-barra{ display: none; }
@media (max-width: 1024px){
	.uny-barra{
		position: fixed; top: 0; left: 0; right: 0; z-index: 99990; height: 60px; padding: 0 12px 0 14px; box-sizing: border-box;
		display: flex; align-items: center; justify-content: space-between;
		background: rgba(255,255,255,.96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
		box-shadow: 0 6px 20px rgba(11,18,54,.12); transform: translateY(-100%); transition: transform .25s ease; pointer-events: none;
	}
	.uny-barra.is-on{ transform: none; pointer-events: auto; }
	.uny-barra__logo{ display: block; line-height: 0; }
	.uny-barra__logo img{ height: 46px; width: auto; display: block; }
	.uny-barra__btn{
		width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px; cursor: pointer; -webkit-tap-highlight-color: transparent;
		background: linear-gradient(120deg,#0071E3,#25409E) !important; box-shadow: 0 6px 16px rgba(0,40,120,.24);
		display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
	}
	.uny-barra__btn span{ display: block; width: 21px; height: 2.5px; border-radius: 2px; background: #fff; }
	.uny-barra__btn:hover, .uny-barra__btn:active{ background: linear-gradient(120deg,#3B8DEB,#2F5BD1) !important; }
}

/* ═══ 9-sep-2026 · /historia/ · MAQUETA PROPIA PARA MÓVIL Y TABLET (v2) ═
   Luis, sobre la v1: «los cuadros se ven muy pegados, hay cuadros con
   sombras dentro de otros cuadros, hay textos que se mueven con el mouse;
   necesito que se vea más organizado».
   Medido en la v1: en varias filas la caja azul trae DENTRO otro contenedor
   con su propia sombra y 30 px de relleno (caja dentro de caja); las fotos
   llevaban la sombra del sitio más la mía y un marco azul de 10 px; entre
   foto y caja había 14 px y entre filas casi nada; y los bloques de texto
   traen «efectos de movimiento» de Elementor (se desplazan al hacer scroll
   o mover el ratón).
   v2, solo hasta 1024 px (PC intacto):
   · Cada fila es UNA sola tarjeta: foto arriba (200 px) y caja azul debajo
     pegada a ella, esquinas redondeadas y una sola sombra; 28 px entre
     tarjetas. Los contenedores intermedios pierden relleno, sombra y fondo.
   · En tablet, la tarjeta es horizontal (texto | foto) como en PC.
   · Sin efectos de movimiento en móvil/tablet.
   · El texto se mantiene justificado, como en PC (Luis).
   ─────────────────────────────────────────────────────────────────────── */
@media (max-width: 1024px){
	/* la fila = la tarjeta */
	.elementor-element-f28f2d7 > .e-con-inner > .e-con,
	.elementor-element-a57839a > .e-con-inner > .e-con,
	.elementor-element-fccc8ea > .e-con-inner > .e-con{
		display: flex !important; gap: 0 !important; padding: 0 !important; margin: 0 16px 28px !important; width: auto !important; max-width: none !important;
		border-radius: 22px !important; overflow: hidden !important; background: #fff;
		box-shadow: 0 12px 30px rgba(11,18,54,.14) !important; align-items: stretch !important;
	}
	.elementor-element-f28f2d7 > .e-con-inner > .e-con:last-child,
	.elementor-element-a57839a > .e-con-inner > .e-con:last-child,
	.elementor-element-fccc8ea > .e-con-inner > .e-con:last-child{ margin-bottom: 8px !important; }
	.elementor-element-f28f2d7 > .e-con-inner, .elementor-element-a57839a > .e-con-inner, .elementor-element-fccc8ea > .e-con-inner{ padding-left: 0 !important; padding-right: 0 !important; }
	/* fila sin contenido (solo un espaciador): sin tarjeta */
	.elementor-element-f28f2d7 > .e-con-inner > .e-con.uny-hist-vacia,
	.elementor-element-a57839a > .e-con-inner > .e-con.uny-hist-vacia,
	.elementor-element-fccc8ea > .e-con-inner > .e-con.uny-hist-vacia{ background: transparent !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; }
	.elementor-element-fccc8ea > .e-con-inner > .e-con.uny-hist-vacia .elementor-widget-spacer{ height: 30px !important; }
	.elementor-element-fccc8ea > .e-con-inner > .e-con.uny-hist-vacia .elementor-spacer-inner{ height: 30px !important; }
	/* foto y caja: sin marco propio (una sola pieza) */
	.e-con.uny-hist-foto{ padding: 0 !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; background-color: #E4EDFC !important; background-size: cover !important; background-position: center 30% !important; min-height: 0 !important; }
	.e-con.uny-hist-caja{ margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: linear-gradient(160deg,#0071E3 0%,#25409E 100%) !important; padding: 24px 22px 26px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }
	.e-con.uny-hist-caja .e-con, .e-con.uny-hist-caja .e-con-inner{ padding: 0 !important; margin: 0 !important; box-shadow: none !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; width: 100% !important; max-width: 100% !important; }
	.uny-hist-caja .elementor-widget-text-editor p{ color: #fff !important; font-size: 15.5px !important; line-height: 1.7 !important; margin: 0 0 10px !important; hyphens: none !important; }
	.uny-hist-caja .elementor-widget-text-editor p:last-child{ margin-bottom: 0 !important; }
	.uny-hist-caja .elementor-widget-heading .elementor-heading-title{ color: #fff !important; font-size: 21px !important; line-height: 1.2 !important; margin: 0 0 10px !important; padding-left: 12px; border-left: 4px solid rgba(255,255,255,.7); }
	/* nada se mueve con el scroll ni con el ratón en pantallas táctiles */
	.elementor-element-f28f2d7 .elementor-motion-effects-element, .elementor-element-a57839a .elementor-motion-effects-element, .elementor-element-fccc8ea .elementor-motion-effects-element, .elementor-element-9b366c3 .elementor-motion-effects-element,
	.elementor-element-f28f2d7 .elementor-motion-effects-layer, .elementor-element-a57839a .elementor-motion-effects-layer, .elementor-element-fccc8ea .elementor-motion-effects-layer, .elementor-element-9b366c3 .elementor-motion-effects-layer{ transform: none !important; opacity: 1 !important; }
	/* franjas de fotos: más altas y sin el desplazamiento lateral del efecto */
	.elementor-element-9b366c3 .elementor-widget-image-carousel .swiper-slide img{ height: 150px !important; width: 100% !important; object-fit: cover !important; object-position: center 30% !important; border-radius: 12px; }
	.elementor-element-9b366c3 .elementor-widget-image-carousel{ padding: 0 10px !important; margin-bottom: 10px !important; }
}
@media (max-width: 767px){
	.elementor-element-f28f2d7 > .e-con-inner > .e-con,
	.elementor-element-a57839a > .e-con-inner > .e-con,
	.elementor-element-fccc8ea > .e-con-inner > .e-con{ flex-direction: column !important; flex-wrap: nowrap !important; }
	.elementor-element-f28f2d7 > .e-con-inner > .e-con > .e-con,
	.elementor-element-a57839a > .e-con-inner > .e-con > .e-con,
	.elementor-element-fccc8ea > .e-con-inner > .e-con > .e-con{ width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
	.e-con.uny-hist-foto{ order: -1; height: 200px !important; }
}
@media (min-width: 768px) and (max-width: 1024px){
	.elementor-element-f28f2d7 > .e-con-inner > .e-con,
	.elementor-element-a57839a > .e-con-inner > .e-con,
	.elementor-element-fccc8ea > .e-con-inner > .e-con{ flex-direction: row !important; flex-wrap: nowrap !important; }
	.e-con.uny-hist-caja{ flex: 1 1 55% !important; width: auto !important; max-width: none !important; padding: 28px 26px !important; }
	.e-con.uny-hist-foto{ flex: 1 1 45% !important; width: auto !important; max-width: none !important; height: auto !important; min-height: 300px !important; order: 0; }
	.uny-hist-caja .elementor-widget-text-editor p{ font-size: 16px !important; }
	.uny-hist-caja .elementor-widget-heading .elementor-heading-title{ font-size: 22px !important; }
}

/* (9-sep-2026) Los párrafos van justificados en todos los anchos, por
   indicación de Luis. */

/* ── Fotos de fondo aplastadas en móvil/tablet: banda con altura ───────
   Marcado por correcciones.js (.uny-foto-banda) en toda la web. */
@media (max-width: 1024px){
	.e-con.uny-foto-banda{ min-height: 260px !important; height: 260px !important; width: 100% !important; max-width: 100% !important; border-radius: 20px !important; background-size: cover !important; background-position: center 30% !important; background-color: #E4EDFC !important; padding: 0 !important; margin: 6px 0 !important; box-shadow: 0 10px 26px rgba(11,18,54,.14); overflow: hidden; }
}
@media (max-width: 767px){
	.e-con.uny-foto-banda{ min-height: 200px !important; height: 200px !important; }
}

/* ═══ 9-sep-2026 · PROGRAMAS (124 páginas) · FICHA DEL COORDINADOR EN MÓVIL/TABLET ═
   Luis, en Administración Financiera: «hay un error ahí en los botones».
   Medido a 390: #uny-ficha-pie va en fila (texto 250 px + botón) y el
   contenedor del botón trae margin-top:-30px, así que el botón «Contacto»
   se monta sobre el nombre del coordinador. En PC (fila de 790 px) no se
   nota. Hasta 1024 px: en columna, sin el margen negativo. */
@media (max-width: 1024px){
	#uny-ficha-pie{ flex-direction: column !important; align-items: stretch !important; gap: 14px !important; padding: 18px 20px !important; }
	#uny-ficha-pie #uny-pie-coord, #uny-ficha-pie .elementor-widget-heading{ width: 100% !important; max-width: none !important; }
	#uny-ficha-pie .elementor-widget-button{ width: 100% !important; }
	#uny-ficha-pie .elementor-widget-button .elementor-widget-container{ margin: 0 !important; }
	#uny-ficha-pie .elementor-button{ display: inline-flex !important; }
}

/* ═══ 9-sep-2026 · /por-que-estudiar-en-al-uny/ · PORTADA COMO LA DEL INICIO (móvil/tablet) ═
   Luis: «la portada de Por qué estudiar está mal, debe parecerse a la del
   home». Medido a 390: en el inicio la portada (.uny-fh) es una tarjeta con
   16 px de margen, esquinas de 26 px, foto con degradado oscuro abajo,
   título de 36 px, botones-píldora y la marquesina dentro de la tarjeta.
   Aquí la portada es un contenedor de Elementor (e235aa4) a sangre, con el
   título pegado al borde y la marquesina suelta. Se le da el mismo vestido.
   En PC no cambia nada.
   OJO: el id e235aa4 se repite en otras páginas hechas con la misma plantilla
   (Acreditación de Saberes lo trae OCULTO y encima construye su propia portada);
   por eso todo va acotado a body.page-id-7196 (id real en vivo de esta página). */
@media (max-width: 1024px){
	body.page-id-7196 .elementor-element-e235aa4{ position: relative !important; margin: 8px 16px 0 !important; width: auto !important; max-width: none !important; min-height: 560px !important; border-radius: 26px !important; overflow: hidden !important; background-size: cover !important; background-position: center 30% !important; display: flex !important; flex-direction: column !important; justify-content: flex-end !important; padding: 0 !important; box-shadow: 0 14px 34px rgba(11,18,54,.18); }
	body.page-id-7196 .elementor-element-e235aa4::before{ content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,12,40,0) 30%, rgba(5,10,35,.35) 60%, rgba(5,10,35,.72) 100%); pointer-events: none; z-index: 0; }
	body.page-id-7196 .elementor-element-e235aa4 > .e-con{ position: relative; z-index: 1; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-fb2eae4{ padding: 0 20px 22px !important; width: auto !important; max-width: none !important; margin: 0 !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-a6ea137{ padding: 0 !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-a6ea137 .elementor-heading-title{ font-size: 34px !important; line-height: 1.06 !important; overflow-wrap: anywhere !important; width: auto !important; max-width: 100% !important; font-weight: 700 !important; color: #fff !important; text-shadow: 0 2px 5px rgba(11,18,54,.85), 0 8px 28px rgba(11,18,54,.55); margin: 0 0 14px !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-a6ea137 .elementor-heading-title::before{ content: ""; display: block; width: 26px; height: 12px; border-radius: 6px; background: #fff; box-shadow: 26px 0 0 -1px rgba(255,255,255,.55); margin-bottom: 16px; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-e385b72{ display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin-top: 4px !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-e385b72 .elementor-button{ border-radius: 999px !important; }
	/* la marquesina, dentro de la tarjeta y pegada al borde inferior */
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-de2c495{ margin: 0 !important; width: 100% !important; max-width: none !important; border-radius: 0 !important; padding: 0 !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-de2c495 > .e-con{ border-radius: 0 !important; width: 100% !important; max-width: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px){
	body.page-id-7196 .elementor-element-e235aa4{ min-height: 640px !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-fb2eae4{ padding: 0 48px 30px !important; }
	body.page-id-7196 .elementor-element-e235aa4 .elementor-element-a6ea137 .elementor-heading-title{ font-size: 46px !important; }
}

/* ═══ 9-sep-2026 · /culturales/ · TARJETAS DE GRUPOS EN MÓVIL ═══════════
   Luis: «hay espacios gigantescos: Orfeón UNY, Teatro y Títeres salen con
   mucho espacio». Medido a 390: la rejilla .uny-gr-rejilla conserva DOS
   columnas (0 px + 342 px): cada fila junta dos tarjetas, una queda
   aplastada en la columna de 0 px y la otra se estira a la altura de las
   dos (1.217, 1.221, 1.400 px). En teléfono, una columna; en tablet, dos. */
@media (max-width: 767px){
	.uny-gr-rejilla{ grid-template-columns: minmax(0,1fr) !important; grid-auto-rows: auto !important; grid-template-rows: none !important; }
	.uny-gr-card{ min-height: 0 !important; height: auto !important; }
	.uny-gr-cuerpo .uny-gr-obj{ flex: 0 0 auto !important; }
}
@media (min-width: 768px) and (max-width: 1024px){
	.uny-gr-rejilla{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; grid-auto-rows: auto !important; grid-template-rows: none !important; }
}

/* ── Cultura: la última tarjeta iba forzada a la columna 2 (body.page-id-5466
   .uny-gr-rejilla > :last-child{grid-column:2}); con una sola columna eso
   crea una columna fantasma de 0 px y empareja las tarjetas por filas. */
@media (max-width: 767px){
	/* el sitio fuerza la última tarjeta a la columna 2 con body.page-id-5466 … > :last-child (especificidad 0,3,1): hay que superarla */
	html body.page-id-5466 .uny-gr-rejilla > :last-child, html body.page-id-5466 .uny-gr-rejilla > :not(:last-child), html body .uny-gr-rejilla > :last-child{ grid-column: auto !important; }
	html body .uny-gr-rejilla{ grid-template-columns: minmax(0,1fr) !important; }
}

/* ── Lo que pasa en la UNY: el resumen nunca se sale de sus tres líneas ─
   Luis: «hay un botón encima de los textos». El recorte a 3 líneas se
   hace con -webkit-box; si el guion del sitio cambia el display del <p>,
   la cuarta línea se cuela debajo del botón. Se fija también por altura. */
.uny-news__res{ display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 3 !important; overflow: hidden !important; max-height: calc(1.7em * 3 + 2px) !important; }
.uny-news__btn{ position: relative; z-index: 1; }
.uny-news__cuerpo{ gap: 0 !important; }
@media (max-width: 1024px){
	.uny-news__res{ margin-bottom: 16px !important; }
	.uny-news__btn{ margin-top: 4px !important; }
}

/* ── Teléfono: márgenes laterales mínimos de 16 px ──────────────────────
   Luis: «los textos y recuadros están muy pegados a los bordes; me gusta
   mantener unos márgenes». correcciones.js marca con .uny-margen los
   bloques de primer nivel cuyo texto queda a menos de 12 px del borde. */
@media (max-width: 767px){
	.uny-margen{ padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box !important; }
}

/* ═══ 9-sep-2026 · ACREDITACIÓN DE SABERES Y DE APRENDIZAJES · MÓVIL Y TABLET ═
   Luis: «en acreditación la información no se entiende… en PC la
   mejoramos; hazle un diseño parecido para tablet y móvil», y lo mismo
   para Acreditación de Aprendizajes.
   Medido a 390: (1) los botones «Acreditación» / «Escríbenos por WhatsApp»
   (y «Solicitar Acreditación») están en widgets que Elementor OCULTA en
   móvil, así que en teléfono no había forma de solicitar nada; (2) una
   foto decorativa (c7fa317) que en PC va oculta, en móvil aparece cortada
   dentro del panel; (3) seis contenedores anidados, cada uno con 10 px de
   relleno, dejaban el texto en 250 px de ancho. Hasta 1024 px: botones
   visibles y a lo ancho, foto decorativa fuera, contenedores intermedios
   sin relleno, panel azul y tarjetas blancas con el mismo vestido que en PC. */
@media (max-width: 1024px){
	/* botones que Elementor escondía en móvil/tablet */
	.elementor-element-218ac95, .elementor-element-9bb56ea, .elementor-element-c6fcc92{ display: block !important; width: 100% !important; margin: 18px 0 0 !important; }
	.elementor-element-218ac95 .uny-tram-cta, .elementor-element-9bb56ea .uny-tram-cta, .elementor-element-c6fcc92 .uny-tram-cta{ display: flex !important; flex-direction: column !important; gap: 10px !important; align-items: stretch !important; }
	.elementor-element-218ac95 .uny-wa-btn, .elementor-element-9bb56ea .uny-wa-btn, .elementor-element-c6fcc92 .uny-wa-btn{ width: 100% !important; justify-content: center !important; box-sizing: border-box; }
	/* foto decorativa: oculta, como en PC */
	.elementor-element-c7fa317{ display: none !important; }
	/* secciones: márgenes de 16 px y sin relleno acumulado */
	.elementor-element-a1a2d63 > .e-con-inner, .elementor-element-5852564 > .e-con-inner{ padding: 0 16px !important; }
	.elementor-element-bc60396, .elementor-element-fab96bc, .elementor-element-4bd4cb8, .elementor-element-8813352, .elementor-element-8f6ab03{ padding: 0 !important; width: 100% !important; max-width: none !important; margin: 0 !important; }
	.elementor-element-8f6ab03{ margin-top: 20px !important; }
	/* paneles azules */
	.elementor-element-a80766c, .elementor-element-bc7c18f, .elementor-element-d26ff6a{ padding: 24px 18px 26px !important; border-radius: 22px !important; width: 100% !important; max-width: none !important; margin: 0 !important; }
	.elementor-element-a80766c .e-con, .elementor-element-bc7c18f .e-con, .elementor-element-d26ff6a .e-con{ padding: 0 !important; width: 100% !important; max-width: none !important; margin: 0 !important; flex: 0 0 auto !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; }
	/* en tablet las columnas texto | tarjetas iban en fila con anchos fijos y la de la derecha salía de la pantalla (medido a 820) */
	.elementor-element-d12d083, .elementor-element-03a7535, .elementor-element-926b08a{ display: flex !important; flex-direction: column !important; gap: 14px !important; }
	.elementor-element-a80766c .elementor-widget, .elementor-element-bc7c18f .elementor-widget, .elementor-element-d26ff6a .elementor-widget{ width: 100% !important; max-width: none !important; }
	/* tarjetas blancas dentro del panel */
	.elementor-element-1bc18a8, .elementor-element-575233d, .elementor-element-c9016ef, .elementor-element-bc73855, .elementor-element-7220871, .elementor-element-8bdc11c, .elementor-element-7a7bbcd, .elementor-element-f313442{ padding: 16px 16px 14px !important; border-radius: 16px !important; margin: 14px 0 0 !important; }
	.elementor-element-1bc18a8 .elementor-widget-text-editor, .elementor-element-575233d .elementor-widget-text-editor{ padding: 0 !important; }
	/* títulos y texto */
	.elementor-element-a80766c .elementor-heading-title, .elementor-element-bc7c18f .elementor-heading-title, .elementor-element-d26ff6a .elementor-heading-title{ font-size: 26px !important; line-height: 1.15 !important; text-align: center !important; margin: 0 0 14px !important; }
	/* franjas de fotos (swiper) decorativas de Aprendizajes: en móvil/tablet salían como caja blanca vacía hasta que cargaban; fuera (la información está en las tarjetas) */
	.elementor-element-2556de2, .elementor-element-eb41a3e, .elementor-element-39d7ba9 .elementor-widget-spacer{ display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px){
	.elementor-element-a80766c, .elementor-element-bc7c18f, .elementor-element-d26ff6a{ padding: 30px 28px 32px !important; }
	.elementor-element-218ac95 .uny-tram-cta, .elementor-element-9bb56ea .uny-tram-cta, .elementor-element-c6fcc92 .uny-tram-cta{ flex-direction: row !important; justify-content: center !important; }
	.elementor-element-218ac95 .uny-wa-btn, .elementor-element-9bb56ea .uny-wa-btn, .elementor-element-c6fcc92 .uny-wa-btn{ width: auto !important; }
}

/* ═══ 9-sep-2026 · /identidad-uny/ · MÓVIL Y TABLET ═════════════════════
   Luis: «en Identidad hay varios errores; diseño especial para tablet y
   teléfono; en el escudo solo una foto; en el himno hay fotos de más, el
   protagonista debe ser el reproductor; en la bandera los textos
   justificados; y que todo quede mejor organizado».
   Medido a 390: el escudo salía DOS veces (tarjeta gris con el pequeño y
   el grande debajo); seis contenedores anidados con 10 px cada uno
   dejaban el texto en 260 px; en el himno las fotos iban entre la letra y
   el reproductor. Hasta 1024 px (PC intacto):
   · Escudo: una sola imagen (la grande) en tarjeta blanca; texto debajo
     (en tablet, al lado).
   · Himno: el reproductor va PRIMERO, como tarjeta destacada; las fotos
     del bloque no se muestran; la letra debajo.
   · Bandera: la bandera arriba en tarjeta blanca y el texto debajo.
   · Contenedores intermedios sin relleno; márgenes de 16 px. */
@media (max-width: 1024px){
	.elementor-element-1b1eda5 > .e-con-inner{ padding: 0 16px !important; }
	.elementor-element-1b1eda5 .e-con{ padding: 0 !important; width: 100% !important; max-width: none !important; margin: 0 !important; flex: 0 0 auto !important; }
	.elementor-element-1b1eda5 .elementor-widget{ width: 100% !important; max-width: 100% !important; min-width: 0 !important; --container-widget-width: 100% !important; --container-widget-flex-grow: 1 !important; }
	.elementor-element-1b1eda5 .elementor-widget-container{ width: auto !important; max-width: 100% !important; }
	.elementor-element-1b1eda5 .elementor-widget-text-editor p{ overflow-wrap: anywhere; }
	/* paneles azules */
	.elementor-element-1b1eda5 .e-con.elementor-element-7186e40, .elementor-element-1b1eda5 .e-con.elementor-element-71d5635, .elementor-element-1b1eda5 .e-con.elementor-element-816e6bb, .elementor-element-1b1eda5 .e-con.elementor-element-a6aeb1c{ padding: 22px 18px 24px !important; border-radius: 22px !important; display: flex !important; flex-direction: column !important; gap: 16px !important; }
	.elementor-element-838dc4e, .elementor-element-c98aa19, .elementor-element-dd2f5e6{ padding: 0 !important; }
	/* ESCUDO: una sola imagen. Medido: la grande (UNY-2-1) es la versión BLANCA
	   del escudo (para fondo azul) y sobre tarjeta blanca no se ve; se deja la
	   de color (UNY-6) en su tarjeta, más grande, y la blanca se esconde */
	.elementor-element-992f2fc{ display: none !important; }
	.elementor-element-d35bdeb{ background: #fff !important; border-radius: 18px !important; padding: 20px !important; display: flex !important; justify-content: center !important; align-items: center !important; }
	.elementor-element-d35bdeb img{ width: 230px !important; max-width: 100% !important; height: auto !important; margin: 0 auto !important; display: block !important; }
	/* HIMNO: el reproductor primero, como protagonista; fotos fuera */
	.elementor-element-40ce627{ order: -1; }
	.elementor-element-86b51ad, .elementor-element-841b7ff img, .elementor-element-0296dd6 img{ display: none !important; }
	.elementor-element-c232031{ background: rgba(255,255,255,.14) !important; border: 1px solid rgba(255,255,255,.35) !important; border-radius: 18px !important; padding: 18px 16px !important; }
	.elementor-element-c232031 audio{ width: 100% !important; display: block !important; margin-top: 12px !important; }
	.elementor-element-c232031 p, .elementor-element-c232031 h3, .elementor-element-c232031 h4{ color: #fff !important; font-weight: 700 !important; font-size: 17px !important; margin: 0 0 6px !important; text-align: left !important; }
	/* BANDERA: imagen arriba en tarjeta blanca */
	.elementor-element-f06faf3{ order: -1; background: #fff !important; border-radius: 18px !important; padding: 14px !important; }
	.elementor-element-f06faf3 img{ width: 100% !important; height: auto !important; display: block !important; border-radius: 10px; }
	/* YAKO: si el contenedor de la mascota no trae foto, no ocupa sitio */
	.elementor-element-4a65dac:not(:has(img)):not(:has(.uny-foto-banda)){ display: none !important; }
	.elementor-element-de018aa{ display: none !important; }
	/* textos */
	.elementor-element-1b1eda5 .elementor-widget-text-editor p{ font-size: 15.5px !important; line-height: 1.7 !important; color: #fff !important; }
}
@media (min-width: 768px) and (max-width: 1024px){
	.elementor-element-1b1eda5 .e-con.elementor-element-7186e40, .elementor-element-1b1eda5 .e-con.elementor-element-a6aeb1c{ flex-direction: row !important; align-items: center !important; gap: 24px !important; padding: 28px 26px !important; }
	/* más peso que «.elementor-element-1b1eda5 .e-con{width:100%}» de arriba: si no, las dos columnas miden 100 % y el texto se sale (medido: documento de 1.586 px a 820) */
	.elementor-element-1b1eda5 .e-con.elementor-element-682881d, .elementor-element-1b1eda5 .e-con.elementor-element-f06faf3{ flex: 0 0 40% !important; width: 40% !important; max-width: 40% !important; }
	.elementor-element-1b1eda5 .e-con.elementor-element-d9c2785, .elementor-element-1b1eda5 .e-con.elementor-element-56d5f31{ flex: 1 1 0 !important; width: auto !important; min-width: 0 !important; }
	#uny-yako-peek{ max-width: 120px !important; right: 0 !important; }
	.elementor-element-1b1eda5 .elementor-widget-text-editor p{ font-size: 16px !important; }
}

/* ═══ 10-sep-2026 · /ubicacion/ y /vida-universitaria/ · SEDES EN MÓVIL ═════
   Medido a 390: el bloque de sedes conserva la maqueta de PC (columna de
   texto de 167 px con las tres tarjetas + fotos fijas de 370 px al lado);
   en teléfono la foto tapa el texto y quedan huecos de 500–670 px.
   Hasta 767 px: la columna de texto ocupa todo el ancho y las fotos pasan
   a bandas de 240 px debajo, sin posición fija. */
@media (max-width: 767px){
	.elementor-element-e7b0f07 > .e-con-inner{ flex-direction: column !important; flex-wrap: nowrap !important; padding: 0 16px !important; width: 100% !important; box-sizing: border-box; }
	.elementor-element-7e23b0d, .elementor-element-34397d5, .elementor-element-34397d5 > .e-con-inner{ width: 100% !important; max-width: none !important; flex: 0 0 auto !important; padding: 0 !important; margin: 0 !important; }
	/* cada tarjeta traía 500 px de relleno inferior (para el efecto fijo de PC) */
	.elementor-element-71dd947, .elementor-element-105d1d9, .elementor-element-e3f798c{ width: 100% !important; max-width: none !important; min-height: 0 !important; height: auto !important; margin: 0 0 16px !important; padding: 22px 18px 24px !important; border-radius: 20px !important; }
	.elementor-element-706764e{ position: static !important; width: 100% !important; max-width: none !important; height: 240px !important; min-height: 240px !important; margin: 0 0 16px !important; border-radius: 20px !important; overflow: hidden !important; transform: none !important; top: auto !important; background-size: cover !important; background-position: center !important; }
	.elementor-element-706764e img{ width: 100% !important; height: 240px !important; object-fit: cover !important; display: block !important; }
	.elementor-element-706764e .e-con, .elementor-element-706764e .elementor-widget{ height: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
}

/* ═══ 10-sep-2026 · MÓVIL/TABLET · SIN «EFECTOS DE MOVIMIENTO» DE ELEMENTOR ═
   Luis: «sin errores de animaciones». Los efectos de scroll y ratón
   (transparencia, desplazamiento, parallax) dejan bloques a medio
   aparecer en pantallas táctiles (medido en Vida Universitaria: «Conviértete
   en UNY-versitario» y su botón quedaban al 30 % de opacidad). Hasta
   1024 px todo se ve completo y quieto; en PC se conservan. */
@media (max-width: 1024px){
	.elementor-motion-effects-element, .elementor-motion-effects-layer, .elementor-motion-effects-container{ transform: none !important; opacity: 1 !important; }
}

/* ── Vida Universitaria: mismo bloque de sedes con otros ids ───────────── */
@media (max-width: 767px){
	.elementor-element-49befc6b > .e-con-inner{ flex-direction: column !important; flex-wrap: nowrap !important; padding: 0 16px !important; width: 100% !important; box-sizing: border-box; }
	.elementor-element-249a5fd1, .elementor-element-322fe6c9, .elementor-element-322fe6c9 > .e-con-inner{ width: 100% !important; max-width: none !important; flex: 0 0 auto !important; padding: 0 !important; margin: 0 !important; }
	.elementor-element-400d94e3, .elementor-element-7967f4f8, .elementor-element-7e46a2b8{ width: 100% !important; max-width: none !important; min-height: 0 !important; height: auto !important; margin: 0 0 16px !important; padding: 22px 18px 24px !important; border-radius: 20px !important; }
	.elementor-element-2af47e2{ position: static !important; width: 100% !important; max-width: none !important; height: 240px !important; min-height: 240px !important; margin: 0 0 16px !important; border-radius: 20px !important; overflow: hidden !important; transform: none !important; top: auto !important; background-size: cover !important; background-position: center !important; }
	.elementor-element-2af47e2 img{ width: 100% !important; height: 240px !important; object-fit: cover !important; display: block !important; }
	.elementor-element-2af47e2 .e-con, .elementor-element-2af47e2 .elementor-widget{ height: 100% !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
}

/* ═══ 10-sep-2026 · TABLET · LA HAMBURGUESA EN LA ESQUINA DE LA PORTADA ═════
   Luis: «en tablet veo el menú bugueado; en teléfono la hamburguesa está
   en la esquina de la foto de portada y al bajar sale el menú fijo, pero
   en tablet no». Medido a 820–950: en las páginas con portada grande
   (.uny-fh: inicio y similares) el sitio solo esconde la barra #luma-cab
   hasta 767 px; en tablet quedaba una barra blanca arriba con la
   hamburguesa suelta, encima de la portada con su propio logo. Hasta
   1024 px la barra se esconde y correcciones.js lleva la hamburguesa a la
   esquina de la foto; al bajar entra la barra fija con logo. */
@media (min-width: 768px) and (max-width: 1024px){
	/* el sitio la fuerza con «html body:has(.uny-fh__box) #luma-cab{display:flex !important}»: hay que pesar más */
	html body:has(.uny-fh__box) main #luma-cab, html body:has(.uny-fh__box) #luma-cab.uny-cab-fuera{ display: none !important; }
	.uny-fh__box .uny-burger--fijo, .uny-fh__box .uny-burger{ position: absolute !important; top: 18px !important; right: 18px !important; left: auto !important; z-index: 60 !important; margin: 0 !important; }
}
/* Vida Universitaria: las tres fotos de sede (una por sede, en fundido en PC)
   van apiladas en absoluto y quedaban detrás de los textos; en teléfono,
   tres bandas seguidas debajo de las tarjetas */
@media (max-width: 767px){
	.elementor-element-2af47e2, .elementor-element-2af47e2 > .e-con-inner, .elementor-element-337ac51d{ position: static !important; height: auto !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; }
	.elementor-element-173ea01, .elementor-element-7b7c045f, .elementor-element-4015f3{ position: static !important; width: 100% !important; height: 200px !important; min-height: 200px !important; margin: 0 0 14px !important; border-radius: 20px !important; opacity: 1 !important; transform: none !important; background-size: cover !important; background-position: center !important; }
}
/* las tarjetas y fotos de sedes las mueve un guion de scroll (GSAP) con
   transformaciones en línea; en teléfono, quietas */
@media (max-width: 767px){
	.elementor-element-71dd947, .elementor-element-105d1d9, .elementor-element-e3f798c, .elementor-element-7e23b0d, .elementor-element-34397d5, .elementor-element-706764e,
	.elementor-element-400d94e3, .elementor-element-7967f4f8, .elementor-element-7e46a2b8, .elementor-element-249a5fd1, .elementor-element-322fe6c9, .elementor-element-2af47e2, .elementor-element-337ac51d{ transform: none !important; position: relative !important; top: auto !important; left: auto !important; opacity: 1 !important; }
	.elementor-element-49befc6b .pin-spacer, .elementor-element-e7b0f07 .pin-spacer{ padding: 0 !important; height: auto !important; min-height: 0 !important; }
}

/* ═══ 10-sep-2026 · /por-que-estudiar-en-al-uny/ · TARJETAS EN TABLET ═══════
   Medido a 820: las tarjetas de «Nuestras facultades» y «Así se vive la UNY»
   miden 0 px de ancho (un guion del sitio les pone margin-left/right:auto
   en línea y, con el contenido en posición absoluta, la caja se queda sin
   ancho); quedaba un hueco de 530 px. Hasta 1024 px: ancho completo. */
@media (max-width: 1024px){
	[class*="pq-"][class*="grid"] > *{ width: 100% !important; min-width: 0 !important; margin: 0 !important; }
	.pq-fcard, .pq-vcard, .pq-rcard{ width: 100% !important; margin: 0 !important; }
}
/* la columna de las tarjetas de sedes traía min-height:100vh (844 px) */
@media (max-width: 767px){
	.elementor-element-322fe6c9, .elementor-element-34397d5, .elementor-element-249a5fd1, .elementor-element-7e23b0d{ min-height: 0 !important; height: auto !important; }
}

/* ═══ 10-sep-2026 · BOTONES DE ELEMENTOR EN MÓVIL/TABLET · EL TEXTO NO PARTE ═
   Luis, en las sedes a tablet: «la flecha queda encima o mal puesta».
   Medido a 820: el botón «Inscríbete Ahora!» tiene 135 px de caja interior
   y el texto necesita 131: parte en dos líneas y el icono se va abajo.
   Hasta 1024 px: el texto del botón no parte, el icono centrado, y el
   botón se ensancha lo que haga falta (nunca más que su contenedor). */
@media (max-width: 1024px){
	.elementor-button .elementor-button-content-wrapper{ flex-wrap: nowrap !important; align-items: center !important; white-space: nowrap !important; justify-content: center !important; }
	.elementor-button .elementor-button-text{ white-space: nowrap !important; line-height: 1.2 !important; }
	.elementor-button .elementor-button-icon{ display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; }
	.elementor-widget-button .elementor-button{ width: auto !important; max-width: 100% !important; box-sizing: border-box !important; }
}


/* ═══ 11-sep-2026 · TÍTULOS DE PORTADA EN MAYÚSCULAS ═══════════════════
   Luis: «revisa que todos los títulos estén en mayúsculas». Las portadas
   .uny-ph ya lo hacían por CSS; las .uny-fh (Estudia en la UNY, Lo que
   pasa, Investigación, Dirección de Investigación, Cambio de Modalidad…)
   mostraban el título tal cual venía escrito. Se unifica: todo título de
   portada en mayúsculas, salvo el Home, que conserva su diseño aprobado. */
body:not(.home) .uny-fh__title h1,
body:not(.home) .uny-ph__title h1,
body:not(.home) #luma-hero h1,
body:not(.home) .luma-hero h1,
body:not(.home) .uny-pg-top h1{ text-transform: uppercase !important; }

/* ═══ 17-sep-2026 · HISTORIA: encuadre de la portada en teléfono ═══════════
   La portada nueva (retrato, historia-portada.jpg) tiene la cara en el tercio
   izquierdo. En teléfono el hero es vertical y el logo, el título y la caja de
   la frase tapan casi todo; con «cover» la cara queda detrás del título. Se
   amplía un 15 % para ganar margen y se coloca la cara en la franja libre a la
   derecha del título. Especificidad html+body para ganar a la regla global. */
@media (max-width:767px){
  html body.page-id-4175 .uny-fh__bg{
    background-size:auto 115% !important;
    background-position:10% 95% !important;
  }
}

/* ═══ 17-sep-2026 · lote3-acreditacion: David pide quitar las dos fotos de
   Acreditación de Aprendizajes (la de los tres estudiantes y la de abajo de
   «¿Quiénes pueden solicitar…?»). Son contenedores con slideshow de fondo. */
body.page-id-5297 .elementor-element-2556de2, body.page-id-5297 .elementor-element-eb41a3e{display:none!important}

/* ═══ 17-sep-2026 · /modelo-educativo/ · CON EL LENGUAJE DE BIENESTAR ═════
   Reutiliza las clases uny-eg__* (paneles, cabecera, rótulo, panel azul,
   fichas). Aquí solo lo propio: fichas en rejilla ordenada con texto a la
   izquierda, tarjeta de infografía ampliable y el visor a pantalla completa.
   El HTML lo arma correcciones.js. ─────────────────────────────────────── */
.uny-me{ padding-top: 44px !important; }
.uny-me .uny-eg__txt{ max-width: none; }
.uny-me__txts{ margin-top: 20px; }
.uny-me__txts .uny-eg__txt{ margin-bottom: 12px !important; }
.uny-me .uny-eg__rot{ margin-top: 22px !important; }
.uny-me .uny-eg__cab + .uny-eg__txt{ margin-top: 0 !important; }
/* fichas: dos columnas iguales (una en teléfono), texto a la izquierda */
.uny-me__fns{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; margin-top: 16px !important; }
.uny-me__fn{ align-items: flex-start !important; text-align: left !important; padding: 26px 24px 22px 24px !important; }
.uny-me__fn .uny-eg__fico{ width: 50px; height: 50px; margin-bottom: 14px; }
.uny-me__fn .uny-eg__fico svg{ width: 24px; height: 24px; }
.uny-me__fn .uny-eg__fnD{ text-align: left !important; font-size: 15px !important; line-height: 1.6 !important; color: #2b3a55 !important; }
/* infografía: tarjeta clara, al centro, se amplía al tocar */
.uny-me__info{ margin: 0 auto !important; padding: 0 !important; max-width: 520px; } /* 17-sep: Luis: «no coloques las infografías en grande»; el tamaño grande queda solo en el visor */
.uny-me__zoom{ position: relative; display: block; border: 1px solid #E6ECF8; border-radius: 18px; background: #F6F9FF; padding: 14px; cursor: zoom-in; text-decoration: none !important; transition: transform .2s ease, box-shadow .2s ease; }
.uny-me__zoom:hover{ transform: translateY(-3px); box-shadow: 0 12px 26px rgba(11,18,54,.12); }
.uny-me__zoom img{ display: block; width: 100%; height: auto; border-radius: 10px; }
.uny-me__lupa{ position: absolute; right: 24px; bottom: 24px; display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 999px; background: #0B1236; color: #fff !important; font-size: 13px; font-weight: 700; letter-spacing: .02em; box-shadow: 0 6px 16px rgba(11,18,54,.25); pointer-events: none; }
.uny-me__lupa svg{ width: 16px; height: 16px; }
.uny-me__cta{ margin-top: 24px; text-align: center !important; }
.uny-me__btn{ display: inline-block; padding: 15px 34px; border-radius: 999px; background: linear-gradient(135deg,#0071E3,#25409E); color: #fff !important; font-weight: 700; font-size: 15px; text-decoration: none !important; box-shadow: 0 10px 24px rgba(0,113,227,.28); transition: transform .2s ease; }
.uny-me__btn:hover{ transform: translateY(-2px); }
/* visor */
.uny-me__lb{ position: fixed; inset: 0; z-index: 2147483000; display: none; align-items: center; justify-content: center; padding: 22px; background: rgba(8,14,40,.9); cursor: zoom-out; }
.uny-me__lb.is-on{ display: flex; }
.uny-me__lb img{ width: min(96vw, 1400px); height: auto; max-height: 92vh; object-fit: contain; border-radius: 10px; background: #fff; padding: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.5); cursor: default; }
.uny-me__lbX{ position: absolute; top: 16px; right: 18px; width: 46px; height: 46px; border-radius: 50%; background: #fff !important; color: #0B1236 !important; font-size: 30px; line-height: 46px; text-align: center !important; text-decoration: none !important; box-shadow: 0 6px 18px rgba(0,0,0,.3); }
html.uny-me-lb-abierto, html.uny-me-lb-abierto body{ overflow: hidden !important; }
@media (max-width: 767px){
	.uny-me{ padding-top: 28px !important; }
	.uny-me__fns{ grid-template-columns: 1fr !important; }
	.uny-me__zoom{ padding: 8px; }
	.uny-me__lupa{ right: 16px; bottom: 16px; padding: 8px 12px; }
	.uny-me__btn{ display: block; }
	.uny-me__lb{ padding: 10px; }
	.uny-me__lb img{ max-width: 96vw; }
}

/* 18-sep-2026 · Estructura › Vicerrectorado Administrativo: foto vertical nueva
   (David). En tablet/teléfono la banda genérica corta a 30% y deja las caras en
   el borde; para esta foto las caras están a media altura. */
@media (max-width: 1024px){
	html body.page-id-4367 .e-con.elementor-element-0348d37.uny-foto-banda{ background-position: center 58% !important; }
}

/* 18-sep-2026 · Estructura › Vicerrectorado Administrativo: en escritorio la caja
   es muy apaisada para una foto vertical; se le da más alto para que entren las
   cabezas de los que están de pie. */
@media (min-width: 1025px){
	html body.page-id-4367 .e-con.elementor-element-0348d37{ min-height: 330px !important; }
}

/* 18-sep-2026 · Rutas Estudiantiles: Luis pide más autobuses y edificio, menos
   cielo. En escritorio se amplía la foto y se ancla abajo. */
/* (el zoom va en correcciones.js: el script del sitio escribe background-size en línea) */

/* 18-sep-2026 · Rutas Estudiantiles: la introducción, al mismo ancho que el
   panel «Acompañamiento en tu movilidad» (Luis). Antes tenía tope de 900 px. */
.uny-rt .uny-rt-intro{ max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }

/* 18-sep-2026 · Inversión Académica: la introducción, al mismo ancho que las
   tarjetas de información (Luis). Antes tenía tope de 900 px. */
.uny-inv-caja .uny-inv-intro{ max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }


/* 18-sep-2026 · Menú «Docentes UNY» (tercer nivel) en el desplegable de Elementor
   (páginas de carrera y programa). SmartMenus registra el submenú, pero por si
   su hover no llega, este respaldo lo abre con CSS: hacia la izquierda, porque
   +UNY está pegado al borde derecho. Solo afecta a nuestro <li>. */
.elementor-nav-menu--main .sub-menu li.uny-docentes{ position: relative !important; }
.elementor-nav-menu--main .sub-menu li.uny-docentes:hover > ul,
.elementor-nav-menu--main .sub-menu li.uny-docentes:focus-within > ul{
	display: block !important; position: absolute !important; top: 0 !important;
	left: auto !important; right: 100% !important; margin: 0 !important;
	width: auto !important; min-width: 13em !important; max-width: none !important;
	opacity: 1 !important; visibility: visible !important; z-index: 9999 !important;
}

/* 18-sep-2026 · Menú de pastillas de las portadas (.uny-menu-root): el tercer
   nivel de «Docentes UNY» abría a la derecha y se salía de la pantalla, porque
   +UNY es el último ítem. Abre hacia la izquierda, como en los otros menús. */
.uny-menu-root li.uny-docentes > ul{ left: auto !important; right: 100% !important; top: 0 !important; }
/* …y el desplegable del ÚLTIMO ítem (+UNY) se alinea a su borde derecho: abría
   desde la izquierda del ítem y a 1400 px de ancho se cortaba por la derecha. */
.uny-menu-root > li:last-child > ul{ left: auto !important; right: 0 !important; }

/* 18-sep-2026 · Botón del plan de estudio en teléfono: a todo el ancho y con aire */
@media (max-width: 767px){
	.elementor-widget-button.uny-plan-visible{ display: block !important; width: 100% !important; margin: 16px 0 6px !important; }
	.elementor-widget-button.uny-plan-visible .elementor-button{ display: flex !important; width: 100% !important; justify-content: center !important; }
}

/* 18-sep-2026 · Postdoctorado en Organizaciones Inteligentes y Sostenibles: David,
   «la cara está cortada». La portada es un <img> con object-fit:cover en una caja
   muy apaisada (muestra ~59 % del alto) y estaba centrada; las cabezas están en el
   tercio superior. Se ancla arriba. */
html body.page-id-5174 .elementor-element-f3ff680 img{ object-position: center 8% !important; }

/* ═══ 18-sep-2026 · Visor de fotos de las notas de prensa ═══════════════════ */
body.uny-nota a.uny-nota__foto, body.uny-nota .uny-nota__portada img{ cursor: zoom-in !important; }
body.uny-nota a.uny-nota__foto{ position: relative; }
body.uny-nota a.uny-nota__foto::after{ content: "\2922"; position: absolute; right: 10px; bottom: 10px; width: 34px; height: 34px; border-radius: 50%; background: rgba(11,18,54,.78); color: #fff; font-size: 18px; line-height: 34px; text-align: center; opacity: 0; transform: translateY(4px); transition: opacity .2s ease, transform .2s ease; pointer-events: none; }
body.uny-nota a.uny-nota__foto:hover::after{ opacity: 1; transform: none; }
.uny-lb{ position: fixed; inset: 0; z-index: 2147483000; display: none; align-items: center; justify-content: center; padding: 24px 76px; background: rgba(8,14,40,.93); cursor: zoom-out; }
.uny-lb.is-on{ display: flex; }
.uny-lb__img{ max-width: 100%; max-height: 90vh; width: auto; height: auto; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.55); cursor: default; background: #0B1236; }
.uny-lb__x, .uny-lb__nav{ position: absolute; display: block; width: 48px; height: 48px; border-radius: 50%; background: #fff !important; color: #0B1236 !important; text-align: center !important; text-decoration: none !important; box-shadow: 0 6px 18px rgba(0,0,0,.35); font-family: Arial, sans-serif; user-select: none; }
.uny-lb__x{ top: 16px; right: 18px; font-size: 30px; line-height: 46px; }
.uny-lb__nav{ top: 50%; margin-top: -24px; font-size: 34px; line-height: 42px; }
.uny-lb__prev{ left: 16px; } .uny-lb__next{ right: 16px; }
.uny-lb__x:hover, .uny-lb__nav:hover{ background: #EAF2FF !important; }
.uny-lb__cont{ position: absolute; left: 0; right: 0; bottom: 14px; text-align: center !important; color: rgba(255,255,255,.85); font: 600 13px/1 Montserrat, sans-serif; letter-spacing: .12em; pointer-events: none; }
.uny-lb--una .uny-lb__nav, .uny-lb--una .uny-lb__cont{ display: none; }
html.uny-lb-abierto, html.uny-lb-abierto body{ overflow: hidden !important; }
@media (max-width: 767px){
	.uny-lb{ padding: 60px 8px 46px; }
	.uny-lb__img{ max-height: 78vh; border-radius: 6px; }
	.uny-lb__nav{ width: 40px; height: 40px; margin-top: -20px; font-size: 28px; line-height: 35px; background: rgba(255,255,255,.92) !important; }
	.uny-lb__prev{ left: 8px; } .uny-lb__next{ right: 8px; }
}