/* Tuenweb Site: CSS BASE de las cabeceras, menús y pies DEL PLUGIN (plantillas Estándar y Columnas).
 *
 * Viene con el plugin y lo actualiza install.php: NO se edita en cada web. Cada web cambia colores,
 * tipografías y medidas en el panel (Site › CSS) redefiniendo estas variables, p. ej.:
 *   .tw-site-header{ --tw-site-accent:#D9291C; --tw-site-height:84px; }
 *   .tw-site-footer{ --tw-site-footer-bg:#0E0C0B; }
 * Solo se carga si la cabecera o el pie de la página usan una plantilla del plugin (las plantillas
 * propias de una web usan el CSS de esa web). Todo va con prefijo tw-site- para no chocar.
 */

.tw-site-header, .tw-site-footer{
  --tw-site-max:1200px;
  --tw-site-gutter:24px;
  --tw-site-font:inherit;
  --tw-site-accent:#1D4A5E;
  --tw-site-accent-text:#FFFFFF;
  --tw-site-radius:4px;
}
.tw-site-header{
  --tw-site-bg:#FFFFFF;
  --tw-site-text:#1A1A1A;
  --tw-site-muted:#5B6472;
  --tw-site-border:rgba(0,0,0,0.08);
  --tw-site-height:76px;
  --tw-site-logo-height:44px;
  --tw-site-logo-height-mobile:36px;
  --tw-site-sub-bg:#FFFFFF;
  --tw-site-topbar-bg:var(--tw-site-accent);
  --tw-site-topbar-text:var(--tw-site-accent-text);
  --tw-site-overlay-bg:#111418;
  --tw-site-overlay-text:#FFFFFF;
  --tw-site-overlay-muted:rgba(255,255,255,0.6);
}
.tw-site-footer{
  --tw-site-footer-bg:#111418;
  --tw-site-footer-text:rgba(255,255,255,0.75);
  --tw-site-footer-title:#FFFFFF;
  --tw-site-footer-link:rgba(255,255,255,0.75);
  --tw-site-footer-link-hover:#FFFFFF;
  --tw-site-footer-border:rgba(255,255,255,0.12);
  --tw-site-footer-cols:repeat(4, minmax(0, 1fr));
}

.tw-site-wrap{ max-width:var(--tw-site-max); margin:0 auto; padding:0 var(--tw-site-gutter); }
.tw-site-sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (min-width:992px){ .tw-site-only-mobile{ display:none !important; } }   /* sin "revert": cada elemento conserva su display (flex, etc.) */

/* ---------------------------------------------------------------- Cabecera */
.tw-site-header{ position:relative; z-index:900; background:var(--tw-site-bg); color:var(--tw-site-text); font-family:var(--tw-site-font); border-bottom:1px solid var(--tw-site-border); }
.tw-site-header.is-sticky{ position:sticky; top:0; }
/* Fija SOBRE el contenido (1.7): no reserva su hueco; la primera sección de la web lo deja (p. ej. con
   padding-top: var(--tw-site-height)). Útil para cabeceras translúcidas sobre una portada. */
.tw-site-header.is-fixed{ position:fixed; top:0; left:0; right:0; }
.tw-site-header.is-scrolled{ box-shadow:0 6px 20px rgba(0,0,0,0.08); }
.tw-site-header a{ color:inherit; text-decoration:none; }
.tw-site-header__bar{ display:flex; align-items:center; gap:24px; min-height:var(--tw-site-height); }
.tw-site-logo{ display:flex; align-items:center; flex:0 0 auto; margin-right:auto; }
.tw-site-logo img{ display:block; height:var(--tw-site-logo-height); width:auto; }
.tw-site-header__ctas{ display:flex; align-items:center; gap:10px; }

.tw-site-topbar{ background:var(--tw-site-topbar-bg); color:var(--tw-site-topbar-text); font-size:13px; }
.tw-site-topbar__inner{ display:flex; align-items:center; justify-content:flex-end; gap:20px; min-height:38px; flex-wrap:wrap; }
.tw-site-topbar a{ color:inherit; }

/* Botones CTA */
.tw-site-cta{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 20px; border-radius:var(--tw-site-radius); font-weight:600; font-size:14px; line-height:1.2; border:1px solid transparent; cursor:pointer; white-space:nowrap; transition:background .15s, color .15s, border-color .15s; }
.tw-site-cta--primary{ background:var(--tw-site-accent); color:var(--tw-site-accent-text) !important; }
.tw-site-cta--primary:hover{ filter:brightness(0.92); }
.tw-site-cta--outline{ border-color:currentColor; color:inherit; }
.tw-site-cta--outline:hover{ background:var(--tw-site-accent); border-color:var(--tw-site-accent); color:var(--tw-site-accent-text) !important; }
/* Icono y texto destacado de un elemento (1.8) */
.tw-site-icon{ display:inline-block; width:1.15em; height:1.15em; fill:currentColor; flex:none; vertical-align:-0.2em; }
.tw-site-cta .tw-site-item__detail{ font-weight:700; }
.tw-site-cta--link{ padding:11px 4px; text-decoration:underline !important; }
.tw-site-nav__ctas{ display:none; }

/* Menú desplegable (escritorio) */
.tw-site-nav{ display:flex; align-items:center; gap:18px; }
.tw-site-menu{ display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; }
.tw-site-menu__item{ position:relative; display:flex; align-items:center; }
.tw-site-menu__link{ display:block; padding:10px 12px; font-size:15px; font-weight:500; border-radius:var(--tw-site-radius); }
.tw-site-menu__link:hover, .tw-site-menu__link[aria-current="page"]{ color:var(--tw-site-accent); }
.tw-site-menu__caret{ width:22px; height:22px; margin-left:-8px; padding:0; border:0; background:none; color:inherit; cursor:pointer; position:relative; }
.tw-site-menu__caret::before{ content:""; position:absolute; left:6px; top:6px; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); transition:transform .15s; }
.tw-site-menu__item.is-open > .tw-site-menu__caret::before{ transform:rotate(-135deg); top:9px; }
.tw-site-sub{ position:absolute; top:100%; left:0; min-width:240px; padding:14px 18px; background:var(--tw-site-sub-bg); color:var(--tw-site-text); border:1px solid var(--tw-site-border); border-radius:var(--tw-site-radius); box-shadow:0 18px 40px rgba(0,0,0,0.12); opacity:0; visibility:hidden; transform:translateY(6px); transition:opacity .15s, transform .15s, visibility .15s; z-index:10; }
.tw-site-sub ul{ list-style:none; margin:0; padding:0; }
.tw-site-sub li a, .tw-site-sub li span{ display:block; padding:7px 0; font-size:14px; white-space:nowrap; }
.tw-site-sub a:hover, .tw-site-sub a[aria-current="page"]{ color:var(--tw-site-accent); }
.tw-site-sub--mega{ display:flex; gap:36px; }
.tw-site-sub__col{ min-width:220px; }
.tw-site-sub__head{ display:block; font-weight:700; padding:7px 0 9px; margin-bottom:6px; border-bottom:1px solid var(--tw-site-border); }
.tw-site-menu__item:hover > .tw-site-sub, .tw-site-menu__item:focus-within > .tw-site-sub, .tw-site-menu__item.is-open > .tw-site-sub{ opacity:1; visibility:visible; transform:translateY(0); }

/* Botón del menú */
.tw-site-toggle{ display:none; align-items:center; gap:10px; padding:8px; margin:0; border:0; background:none; color:inherit; cursor:pointer; font:inherit; }
.tw-site-toggle__bars{ display:inline-flex; flex-direction:column; gap:5px; width:24px; }
.tw-site-toggle__bars span{ display:block; height:2px; background:currentColor; border-radius:2px; transition:transform .2s, opacity .2s; }
.tw-site-toggle[aria-expanded="true"] .tw-site-toggle__bars span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.tw-site-toggle[aria-expanded="true"] .tw-site-toggle__bars span:nth-child(2){ opacity:0; }
.tw-site-toggle[aria-expanded="true"] .tw-site-toggle__bars span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.tw-site-toggle__label{ font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.tw-site-header--pantalla-completa .tw-site-toggle{ display:inline-flex; }

/* Menú a pantalla completa */
.tw-site-overlay{ position:fixed; inset:0; top:var(--tw-site-overlay-top, 0); z-index:899; overflow-y:auto; background:var(--tw-site-overlay-bg); color:var(--tw-site-overlay-text); padding:calc(var(--tw-site-height) + 32px) 0 48px; }
/* Aparece con un fundido (1.7): el JS quita hidden y añade is-open en el siguiente fotograma. */
.tw-site-overlay{ opacity:0; visibility:hidden; transition:opacity .35s ease, visibility .35s ease; }
.tw-site-overlay.is-open{ opacity:1; visibility:visible; transition-property:opacity; } /* visible ya al abrir: puede recibir el foco */
.tw-site-overlay[hidden]{ display:none; }
@media (prefers-reduced-motion:reduce){ .tw-site-overlay{ transition:none; } }
.tw-site-header--pantalla-completa .tw-site-header__bar{ position:relative; z-index:901; }
/* backdrop-filter, filter o transform en la cabecera harían que la capa (position:fixed, hija suya) quedara
   encerrada en la cabecera: mientras la capa está visible (también durante el fundido de cierre) se anulan. */
.tw-site-header:has(> .tw-site-overlay:not([hidden])){ -webkit-backdrop-filter:none; backdrop-filter:none; filter:none; transform:none; }
body.tw-site-nav-open .tw-site-header--pantalla-completa{ --tw-site-text:var(--tw-site-overlay-text); background:transparent; border-color:transparent; }
body.tw-site-nav-open{ overflow:hidden; }
.tw-site-overlay__list{ list-style:none; margin:0; padding:0; }
.tw-site-overlay__item{ border-bottom:1px solid rgba(255,255,255,0.12); }
.tw-site-overlay__link{ display:flex; align-items:baseline; gap:18px; padding:18px 0; font-size:clamp(26px, 4.4vw, 46px); line-height:1.1; font-weight:500; }
.tw-site-overlay__link:hover, .tw-site-overlay__link[aria-current="page"]{ color:var(--tw-site-accent); }
.tw-site-overlay__index{ font-size:13px; letter-spacing:.1em; color:var(--tw-site-overlay-muted); min-width:2.2em; }
.tw-site-overlay__sub{ list-style:none; margin:0 0 18px; padding:0 0 0 calc(2.2em + 18px); display:flex; flex-wrap:wrap; gap:6px 22px; font-size:15px; color:var(--tw-site-overlay-muted); }
.tw-site-overlay__sub a:hover{ color:var(--tw-site-overlay-text); }
.tw-site-overlay__sub2{ font-size:14px; }
.tw-site-overlay__ctas{ display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }

/* Selector de idioma */
.tw-site-lang{ display:flex; gap:6px; font-size:13px; }
.tw-site-lang__link{ padding:4px 6px; border-radius:var(--tw-site-radius); opacity:.7; }
.tw-site-lang__link.is-active, .tw-site-lang__link:hover{ opacity:1; font-weight:700; }
.tw-site-lang--names{ gap:2px 10px; flex-wrap:wrap; }
/* Desplegable: <details> con el idioma actual; la lista se abre debajo. */
.tw-site-lang--dropdown{ position:relative; display:inline-block; }
.tw-site-lang--dropdown summary{ list-style:none; cursor:pointer; padding:4px 22px 4px 6px; position:relative; font-weight:700; }
.tw-site-lang--dropdown summary::-webkit-details-marker{ display:none; }
.tw-site-lang--dropdown summary::after{ content:""; position:absolute; right:6px; top:50%; width:6px; height:6px; margin-top:-5px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); }
.tw-site-lang--dropdown[open] summary::after{ transform:rotate(-135deg); margin-top:-1px; }
.tw-site-lang__list{ position:absolute; right:0; top:100%; z-index:20; min-width:150px; display:flex; flex-direction:column; padding:6px; margin-top:6px; background:var(--tw-site-sub-bg); color:var(--tw-site-text); border:1px solid var(--tw-site-border); border-radius:var(--tw-site-radius); box-shadow:0 12px 30px rgba(0,0,0,0.12); }
.tw-site-lang__list .tw-site-lang__link{ padding:7px 10px; }
.tw-site-overlay .tw-site-lang, .tw-site-nav .tw-site-lang{ margin-top:24px; }
.tw-site-footer .tw-site-lang__list{ top:auto; bottom:100%; margin:0 0 6px; }

/* ---------------------------------------------------------------- Móvil (cabecera) */
@media (max-width:991px){
  .tw-site-only-desktop{ display:none !important; }
  .tw-site-logo img{ height:var(--tw-site-logo-height-mobile); }
  .tw-site-header__bar{ gap:12px; }
  .tw-site-header__ctas{ display:none; }
  .tw-site-header--sin-menu .tw-site-header__ctas{ display:flex; }   /* sin menú no hay dónde llevarlos (1.8) */
  .tw-site-header--ctas-barra .tw-site-header__ctas{ display:flex; margin-left:auto; }   /* 1.9: en la barra, junto al botón del menú */
  .tw-site-header--ctas-barra .tw-site-nav__ctas{ display:none; }
  .tw-site-toggle{ display:inline-flex; }
  .tw-site-header--desplegable .tw-site-nav{ position:absolute; left:0; right:0; top:100%; display:none; flex-direction:column; align-items:stretch; gap:0; max-height:calc(100vh - var(--tw-site-height)); overflow-y:auto; padding:8px var(--tw-site-gutter) 24px; background:var(--tw-site-bg); border-bottom:1px solid var(--tw-site-border); box-shadow:0 18px 30px rgba(0,0,0,0.1); }
  .tw-site-header--desplegable .tw-site-nav.is-open{ display:flex; }
  .tw-site-menu{ flex-direction:column; align-items:stretch; gap:0; }
  .tw-site-menu__item{ flex-wrap:wrap; border-bottom:1px solid var(--tw-site-border); }
  .tw-site-menu__link{ flex:1; padding:14px 0; }
  .tw-site-menu__caret{ width:44px; height:44px; margin:0; }
  .tw-site-menu__caret::before{ left:18px; top:16px; }
  .tw-site-menu__item.is-open > .tw-site-menu__caret::before{ top:20px; }
  .tw-site-sub, .tw-site-menu__item:hover > .tw-site-sub, .tw-site-menu__item:focus-within > .tw-site-sub{ position:static; flex-basis:100%; display:none; opacity:1; visibility:visible; transform:none; min-width:0; padding:0 0 12px 14px; border:0; box-shadow:none; background:none; }
  .tw-site-menu__item.is-open > .tw-site-sub{ display:block; }
  .tw-site-sub--mega{ gap:0; }
  .tw-site-menu__item.is-open > .tw-site-sub--mega{ display:flex; flex-direction:column; gap:14px; }
  .tw-site-sub li a{ white-space:normal; }
  .tw-site-nav__ctas{ display:flex; flex-direction:column; gap:10px; margin-top:18px; }
  .tw-site-overlay{ padding-top:calc(var(--tw-site-height) + 16px); }
}

/* ---------------------------------------------------------------- Pie */
.tw-site-footer{ background:var(--tw-site-footer-bg); color:var(--tw-site-footer-text); font-family:var(--tw-site-font); padding:56px 0 0; font-size:14.5px; line-height:1.6; }
.tw-site-footer a{ color:var(--tw-site-footer-link); text-decoration:none; }
.tw-site-footer a:hover{ color:var(--tw-site-footer-link-hover); }
.tw-site-footer__grid{ display:grid; grid-template-columns:var(--tw-site-footer-cols); gap:40px; padding-bottom:44px; }
.tw-site-footer__grid--1{ --tw-site-footer-cols:minmax(0, 1fr); }
.tw-site-footer__grid--2{ --tw-site-footer-cols:repeat(2, minmax(0, 1fr)); }
.tw-site-footer__grid--3{ --tw-site-footer-cols:repeat(3, minmax(0, 1fr)); }
.tw-site-footer__grid--5{ --tw-site-footer-cols:repeat(5, minmax(0, 1fr)); }
.tw-site-footer__grid--6{ --tw-site-footer-cols:repeat(6, minmax(0, 1fr)); }
.tw-site-footer__title{ margin:0 0 14px; font-size:15px; font-weight:700; color:var(--tw-site-footer-title); }
.tw-site-footer__logo{ display:inline-block; margin-bottom:16px; }
.tw-site-footer__logo img{ display:block; height:44px; width:auto; }
/* color:inherit: si la web pinta sus <p> en gris (p{color:...}), aquí seguirían el color del pie. */
.tw-site-footer p, .tw-site-topbar p{ color:inherit; }
.tw-site-footer__text p{ margin:0 0 10px; }
.tw-site-list{ list-style:none; margin:0; padding:0; }
.tw-site-list__item{ padding:4px 0; }
.tw-site-footer__band{ margin:0 0 32px; }
.tw-site-footer__band img{ display:inline-block; max-width:100%; height:auto; }
.tw-site-footer__legal--sin-separador{ display:inline-flex; flex-wrap:wrap; gap:6px 18px; }
.tw-site-footer__bottom{ display:flex; justify-content:space-between; align-items:center; gap:12px 24px; flex-wrap:wrap; padding:20px 0 26px; border-top:1px solid var(--tw-site-footer-border); font-size:13px; }

@media (max-width:991px){
  .tw-site-footer__grid{ grid-template-columns:repeat(2, minmax(0, 1fr)) !important; gap:32px; }
}
@media (max-width:600px){
  .tw-site-footer__grid{ grid-template-columns:minmax(0, 1fr) !important; }
  .tw-site-footer__bottom{ flex-direction:column; align-items:flex-start; }
}