/* =========================================================
   NexxIA — base.css
   Estilos compartilhados por todas as páginas do site:
   tokens, reset, header + menu mobile, botões e footer.
   Extraído de index.html em 2026-09-08.
   ========================================================= */

/* =========================================
   1. DESIGN TOKENS — NexxIA Brand System
   ========================================= */
:root {
  --navy:           #132252;
  --navy-deep:      #0B1734;
  --navy-mid:       #0D1E42;
  --blue-ia:        #3D7EF5;
  --blue-ia-light:  #5A95FF;
  --blue-ia-dark:   #2D5EC4;
  --blue-ia-glow:   rgba(61,126,245,0.25);
  --orange:         #F05A22;
  --orange-glow:    rgba(240,90,34,0.3);
  --white:          #FFFFFF;
  --gray-400:       #8892B0;
  --gray-500:       #6A7494;
  --gray-600:       #4A5578;
  --navy-dark:      #0B1734;
  --teal:           #2DD4BF;
  --font-sans: 'Inter', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;
  --header-h: 72px;
  --ease-out-expo: cubic-bezier(0.16,1,0.3,1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; }
body {
  font-family: var(--font-sans);
  background: var(--navy-deep);
  color: var(--white);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: var(--navy-deep); }
::-webkit-scrollbar-thumb { background: var(--blue-ia); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--blue-ia-light); }
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
/* Brand Helpers */
.ia-blue { color: var(--blue-ia); }
.brand-dot {
  display: inline-block;
  width: 0.22em; height: 0.22em;
  border-radius: 50%;
  background: var(--orange);
  vertical-align: baseline;
  margin-left: 0.06em;
  position: relative; top: 0.08em;
}
/* === HEADER === */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--header-h);
  display: flex; align-items: center;
  padding: 0 clamp(1.5rem,5vw,4rem);
  
  /* Fundo fixo desde o início para não sobrepor o texto */
  background: rgba(11,23,52,0.95);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  
  transition: background .5s var(--ease-out-expo), backdrop-filter .5s var(--ease-out-expo),
              border-bottom-color .4s ease, box-shadow .5s ease;
  
  /* Sombras e bordas persistentes solicitadas */
  border-bottom: 1px solid rgba(61,126,245,0.18);
  box-shadow: 0 8px 32px rgba(0,0,0,0.45);
}
.site-header.scrolled {
  background: rgba(11,23,52,0.98);
  border-bottom-color: rgba(61,126,245,0.35);
  box-shadow: 0 12px 48px rgba(0,0,0,0.65);
}
.header-inner {
  width: 100%; display: flex; align-items: center;
  justify-content: space-between;
  max-width: 1400px; margin: 0 auto;
}
.header-logo { display: flex; align-items: center; flex-shrink: 0; }
.header-logo img {
  height: 34px; width: auto; object-fit: contain;
  transition: transform .4s var(--ease-out-expo), filter .4s ease;
}
.header-logo:hover img {
  transform: scale(1.06);
  filter: drop-shadow(0 0 12px var(--blue-ia-glow));
}
.header-nav { display: flex; align-items: center; gap: 2.5rem; list-style: none; }
.header-nav a {
  font-family: var(--font-mono); font-size: .78rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: var(--gray-400);
  transition: color .3s ease; position: relative;
}
.header-nav a::after {
  content:''; position: absolute; bottom: -3px; left: 0;
  width: 0; height: 1px; background: var(--blue-ia);
  transition: width .4s var(--ease-out-expo);
}
.header-nav a:hover { color: var(--white); }
.header-nav a:hover::after { width: 100%; }
.btn-header {
  font-family: var(--font-mono); font-size: .72rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase;
  padding: .6rem 1.5rem; border-radius: 50px;
  border: 1.5px solid var(--blue-ia); color: var(--blue-ia); background: transparent;
  transition: all .3s var(--ease-out-expo); white-space: nowrap;
}
.btn-header:hover { background: var(--blue-ia); color: var(--white); box-shadow: 0 0 28px var(--blue-ia-glow); }
.hamburger { display: none; flex-direction: column; gap: 5px; width: 26px; cursor: pointer; }
.hamburger span { display: block; height: 2px; background: var(--white); border-radius: 2px; transition: transform .3s ease, opacity .2s ease; }
/* Estado aberto sem GSAP (páginas internas). A home anima via GSAP e não usa esta classe. */
.hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; transform: translateX(-8px); }
.hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
/* Item ativo do menu (páginas internas) */
.header-nav a[aria-current="page"] { color: var(--white); }
.header-nav a[aria-current="page"]::after { width: 100%; }
/* PRIMARY BUTTON */
.btn-primary {
  position: relative; display: inline-flex; align-items: center; gap: .65rem;
  padding: 1rem 2.2rem; border-radius: 50px;
  font-family: var(--font-sans); font-size: .92rem; font-weight: 700;
  color: var(--white);
  background: linear-gradient(135deg, var(--blue-ia) 0%, var(--blue-ia-dark) 100%);
  box-shadow: 0 4px 30px rgba(61,126,245,.38); overflow: hidden;
  transition: transform .35s var(--ease-out-expo), box-shadow .35s var(--ease-out-expo);
  will-change: transform;
}
.btn-primary::after {
  content:''; position: absolute; top: 0; left: -120%; width: 60%; height: 100%;
  background: linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transform: skewX(-15deg); transition: left .7s ease;
}
.btn-primary:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 14px 45px rgba(61,126,245,.52); }
.btn-primary:hover::after { left: 160%; }
.btn-primary:active { transform: translateY(0) scale(.99); }
.btn-primary-icon { display: flex; align-items: center; transition: transform .35s var(--ease-out-expo); }
.btn-primary:hover .btn-primary-icon { transform: translateX(5px); }
/* SECONDARY BUTTON */
.btn-secondary {
  display: inline-flex; align-items: center; gap: .65rem;
  padding: 1rem 2.2rem; border-radius: 50px;
  font-family: var(--font-sans); font-size: .92rem; font-weight: 600;
  color: var(--white); background: transparent;
  border: 1.5px solid rgba(255,255,255,.2); backdrop-filter: blur(10px);
  transition: border-color .3s ease, background .3s ease, transform .35s var(--ease-out-expo);
  will-change: transform;
}
.btn-secondary svg { transition: transform .35s var(--ease-out-expo); }
.btn-secondary:hover { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.06); transform: translateY(-3px); }
.btn-secondary:hover svg { transform: translateX(5px); }
.btn-secondary:active { transform: translateY(0); }
/* === FOOTER === */
.site-footer {
  width: 100%; padding: 2rem 0; background: var(--navy-deep); border-top: 1px solid rgba(255,255,255,0.05);
}
.footer-container {
  max-width: 1200px; margin: 0 auto; padding: 0 clamp(1.5rem, 5vw, 4rem);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 2rem;
}
.site-footer p {
  font-size: 0.85rem; color: var(--gray-500); margin: 0; text-align: left;
}
.footer-links { list-style: none; display: flex; flex-wrap: wrap; gap: 1.5rem; margin: 0; padding: 0; }
.footer-links a {
  display: inline-flex; align-items: center; min-height: 44px;
  font-size: 0.85rem; color: var(--gray-400); text-decoration: underline; text-underline-offset: 3px;
  transition: color .3s ease;
}
.footer-links a:hover, .footer-links a[aria-current="page"] { color: var(--white); }
/* RESPONSIVE (compartilhado) */
@media (max-width:960px) {
  .header-nav { display: none; }
  .hamburger { display: flex; }
  /* Menu mobile: painel abaixo do header, reaproveitando a mesma lista de links */
  .site-header.menu-open .header-nav {
    display: flex; flex-direction: column; align-items: stretch; gap: 0;
    position: absolute; top: 100%; left: 0; right: 0;
    padding: .75rem clamp(1.5rem,5vw,4rem) 1.25rem;
    background: var(--navy-deep);
    border-bottom: 1px solid rgba(61,126,245,0.25);
    box-shadow: 0 16px 48px rgba(0,0,0,0.55);
    max-height: calc(100vh - var(--header-h)); overflow-y: auto;
  }
  .site-header.menu-open .header-nav li { border-bottom: 1px solid rgba(255,255,255,0.06); }
  .site-header.menu-open .header-nav li:last-child { border-bottom: none; }
  .site-header.menu-open .header-nav a {
    display: flex; align-items: center; min-height: 48px;
    padding: .6rem 0; font-size: .85rem;
  }
  .site-header.menu-open .header-nav a::after { display: none; }
}
@media (max-width:600px) {
  .btn-primary, .btn-secondary { width: 100%; justify-content: center; }
}

/* === AVISO DE CONSENTIMENTO (analytics.js) === */
.consent-box {
  position: fixed; left: 1rem; right: 1rem; bottom: 1rem; z-index: 200;
  max-width: 560px; margin: 0 auto; padding: 1.1rem 1.25rem;
  border-radius: 18px; background: rgba(11,23,52,0.98); border: 1px solid rgba(61,126,245,0.35);
  box-shadow: 0 16px 48px rgba(0,0,0,0.55);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  display: flex; flex-direction: column; gap: .9rem;
  animation: consent-entrar .45s var(--ease-out-expo) both;
}
@keyframes consent-entrar { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
.consent-box.is-saindo { opacity: 0; transform: translateY(16px); transition: opacity .3s ease, transform .3s ease; }
.consent-texto { font-size: .9rem; line-height: 1.55; color: rgba(255,255,255,0.85); margin: 0; }
.consent-texto a { color: var(--blue-ia-light); text-decoration: underline; text-underline-offset: 3px; }
.consent-acoes { display: flex; gap: .6rem; justify-content: flex-end; flex-wrap: wrap; }
.consent-btn {
  min-height: 44px; padding: .6rem 1.25rem; border-radius: 50px;
  font-family: var(--font-sans); font-size: .9rem; font-weight: 700; cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.consent-btn-primario { color: var(--white); background: linear-gradient(135deg, var(--blue-ia) 0%, var(--blue-ia-dark) 100%); border: 1.5px solid transparent; }
.consent-btn-primario:hover { transform: translateY(-2px); }
.consent-btn-secundario { color: rgba(255,255,255,0.85); background: transparent; border: 1.5px solid rgba(255,255,255,0.25); }
.consent-btn-secundario:hover { border-color: rgba(255,255,255,0.5); }
.consent-btn:focus-visible { outline: 3px solid var(--blue-ia-light); outline-offset: 2px; }
@media (min-width: 640px) { .consent-box { flex-direction: row; align-items: center; left: auto; right: 1.5rem; bottom: 1.5rem; margin: 0; } .consent-acoes { flex-shrink: 0; } }
@media (prefers-reduced-motion: reduce) { .consent-box { animation: none; } }