:root{
  --primary:#0b1220; --secondary:#1b2a4b;
  --accent1:#22d3ee; --accent2:#6366f1;
  --text:#f8fafc; --muted:#cbd5e1;
  --card:rgba(255,255,255,.08); --header:72px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  color:var(--text);
  background:
    radial-gradient(900px 600px at 10% 20%, rgba(34,211,238,.15), rgba(99,102,241,.08) 40%, rgba(10,15,30,0) 70%),
    linear-gradient(180deg,#0a0f1e 0%, var(--secondary) 100%);
  line-height:1.65; overflow-x:hidden;
}
.container{max-width:1200px;margin:0 auto;padding:0 22px}
.section{padding:44px 0}
.section-title{font-size:2.2rem;text-align:center;margin-bottom:28px}

/* ===== Header & Nav ===== */
.site-header{
  position:fixed; top:0; left:0; right:0; height:var(--header);
  display:flex; align-items:center;
  background:linear-gradient(180deg, rgba(6,10,20,.92) 0%, rgba(6,10,20,.75) 60%, rgba(6,10,20,0) 100%);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(10px); z-index:1000;
}
.nav-row{display:flex;align-items:center;justify-content:space-between;width:100%}
.brand{display:flex;align-items:center;gap:12px;color:var(--text);text-decoration:none;font-weight:800}
.logo{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:12px;background:linear-gradient(135deg,var(--accent1),var(--accent2));color:#0b1220;font-weight:900}

/* nav desktop */
.nav{display:flex;align-items:center;gap:22px}
.nav a{color:var(--text);text-decoration:none;font-weight:600;position:relative;opacity:.95}
.nav a::after{content:'';position:absolute;bottom:-6px;left:0;width:0;height:2px;background:linear-gradient(90deg,var(--accent1),var(--accent2));transition:width .28s}
.nav a:hover::after{width:100%}
#lang{padding:8px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--text)}
/* problema do dropdown branco em alguns PCs */
#lang option{color:#111 !important;background:#fff !important}

/* botão hambúrguer */
.nav-toggle{
  display:none; width:44px; height:40px; border-radius:10px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.06); color:var(--text);
  align-items:center; justify-content:center; gap:4px;
}
.nav-toggle .bar{display:block;width:20px;height:2px;background:var(--text);opacity:.9}
@media (max-width:980px){
  .nav-toggle{display:inline-flex}
  .nav{
    position:absolute; right:12px; left:12px; top:calc(var(--header) - 6px);
    display:none; flex-direction:column; gap:12px;
    padding:12px; border-radius:12px;
    background:rgba(6,10,20,.96); border:1px solid rgba(255,255,255,.12);
    box-shadow:0 20px 60px rgba(0,0,0,.35);
  }
  .nav.open{display:flex; animation:navIn .18s ease-out}
  @keyframes navIn{from{opacity:0; transform:translateY(-6px)} to{opacity:1; transform:translateY(0)}}
}

/* ===== Hero (logo + wordmark menores) ===== */
.hero-wrap{padding-top:var(--header); display:flex; align-items:center; justify-content:center; min-height:60vh}
.hero-inner{max-width:1200px;width:100%;display:grid;grid-template-columns:1fr;gap:12px;text-align:center}
.hero-logo{width:min(400px,72vw);height:auto;filter:drop-shadow(0 12px 32px rgba(34,211,238,.15))}
.hero-wordmark{width:min(720px,92vw);height:auto;opacity:.95}
@media (min-width:900px){
  .hero-wrap{min-height:68vh}
  .hero-logo{width:min(420px,38vw)}
  .hero-wordmark{width:min(740px,62vw)}
}

/* ===== Body content ===== */
.hero h1{
  font-size:clamp(2.2rem,1.4rem + 2vw,3.4rem); line-height:1.1;
  background:linear-gradient(90deg,#e0fbff,#c4b5fd); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero p{color:var(--muted);max-width:840px;margin-bottom:18px}
.cta{display:inline-flex;gap:10px;flex-wrap:wrap;margin-top:6px}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:12px 16px;border-radius:999px;background:linear-gradient(135deg,var(--accent1),var(--accent2));color:#0b1220;font-weight:800;text-decoration:none;box-shadow:0 8px 26px rgba(34,211,238,.25)}
.btn.alt{background:transparent;color:var(--text);border:1px solid rgba(255,255,255,.18)}

.grid{display:grid;gap:22px}
.grid-2{grid-template-columns:1fr}
@media(min-width:980px){.grid-2{grid-template-columns:1.05fr .95fr}}
.card{background:var(--card);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:20px;box-shadow:0 18px 60px -28px rgba(0,0,0,.35)}
.card img{width:100%;border-radius:12px;border:1px solid rgba(255,255,255,.12);display:block;margin:8px 0;object-fit:cover}
.inpt{width:100%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;margin-bottom:10px;border-radius:10px;padding:10px}
.badge{display:inline-block;padding:4px 8px;border-radius:999px;color:#0b1220;background:#a7f3d0;border:1px solid rgba(34,211,238,.3);font-size:.85rem}
.small{color:var(--muted);font-size:.95rem}
.lnk{color:#e0fbff;text-decoration:none}

/* Footer */
footer{background:#0a0f1c;padding:46px 0 28px;border-top:1px solid rgba(255,255,255,.08)}
.footer-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.copyright{text-align:center;color:var(--muted);margin-top:18px;border-top:1px solid rgba(255,255,255,.08);padding-top:14px}

/* Cookie */
.cookie{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;background:rgba(6,10,20,.9);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:14px;display:flex;gap:10px;align-items:center;z-index:9999}
.cookie[hidden]{display:none}

.nav-toggle .bar{display:block;width:20px;height:2px;background:var(--text);opacity:.9}
/* Estado desabilitado (evitar duplo submit) */
.btn[disabled]{
  opacity:.6;
  cursor:not-allowed;
  filter:grayscale(25%);
  box-shadow:none;
}
/* Estado desabilitado (evitar duplo submit) */
.btn[disabled]{
  opacity:.6;
  cursor:not-allowed;
  filter:grayscale(25%);
  box-shadow:none;
}

/* Captcha no form */
.captcha{
  margin: 12px 0 10px;
  transform: translateZ(0); /* ajuda em alguns devices */
}
/* Estilos para forms Netlify */
.hidden {
  position: absolute;
  left: -9999px;
  top: -9999px;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

/* Success page styles */
.success-container {
  max-width: 600px;
  margin: 100px auto;
  text-align: center;
  padding: 40px 20px;
}

.success-icon {
  font-size: 4rem;
  margin-bottom: 20px;
  color: #4CAF50;
}

.success-btn {
  display: inline-block;
  padding: 12px 24px;
  background: #243050;
  color: white;
  text-decoration: none;
  border-radius: 8px;
  margin-top: 20px;
  transition: background 0.3s;
}

.success-btn:hover {
  background: #1a2439;
}
.hidden {
  position: absolute;
  left: -9999px;
  top: -9999px;
  height: 1px;
  width: 1px;
  overflow: hidden;
}