/* Round 5: mobile header. Sticky header (hide on scroll down / show on scroll up) + full-width menu panel. */
@media (max-width:860px){
  html,body,body.page,.page{overflow-x:clip!important}
  body.menu-open{overflow-y:visible!important}
  .site-header{position:sticky!important;top:0;z-index:100;transition:transform .28s ease}
  .site-header.site-header--oculta{transform:translateY(-100%)}
  body.menu-open .site-header,.site-header:has(.site-nav.is-open){transform:none!important}
  .site-header .nav-shell{position:relative}
  .site-header .menu-toggle{z-index:101}
  .site-header .site-nav{
    position:absolute;top:100%;left:calc(50% - 50vw);right:auto;width:100vw;margin:0;padding:6px 0 14px;gap:0;
    border-radius:0;border:0;border-top:1px solid rgba(255,255,255,.14);background:#0b2a47;
    box-shadow:0 18px 30px rgba(0,0,0,.35),0 0 0 100vmax rgba(3,10,16,.5);clip-path:inset(0 -100vmax -100vmax -100vmax);
    max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);overflow-y:auto;overscroll-behavior:contain}
  .site-header .site-nav a,.site-header .site-nav a[data-page]{
    display:flex!important;align-items:center;min-height:52px;margin:0!important;width:100%;box-sizing:border-box;padding:0 22px!important;
    font-size:17px!important;font-weight:650!important;letter-spacing:0!important;color:#e9f1f7!important;
    border-bottom:1px solid rgba(255,255,255,.08);border-left:4px solid transparent;text-decoration:none!important}
  .site-header .site-nav a:active,.site-header .site-nav a:hover{background:rgba(255,255,255,.07)}
  .site-header .site-nav a.is-active,.site-header .site-nav a[aria-current=page]{background:rgba(223,181,74,.16);border-left-color:#dfb54a;color:#fff!important}
  .site-header .site-nav a:focus-visible{outline:2px solid #f3cf70;outline-offset:-2px}
}
@media (prefers-reduced-motion:reduce){.site-header{transition:none}}
