/*! Diseño y desarrollo web: Xaime Nieto · https://xaimenieto.com · contacto@xaimenieto.com · © 2026 */
/* Encabezado global propuesto · Grupo Hotelero Santa Fe (vista privada)
   Un solo encabezado para todo el sitio, con megamenús por sección y la cotización de BMV: HOTEL. */
.gx,.gx-cajon,.gx-saltar,.gx-seccion{
 --marfil:#FFFFFF;--marfil-2:#F2F7FA;--tinta:#2F414C;--tinta-2:#435561;--filete:#DDE6EC;--acento:#2F414C;--marino:#2F414C;--claro:#A0C4DA;
 --margen:32px;--display:"Red Hat Display",system-ui,sans-serif;--texto:"Red Hat Text",system-ui,sans-serif}
.gx,.gx *,.gx-cajon,.gx-cajon *,.gx-seccion,.gx-seccion *{box-sizing:border-box}
.gx a,.gx-cajon a,.gx-seccion a{text-decoration:none;color:inherit}
.gx ul,.gx-cajon ul,.gx-seccion ul{list-style:none;margin:0;padding:0}
.gx button,.gx-cajon button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.gx :focus-visible,.gx-cajon :focus-visible,.gx-seccion :focus-visible{outline:2px solid currentColor;outline-offset:3px;border-radius:4px}
.gx-ancho{max-width:calc(1280px + 2*var(--margen));margin:0 auto;padding:0 var(--margen)}
.gx-saltar{position:absolute;left:var(--margen);top:-200px;z-index:2000;background:var(--tinta);color:#fff!important;font:600 16px/1 var(--texto);padding:14px 20px;border-radius:8px}
.gx-saltar:focus{top:8px}

/* ── Contenedor: se queda fijo; en la portada, transparente sobre la foto hasta desplazar ── */
.gx.tr-header{position:sticky;top:-44px;z-index:1000;font:400 16px/1.5 var(--texto);color:var(--tinta);margin:0;padding:0;height:auto;background:none}
.gx-principal{position:relative;isolation:isolate;border-bottom:1px solid var(--filete);transition:border-color .25s,color .25s}
/* vidrio en un pseudoelemento: así los megamenús pueden tener su propio desenfoque */
.gx-principal::before{content:"";position:absolute;inset:0;z-index:-1;background:#fff;transition:background .25s}
.gx--solido .gx-principal::before,.gx--abierto .gx-principal::before{-webkit-backdrop-filter:saturate(180%) blur(30px);backdrop-filter:saturate(180%) blur(30px)}
.gx--solido .gx-principal::before{background:rgba(255,255,255,.92)}
.gx--solido .gx-principal{border-bottom-color:rgba(47,65,76,.08);box-shadow:0 10px 30px -18px rgba(47,65,76,.35)}
.gx--abierto .gx-principal::before{background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(40px) saturate(190%) brightness(1.06);backdrop-filter:blur(40px) saturate(190%) brightness(1.06)}
.gx--abierto .gx-principal{border-bottom-color:transparent}
.gx--abierto .gx-mega{box-shadow:0 12px 24px -12px rgba(20,29,35,.12),0 48px 96px -24px rgba(20,29,35,.30)}
/* Portada en reposo: velo de humo con una sola curva suave (smoothstep, sin quiebres de pendiente), que cubre barra y menú
   y se desvanece 140 px sobre la foto, sin línea ni banda visible */
.gx--foto::after{content:"";position:absolute;left:0;right:0;top:0;bottom:-140px;z-index:-1;pointer-events:none;opacity:0;transition:opacity .3s;
 background:linear-gradient(180deg,rgba(20,29,35,0.740) 0.00%,rgba(20,29,35,0.740) 6.25%,rgba(20,29,35,0.740) 12.50%,rgba(20,29,35,0.740) 18.75%,rgba(20,29,35,0.740) 25.00%,rgba(20,29,35,0.739) 31.25%,rgba(20,29,35,0.716) 37.50%,rgba(20,29,35,0.666) 43.75%,rgba(20,29,35,0.593) 50.00%,rgba(20,29,35,0.506) 56.25%,rgba(20,29,35,0.410) 62.50%,rgba(20,29,35,0.311) 68.75%,rgba(20,29,35,0.216) 75.00%,rgba(20,29,35,0.131) 81.25%,rgba(20,29,35,0.062) 87.50%,rgba(20,29,35,0.017) 93.75%,rgba(20,29,35,0.000) 100.00%)}
.gx--foto:not(.gx--solido):not(.gx--abierto)::after{opacity:1}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra{background:transparent}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-principal{border-bottom-color:transparent;color:#fff}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-principal::before{background:transparent}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-logo .claro{opacity:1}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-logo .oscuro{opacity:0}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-cta{background:#fff;color:var(--tinta)!important;border-color:#fff}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-abrir{border-color:rgba(255,255,255,.5)}

/* ── Barra superior: la emisora primero ── */
.gx-barra{background:var(--marino);color:rgba(255,255,255,.82);font:500 14px/1 var(--texto);transition:background-color .3s}
.gx-barra .gx-ancho{display:flex;align-items:center;gap:24px;min-height:44px}
.gx-cotiza{display:inline-flex;align-items:center;gap:10px;min-height:44px;white-space:nowrap;color:#fff}
.gx-cotiza .sim{display:inline-flex;align-items:baseline;gap:6px;padding-bottom:2px;border-bottom:1px solid transparent;font-weight:600;letter-spacing:.06em;transition:border-color .2s}
.gx-cotiza .sim small{font-weight:500;color:var(--claro);letter-spacing:.06em}
.gx-cotiza .var{color:var(--claro)}
.gx-cotiza .var.baja{color:#F2B8A8}
.gx-cotiza .var.sube{color:#9FE0B8}
.gx-cotiza .hora{color:rgba(255,255,255,.6);font-weight:400}
/* un solo filete continuo bajo «BMV HOTEL» (el subrayado de texto se cortaba en el hueco entre ambos) */
.gx-cotiza:hover .sim,.gx-cotiza:focus-visible .sim{border-bottom-color:currentColor}
.gx-sep{width:1px;height:16px;background:rgba(255,255,255,.2)}
.gx-tel{display:inline-flex;align-items:center;gap:8px;min-height:44px;white-space:nowrap}
.gx-tel:hover,.gx-barra a:hover{color:#fff}
.gx-barra-der{margin-left:auto;display:flex;align-items:center;gap:18px}
.gx-marca{letter-spacing:.08em;font-weight:600;display:inline-flex;align-items:center;min-height:44px}
.gx-redes{display:flex}
.gx-redes a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;color:rgba(255,255,255,.78)}

/* ── Barra principal ── */
.gx-principal>.gx-ancho{display:flex;align-items:center;gap:40px;height:88px;transition:height .3s,gap .3s}
.gx--solido .gx-principal>.gx-ancho{height:72px}
/* al compactar (88 → 72) un relleno invisible conserva el espacio: la página no se mueve y el estado no oscila cerca del tope */
@media (min-width:701px){.gx.tr-header{transition:padding-bottom .3s}.gx.tr-header.gx--solido{padding-bottom:16px}}
.gx.tr-header{overflow-anchor:none}
.gx-logo{display:block;flex:none;line-height:0;position:relative}
.gx-logo img{display:block;height:48px;width:auto;margin-left:-13px;transition:height .3s,margin .3s}
@media (min-width:701px){.gx--solido .gx-logo img{height:46px;margin-left:-12.5px}}
.gx-logo .claro{position:absolute;left:0;top:0;opacity:0}
.gx-logo img{transition:height .3s,margin .3s,opacity .25s}
.gx-nav{margin-left:auto;height:100%}
.gx-menu{display:flex;align-items:stretch;gap:36px;height:100%}
.gx-menu>li{display:flex;align-items:center}
.gx-menu>li>a,.gx-menu>li>button{display:inline-flex;align-items:center;gap:8px;height:100%;font:500 16px/1 var(--texto);letter-spacing:.01em;position:relative}
.gx-menu>li>a::after,.gx-menu>li>button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .25s}
.gx-menu>li>a:hover::after,.gx-menu>li>button:hover::after,.gx-menu>li>button[aria-expanded="true"]::after,.gx-menu>li>[aria-current]::after{transform:scaleX(1)}
.gx-chev{transition:transform .2s;opacity:.7}
button[aria-expanded="true"]>.gx-chev{transform:rotate(180deg)}
.gx-cta{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 24px;border-radius:999px;background:var(--tinta);color:var(--marfil)!important;font:600 16px/1 var(--texto);white-space:nowrap;flex:none;border:1px solid var(--tinta);transition:none}
.gx-cta:hover{background:var(--acento);border-color:var(--acento)}
.gx-abrir{display:none;align-items:center;justify-content:center;width:48px;height:48px;border:1px solid var(--filete);border-radius:999px;flex:none;transition:border-color .25s}

/* ── Megamenús ── */
/* Megamenú: vidrio claro a todo lo ancho y al ras del menú (estilo iPhone): blanco translúcido, desenfoque profundo con saturación,
   brillo especular en el canto superior, borde de luz y sombra en capas. Tinta un punto más oscura para AA sobre cualquier fondo. */
.gx-mega{position:absolute;left:0;right:0;top:100%;border-radius:0;color:var(--tinta);display:none;isolation:isolate;
 --tinta-2:#435561;--acento:#2F414C;--filete:rgba(47,65,76,.11);
 background:linear-gradient(180deg,rgba(255,255,255,.90) 0,rgba(255,255,255,.84) 100%);
 -webkit-backdrop-filter:blur(40px) saturate(190%) brightness(1.06);backdrop-filter:blur(40px) saturate(190%) brightness(1.06);
 border:0;border-bottom:1px solid rgba(255,255,255,.7);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 12px 24px -12px rgba(20,29,35,.12),0 48px 96px -24px rgba(20,29,35,.30)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.gx-mega{background:rgba(255,255,255,.97)}}
.gx-velo{position:fixed;inset:0;z-index:-1;background:rgba(20,29,35,.28);opacity:0;visibility:hidden;transition:opacity .16s ease-out,visibility .16s}
.gx--abierto .gx-velo{opacity:1;visibility:visible}
.gx-mega.abierto{display:block;animation:gx-aparece .16s ease-out}
.gx-mega.abierto.gx-cambio{animation:none}
@keyframes gx-aparece{from{opacity:0}to{opacity:1}}
.gx--quieto,.gx--quieto *,.gx--quieto *::before,.gx--quieto *::after{transition:none!important}
.gx-mega .gx-ancho{display:grid;gap:48px;padding-top:40px;padding-bottom:48px}
.gx-mega-cab{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-bottom:1px solid var(--filete);padding-bottom:16px;margin-bottom:8px;grid-column:1/-1}
.gx-mega-cab h2{margin:0;font:600 28px/1.2 var(--display);letter-spacing:-.01em}
.gx-mega-cab a{font:600 16px/1 var(--texto);color:var(--acento);display:inline-flex;align-items:center;gap:8px;min-height:44px}
.gx-mega-cab a:hover{text-decoration:underline;text-underline-offset:5px}
.gx-eti{font:600 14px/1.4 var(--texto);letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-2);margin:0 0 12px}
/* Portafolio: familias · hoteles · foto */
.gx-mega--port .gx-ancho{grid-template-columns:280px 1fr 320px}
.gx-familias li+li{border-top:1px solid var(--filete)}
.gx-familias button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:64px;text-align:left;font:600 16px/1.3 var(--texto);color:var(--tinta-2);padding-right:8px}
.gx-familias button small{display:block;font:500 14px/1.4 var(--texto);color:var(--tinta-2);margin-top:2px}
.gx-familias button[aria-selected="true"]{color:var(--tinta)}
.gx-familias button[aria-selected="true"] .flecha{opacity:1;transform:none}
.gx-familias .flecha{opacity:0;transform:translateX(-4px);transition:.2s;color:var(--acento)}
.gx-hoteles[hidden]{display:none}
.gx-hoteles ul{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.gx-hoteles li{display:flex}
.gx-hoteles a{display:flex;align-items:flex-start;width:100%;padding:16px 0;border-bottom:1px solid var(--filete);font:500 16px/1.4 var(--texto);text-wrap:pretty}
.gx-hoteles a:hover{color:var(--acento)}
.gx-foto{display:block;position:relative;border-radius:16px;overflow:hidden;aspect-ratio:4/5;background:var(--marfil-2)}
.gx-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:transform .6s,opacity .5s ease}
.gx-foto img.vis{opacity:1;z-index:2}
/* mientras llega la primera foto: brillo de carga y sin rótulo */
.gx-foto:not(:has(img.vis)) span{opacity:0}
.gx-foto:not(:has(img.vis)){background:linear-gradient(100deg,var(--marfil-2) 30%,#fff 50%,var(--marfil-2) 70%) 0 0/300% 100%;animation:gx-carga 1.4s linear infinite}
@keyframes gx-carga{from{background-position:100% 0}to{background-position:0 0}}
.gx-foto span{transition:opacity .3s}
.gx-foto img.previa{opacity:1;z-index:1;transition:none}
.gx-foto span{z-index:3}
.gx-foto span b{display:block;font:inherit;color:inherit;text-wrap:balance}
.gx-foto:hover img{transform:scale(1.04)}
.gx-foto span{position:absolute;left:0;right:0;bottom:0;padding:48px 20px 20px;background:linear-gradient(180deg,rgba(20,29,35,0),rgba(20,29,35,.8));color:#fff;font:600 20px/1.3 var(--display)}
.gx-foto span small{display:block;font:500 14px/1.4 var(--texto);color:rgba(255,255,255,.85);margin-top:4px}
/* Inversionistas y Sustentabilidad */
.gx-mega--sec .gx-ancho{grid-template-columns:320px 1fr 320px}
.gx-mega--dos .gx-ancho{grid-template-columns:1fr 400px}
.gx-mega--dos .gx-mini{aspect-ratio:16/10}
.gx-dato{background:var(--marino);color:#fff;border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:6px}
.gx-dato .ex{font:600 14px/1 var(--texto);letter-spacing:.08em;color:var(--claro)}
.gx-dato .pr{font:600 40px/1.1 var(--display);letter-spacing:-.01em}
.gx-dato .pr small{font:500 16px/1 var(--texto);color:rgba(255,255,255,.75);margin-left:6px}
.gx-dato .vr{font:500 16px/1.4 var(--texto)}
.gx-dato dl{display:grid;grid-template-columns:1fr auto;gap:6px 16px;margin:12px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.15);font:500 14px/1.4 var(--texto)}
.gx-dato dt{color:rgba(255,255,255,.7)}
.gx-dato dd{margin:0;text-align:right}
.gx-dato .hr{font:400 14px/1.4 var(--texto);color:rgba(255,255,255,.7);margin-top:4px}
.gx-enlaces{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;align-content:start}
.gx-enlaces a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;border-bottom:1px solid var(--filete);font:500 16px/1.4 var(--texto);text-wrap:pretty}
.gx-enlaces a svg{flex:none}
.gx-enlaces a svg{color:var(--acento);opacity:0;transform:translateX(-4px);transition:.2s}
.gx-enlaces a:hover{color:var(--acento)}
.gx-enlaces a:hover svg{opacity:1;transform:none}
.gx-enlaces .grupo{grid-column:1/-1;margin-top:16px}
.gx-mini{display:block;position:relative;border-radius:16px;overflow:hidden;aspect-ratio:4/3;align-self:start}
.gx-mini img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s}
.gx-mini:hover img{transform:scale(1.04)}

/* ── Barra de sección (Inversionistas y Sustentabilidad) ── */
.gx-seccion{margin:0!important;position:sticky;top:73px;z-index:999;background:var(--marfil-2);transition:background .3s;border-bottom:0;font:500 14px/1 var(--texto);color:var(--tinta-2)}
.gx-seccion .gx-ancho{display:flex;align-items:center;gap:32px;min-height:56px;overflow-x:auto;scrollbar-width:none}
.gx-seccion .gx-ancho::-webkit-scrollbar{display:none}
.gx-seccion b{font:600 14px/1 var(--texto);letter-spacing:.08em;text-transform:uppercase;color:var(--tinta);white-space:nowrap}
.gx-seccion a{white-space:nowrap;display:inline-flex;align-items:center;min-height:56px;border-bottom:2px solid transparent}
.gx-seccion a:hover{color:var(--tinta)}
.gx-seccion a[aria-current]{color:var(--tinta);border-bottom-color:var(--tinta)}
/* Sustentabilidad: los 4 comités en un desplegable */
.gx-sec-grupo{display:flex}
.gx-sec-grupo button{display:inline-flex;align-items:center;gap:6px;min-height:56px;padding:0;margin:0;border:0;border-bottom:2px solid transparent;background:none;font:inherit;color:inherit;white-space:nowrap;cursor:pointer}
.gx-sec-grupo button:hover,.gx-sec-grupo--actual button{color:var(--tinta)}
.gx-sec-grupo--actual button{border-bottom-color:var(--tinta)}
.gx-sec-grupo button .gx-chev{transition:transform .25s}
.gx-sec-grupo button[aria-expanded="true"] .gx-chev{transform:rotate(180deg)}
.gx-sec-grupo ul{position:fixed;z-index:1001;min-width:300px;padding:8px!important;background:#fff;border:1px solid var(--filete);border-radius:16px;box-shadow:0 24px 48px -24px rgba(20,29,35,.35)}
.gx-sec-grupo ul a{display:flex;min-height:44px;padding:0 14px;border:0;border-radius:10px;color:var(--tinta-2)}
.gx-sec-grupo ul a:hover,.gx-sec-grupo ul a[aria-current]{background:var(--marfil-2);color:var(--tinta)}

/* el subrayado de la página activa asienta en la orilla de la barra (sin filete debajo que lo separe)
   con barra de sección, encabezado y barra son un solo bloque: la barra es opaca y la sombra va en su borde inferior */
.gx-seccion{box-shadow:inset 0 -1px 0 var(--filete)}
.gx-seccion a[aria-current],.gx-sec-grupo--actual button{position:relative;z-index:1}
.gx-desplazado .gx-seccion{background:var(--marfil-2);box-shadow:inset 0 -1px 0 var(--filete),0 10px 30px -18px rgba(47,65,76,.35)}
body:has(.gx-seccion) .gx--solido .gx-principal{box-shadow:none;border-bottom-color:transparent}
/* sin transparencia: la foto no se asoma entre encabezado y barra, y los dos se leen como un solo bloque */
body:has(.gx-seccion) .gx--solido:not(.gx--abierto) .gx-principal::before{background:#fff;-webkit-backdrop-filter:none;backdrop-filter:none}

/* ── Cajón del teléfono y la tableta ── */
.gx-cajon{position:fixed;inset:0;z-index:2001;background:#fff;color:var(--tinta);display:none;flex-direction:column;font:400 16px/1.5 var(--texto)}
.gx-cajon.abierto{display:flex}
.gx-cajon-cab{display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 20px;border-bottom:1px solid var(--filete);flex:none}
.gx-cajon-cab img{height:38px;width:auto;margin-left:-10px}
.gx-cerrar{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--filete);border-radius:999px}
.gx-cajon-cuerpo{overflow-y:auto;overscroll-behavior:contain;flex:1;padding:8px 20px 220px}
.gx-cajon .n1>li{border-bottom:1px solid var(--filete)}
.gx-cajon .n1>li>a,.gx-cajon .n1>li>button{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:64px;font:600 20px/1.2 var(--display);text-align:left}
.gx-cajon .sub{display:none;padding:0 0 16px}
.gx-cajon .sub.abierto{display:block}
.gx-cajon .sub .eti{font:600 14px/1.4 var(--texto);letter-spacing:.08em;text-transform:uppercase;color:var(--tinta-2);margin:16px 0 4px}
.gx-cajon .sub a{display:flex;align-items:center;min-height:44px;font:500 16px/1.3 var(--texto);color:var(--tinta-2)}
.gx-cajon .sub a.ir{color:var(--acento);font-weight:600}
.gx-cajon-pie{display:flex;flex-direction:column;gap:12px;padding:24px 0}
.gx-cajon-pie .gx-cta{width:100%;justify-content:center}
.gx-cajon-pie .fila{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;color:var(--tinta-2);font:500 16px/1 var(--texto)}
.gx-cajon-pie .fila a{display:inline-flex;align-items:center;min-height:44px}
.gx-cajon-pie .gx-redes a{color:var(--tinta-2);width:44px;height:44px}
.gx-sin-scroll{overflow:hidden}
/* con el menú abierto, el chat y el botón de subir no se enciman */
.gx-sin-scroll #chatLauncher,.gx-sin-scroll #chatMessenger,.gx-sin-scroll #toTop{visibility:hidden!important}

@media (max-width:1180px){.gx-menu{gap:24px}.gx-principal>.gx-ancho{gap:28px}.gx-mega--port .gx-ancho{grid-template-columns:240px 1fr 260px}.gx-mega--sec .gx-ancho{grid-template-columns:280px 1fr 260px}.gx-mega--dos .gx-ancho{grid-template-columns:1fr 320px}}
@media (max-width:1100px){
 .gx-nav{display:none}.gx-abrir{display:inline-flex}.gx-cta{margin-left:auto}
 /* pantallas angostas: teléfono e idioma, como en todo el sitio; la cotización sigue en el menú y la página de Inversionistas */
 .gx-barra .gx-marca,.gx-barra .gx-redes,.gx-barra .gx-sep,.gx-barra .gx-cotiza{display:none}
}
@media (max-width:700px){
 .gx,.gx-cajon,.gx-seccion{--margen:20px}
 .gx-principal>.gx-ancho{height:72px;gap:12px}
 .gx-logo img{height:38px;margin-left:-10px}
 .gx-cta{padding:0 18px}
 .gx-cotiza .hora{display:none}
 .gx-barra .gx-ancho{gap:12px}
}
@media (max-width:360px){.gx-logo img{height:32px;margin-left:-9px}.gx-cta{padding:0 14px}.gx-principal>.gx-ancho{gap:8px}}
.gx-menu>li>button[data-actual]::after{transform:scaleX(1)}

/* Blindaje contra los estilos generales del sitio (style.css pinta de blanco h1–h6 y alinea listas) */
.gx .gx-mega h2,.gx .gx-mega p,.gx .gx-mega a,.gx .gx-mega button{color:var(--tinta);text-align:left}
.gx .gx-mega .gx-eti,.gx .gx-familias button,.gx .gx-familias button small{color:var(--tinta-2)}
.gx .gx-familias button[aria-selected="true"]{color:var(--tinta)}
.gx .gx-mega .gx-mega-cab a,.gx .gx-enlaces a svg,.gx .gx-familias .flecha{color:var(--acento)}
.gx .gx-mega .gx-foto span,.gx .gx-mega .gx-foto span small{color:#fff}
.gx .gx-dato,.gx .gx-dato *{color:#fff}
.gx .gx-dato .ex{color:var(--claro)}
.gx .gx-dato dt,.gx .gx-dato .hr{color:rgba(255,255,255,.72)}
.gx .gx-hoteles a:hover,.gx .gx-enlaces a:hover{color:var(--acento)}
.gx-cajon h1,.gx-cajon h2,.gx-cajon p,.gx-cajon a,.gx-cajon button{color:var(--tinta);text-align:left}
.gx-cajon .sub a,.gx-cajon .sub .eti{color:var(--tinta-2)}
.gx-cajon .sub a.ir{color:var(--acento)}
@media (max-width:360px){.gx-cotiza .var{display:none}}
@media (prefers-reduced-motion:reduce){.gx *,.gx-seccion,.gx-velo{transition:none!important;animation:none!important}}
/* Cotización mientras llega: barras de carga con la forma de cada cifra (sin guiones) */
.gx-dato [data-pr]:empty,.gx-dato dd:empty,.gx-dato [data-var]:empty,.gx-dato [data-hora]:empty,.gx-cotiza [data-pr]:empty{display:inline-block;vertical-align:middle;border-radius:6px;
 background:linear-gradient(100deg,rgba(255,255,255,.10) 30%,rgba(255,255,255,.28) 50%,rgba(255,255,255,.10) 70%) 0 0/300% 100%;animation:gx-carga 1.4s linear infinite}
.gx-dato [data-pr]:empty{width:3.4ch;height:.8em}
.gx-dato [data-var]:empty{width:9ch;height:.9em}
.gx-dato [data-hora]:empty{width:12ch;height:.9em}
.gx-dato dd:empty{width:5ch;height:.9em;justify-self:end}
.gx-cotiza [data-pr]:empty{width:5ch;height:.9em}
@media (prefers-reduced-motion:reduce){.gx-dato :empty,.gx-cotiza :empty{animation:none!important}}
/* el anillo de foco sólo para teclado: Bootstrap del sitio lo pinta también al hacer clic con el ratón */
.gx :focus:not(:focus-visible),.gx-cajon :focus:not(:focus-visible),.gx-seccion :focus:not(:focus-visible){outline:none!important}
/* teléfono: los botones de contacto largos («Contacto Sustentabilidad») pasan a dos líneas para que el menú quepa */
@media (max-width:520px){.gx-principal .gx-cta{white-space:normal;text-align:center;max-width:148px;font-size:14px;line-height:1.15;padding:0 16px}}

/* ── Jerarquía de marca (medida el 16-oct): «Santa Fe» ocupa el 24.6 % del alto del logotipo; a 48 px medía lo mismo
   que las mayúsculas del menú (≈11 px) y el botón tenía su misma altura. Ahora la marca domina: ~1.4× el menú y
   ~70 % del alto de la barra. El margen negativo es el 8.64 % del ancho, para que la tinta alinee con el contenido. ── */
.gx-logo img{height:64px;margin-left:-17.5px}
.gx-cta{height:44px;padding:0 22px}
@media (max-width:1180px){.gx-logo img{height:56px;margin-left:-15.3px}}
@media (min-width:701px){.gx--solido .gx-logo img{height:54px;margin-left:-14.7px}}
@media (max-width:700px){.gx-logo img{height:44px;margin-left:-12px}}
@media (max-width:400px){.gx-logo img{height:40px;margin-left:-10.9px}}
@media (max-width:360px){.gx-logo img{height:34px;margin-left:-9.3px}}

/* Inversionistas y Sustentabilidad: el nombre es enlace a su página y la flecha abre el desplegable (en escritorio también al pasar el cursor) */
.gx-menu>li.gx-dividido{gap:2px}
.gx-menu>li.gx-dividido>.gx-flecha{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:100%;margin-right:-6px;padding:0;border:0;background:none;color:inherit;cursor:pointer}
.gx-menu>li.gx-dividido>.gx-flecha::after{display:none}
.gx-menu>li.gx-dividido>.gx-flecha .gx-chev{transition:transform .25s}
.gx-menu>li.gx-dividido>.gx-flecha[aria-expanded="true"] .gx-chev{transform:rotate(180deg)}
.gx-menu>li>a[data-actual]::after,.gx-menu>li.gx-dividido:has(.gx-flecha[aria-expanded="true"])>a::after{transform:scaleX(1)}

/* ── Barra superior CLARA (predeterminada desde el 19-oct). Estudio: IHG usa un tinte de 1.16:1 contra su encabezado
   blanco; Accor, Hilton, Marriott y Hyatt no tienen franja oscura. La #2F414C (10.6:1) era la más pesada.
   La oscura sigue disponible para comparar con ?…&barra=oscura (clase gx--barra-oscura). ── */
.gx:not(.gx--barra-oscura).tr-header{top:-44px}
.gx:not(.gx--barra-oscura) .gx-barra{background:var(--marfil-2);color:var(--tinta-2);font-size:13px;box-shadow:inset 0 -1px 0 rgba(47,65,76,.1)}
.gx:not(.gx--barra-oscura) .gx-barra .gx-ancho{min-height:44px}
.gx:not(.gx--barra-oscura) .gx-tel,.gx:not(.gx--barra-oscura) .gx-marca,.gx:not(.gx--barra-oscura) .gx-cotiza{min-height:44px}
.gx:not(.gx--barra-oscura) .gx-redes a{width:36px;height:36px;color:var(--tinta-2)}
.gx:not(.gx--barra-oscura) .gx-barra a:hover,.gx:not(.gx--barra-oscura) .gx-tel:hover{color:var(--tinta)}
.gx:not(.gx--barra-oscura) .gx-sep{background:rgba(47,65,76,.18)}
.gx:not(.gx--barra-oscura) .gx-cotiza{color:var(--tinta)}
.gx:not(.gx--barra-oscura) .gx-cotiza .sim small{color:var(--tinta-2)}
.gx:not(.gx--barra-oscura) .gx-cotiza .pr{color:var(--tinta);font-weight:600;font-variant-numeric:tabular-nums}
.gx:not(.gx--barra-oscura) .gx-cotiza .var{color:var(--tinta-2);font-variant-numeric:tabular-nums}
.gx:not(.gx--barra-oscura) .gx-cotiza .var.baja{color:#A33A2B}
.gx:not(.gx--barra-oscura) .gx-cotiza .var.sube{color:#1D6B45}
.gx:not(.gx--barra-oscura) .gx-cotiza .hora{color:#5E717D}
.gx:not(.gx--barra-oscura) .gx-cotiza [data-pr]:empty{background:linear-gradient(100deg,rgba(47,65,76,.08) 30%,rgba(47,65,76,.18) 50%,rgba(47,65,76,.08) 70%) 0 0/300% 100%}
/* portada en reposo: la barra sigue transparente sobre la foto, con texto blanco y sin línea */
.gx--foto:not(.gx--solido):not(.gx--abierto):not(.gx--barra-oscura) .gx-barra{background:transparent;color:rgba(255,255,255,.86);box-shadow:none}
.gx--foto:not(.gx--solido):not(.gx--abierto):not(.gx--barra-oscura) .gx-barra a:hover{color:#fff}
.gx--foto:not(.gx--solido):not(.gx--abierto):not(.gx--barra-oscura) .gx-redes a{color:rgba(255,255,255,.82)}
.gx--foto:not(.gx--solido):not(.gx--abierto):not(.gx--barra-oscura) .gx-sep{background:rgba(255,255,255,.24)}

/* ── Selector de idioma: la píldora líquida de begoincabo.com (mismas medidas, curva y animación) ──
   Base: sobre fondo claro (barra #F2F7FA, cajón blanco) con la píldora en #2F414C.
   Sobre fondo oscuro (foto de la portada en reposo, tema oscuro, barra oscura): cápsula de vidrio y píldora blanca. */
.gx-langtoggle{position:relative;display:inline-flex;align-items:center;align-self:center;box-sizing:border-box;height:32px;border:0;border-radius:999px;padding:4px;background:rgba(47,65,76,.08)}
.gx-lang-pill{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);border-radius:999px;background:#2F414C;box-shadow:0 2px 8px rgba(0,0,0,.12);translate:0 0;transition:translate .34s cubic-bezier(.45,1.5,.5,1);will-change:translate,scale}
.gx-langtoggle[data-active="es"] .gx-lang-pill{translate:100% 0}
.gx-lang-pill.gx-sliding{animation:gx-liquid .34s ease-out}
@keyframes gx-liquid{0%{scale:1 1}45%{scale:1.28 1.05}100%{scale:1 1}}
.gx-lang-opt{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:24px;background:none;border:0;cursor:pointer;font:600 10.5px/1 var(--texto);text-transform:uppercase;letter-spacing:.1em;color:#435561!important;padding:0 14px;text-decoration:none!important;transition:color .22s ease}
.gx-langtoggle[data-active="en"] .gx-lang-opt[data-lang="en"],.gx-langtoggle[data-active="es"] .gx-lang-opt[data-lang="es"]{color:#fff!important}
.gx-lang-opt:focus-visible{outline:2px solid #2F414C;outline-offset:3px;border-radius:999px}
/* sobre fondo oscuro */
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-langtoggle,:root[data-tema=oscuro] .gx-langtoggle,.gx--barra-oscura .gx-barra .gx-langtoggle{
 background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px) saturate(1.2);backdrop-filter:blur(8px) saturate(1.2)}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-lang-pill,:root[data-tema=oscuro] .gx-lang-pill,.gx--barra-oscura .gx-barra .gx-lang-pill{background:rgba(255,255,255,.95)}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-lang-opt,:root[data-tema=oscuro] .gx-lang-opt,.gx--barra-oscura .gx-barra .gx-lang-opt{color:rgba(255,255,255,.74)!important}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-langtoggle[data-active] .gx-lang-opt[aria-current],:root[data-tema=oscuro] .gx-langtoggle[data-active] .gx-lang-opt[aria-current],.gx--barra-oscura .gx-barra .gx-langtoggle[data-active] .gx-lang-opt[aria-current]{color:#232C37!important}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-lang-opt:focus-visible,:root[data-tema=oscuro] .gx-lang-opt:focus-visible,.gx--barra-oscura .gx-barra .gx-lang-opt:focus-visible{outline-color:#fff}
/* teléfono y tableta: área de toque de 44 px aunque la cápsula se vea de 31 */
@media (max-width:1100px){.gx-lang-opt::after{content:"";position:absolute;left:0;right:0;top:-10px;bottom:-10px}}
@media (prefers-reduced-motion:reduce){.gx-lang-pill{transition:none}.gx-lang-pill.gx-sliding{animation:none}}
