/* ── Encabezado: sólo logotipo + llamada telefónica directa ───────────── */
.skip{
  position:absolute;left:-9999px;top:0;z-index:99;
  background:var(--teal);color:#fff;padding:12px 18px;font-weight:600;
}
.skip:focus{left:12px;top:12px}

header.site{
  position:sticky;top:0;z-index:20;
  background:rgba(255,255,255,.9);
  backdrop-filter:saturate(1.3) blur(14px);
  -webkit-backdrop-filter:saturate(1.3) blur(14px);
  border-bottom:var(--rule);
}
.site-in{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:76px}
.logo img{width:clamp(148px,17vw,196px)}
.tel-chip{
  display:inline-flex;align-items:center;gap:10px;
  min-height:44px;padding:0 18px;border-radius:999px;
  background:rgba(15,110,92,.05);border:1px solid rgba(15,110,92,.24);
  color:var(--ink);text-decoration:none;
  font:500 15px/1 var(--f-mono);letter-spacing:.01em;white-space:nowrap;
  transition:background .18s ease,border-color .18s ease,transform .18s ease;
}
.tel-chip:hover{background:rgba(15,110,92,.11);border-color:var(--teal);transform:translateY(-1px)}
.tel-chip svg{width:17px;height:17px;flex:none;stroke:var(--teal)}
.tel-chip span{font-family:var(--f-body);font-weight:600;font-size:14.5px}

/* ── Navegación con submenús ──────────────────────────────────────────────
   Tres grupos, no una fila de nueve enlaces: a partir de siete destinos
   una barra plana deja de leerse y empieza a escanearse mal. Los
   disparadores son <button> y no enlaces porque no llevan a ninguna
   parte: abren un menú. El estado vive en aria-expanded, así que el
   lector de pantalla y el CSS leen exactamente lo mismo.
   Abren con clic en todos los tamaños; en móvil el mismo marcado se
   convierte en acordeón dentro de un cajón a pantalla completa.        */
.mainnav{display:flex}
.menubar{display:flex;gap:2px;list-style:none;margin:0;padding:0}
.menu{position:relative}
.menu-btn{
  display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;
  border:0;background:none;cursor:pointer;color:var(--ink);border-radius:10px;
  font:500 15px/1 var(--f-body);letter-spacing:.005em;
  transition:background .16s ease,color .16s ease;
}
.menu-btn:hover{background:rgba(15,110,92,.06);color:var(--teal)}
.menu-btn[aria-expanded="true"]{background:rgba(15,110,92,.09);color:var(--teal)}
.chev{
  width:8px;height:8px;flex:none;
  border-right:1.7px solid currentColor;border-bottom:1.7px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);transition:transform .2s ease;
}
.menu-btn[aria-expanded="true"] .chev{transform:rotate(225deg) translate(-1px,-1px)}
.submenu{
  position:absolute;top:calc(100% + 9px);left:0;z-index:30;min-width:268px;
  list-style:none;margin:0;padding:8px;display:none;
  background:var(--paper);border:1px solid rgba(15,110,92,.16);border-radius:14px;
  box-shadow:0 26px 48px -28px rgba(4,35,31,.5);
}
.menu-btn[aria-expanded="true"] + .submenu{display:block}
.submenu a{
  display:block;padding:11px 13px;border-radius:9px;text-decoration:none;
  color:var(--ink);font-size:14.8px;line-height:1.35;
}
.submenu a:hover{background:rgba(15,110,92,.07);color:var(--teal)}
.site-actions{display:flex;align-items:center;gap:10px}
.burger{
  display:none;place-items:center;width:44px;height:44px;border-radius:11px;cursor:pointer;
  border:1px solid rgba(15,110,92,.22);background:var(--paper);color:var(--ink);
}
.burger svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.8;fill:none}
.burger .ico-x{display:none}
.burger[aria-expanded="true"] .ico-menu{display:none}
.burger[aria-expanded="true"] .ico-x{display:block}

/* El encabezado es fijo: sin este margen, al saltar a una sección su
   título queda escondido detrás de la barra.                          */
[id]{scroll-margin-top:clamp(92px,11vw,108px)}

@media (max-width:1023px){
  .mainnav{
    position:absolute;top:100%;left:0;right:0;z-index:25;display:none;overflow-y:auto;
    height:calc(100vh - 76px);height:calc(100dvh - 76px);
    background:var(--paper);border-top:1px solid var(--hair);
    padding:10px var(--pad) 48px;overscroll-behavior:contain;
  }
  .mainnav.open{display:block}
  .menubar{flex-direction:column;gap:0}
  .menu{position:static;border-bottom:1px solid var(--hair)}
  .menu-btn{
    width:100%;justify-content:space-between;min-height:58px;padding:0 2px;border-radius:0;
    font:600 17px/1.2 var(--f-display);letter-spacing:-.01em;
  }
  .menu-btn:hover,.menu-btn[aria-expanded="true"]{background:none}
  .submenu{
    position:static;display:none;min-width:0;padding:0 0 14px;
    border:0;border-radius:0;box-shadow:none;background:none;
  }
  .submenu a{padding:12px 2px;border-radius:0;font-size:15.5px}
  .burger{display:grid}
}
@media (max-width:559px){
  .logo img{width:132px}
  .tel-chip{padding:0 13px}
  .tel-chip span{display:none}
}