/* =========================================================
   HEADER
   ========================================================= */
.site-header,
.site-header--light,
.header{
  position: sticky;
  top: 0;
  /* HEADER acima do slider e abaixo da topbar */
  z-index: 900;

  background: linear-gradient(180deg, #ffffff 0%, #fbfaff 100%);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid #ecebff;
  box-shadow: 0 6px 18px rgba(93,63,211,.06);
}

.header-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:.8rem 0;
}

/* logo */
.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
}
.brand-logo{
  width:160px;
  height:auto;
}

/* navegação principal (desktop) */
.nav-links{
  display:flex;
  align-items:center;
  gap:1.4rem;
}
.nav-links a{
  position:relative;
  padding:.55rem 1.2rem;
  border-radius:999px;
  font-weight:500;
  color:#111827;
  opacity:.95;
  transition:
    background-color .15s ease,
    color .15s ease,
    box-shadow .15s ease,
    transform .12s ease;
}
.nav-links a:hover{
  background:rgba(107,75,255,.06);
  color:var(--accent);
  transform:translateY(-1px);
}
/* item ativo (Home) */
.nav-links a.is-active{
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  color:#fff;
  box-shadow:0 10px 26px rgba(88,28,135,.35);
}

/* CTA / botão Assine Já */
.header-cta{
  display:flex;
  align-items:center;
  gap:1rem;
  padding-left:1.5rem;
  border-left:1px solid #e5e7eb;
}

/* ===== TOGGLE MOBILE ===== */
.menu-toggle{
  display:none;
  background:transparent;
  border:0;
  color:#0f172a;
  font-size:1.7rem;
  line-height:1;
  padding:.25rem .3rem;
  cursor:pointer;
}

/* ===== DRAWER MOBILE ===== */

/* quando o menu está aberto, travar scroll do body */
body.nav-open{
  overflow:hidden;
}

/* overlay escuro cobrindo toda a tela */
.mobile-menu-overlay{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  display:none;              /* só mostra com .is-open */
  z-index:920;               /* acima do header; abaixo de modais */
}

/* estado aberto */
.mobile-menu-overlay.is-open{
  display:block;
}

/* drawer lateral em si */
.mobile-menu{
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  width:min(280px, 82vw);
  background:#ffffff;        /* FUNDO BRANCO SÓ DO MENU */
  padding:80px 24px 24px;
  box-shadow:12px 0 40px rgba(15,23,42,.45);
  display:flex;
  flex-direction:column;
  gap:1rem;
  transform:translateX(-100%);
  transition:transform .24s ease;
  z-index:930;               /* acima do overlay escuro */
}

/* quando o drawer abre */
.mobile-menu.is-open{
  transform:translateX(0);
}

/* links do drawer */
.mobile-menu a{
  padding:.6rem .4rem;
  border-radius:8px;
  font-size:0.98rem;
  color:#111827;
}
.mobile-menu a:hover{
  background:rgba(107,75,255,.08);
}
.mobile-menu .full{
  width:100%;
  text-align:center;
  margin-top:1rem;
}

/* botão X dentro do drawer */
.mobile-menu-close{
  position:absolute;
  top:18px;
  right:16px;
  border:0;
  background:transparent;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
  color:#0f172a;
}

/* Texto branco apenas no botão "Assine já" do menu sanduíche */
.mobile-menu .btn.btn-primary{
  color:#ffffff !important;
}

/* ========= BREAKPOINT MOBILE ========= */
@media (max-width: 960px){
  .nav-links{
    display:none;
  }
  .header-cta{
    display:none;
  }
  .menu-toggle{
    display:block;
  }
  .brand-logo{
    width:140px;
  }
}