/* components/header.css — Valionns · header fijo, logo y navegación desktop */
.nav{position:fixed;z-index:41;top:0;left:0;width:100%;padding:24px 0}
.nav .wrap{display:flex;justify-content:space-between;align-items:center}
.brand{display:flex;align-items:center;flex-shrink:0}
.brand i{width:5px;height:5px;border-radius:50%;background:var(--acid);display:inline-block;font-style:normal}

/* Logo con dos versiones oficiales (blanco / negro). El color lo decide SIEMPRE el archivo correcto
   según el fondo real detectado por JS (data-theme de cada sección) — nunca un filtro ni mix-blend-mode,
   que con tinta sólida podía volver el logo invisible sobre ciertos fondos. */
.site-logo,.logo-stack{position:relative;display:block;width:108px;height:auto}
.site-logo,.valionns-logo{display:block;width:108px;height:auto;max-width:125px;object-fit:contain}
.valionns-logo-black{position:absolute;left:0;top:0;opacity:0;transition:opacity .3s ease}
.valionns-logo-white{opacity:1;transition:opacity .3s ease}
body.header-light .valionns-logo-white{opacity:0}
body.header-light .valionns-logo-black{opacity:1}

.links{display:flex;gap:28px;font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#fff;mix-blend-mode:difference}
.menu-btn{display:none;background:none;border:none;color:#fff;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;mix-blend-mode:difference}