/* CEMHS v7 — responsive mega-menu guardrail only; baseline nav design unchanged.
   At 901–1120px the inherited wide dropdown clipped off the left viewport.
   Use viewport-aligned dropdown in this breakpoint, preserve 2 columns & UI motion. */
@media (min-width:901px) and (max-width:1120px){
  .nav-group-wide > .mega-wide{
    position:fixed;
    top:calc(var(--header) - 4px);
    left:16px;
    right:16px;
    width:auto;
  }
}


/* V7.2: SAC is a compact utility link, never a second CTA.
   The Área VIP is the only pill; mobile retains the full-size tappable menu row. */
@media (min-width:901px){
  .nav-enterprise > a[href="sac/"]{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    width:auto;
    min-width:0;
    max-width:max-content;
    min-height:40px;
    padding:0 1px;
    margin-inline:-6px;
    border:0;
    background:transparent;
    box-shadow:none;
    border-radius:0;
    color:inherit;
    font-size:12px;
    font-weight:720;
    letter-spacing:.035em;
    white-space:nowrap;
  }
}

/* GSG V7.3 — protect Área VIP from flex compression in narrow desktop widths.
   Full nav 901–1050 uses tighter spacing and a single-line Salas e Lojas label.
   Header/mobile/hero/breadcrumb and the 1121+ baseline dimensions are immutable. */
@media (min-width:901px) and (max-width:1120px){
  .nav-enterprise > a.pill-nav{
    flex:0 0 auto;
    min-width:104px;
    min-height:44px;
    height:44px;
    max-width:none;
    padding:0 13px;
    gap:7px;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
    line-height:1;
    font-size:12px;
  }
}
@media (min-width:901px) and (max-width:1050px){
  .nav-enterprise{gap:6px}
  .topbar-inner{gap:12px}
  .logo{min-width:180px;width:180px}
  .nav-enterprise > .nav-group > .nav-trigger{font-size:11px;white-space:nowrap}
  .nav-enterprise > a[href="sac/"]{margin-inline:-2px}
}

@media (min-width:901px) and (max-width:930px){.nav-enterprise{gap:5px}}

/* GSG V7.4 — restore a full-size Área VIP CTA; no compression, no type wrapping. */
@media (min-width:951px){
 .nav-enterprise > a.pill-nav{
  box-sizing:border-box;
  display:inline-flex;
  flex:0 0 140px;
  width:140px;
  min-width:140px;
  max-width:140px;
  height:46px;
  min-height:46px;
  padding:0 18px;
  align-items:center;
  justify-content:center;
  gap:10px;
  white-space:nowrap;
  font-size:13px;
  font-weight:780;
  line-height:1;
  letter-spacing:.005em;
 }
 .nav-enterprise > a.pill-nav svg{
  width:17px;
  height:17px;
  flex:0 0 17px;
 }
}
@media (min-width:951px) and (max-width:1120px){
 .nav-enterprise{gap:6px}
 .topbar-inner{gap:12px}
 .logo{width:180px;min-width:180px}
 .nav-enterprise > .nav-group > .nav-trigger{font-size:11px;white-space:nowrap}
 .nav-enterprise > a[href="sac/"]{margin-inline:-2px}
}
/* At <=950px the complete header is not viable as a single row.
   Reuse the existing toggle and nav drawer, without changing JS or the wider header. */
@media (min-width:901px) and (max-width:950px){
 .topbar .nav-toggle{display:flex;z-index:210}
 .topbar .nav-enterprise{
  position:fixed;
  inset:var(--header) 0 0;
  display:none;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  padding:16px 20px 28px;
  background:#fff;
  color:var(--ink);
  overflow:auto;
 }
 .topbar .nav-enterprise.open{display:flex}
 .nav-enterprise > a:not(.pill),
 .nav-enterprise > .nav-group > .nav-trigger{
  width:100%;
  min-height:52px;
  height:auto;
  margin:0;
  padding:0 4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:0;
  border-bottom:1px solid var(--line);
  background:transparent;
  font-size:15px;
  font-weight:720;
  line-height:1.2;
  letter-spacing:0;
  text-decoration:none;
  white-space:normal;
 }
 .nav-enterprise > a:not(.pill)::after,
 .nav-enterprise > .nav-group > .nav-trigger::after{display:none!important}
 .nav-enterprise > .nav-group{display:block;border-bottom:0}
 .nav-enterprise > .nav-group > .nav-trigger svg{width:14px;height:14px;flex:0 0 auto}
 .nav-enterprise .nav-group .mega,
 .nav-enterprise .nav-group-wide > .mega-wide{
  position:static;
  top:auto;
  left:auto;
  right:auto;
  display:none;
  width:100%;
  opacity:1;
  visibility:visible;
  transform:none;
  margin:0;
  padding:8px 0 10px;
  border:0;
  border-bottom:1px solid var(--line);
  background:var(--soft);
 }
 .nav-enterprise .nav-group.is-open > .mega{display:block}
 .nav-enterprise .mega-grid{grid-template-columns:1fr;gap:0}
 .nav-enterprise .mega-intro{display:none}
 .nav-enterprise .mega-grid a,
 .nav-enterprise .mega-compact a{min-height:48px;padding:11px 12px;border-radius:0}
 .nav-enterprise > a[href="sac/"]{
  width:100%;
  max-width:none;
  min-width:0;
  min-height:52px;
  padding:0 4px;
  margin:0;
  font-size:15px;
  font-weight:720;
  letter-spacing:0;
  justify-content:space-between;
  color:inherit;
 }
 .nav-enterprise > a.pill-nav{
  box-sizing:border-box;
  display:inline-flex;
  align-self:flex-start;
  flex:0 0 auto;
  width:auto;
  min-width:148px;
  max-width:none;
  height:46px;
  min-height:46px;
  padding:0 20px;
  margin:20px 0 10px!important;
  align-items:center;
  justify-content:center;
  gap:10px;
  white-space:nowrap;
  font-size:14px;
  font-weight:780;
  line-height:1;
  border:1px solid var(--teal);
  background:transparent;
  color:var(--teal);
 }
}


/* GSG V7.5 — Neutral drawer hierarchy (requested visual baseline).
   Open/current accordion triggers must look like sibling link rows.
   Distinguish expansion via chevron rotation only; no teal text/rule. */
@media (max-width:950px){
  .topbar .nav-enterprise > .nav-group > .nav-trigger,
  .topbar .nav-enterprise > .nav-group.is-current > .nav-trigger,
  .topbar .nav-enterprise > .nav-group.is-open > .nav-trigger,
  .topbar .nav-enterprise > .nav-group:hover > .nav-trigger,
  .topbar .nav-enterprise > a:not(.pill)[aria-current="page"]{
    color:var(--ink)!important;
    border-bottom:1px solid var(--line)!important;
    background:transparent;
    box-shadow:none;
  }
  .topbar .nav-enterprise > .nav-group > .nav-trigger svg{
    color:inherit!important;
  }
}


/* MMD GSG V7.6 — white accordion panels throughout the mobile/drawer nav.
   White aligns with the canvas; don't alter desktop megamenu or active states. */
@media (max-width:950px){
  .topbar .nav-enterprise > .nav-group > .mega,
  .topbar .nav-enterprise > .nav-group-wide > .mega-wide{
    background:#fff;
  }
}