/* 03-nav.css — barra superior, menu movil, cortina de transicion y router */
/* ============ NAV ============ */
.nav{position:fixed;inset:0 0 auto 0;height:var(--nav-h);z-index:100;display:flex;align-items:center;transition:background .4s,border-color .4s,backdrop-filter .4s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(4,20,27,.78);backdrop-filter:blur(14px);border-color:var(--line-soft)}
.nav-in{display:flex;align-items:center;gap:2rem;width:min(1360px,94vw);margin-inline:auto}
.brand{display:flex;align-items:center;gap:.7rem;font-family:var(--fd);font-weight:700;font-size:1.02rem;letter-spacing:.02em}
.brand svg{width:34px;height:34px;flex:none}
.brand em{font-style:normal;color:var(--green)}
.nav-links{display:flex;gap:1.9rem;margin-left:auto}
.nav-links a{font-family:var(--fm);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);position:relative;padding:.4rem 0;transition:color .3s}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-cta{margin-left:1.2rem}
.nav-admin{font-family:var(--fm);font-size:.72rem;color:var(--ink-faint);letter-spacing:.14em}
.nav-admin:hover{color:var(--green)}
.burger{display:none;margin-left:auto;width:44px;height:44px;position:relative;z-index:130}
.burger span{position:absolute;left:10px;right:10px;height:2px;background:var(--ink);transition:transform .4s var(--ease),opacity .3s;top:17px}
.burger span:last-child{top:26px}
body.menu-open .burger span:first-child{transform:translateY(4.5px) rotate(45deg)}
body.menu-open .burger span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:120;background:rgba(3,18,25,.96);backdrop-filter:blur(18px);display:flex;flex-direction:column;justify-content:center;padding:6rem 8vw 3rem;gap:.4rem;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
body.menu-open .mnav{opacity:1;visibility:visible}
body.menu-open{overflow:hidden}
.mnav a{font-family:var(--fd);font-size:clamp(1.6rem,7vw,2.6rem);font-weight:700;padding:.55rem 0;border-bottom:1px solid var(--line-soft);display:flex;justify-content:space-between;align-items:center;transform:translateY(18px);opacity:0;transition:transform .5s var(--ease),opacity .5s,color .3s}
.mnav a small{font-family:var(--fm);font-size:.7rem;color:var(--green);letter-spacing:.2em}
body.menu-open .mnav a{transform:none;opacity:1}
.mnav a:hover{color:var(--green)}
.mnav .mnav-foot{margin-top:2.4rem;font-family:var(--fm);font-size:.75rem;color:var(--ink-faint);letter-spacing:.1em}
/* ============ WIPE (transición de página) ============ */
#wipe{position:fixed;inset:0;z-index:300;pointer-events:none}
#wipe i{position:absolute;inset:0;transform:translateY(103%)}
#wipe i:first-child{background:#07303c}
#wipe i:last-child{background:#03141b}
#wipe b{position:absolute;inset:0;display:grid;place-items:center;opacity:0}
#wipe b svg{width:56px;height:56px;filter:drop-shadow(0 0 24px rgba(60,232,158,.5))}
/* ============ PAGES / ROUTER ============ */
.page{display:none}
.page.active{display:block}

/* ---- AVISO DE BORRADOR LOCAL ---- */
/* Solo aparece si hay cambios sin publicar guardados en este
   navegador. Los visitantes del sitio publicado no lo ven. */
.aviso-borrador{position:fixed;left:0;right:0;bottom:0;z-index:250;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.6rem 1.2rem;padding:.85rem 1.2rem;background:rgba(255,209,102,.95);color:#0a1418;font-size:.85rem;backdrop-filter:blur(8px);box-shadow:0 -6px 24px rgba(0,0,0,.35)}
.aviso-borrador code{font-family:var(--fm);font-size:.9em;padding:.05rem .3rem;border-radius:4px;background:rgba(10,20,24,.14)}
.aviso-borrador button{font:inherit;font-weight:600;cursor:pointer;padding:.4rem .9rem;border:1px solid rgba(10,20,24,.35);border-radius:999px;background:rgba(10,20,24,.08);color:inherit;transition:background .25s}
.aviso-borrador button:hover{background:rgba(10,20,24,.2)}