/* =============================================================
   Alissa Brontë — Capa móvil compartida
   Menú overlay full-screen para ≤780px. Vanilla, cero deps.
   Se carga en todas las páginas. Los overrides usan ".nav X"
   (especificidad alta) para ganar sin depender del orden de carga.
   ============================================================= */

.nav-burger{display:none}
.mobile-menu{display:none}

@media (max-width:780px){
  /* Barra móvil = logo + hamburguesa. El CTA salta al overlay. */
  .nav .nav-cta{display:none}

  .nav-burger{
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:44px;height:44px;padding:11px;margin:-10px -8px;
    background:none;border:0;cursor:pointer;position:relative;z-index:210;
  }
  .nav-burger span{
    display:block;height:2px;width:100%;background:#f4ebe0;border-radius:2px;
    transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .2s ease;
  }
  .nav-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-burger.is-open span:nth-child(2){opacity:0}
  .nav-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

  body.menu-open{overflow:hidden}
  /* El nav (logo + X) por encima del overlay para poder cerrarlo */
  body.menu-open .nav{z-index:210;background:none;border:0;backdrop-filter:none;-webkit-backdrop-filter:none}

  .mobile-menu{
    position:fixed;inset:0;z-index:200;
    display:flex;align-items:center;justify-content:center;
    background:rgba(7,4,4,0.97);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s ease;
  }
  .mobile-menu.open{opacity:1;visibility:visible}
  .mobile-menu-inner{display:flex;flex-direction:column;align-items:center;gap:30px;padding:40px;text-align:center}
  .mobile-menu-links{display:flex;flex-direction:column;align-items:center;gap:30px}
  .mobile-menu-link{
    font-family:'Cormorant Garamond',serif;font-style:italic;font-size:36px;line-height:1;
    color:#f4ebe0;text-decoration:none;opacity:0;transform:translateY(20px);
  }
  .mobile-menu-link.active{color:#d4a04c}
  .mobile-menu.open .mobile-menu-link{
    animation:abMenuIn .55s cubic-bezier(.2,.8,.2,1) forwards;
    animation-delay:calc(.1s + var(--mi,0) * .07s);
  }
  .mobile-menu-cta{
    margin-top:14px;padding:16px 36px;background:#d4a04c;color:#070404;text-decoration:none;
    font-family:'Space Mono',monospace;font-size:12px;letter-spacing:.28em;text-transform:uppercase;
    border-radius:2px;opacity:0;transform:translateY(20px);
  }
  .mobile-menu.open .mobile-menu-cta{
    animation:abMenuIn .55s cubic-bezier(.2,.8,.2,1) forwards;
    animation-delay:calc(.1s + 5 * .07s);
  }
  @keyframes abMenuIn{to{opacity:1;transform:none}}
}

@media (prefers-reduced-motion: reduce){
  .nav-burger span,.mobile-menu,.mobile-menu-link,.mobile-menu-cta{transition:none!important;animation:none!important}
  .mobile-menu.open .mobile-menu-link,.mobile-menu.open .mobile-menu-cta{opacity:1;transform:none}
}