/* DTO Publicidade — shared.css
   Nav, footer, variáveis, reset, fontes, mobile menu.
   Inclua este arquivo em todas as páginas antes do CSS específico. */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root { --orange:#F47920; --pink:#E91E72; --bg:#08060D; }
/* overflow-x no html (não no body) — evita quebrar position:sticky no Chrome/Safari mobile */
html { scroll-behavior: smooth; overflow-x:hidden; }
body {
  width:100%; background:var(--bg);
  color:#F0EEF5; font-family:'DM Sans',sans-serif;
}
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(ellipse 58% 58% at 28% 46%, rgba(88,12,138,.22) 0%, transparent 68%),
    radial-gradient(ellipse 44% 52% at 70% 34%, rgba(112,8,56,.18) 0%, transparent 65%),
    radial-gradient(ellipse 52% 36% at 50% 84%, rgba(52,6,88,.14) 0%, transparent 70%);
}

/* NAV */
nav {
  position:fixed; top:0; left:0; right:0; z-index:200;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 56px;
  background:linear-gradient(to bottom, rgba(8,6,13,.95) 0%, rgba(8,6,13,.40) 68%, transparent 100%);
}
/* NAV: Liquid Glass ao rolar (pseudo-elemento: não cria containing block para .nav-links fixed) */
nav::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:rgba(8,6,13,.62);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  backdrop-filter:blur(18px) saturate(140%);
  box-shadow:0 1px 0 rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.22);
  opacity:0; transition:opacity .35s ease;
}
nav.scrolled::before { opacity:1; }
nav.glass { background:none; }
.nav-logo { display:flex; align-items:center; text-decoration:none; }
.nav-logo svg { height:43px; width:auto; }
.nav-links { display:flex; align-items:center; gap:32px; list-style:none; }
.nav-links a {
  font-family:'Sora',sans-serif; font-size:11px; font-weight:600;
  letter-spacing:.13em; text-transform:uppercase; text-decoration:none;
  color:rgba(240,238,245,.50); transition:color .22s;
}
.nav-links a:hover, .nav-links a.active { color:#fff; }
.nav-links .cta {
  padding:8px 22px; border:1px solid var(--orange); border-radius:2px;
  color:var(--orange); transition:background .22s,border-color .22s,color .22s;
}
.nav-links .cta:hover { background:transparent; border-color:rgba(244,121,32,.42); color:rgba(244,121,32,.55); }
.hamburger {
  display:none; flex-direction:column; justify-content:center; gap:5px;
  background:none; border:none; cursor:pointer; padding:6px; z-index:300;
}
.hamburger span { display:block; width:24px; height:2px; background:#F0EEF5; border-radius:1px; transition:transform .3s,opacity .3s; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* FOOTER */
footer {
  position:relative; z-index:10;
  background:rgba(8,6,13,.98);
  border-top:1px solid rgba(240,238,245,.06);
  padding:64px 56px 36px;
}
.footer-top {
  display:grid; grid-template-columns:auto 1fr 1fr 1fr;
  gap:clamp(32px,6vw,96px); margin-bottom:48px;
}
.footer-logo svg { height:96px; width:auto; }
.footer-col h4 {
  font-family:'Sora',sans-serif; font-size:9px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:rgba(240,238,245,.30); margin-bottom:16px;
}
.footer-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.footer-col ul a {
  font-family:'DM Sans',sans-serif; font-size:14px; font-weight:300;
  color:rgba(240,238,245,.50); text-decoration:none; transition:color .2s;
}
.footer-col ul a:hover { color:rgba(240,238,245,.88); }
.footer-addr {
  font-family:'DM Sans',sans-serif; font-size:13px; font-weight:300;
  color:rgba(240,238,245,.42); line-height:1.8;
}
.footer-socials { display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.footer-socials a {
  width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(240,238,245,.14);
  display:flex; align-items:center; justify-content:center;
  color:rgba(240,238,245,.44); text-decoration:none; font-size:13px;
  transition:border-color .2s,color .2s;
}
.footer-socials a:hover { border-color:rgba(244,121,32,.5); color:var(--orange); }
.footer-bottom {
  border-top:1px solid rgba(240,238,245,.06); padding-top:24px;
  display:flex; align-items:center; justify-content:center;
}
.footer-copy {
  font-family:'DM Sans',sans-serif; font-size:12px; font-weight:300;
  color:rgba(240,238,245,.24); letter-spacing:.04em; text-align:center;
}

/* MOBILE */
@media (max-width:767px) {
  nav { padding:16px 20px; }
  .nav-logo svg { height:32px; }
  .nav-links {
    display:none; position:fixed; inset:0;
    background:rgba(8,6,13,.97); flex-direction:column;
    align-items:center; justify-content:flex-start;
    padding-top:88px; gap:32px; z-index:250;
    overflow-y:auto;
  }
  .nav-links.open { display:flex; }
  .nav-links a { font-size:18px; letter-spacing:.08em; color:rgba(240,238,245,.72); }
  .nav-links .cta { padding:12px 36px; font-size:14px; }
  .hamburger { display:flex; }
  footer { padding:40px 20px 24px; overflow:hidden; }
  .footer-top { grid-template-columns:1fr; gap:28px; }
  .footer-logo { display:flex; justify-content:flex-start; }
  .footer-logo svg { height:56px; }
  .footer-socials { flex-wrap:wrap; }
}

/* MOBILE NAV: logo centralizada acima dos links */
.nav-mobile-logo {
  display:none;
}
@media (max-width:767px) {
  .nav-mobile-logo {
    display:block; position:fixed; top:22px; left:50%; transform:translateX(-50%);
    z-index:260; pointer-events:none; opacity:0; transition:opacity .3s;
  }
  .nav-links.open ~ .nav-mobile-logo,
  .nav-links.open + .nav-mobile-logo { opacity:1; }
  .nav-mobile-logo svg { height:36px; width:auto; }
}

/* ── GLOBAL MOBILE: aumento base de fonte ── */
@media (max-width:767px) {
  body { font-size:17px; }
}

/* ── FORMULÁRIOS AJAX (estados compartilhados por todos os formulários do site) ──
   Erros de validação vindos do backend (inclusive antispam/captcha) e mensagem global. */
.ajax-form input.error,
.ajax-form textarea.error,
.ajax-form select.error {
    border-color: rgba(233, 30, 114, 0.7) !important;
    box-shadow: 0 0 0 1px rgba(233, 30, 114, 0.25);
}
.ajax-form .captcha-wrap.has-error .captcha-image {
    outline: 2px solid rgba(233, 30, 114, 0.7);
    outline-offset: 2px;
}
.ajax-form .form-error-global {
    font-family: "Sora", sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: rgba(233, 30, 114, 0.85);
    margin-bottom: 8px;
    display: none;
}
.ajax-form .form-error-global.visible {
    display: block;
}
.ajax-form .form-success {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
