/* =========================================================
   B2W Agency · Shared Header System
   Extracted/aligned from current Home navigation.
   Use after style.css so internal PHP pages keep the same nav.
   ========================================================= */

.site-header{
  position:fixed;
  inset:0 0 auto;
  z-index:1000;
  border-bottom:1px solid transparent;
  transition:.25s;
}
.site-header.scrolled{
  background:rgba(4,10,20,.86);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-color:var(--line);
}
.site-header .nav-shell{
  height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  flex-wrap:nowrap;
}
.site-header .brand{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}
.site-header .brand img{
  width:144px;
  height:auto;
  display:block;
}
.site-header .desktop-nav{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:nowrap;
  gap:28px;
  min-width:0;
  font-size:.92rem;
  font-weight:700;
}
.site-header .desktop-nav>a:not(.button),
.site-header .nav-trigger{
  display:inline-flex;
  align-items:center;
  gap:.48rem;
  white-space:nowrap;
}
.site-header .desktop-nav>a,
.site-header .nav-trigger{
  color:#dce6f5;
}
.site-header .desktop-nav>a:hover,
.site-header .desktop-nav>a:focus-visible,
.site-header .nav-trigger:hover,
.site-header .nav-trigger:focus-visible{
  color:#fff;
  outline:none;
}
.site-header .desktop-nav>a.is-active{
  color:#fff;
}
.site-header .nav-icon{
  width:17px;
  height:17px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.8;
  opacity:.8;
  flex:0 0 auto;
}
.site-header .desktop-nav>a:hover .nav-icon,
.site-header .desktop-nav>a:focus-visible .nav-icon,
.site-header .nav-trigger:hover .nav-icon,
.site-header .nav-trigger:focus-visible .nav-icon,
.site-header .desktop-nav>a.is-active .nav-icon{
  color:#64d9ff;
  opacity:1;
}
.site-header .nav-trigger{
  appearance:none;
  border:0;
  background:none;
  padding:0;
  cursor:pointer;
}
.site-header .nav-trigger>svg:last-child{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
}
.site-header .nav-group{position:relative}
.site-header .mega-menu{
  position:absolute;
  top:34px;
  left:50%;
  transform:translate(-50%,-8px);
  width:min(720px,86vw);
  padding:20px;
  border:1px solid var(--line);
  background:rgba(7,17,33,.98);
  box-shadow:var(--shadow);
  border-radius:22px;
  opacity:0;
  visibility:hidden;
  transition:.2s;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.site-header .nav-group.open .mega-menu{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}
.site-header .mega-menu a{
  display:flex!important;
  align-items:center;
  gap:.62rem;
  padding:13px 14px;
  border-radius:12px;
  color:#c9d4e5;
}
.site-header .mega-menu a svg{
  width:18px;
  height:18px;
  stroke:#64d9ff;
  fill:none;
  stroke-width:1.8;
  flex:0 0 auto;
}
.site-header .mega-menu a:hover,
.site-header .mega-menu a:focus-visible{
  background:rgba(23,100,255,.12);
  color:#fff;
  outline:none;
}

/* Language control — same visual language as Home */
.site-header .language-switcher{
  display:inline-flex;
  align-items:center;
  gap:.38rem;
  min-height:38px;
  padding:.45rem .68rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  color:#8394aa;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.06em;
  line-height:1;
  white-space:nowrap;
  transition:border-color .22s ease,background .22s ease;
}
.site-header .language-switcher:hover,
.site-header .language-switcher:focus-visible{
  border-color:rgba(100,217,255,.38);
  background:rgba(255,255,255,.035);
  outline:none;
}
.site-header .language-switcher-alt{text-decoration:none}
.site-header .language-switcher-alt span{
  color:#fff;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
}
.site-header .language-icon{
  width:15px;
  height:15px;
  fill:none;
  stroke:#64d9ff;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex:0 0 auto;
}
.site-header .button.button-ghost{
  width:auto;
  white-space:nowrap;
}

/* Mobile controls */
.site-header .mobile-header-actions{
  display:none;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex:0 0 auto;
}
.site-header .mobile-language-direct{
  display:none;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:38px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px;
  background:rgba(4,16,32,.22);
  color:#fff;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  font-size:.68rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.08em;
}
.site-header .mobile-language-direct:hover,
.site-header .mobile-language-direct:focus-visible{
  border-color:rgba(128,153,243,.56);
  background:rgba(32,86,248,.12);
  color:#fff;
  outline:none;
}
.site-header .mobile-toggle{
  display:none;
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:50%;
  border:1px solid var(--line);
  background:transparent;
  color:#fff;
}
.site-header .mobile-toggle span{
  display:block;
  width:18px;
  height:2px;
  background:currentColor;
  margin:4px auto;
}
.site-header .mobile-menu{
  display:none;
  position:fixed;
  inset:82px 0 0;
  background:#050d1a;
  color:#f7f9ff;
  padding:26px 20px;
  overflow:auto;
  overscroll-behavior:contain;
}
.site-header .mobile-menu.open{display:block}
.site-header .mobile-menu>a,
.site-header .mobile-menu details>summary{
  display:block;
  padding:14px 0;
  border-bottom:1px solid var(--line);
  color:#f7f9ff;
  font-weight:750;
}
.site-header .mobile-menu details>summary{
  cursor:pointer;
  list-style:none;
}
.site-header .mobile-menu details>summary::-webkit-details-marker{display:none}
.site-header .mobile-menu details>a{
  display:block;
  padding:13px 0 13px 18px;
  border-bottom:1px solid rgba(123,155,205,.14);
  color:#a8b4c8;
}
.site-header .mobile-menu a:hover,
.site-header .mobile-menu a:focus-visible,
.site-header .mobile-menu summary:hover,
.site-header .mobile-menu summary:focus-visible{
  color:#64d9ff;
  outline:none;
}
.site-header .mobile-menu .mobile-language-switcher{display:none!important}

@media(max-width:1100px){
  .site-header .desktop-nav{display:none}
  .site-header .mobile-header-actions{display:flex}
  .site-header .mobile-language-direct{display:inline-flex}
  .site-header .mobile-header-actions .mobile-toggle{display:block}
}

@media(max-width:760px){
  .site-header .nav-shell{height:70px}
  .site-header .brand img{width:128px}
  .site-header .mobile-menu{inset:70px 0 0}
  .site-header .mobile-header-actions{gap:7px}
  .site-header .mobile-language-direct{
    min-width:40px;
    height:36px;
    padding-inline:10px;
    font-size:.64rem;
  }
  .site-header .mobile-header-actions .mobile-toggle{
    width:42px;
    height:42px;
    flex-basis:42px;
  }
}

@media(max-width:430px){
  .site-header .mobile-language-direct{
    min-width:38px;
    height:34px;
    padding-inline:9px;
  }
}

@media(prefers-reduced-motion:reduce){
  .site-header,
  .site-header .mega-menu,
  .site-header .mobile-language-direct{
    transition:none!important;
  }
}
