/* 02-header.css — Header fluide + shrink progressif */

#bar-sentinel{ height:1px; }
#bar-spacer{ height:0; transition:height .12s linear; }

.head-top{ background:#fff; }
.head-top-inner{
  max-width:var(--maxw); margin:0 auto; height:var(--top-h); padding:0 16px;
  display:flex; justify-content:center; align-items:center;
}
.logo{
  height:var(--logo-h); width:auto; display:block;
  max-height:calc(var(--top-h) - 8px);
  transform:scale(calc(1 - .06 * var(--shrink,0)));
  transform-origin:left center;
  transition:transform .12s linear;
}

.head-bar{
  position:relative;
  background: radial-gradient(160% 200% at 50% 40%, #BFC3F3 0%, #8E94D8 38%, #595EA8 68%, #2E2C62 100%);
  background-color:#2E2C62;
  border-radius:0;
  box-shadow:
    0 0 0 1px rgba(230,231,255,.36),
    0 16px 40px rgba(198,201,255,.55),
    0 4px 10px rgba(0,0,0,.14),
    0 0 0 3px rgba(198,201,255,1),
    0 26px 60px rgba(158,168,255,.78),
    0 10px 22px rgba(0,0,0,.24)!important;
  will-change:transform; transform:translateZ(0); contain:paint;
}
.head-bar::before{
  content:""; position:absolute; inset:8px 12px;
  border:1px solid rgba(230,231,255,.9); border-radius:12px; pointer-events:none;
  opacity:calc(.95 * (1 - var(--shrink,0)));
  transition:opacity .15s linear;
}
.head-bar.fixed{ position:fixed; top:0; left:0; right:0; z-index:1000; }

.head-bar-inner{
  max-width:var(--maxw); margin:0 auto; padding:0 16px;
  padding-top:calc(var(--bar-py) * (1 - var(--shrink,0) * 0.6));
  padding-bottom:calc(var(--bar-py) * (1 - var(--shrink,0) * 0.6));
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center;
  transition:padding .12s linear; will-change:padding;
}

.t-left,.t-dash,.t-right{
  font-family:'Bodoni Moda',serif; font-weight:900; color:var(--title,#F2F3FF);
  text-transform:uppercase; letter-spacing:.02em; line-height:1; white-space:nowrap;
  font-size:calc(var(--title-small) + (var(--title-large) - var(--title-small)) * (1 - var(--shrink,0)));
  transition:font-size .12s linear;
}
.t-left{  justify-self:end;   text-align:right; }
.t-dash{  justify-self:center; padding:0 .4ch; }
.t-right{ justify-self:start; text-align:left; }

@media (prefers-reduced-motion:reduce){
  #bar-spacer,.logo,.head-bar-inner,.t-left,.t-dash,.t-right,.head-bar::before{ transition:none!important; }
}