/* ==========================================================================
   Header / Navigation
   ========================================================================== */

.announce-bar{
  position:fixed;top:0;left:0;right:0;z-index:1001;
  height:var(--announce-h);
  background:var(--grad-red);
  color:#fff;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font-size:.84rem;font-weight:500;padding:0 44px 0 16px;
  transition:transform .35s ease;
}
.announce-bar a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:2px;white-space:nowrap;}
.announce-bar a:hover{opacity:.85;}
.announce-bar .ab-close{
  position:absolute;right:12px;top:50%;transform:translateY(-50%);
  width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,.8);transition:background .3s ease,color .3s ease;
}
.announce-bar .ab-close:hover{background:rgba(255,255,255,.18);color:#fff;}
.announce-bar .ab-close svg{width:13px;height:13px;}
.announce-bar.closed{transform:translateY(-100%);}
@media(max-width:640px){
  .announce-bar{font-size:.76rem;padding:0 40px 0 12px;gap:6px;}
  .announce-bar span.ab-full{display:none;}
}

.site-header{
  position:fixed;
  top:var(--announce-h);left:0;right:0;
  z-index:1000;
  height:var(--header-h);
  display:flex;
  align-items:center;
  background:transparent;
  transition:background .4s ease, box-shadow .4s ease, backdrop-filter .4s ease, height .3s ease, top .35s ease;
}
.site-header.is-scrolled{
  background:rgba(250,250,250,.72);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  box-shadow:0 1px 0 rgba(36,22,49,.08), 0 10px 30px rgba(36,22,49,.06);
  height:74px;
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;
}

.brand{display:flex;align-items:center;gap:10px;}
.brand img{height:56px;width:auto;display:block;}
@media(max-width:640px){.brand img{height:46px;}}
@media(max-width:480px){.brand img{height:40px;}}

.main-nav{display:flex;align-items:center;gap:4px;}
.main-nav > ul{display:flex;align-items:center;gap:2px;}
.main-nav > ul > li{position:relative;}
.nav-link{
  display:flex;align-items:center;gap:6px;
  padding:11px 16px;
  border-radius:999px;
  font-size:.92rem;
  font-weight:500;
  color:var(--dark);
  transition:background .3s ease, color .3s ease;
}
.site-header:not(.is-scrolled) .nav-link{color:rgba(255,255,255,.92);}
.nav-link:hover{background:rgba(36,22,49,.06);}
.site-header:not(.is-scrolled) .nav-link:hover{background:rgba(255,255,255,.14);}
.nav-link svg{width:12px;height:12px;transition:transform .3s ease;opacity:.7;}
.has-mega:hover .nav-link svg,.has-mega.open .nav-link svg{transform:rotate(180deg);}
.nav-link.active{font-weight:600;}  /* no pill/border highlight on any nav item */
.mobile-menu .m-link.active{color:var(--red);}

.header-actions{display:flex;align-items:center;gap:14px;}
.header-actions .btn-ghost{border-color:rgba(36,22,49,.18);color:var(--dark);}
.site-header:not(.is-scrolled) .header-actions .btn-ghost{color:#fff;border-color:rgba(255,255,255,.35);}
.site-header:not(.is-scrolled) .header-actions .btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff;}
.header-actions .btn-login{color:var(--dark);}
.site-header:not(.is-scrolled) .header-actions .btn-login{color:#fff;}
.header-actions .btn-login:hover{color:var(--red);}
@media(max-width:1100px){.header-actions .btn-login{display:none;}}

/* mega menu */
.mega{
  position:absolute;
  top:calc(100% + 14px);
  left:50%;
  transform:translateX(-50%) translateY(10px);
  width:560px;
  background:#fff;
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-lg);
  border:1px solid var(--line);
  padding:20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s ease, transform .3s ease, visibility .3s;
}
.mega.mega-wide{width:640px;}
.has-mega:hover .mega,.has-mega.open .mega{
  opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0);
}
.mega a{
  display:flex;align-items:flex-start;gap:12px;
  padding:12px 14px;border-radius:12px;
  transition:background .25s ease;
}
.mega a:hover{background:var(--bg);}
.mega a .mega-ic{
  width:38px;height:38px;border-radius:11px;flex:none;
  display:flex;align-items:center;justify-content:center;
  background:var(--bg);color:var(--red);
  transition:background .25s ease,color .25s ease;
}
.mega a .mega-ic svg{width:18px;height:18px;}
.mega a:hover .mega-ic{background:var(--grad-red);color:#fff;}
.mega a .mega-copy{display:flex;flex-direction:column;gap:2px;padding-top:2px;}
.mega a strong{font-family:var(--font-head);color:var(--dark);font-size:.92rem;font-weight:600;}
.mega a small{color:var(--ink-light);font-size:.78rem;}

/* mobile */
.menu-toggle{
  display:none;
  width:44px;height:44px;
  border-radius:12px;
  border:1px solid rgba(36,22,49,.16);
  background:rgba(255,255,255,.5);
  align-items:center;justify-content:center;
  flex-direction:column;gap:5px;
}
.site-header:not(.is-scrolled) .menu-toggle{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.08);}
.menu-toggle span{width:20px;height:2px;background:var(--dark);border-radius:2px;transition:transform .3s ease, opacity .3s ease;}
.site-header:not(.is-scrolled) .menu-toggle span{background:#fff;}
.menu-toggle.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.active span:nth-child(2){opacity:0;}
.menu-toggle.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-menu{
  position:fixed;inset:0;
  background:var(--dark);
  z-index:1002;
  padding:120px 28px 40px;
  transform:translateY(-100%);
  transition:transform .5s cubic-bezier(.16,1,.3,1);
  overflow-y:auto;
}
.mobile-menu.open{transform:translateY(0);}
.mobile-menu ul{display:flex;flex-direction:column;}
.mobile-menu > .container > ul > li{border-bottom:1px solid rgba(255,255,255,.1);}
.mobile-menu .m-link{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 4px;color:#fff;font-family:var(--font-head);font-size:1.15rem;font-weight:500;
}
.mobile-menu .m-link svg{width:14px;height:14px;transition:transform .3s ease;}
.mobile-menu li.open > .m-link svg{transform:rotate(180deg);}
.mobile-sub{
  max-height:0;overflow:hidden;
  transition:max-height .4s ease;
  padding-left:8px;
}
.mobile-menu li.open .mobile-sub{max-height:400px;}
.mobile-sub a{display:block;padding:12px 4px;color:rgba(255,255,255,.65);font-size:.95rem;}
.mobile-menu .m-cta{margin-top:28px;}
.mobile-menu .btn-ghost{color:#fff;border-color:rgba(255,255,255,.3);}
.mobile-menu .btn-ghost:hover{background:rgba(255,255,255,.1);border-color:#fff;}

@media(max-width:1100px){
  .main-nav{display:none;}
  .menu-toggle{display:flex;}
  .header-actions .btn-primary{display:none;}
}
