/* Menú móvil de las páginas estáticas (home, /pulse, /pola). En escritorio no
   existe: el header sigue con sus links y sus dos pastillas. En ≤900px las
   acciones se reemplazan por un botón redondo que abre una hoja desde arriba con
   los cuatro destinos y las dos acciones (iniciar sesión, solicitar acceso).
   La hoja vive FUERA del header a propósito: el header tiene backdrop-filter y
   eso convierte a un hijo position:fixed en relativo al header, no a la pantalla. */
.menu-btn{display:none;position:relative;width:44px;height:44px;flex:0 0 auto;border-radius:999px;border:1px solid rgba(255,255,255,.5);background:rgba(255,255,255,.4);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);cursor:pointer;padding:0;transition:background .3s,border-color .3s,color .3s}
.menu-btn:active{transform:scale(.96)}
.menu-btn span{position:absolute;left:13px;right:13px;height:1.8px;border-radius:2px;background:currentColor;transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .2s}
.menu-btn span:nth-child(1){top:16px}
.menu-btn span:nth-child(2){top:21px}
.menu-btn span:nth-child(3){top:26px}
.menu-btn[aria-expanded=true] span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.menu-btn[aria-expanded=true] span:nth-child(2){opacity:0}
.menu-btn[aria-expanded=true] span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}
.nav.on-dark .menu-btn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff}
/* Con la hoja abierta el header está sobre el lienzo claro: vuelve a tinta aunque haya un bloque oscuro detrás. */
body.menu-open .nav,body.menu-open .nav.on-dark{background:transparent}
body.menu-open .nav.on-dark .brand{color:var(--ink)}
body.menu-open .nav .menu-btn{background:#fff;border-color:rgba(13,13,15,.08);color:var(--ink)}
body.menu-open{overflow:hidden}

.site-menu{position:fixed;inset:0;z-index:49;visibility:hidden;pointer-events:none}
.site-menu::before{content:'';position:absolute;inset:0;background:rgba(13,13,15,.32);opacity:0;transition:opacity .3s}
.site-menu-sheet{position:relative;background:rgba(242,242,244,.94);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6);border-radius:0 0 32px 32px;padding:calc(var(--nav-h) + 8px) calc(var(--gutter) + 8px) 24px;max-height:100svh;overflow-y:auto;overscroll-behavior:contain;transform:translateY(-16px);opacity:0;transition:transform .42s cubic-bezier(.22,1,.36,1),opacity .25s;box-shadow:0 24px 60px rgba(13,13,15,.14)}
.site-menu.open{visibility:visible;pointer-events:auto}
.site-menu.open::before{opacity:1}
.site-menu.open .site-menu-sheet{transform:none;opacity:1}
.site-menu nav{display:grid;border-top:1px solid var(--line)}
.site-menu nav a{display:flex;align-items:center;justify-content:space-between;min-height:64px;font-size:34px;font-weight:300;letter-spacing:-.03em;color:var(--ink);border-bottom:1px solid var(--line)}
.site-menu nav a[aria-current=page]{color:var(--accent-ink)}
.site-menu nav a .icon{width:20px;height:20px;color:var(--dim)}
.site-menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:24px}
.site-menu-actions .pill{justify-content:center;height:52px}
.site-menu-actions .pill-gray{background:#fff;border:1px solid var(--line)}
@media (max-width:900px){
  .menu-btn{display:inline-block}
  .nav .actions{display:none}
}
@media (min-width:901px){.site-menu{display:none}}
@media (max-width:360px){.site-menu-actions{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.site-menu::before,.site-menu-sheet,.menu-btn span{transition:none}}