/* Header compartido de las páginas de Longa (igual al de index.html).
   Se enlaza DESPUÉS del <style> de cada página para ganar a sus reglas viejas. */
header{
  --hdr-bg:#1a1226; --hdr-ink:#f7f1fc; --hdr-dim:#b9aacf; --hdr-accent:#ff2d8f; --hdr-on-accent:#1a0715; --hdr-line:rgba(247,241,252,0.12);
  position:sticky;top:0;z-index:50;background:var(--hdr-bg);border-bottom:1px solid var(--hdr-line);color:var(--hdr-ink);
}
header nav.wrap{display:flex;align-items:center;justify-content:flex-start;gap:28px;height:68px;}
header .brand{display:flex;align-items:center;gap:0;min-height:44px;font-size:inherit;letter-spacing:normal;}
/* El escudo cuelga bajo la barra como un banderín y, al hacer scroll, se achica dentro de la barra como marca de agua gris. */
header .brand-mark{height:0;width:140px;flex:none;position:relative;align-self:center;display:block;}
header .brand-mark img{position:absolute;left:0;top:-32px;width:140px;height:auto;display:block;filter:drop-shadow(0 8px 18px rgba(0,0,0,0.5));transition:width .22s ease,top .22s ease,opacity .4s ease,filter .4s ease;}
header.condensed .brand-mark{width:58px;}
header.condensed .brand-mark img{width:58px;top:-29px;opacity:.42;filter:grayscale(1) brightness(2);animation:none;}
header.condensed .brand-mark::after{display:none;}
@media (prefers-reduced-motion: no-preference){
  header .brand-mark img{animation:crest-settle .85s cubic-bezier(.22,.85,.28,1) both;}
  header .brand-mark::after{content:"";position:absolute;left:0;top:-32px;width:140px;height:140px;pointer-events:none;
    background:linear-gradient(115deg,transparent 42%,rgba(255,255,255,.8) 50%,transparent 58%);background-size:320% 100%;
    -webkit-mask-image:url('img/crest.png');mask-image:url('img/crest.png');-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    animation:crest-sweep 1.3s ease .6s 1 both;}
}
@keyframes crest-settle{
  0%{opacity:0;transform:scale(.8);filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  65%{opacity:1;transform:scale(1.035);}
  100%{opacity:1;transform:scale(1);filter:drop-shadow(0 8px 18px rgba(0,0,0,.5));}
}
@keyframes crest-sweep{0%{background-position:160% 0;opacity:0;}18%{opacity:1;}75%{opacity:1;}100%{background-position:-60% 0;opacity:0;}}
header .links{display:flex;gap:26px;list-style:none;margin:0 0 0 auto;padding:0;}
header .links a{font-size:0.82rem;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;color:var(--hdr-dim);text-decoration:none;white-space:nowrap;transition:color .15s;}
header .links a:hover,header .links a.active{color:var(--hdr-ink);}
header nav .btn{padding:11px 18px;font-size:0.86rem;white-space:nowrap;}
header .btn-ghost{color:var(--hdr-ink);border-color:var(--hdr-line);}
header .btn-primary{background:var(--hdr-accent);color:var(--hdr-on-accent);}
@media (max-width:1180px){header .links{gap:16px;} header .links a{font-size:0.76rem;} header nav.wrap{gap:16px;}}
@media (max-width:980px){
  header .links{display:none;}
  header nav.wrap{justify-content:space-between;}
  header .nav-actions{margin-left:auto;}
  header .brand-mark{width:100px;}
  header .brand-mark img{width:100px;top:-24px;}
  header .brand-mark::after{width:100px;height:100px;top:-24px;}
  header.condensed .brand-mark{width:58px;}
  header.condensed .brand-mark img{width:58px;top:-25px;}
}
header .nav-actions{display:flex;align-items:center;gap:14px;}
header .nav-back{display:none;}
@media (max-width:980px){header .nav-back{display:inline-flex;}}
@media (max-width:560px){header nav .nav-trial{display:none;} header nav .btn{padding:9px 12px;font-size:0.72rem;} header .nav-actions{gap:8px;}
  header nav.wrap{gap:8px;} header .brand-mark{width:84px;} header .brand-mark img{width:84px;top:-20px;} header .brand-mark::after{width:84px;height:84px;top:-20px;}
  header.condensed .brand-mark{width:58px;} header.condensed .brand-mark img{width:58px;top:-25px;}}
