/* UOL Cabecera · 3 modelos de cabecera de sitio. Las variables --uc-* las define el bloque. */

.uol-cab{
	box-sizing: border-box; position: relative; z-index: 30;
	background: var(--uc-bg); color: var(--uc-text); line-height: 1.4;
	padding: var(--uc-pad-top) var(--uc-pad-right) var(--uc-pad-bottom) var(--uc-pad-left);
	container: uolcab / inline-size;
}
.uol-cab *,.uol-cab *::before,.uol-cab *::after{ box-sizing: border-box; }
.uol-cab a{ color: inherit; }
.uol-cab--fb{ font-family: var(--uc-font-body); }
.uol-cab--fh .uol-cab__nav,.uol-cab--fh .uol-cab__slogan{ font-family: var(--uc-font-head); }
.uol-cab.uol-cab--viewport,
.is-layout-constrained > .uol-cab.uol-cab--viewport,
.is-layout-flow > .uol-cab.uol-cab--viewport{
	/* De borde a borde de la ventana, aunque esté dentro de un grupo con márgenes (--uc-sbw = barra de desplazamiento, la calcula view.js). */
	width: calc(100vw - var(--uc-sbw, 0px)) !important; max-width: none !important;
	margin-left: calc(50% - 50vw + var(--uc-sbw, 0px) / 2) !important;
	margin-right: calc(50% - 50vw + var(--uc-sbw, 0px) / 2) !important;
}
.uol-cab__inner{ max-width: var(--uc-inner); margin-inline: auto; }

/* Sobre un video o imagen: fondo transparente; el bloque siguiente sube debajo (lo hace view.js). */
.uol-cab--sobre{ background: transparent; }
.uol-cab--sobre.uol-cab--velo{ background: linear-gradient(to bottom, color-mix(in srgb, var(--uc-bg) 78%, transparent), transparent); }
.uol-cab--sobre.uol-cab--oscuro.uol-cab--velo{ background: linear-gradient(to bottom, rgba(0,0,0,.72) 0%, rgba(0,0,0,.45) 60%, rgba(0,0,0,0) 100%); }
/* Sobre video con letras blancas: una sombra leve asegura la lectura sobre zonas claras. */
.uol-cab--sobre.uol-cab--oscuro{ text-shadow: 0 1px 2px rgba(0,0,0,.55); }
.uol-cab--sobre.uol-cab--oscuro .uol-cab__info,.uol-cab--sobre.uol-cab--oscuro .wp-block-navigation__submenu-container{ text-shadow: none; }
.uol-cab--sobre.uol-cab--oscuro{ --uc-line: rgba(255,255,255,.32); }
.uol-cab--sobre.uol-cab--claro.uol-cab--velo{ background: linear-gradient(to bottom, color-mix(in srgb, var(--uc-bg) 88%, transparent), transparent); }

/* ---------- Barra superior ---------- */
.uol-cab__top{
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px;
	padding: 6px 0 12px; font-size: var(--uc-top-size); color: var(--uc-muted);
}
.uol-cab--fina .uol-cab__top{ border-bottom: 1px solid var(--uc-line); }
.uol-cab--top-it .uol-cab__top{ font-style: italic; }
.uol-cab__top-izq,.uol-cab__top-der{ display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; min-width: 0; }
.uol-cab__dia{ color: var(--uc-text); }
.uol-cab__ciudad::before,.uol-cab__ed::before{ content: "·"; margin-right: 18px; opacity: .6; }
.uol-cab__ciudad{ margin-left: -12px; }
.uol-cab__ed{ margin-left: -12px; }
.uol-cab__buscar{ display: flex; align-items: center; gap: 4px; margin: 0; }
.uol-cab__buscar input{
	width: 13em; max-width: 40vw; border: 0; background: transparent; color: var(--uc-text);
	font: inherit; font-style: inherit; padding: 4px 0; outline: none;
}
.uol-cab__buscar input::placeholder{ color: var(--uc-muted); opacity: 1; }
.uol-cab__buscar input:focus{ box-shadow: 0 1px 0 var(--uc-accent); }
.uol-cab__buscar button{ border: 0; background: transparent; color: var(--uc-muted); padding: 4px; cursor: pointer; display: grid; place-items: center; }
.uol-cab__buscar svg{ width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.uol-cab__links{ display: flex; gap: 22px; padding-left: 18px; border-left: 1px solid var(--uc-line); }
.uol-cab__links a{ color: var(--uc-text); text-decoration: none; display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-weight: 600; }
.uol-cab__links a + a{ color: var(--uc-accent); }
.uol-cab__acceso svg{ width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.uol-cab__links a:hover{ text-decoration: underline; }

/* ---------- Filas ---------- */
.uol-cab__fila{ display: flex; align-items: center; gap: 16px 32px; min-width: 0; }
.uol-cab__fila--logo{ padding: 18px 0; }
.uol-cab__fila--principal{ min-height: 64px; }
.uol-cab--fina .uol-cab__fila--logo + .uol-cab__fila{ border-top: 1px solid var(--uc-line); }
.uol-cab--gruesa .uol-cab__fila--principal{ border-bottom: var(--uc-thick) solid var(--uc-strong); }
.uol-cab--a .uol-cab__fila--principal{ padding-top: 14px; }

/* Modelo A: logo | menú (centro) | redes */
.uol-cab--a .uol-cab__marca{ flex: 0 0 auto; padding-bottom: 14px; }
.uol-cab--a .uol-cab__nav{ flex: 1 1 auto; align-self: stretch; display: flex; align-items: stretch; justify-content: center; }
.uol-cab--a .uol-cab__redes{ flex: 0 0 auto; padding-bottom: 14px; }
.uol-cab--a .uol-cab__slogan{ display: none; }

/* Modelo B: logo arriba; menú izquierda | redes */
.uol-cab--b .uol-cab__fila--logo{ justify-content: space-between; }
.uol-cab--b .uol-cab__nav{ flex: 1 1 auto; align-self: stretch; display: flex; align-items: stretch; }
.uol-cab--b .uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item:first-child > .wp-block-navigation-item__content{ padding-left: 0; }
.uol-cab--b .uol-cab__redes{ margin-left: auto; }

/* Modelo C: logo centrado con redes a la derecha; menú centrado */
.uol-cab--c .uol-cab__fila--logo{ display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
.uol-cab--c .uol-cab__lado--der{ display: flex; justify-content: flex-end; }
.uol-cab--c .uol-cab__fila--slogan{ justify-content: center; padding-bottom: 14px; }
.uol-cab--c .uol-cab__nav{ flex: 1 1 auto; align-self: stretch; display: flex; align-items: stretch; justify-content: center; }

/* ---------- Logo y semáforo: piezas separadas, nunca superpuestas ---------- */
.uol-cab__marca{ display: flex; align-items: center; gap: var(--uc-sem-gap); min-width: 0; max-width: 100%; }
.uol-cab__logo{ display: block; flex: 0 1 auto; min-width: 0; line-height: 0; text-decoration: none; }
.uol-cab__logo-img{
	display: block; height: var(--uc-logo-h) !important; width: auto !important; max-width: 100%;
	object-fit: contain; object-position: left center;
}
.uol-cab__logo-texto{ display: block; font-weight: 700; font-size: var(--uc-logo-h); line-height: 1; }
.uol-cab__semaforo{ position: relative; display: inline-flex; align-items: center; flex: 0 0 auto; text-decoration: none; color: inherit; }
.uol-cab__sem-btn{
	display: inline-flex; align-items: center; gap: 10px; border: 0; background: transparent; color: inherit;
	padding: 4px; margin: -4px; font: inherit; cursor: pointer; text-align: left; border-radius: 8px;
}
.uol-cab__sem-btn:focus-visible{ outline: 2px solid var(--uc-accent); outline-offset: 2px; }
.uol-cab__lema{
	font-size: 11px; line-height: 1.25; letter-spacing: .14em; text-transform: uppercase; font-weight: 500;
	color: var(--uc-muted); max-width: 11em; font-style: normal;
}
.uol-cab__sem-btn:hover .uol-cab__lema{ color: var(--uc-text); }

.uol-cab__sem{
	display: inline-flex; flex-direction: column; gap: calc(var(--uc-lamp) * .4);
	padding: calc(var(--uc-lamp) * .55) calc(var(--uc-lamp) * .5);
	background: var(--uc-sem); border-radius: calc(var(--uc-lamp) * 1.2); flex: 0 0 auto;
}
.uol-cab--oscuro .uol-cab__sem{ box-shadow: 0 0 0 1px rgba(255,255,255,.14); }
.uol-cab__sem--h{ flex-direction: row; }
.uol-cab__sem i{ display: block; width: var(--uc-lamp); height: var(--uc-lamp); border-radius: 50%; opacity: .22; }
.uol-cab__sem .r,.uol-cab__info .r{ background: var(--uc-r); color: var(--uc-r); }
.uol-cab__sem .a,.uol-cab__info .a{ background: var(--uc-a); color: var(--uc-a); }
.uol-cab__sem .v,.uol-cab__info .v{ background: var(--uc-v); color: var(--uc-v); }
.uol-cab__sem--rojo .r,.uol-cab__sem--amarillo .a,.uol-cab__sem--verde .v{ opacity: 1; box-shadow: 0 0 calc(var(--uc-lamp) * .9) currentColor; }
.uol-cab__sem--ciclo i{ animation: uolcab-luz 9s infinite; }
.uol-cab__sem--ciclo .a{ animation-delay: 3s; }
.uol-cab__sem--ciclo .v{ animation-delay: 6s; }
@keyframes uolcab-luz{
	0%, 30%{ opacity: 1; box-shadow: 0 0 calc(var(--uc-lamp) * .9) currentColor; }
	34%, 100%{ opacity: .22; box-shadow: none; }
}

/* Explicación breve del semáforo */
.uol-cab__info{
	position: absolute; top: calc(100% + 12px); left: 0; z-index: 50; width: 270px; max-width: 80vw;
	padding: 16px 18px; border-radius: 12px; background: #ffffff; color: #14191d;
	box-shadow: 0 12px 40px -12px rgba(10,14,16,.35), 0 0 0 1px rgba(10,14,16,.06);
	font-size: 14px; line-height: 1.45; font-style: normal; text-align: left;
}
.uol-cab__info[hidden]{ display: none; }
.uol-cab__info::before{ content: ""; position: absolute; top: -6px; left: 22px; width: 12px; height: 12px; background: inherit; transform: rotate(45deg); box-shadow: -1px -1px 0 rgba(10,14,16,.06); }
.uol-cab__info--movida::before{ display: none; }
.uol-cab__info-t{ margin: 0 0 4px; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: #6b7378; font-weight: 600; }
.uol-cab__info-x{ margin: 0 0 10px; }
.uol-cab__info ul{ list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.uol-cab__info li{ display: flex; align-items: center; gap: 10px; }
.uol-cab__info li i{ width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; }
.uol-cab__info-a{ display: inline-block; margin-top: 12px; color: #14191d !important; font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; }

/* ---------- Menú (bloque Navegación del sitio) ---------- */
.uol-cab__nav{ font-size: var(--uc-menu-size); min-width: 0; }
.uol-cab__nav .wp-block-navigation{ gap: 0; font-size: inherit; font-weight: var(--uc-menu-w); color: var(--uc-text); }
.uol-cab__nav .wp-block-navigation__container{ gap: 0 !important; align-items: stretch; }
.uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item{ align-self: stretch; }
.uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content{
	position: relative; display: flex; align-items: center; height: 100%; padding: 14px 16px 18px; text-decoration: none; transition: color .15s;
}
.uol-cab__nav .wp-block-navigation-item__content:hover{ color: var(--uc-accent); }
.uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content::after{
	content: ""; position: absolute; left: 0; right: 0; bottom: calc(-1 * var(--uc-thick)); height: 3px;
	background: var(--uc-accent); transform: scaleX(0); transition: transform .2s;
}
.uol-cab__nav .current-menu-item > .wp-block-navigation-item__content,
.uol-cab__nav .current-menu-ancestor > .wp-block-navigation-item__content{ color: var(--uc-accent); }
.uol-cab__nav .wp-block-navigation__container > .current-menu-item > .wp-block-navigation-item__content::after,
.uol-cab__nav .wp-block-navigation__container > .current-menu-ancestor > .wp-block-navigation-item__content::after,
.uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content:hover::after{ transform: scaleX(1); }
.uol-cab__nav .wp-block-navigation__submenu-container{ background: var(--uc-bg) !important; color: var(--uc-text) !important; border: 1px solid var(--uc-line) !important; font-weight: 400; }
.uol-cab--sobre .uol-cab__nav .wp-block-navigation__submenu-container{ background: #ffffff !important; color: #14191d !important; }
.uol-cab__nav .wp-block-navigation__responsive-container.is-menu-open{ background: var(--uc-bg) !important; color: var(--uc-text) !important; }
.uol-cab--sobre .uol-cab__nav .wp-block-navigation__responsive-container.is-menu-open{ background: #0f1316 !important; color: #f4f6f5 !important; }
.uol-cab--sobre.uol-cab--claro .uol-cab__nav .wp-block-navigation__responsive-container.is-menu-open{ background: #ffffff !important; color: #14191d !important; }
.uol-cab__nav .wp-block-navigation__responsive-container-open{ color: var(--uc-text); }

.uol-cab__nav-full,.uol-cab__nav-movil{ display: flex; align-items: stretch; flex: 1 1 auto; justify-content: inherit; }
.uol-cab__nav--bloques{ display: flex; align-items: center; }
.uol-cab__zona{ display: inline-block; padding: 10px 16px; border: 1px dashed currentColor; border-radius: 6px; font-size: 13px; opacity: .8; }

/* Menú repartido en todo el ancho */
.uol-cab--menu-repartido .uol-cab__nav{ flex: 1 1 auto; }
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation,
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation__responsive-container:not(.is-menu-open),
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation__responsive-close,
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation__responsive-dialog,
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation__responsive-container-content{ flex: 1 1 auto; width: 100%; }
.uol-cab--menu-repartido .uol-cab__nav .wp-block-navigation__container{ flex: 1 1 auto; width: 100%; justify-content: space-between !important; }
.uol-cab--menu-repartido.uol-cab--b .uol-cab__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content{ padding-right: 0; }

/* ---------- Redes ---------- */
.uol-cab__redes{ display: flex; align-items: center; gap: 22px; }
.uol-cab__redes a{ color: var(--uc-muted); display: grid; place-items: center; transition: color .15s; }
.uol-cab__redes a:hover{ color: var(--uc-text); }
.uol-cab__redes svg{ width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }

.uol-cab__slogan{ margin: 0; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--uc-muted); font-weight: 500; }

/* ---------- Hoy en UOL (opcional) ---------- */
.uol-cab__ticker{ display: flex; align-items: stretch; min-width: 0; overflow: hidden; border-bottom: 1px solid var(--uc-line); font-size: 14px; }
.uol-cab__label{ flex: 0 0 auto; display: flex; align-items: center; padding: 8px 14px 8px 0; color: var(--uc-accent); font-weight: 600; font-size: .78em; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.uol-cab__ventana{
	flex: 1 1 auto; min-width: 0; overflow: hidden; display: flex; align-items: center;
	-webkit-mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
	mask-image: linear-gradient(to right, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}
.uol-cab__pista{ display: flex; width: max-content; animation: uolcab-tick var(--uc-dur, 60s) linear infinite; will-change: transform; }
.uol-cab__ticker:hover .uol-cab__pista,.uol-cab__ticker:focus-within .uol-cab__pista,.uol-cab--pausado .uol-cab__pista{ animation-play-state: paused; }
@keyframes uolcab-tick{ to{ transform: translateX(-50%); } }
.uol-cab__serie{ display: flex; margin: 0; padding: 0; list-style: none; }
.uol-cab__serie li{ display: flex; align-items: center; white-space: nowrap; padding: 8px 0; }
.uol-cab__serie li::after{ content: "·"; opacity: .5; margin: 0 16px; }
.uol-cab__serie a{ text-decoration: none; }
.uol-cab__serie a:hover{ text-decoration: underline; }
.uol-cab__pausa{ flex: 0 0 auto; width: 34px; border: 0; padding: 0; cursor: pointer; display: grid; place-items: center; background: transparent; color: var(--uc-muted); }
.uol-cab__pausa svg{ width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.uol-cab__pausa .i-play{ display: none; fill: currentColor; }
.uol-cab--pausado .uol-cab__pausa .i-pausa{ display: none; }
.uol-cab--pausado .uol-cab__pausa .i-play{ display: inline; }

@media (prefers-reduced-motion: reduce){
	.uol-cab__sem--ciclo i{ animation: none; }
	.uol-cab__sem--ciclo .v{ opacity: 1; box-shadow: 0 0 calc(var(--uc-lamp) * .9) currentColor; }
}
.uol-cab__dia{ display: inline-block; }
.uol-cab__dia::first-letter{ text-transform: uppercase; }

/* ---------- Zonas libres (banner de texto, banner gráfico, menú) ---------- */
.uol-cab__zona-c{ display: flex; flex-wrap: wrap; align-items: center; gap: .4em 1em; min-width: 0; width: 100%; }
.uol-cab__zona-c > *{ margin-top: 0 !important; margin-bottom: 0 !important; }
.uol-cab__zona-c img{ max-width: 100%; height: auto; display: block; }
.uol-cab__nav--bloques > .uol-cab__zona-c{ width: auto; flex: 1 1 auto; justify-content: inherit; }
.uol-cab__top-centro{ flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; font-style: normal; }
.uol-cab__top-centro a{ color: inherit; }
.uol-cab__banner{ display: flex; align-items: center; flex: 0 1 auto; min-width: 0; }
.uol-cab--a .uol-cab__banner{ flex: 0 1 auto; padding-bottom: 14px; }
.uol-cab--b .uol-cab__banner{ margin-left: auto; }
.uol-cab__fila--banner{ justify-content: center; padding-bottom: 14px; }
.uol-cab__solo-movil{ display: none !important; }
.uol-cab__top-centro:has(> .uol-cab__solo-movil:only-child),
.uol-cab__banner:has(> .uol-cab__solo-movil:only-child),
.uol-cab__fila--banner:has(.uol-cab__solo-movil:only-child){ display: none; }