/* NILAI — estructura comuna: HEADER + FOOTER
   Patró mestre validat a Home i Qui som.
   Aquest fitxer ha de carregar-se DESPRÉS del CSS específic de cada pàgina.
*/

.site-header,
.site-header a,
.site-header button,
footer,
footer a{
  font-family:"Montserrat",Arial,sans-serif;
}

.site-header .wrap,
footer .wrap{
  width:min(1160px,calc(100% - 44px));
  margin-inline:auto;
}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(250,248,246,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(52,52,52,.065);
}
.header-inner{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
}
.brand img{width:124px;height:auto}
.desktop-nav{display:flex;align-items:center;gap:24px}
.desktop-nav a{
  position:relative;
  text-decoration:none;
  color:var(--taupe,#696367);
  font-size:11px;
  font-weight:500;
}
.desktop-nav a.active,
.desktop-nav a:hover{color:var(--magenta,#9F066B)}
.desktop-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-9px;
  height:1px;
  background:var(--magenta,#9F066B);
  transform:scaleX(0);
}
.desktop-nav a.active::after,
.desktop-nav a:hover::after{transform:scaleX(1)}

.menu-btn{
  display:none;
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  cursor:pointer;
  padding:8px;
}
.menu-btn span{
  display:block;
  width:23px;
  height:1px;
  background:var(--anthracite,#343434);
  margin:6px auto;
}
.mobile-nav{
  display:none;
  padding:8px 22px 22px;
  border-top:1px solid rgba(52,52,52,.10);
}
.mobile-nav.open{display:grid}
.mobile-nav a{
  padding:13px 0;
  border-bottom:1px solid rgba(52,52,52,.06);
  text-decoration:none;
  font-size:13px;
}

footer{
  border-top:1px solid rgba(52,52,52,.10);
  padding:25px 0 28px;
}
.footer-inner{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:30px;
}
.footer-logo{width:98px}
.footer-nav{
  display:flex;
  justify-content:center;
  gap:21px;
  flex-wrap:wrap;
}
.footer-nav a{
  font-size:9.5px;
  color:var(--taupe,#696367);
  text-decoration:none;
}
.copy{
  font-size:9px;
  color:#9a9491;
  text-align:right;
}

@media(max-width:900px){
  .desktop-nav{display:none}
  .menu-btn{display:block}
}

@media(max-width:640px){
  .site-header .wrap,
  footer .wrap{
    width:min(100% - 30px,1160px);
    margin-inline:auto;
  }
  .header-inner{min-height:68px}
  .brand img{width:106px}

  .footer-inner{
    grid-template-columns:1fr;
    text-align:center;
  }
  .footer-logo{margin:auto}
  .copy{text-align:center}
  .footer-nav{gap:14px 20px}
}