/* =====================================================================
   Cabecera y pie comunes a todas las páginas (partials/ → scripts/layout.mjs).
   Se carga DESPUÉS del <style> en línea de cada página, así que sus reglas
   ganan a las antiguas de .hdr / .ft con la misma especificidad.
   ===================================================================== */

/* PENDIENTE CLIENTE: la referencia usa una foto de ciudad (skyline) de fondo en
   portadas y bloques de contacto. Cuando llegue: --ciudad:url(/assets/ciudad.jpg) */
:root{--ciudad:none}

/* ---------- bloque de contacto (partials/cta.html) ---------- */
.cta{background:linear-gradient(rgba(4,63,88,.9),rgba(4,63,88,.9)),var(--ciudad) center/cover,var(--navy)}
.cta{margin-top:0;padding-block:clamp(64px,7vw,96px);box-shadow:none}
.cta .pg{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:center;
  max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut);column-gap:clamp(16px,2vw,28px)}
.cta__i{grid-column:1/6}
.cta .form{grid-column:7/13}
@media (max-width:1024px){.cta__i,.cta .form{grid-column:1/13}.cta .form{margin-top:36px}}
.cta__i{padding-top:0}
.cta .form{margin-top:0;margin-bottom:0;align-self:center}
.cta .ch{margin-top:clamp(26px,3vw,40px)}
.cta .cons label{text-transform:none;letter-spacing:0;font-weight:400;font-size:12.5px;color:var(--muted)}

/* ---------- cabecera: siempre blanca, con filete azul abajo ---------- */
.hdr,.hdr.stuck{background:#fff;backdrop-filter:none;box-shadow:none;border-bottom:2px solid var(--navy)}
/* la cabecera es blanca siempre: se anula el modo "on-dark" de cada página */
body.on-dark .hdr,body.on-dark .hdr.stuck{background:#fff;box-shadow:none}
body.on-dark .nav a,body.on-dark .nav a[aria-current]{color:var(--ink)}
body.on-dark .b-solid{background:var(--navy);color:#fff}
body.on-dark .prog{background:var(--gold)}
.hdr__in,.hdr.stuck .hdr__in{height:92px;gap:clamp(14px,1.8vw,26px)}
.hdr__marca{display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;flex:none}
.hdr__marca img{height:43px;width:auto}
.hdr__marca span{font:400 7.6px/1 "Source Serif 4",Georgia,serif;color:var(--navy);white-space:nowrap;letter-spacing:.01em}
.hdr__ir{flex:none;padding-left:clamp(12px,1.2vw,18px);border-left:1px solid var(--line);
  display:flex;flex-direction:column;gap:6px;align-self:center}
.hdr__ir small{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;color:var(--muted);white-space:nowrap}
.hdr__ir img{height:32px;width:auto}

.nav{gap:clamp(16px,2.2vw,42px)}
.nav a{font-size:14px;font-weight:500;color:var(--ink)}
.nav a[aria-current="page"]::after{right:0}
.nav .nav__cta{display:none}
.hcta{gap:clamp(18px,2.4vw,46px);margin-left:clamp(10px,1.6vw,30px)}
.hcta .btn{padding:15px 24px;white-space:nowrap}

.burger{position:relative}
.burger i{transition:transform .3s var(--e)}
.hdr.menu .burger i:first-child{transform:translateY(2.75px) rotate(45deg)}
.hdr.menu .burger i:last-child{transform:translateY(-2.75px) rotate(-45deg)}

@media (max-width:1199px){
  .hdr__ir small{display:none}
  .hdr__ir img{height:26px}
}
@media (max-width:1024px){
  .hdr__ir{display:none}
  .hcta .btn{display:none}
}
@media (max-width:860px){
  .hdr__in,.hdr.stuck .hdr__in{height:76px}
  .hdr__marca img{height:36px}
  .hdr__ir{display:flex}
  .hdr__ir img{height:22px}
  .hcta{margin-left:auto}
  /* menú móvil: panel a pantalla completa bajo la cabecera */
  .nav{display:flex;position:fixed;top:78px;left:0;right:0;bottom:0;margin:0;
    flex-direction:column;align-items:stretch;gap:0;padding:12px var(--gut) 40px;
    background:#fff;overflow-y:auto;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .3s var(--e),transform .3s var(--e),visibility .3s var(--e)}
  .hdr.menu .nav{opacity:1;visibility:visible;transform:none}
  .nav a{font-size:20px;font-weight:600;padding:16px 0;border-bottom:1px solid var(--line-2)}
  .nav a::after{display:none}
  .nav a[aria-current="page"]{color:var(--navy)}
  .nav .nav__cta,body.on-dark .nav .nav__cta{color:#fff}
  .nav .nav__cta{display:block;margin-top:26px;border:0;text-align:center;
    background:var(--navy);color:#fff;border-radius:100px;font-size:16px}
  .hdr.menu{transform:none!important}
}
@media (max-width:420px){
  .hdr__ir{display:none}
}
body.sin-scroll{overflow:hidden}

/* ---------- selector de idioma ----------
   Pesa lo mismo que el enlace que reemplaza: sin caja, mismo cuerpo y el mismo
   subrayado dorado del nav. El panel desplegable es lo único con caja. */
.idioma{position:relative}
.idioma__b{position:relative;display:inline-flex;align-items:center;gap:8px;
  background:none;border:0;padding:6px 0;cursor:pointer;
  font:600 14px/1 Montserrat,sans-serif;color:var(--navy)}
.idioma__b svg{flex:none}
.idioma__b .glo{width:17px;height:17px}
.idioma__b .chv{width:9px;height:6px;transition:transform .32s var(--e)}
.idioma__b::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1.5px;
  background:var(--gold);transition:right .35s var(--e)}
.idioma__b:hover::after,.idioma.abierto .idioma__b::after{right:0}
.idioma.abierto .chv{transform:rotate(180deg)}

.idioma__l{position:absolute;top:calc(100% + 15px);right:0;min-width:228px;
  margin:0;padding:6px;list-style:none;background:var(--white);
  border:1px solid var(--line);border-radius:12px;
  box-shadow:0 26px 60px -34px rgba(3,41,58,.45);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .28s var(--e),transform .28s var(--e),visibility .28s var(--e)}
.idioma.abierto .idioma__l{opacity:1;visibility:visible;transform:none}
.idioma__l button{display:flex;align-items:flex-start;gap:11px;width:100%;
  background:none;border:0;cursor:pointer;padding:11px 12px;border-radius:8px;
  font:500 14.5px/1.35 Montserrat,sans-serif;color:var(--ink);text-align:left;
  transition:background .25s var(--e),color .25s var(--e)}
.idioma__l button:hover,.idioma__l button:focus-visible{background:var(--paper);outline:none}
.idioma__l button::before{content:"";width:6px;height:6px;flex:none;margin-top:5px;
  background:var(--navy);opacity:0;transition:opacity .25s var(--e)}
.idioma__l li[aria-selected="true"] button{color:var(--navy);font-weight:700}
.idioma__l li[aria-selected="true"] button::before{opacity:1}
.idioma__n small{display:block;margin-top:4px;font-size:11px;font-weight:500;
  letter-spacing:.02em;color:var(--gold-ink)}
.idioma__l i{margin-left:auto;font-style:normal;font-size:11px;letter-spacing:.12em;
  font-weight:700;color:var(--muted);padding-top:3px}
.idioma__l li[aria-selected="true"] i{color:var(--navy)}

/* ---------- pie ---------- */
.ft{background:var(--navy-d);color:rgba(255,255,255,.7);padding:clamp(56px,6vw,76px) 0 30px}
.ft__t{display:flex;flex-wrap:wrap;gap:34px;justify-content:space-between;align-items:center}
.ft__marca{display:flex;align-items:stretch;height:58px}
.ft__marca img{height:100%;width:auto}
.ft__marca span{display:flex;flex-direction:column;justify-content:center;gap:3px;
  margin-left:8px;padding:0 12px;background:var(--navy);border-left:2px solid rgba(255,255,255,.35);
  font:400 9.5px/1.2 "Source Serif 4",Georgia,serif;color:rgba(255,255,255,.9);white-space:nowrap}
.ft__marca b{font-weight:600;font-size:14px;line-height:1.1;letter-spacing:.01em;text-transform:uppercase;color:#fff}
.ft__d{max-width:none;margin-top:18px;font-size:14.5px;line-height:1.75;color:rgba(255,255,255,.62)}
.ft__c{display:flex;flex-direction:column;align-items:flex-end;gap:18px;text-align:right;
  width:min(100%,600px)}
.ft__btn{display:flex;align-items:center;justify-content:center;gap:11px;width:100%;
  padding:18px 26px;border-radius:100px;background:var(--navy);color:#fff!important;
  font:600 15px/1 Montserrat,sans-serif;text-decoration:none;
  transition:background .3s var(--e),transform .3s var(--e)}
.ft__btn svg{transition:transform .35s var(--e)}
.ft__btn:hover{background:#0a4d6b;transform:translateY(-2px)}
.ft__btn:hover svg{transform:translateX(5px)}
.ft__leg{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px 14px;margin:0;font-size:12.5px}
.ft__leg a{color:rgba(255,255,255,.62);text-decoration:none}
.ft__leg a:hover{color:#fff}
.ft__leg i{font-style:normal;color:rgba(255,255,255,.28)}
.ft__n{margin-top:32px;padding-block:24px;border-top:1px solid rgba(255,255,255,.15);
  border-bottom:1px solid rgba(255,255,255,.15);justify-content:center;gap:10px 26px}
.ft__n a{font-size:clamp(15px,1.5vw,19px)}
.ft__l{margin-top:0;padding-top:22px;border-top:0;display:flex;flex-wrap:wrap;gap:10px 30px;
  justify-content:space-between;font-size:12.5px;color:rgba(255,255,255,.55)}
@media (max-width:1024px){
  .ft__c{align-items:flex-start;text-align:left}
  .ft__leg{justify-content:flex-start}
}
@media (max-width:520px){
  .ft__marca{height:46px}
  .ft__marca b{font-size:11.5px}
  .ft__marca span{font-size:8px}
  .ft__n{justify-content:flex-start}
}

/* enlaces largos (correos) no rompen el ancho en móvil */
a[href^="mailto:"]{overflow-wrap:anywhere}
