:root{
  --bg: #0a0f1a;
  --bg-alt:#0d1324;
  --card:#121a2b;
  --text:#e8f1ff;
  --muted:#a8b0c3;
  --brand1:#0af;
  --brand2:#00d084;
  --accent:#ffd23f;
  --cta-start:#00a2ff;
  --cta-end:#00e0b8;
  --shadow: 0 8px 30px rgba(0,0,0,.5);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Helvetica Neue", sans-serif;
  background: radial-gradient(1200px 600px at 20% -10%, rgba(0,162,255,.2), transparent 60%) , radial-gradient(1200px 600px at 100% 10%, rgba(0,224,184,.15), transparent 60%), var(--bg);
  color:var(--text);
  line-height:1.5;
}

a{color:var(--brand1); text-decoration:none}
a:hover{text-decoration:underline}

.container{width:min(1120px, 92vw); margin:0 auto}

.header{
  position:sticky; top:0; z-index:50;
  background:rgba(10,15,26,.7); backdrop-filter: blur(8px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.header .container{display:flex; align-items:center; justify-content:space-between; gap:1rem; padding: .8rem 0;}
.brand img{display:block}

.nav{display:flex; gap:1rem; align-items:center}
.nav a{color:var(--muted); font-weight:500; padding:.5rem .6rem; border-radius:10px}
.nav a:hover{color:var(--text); background:rgba(255,255,255,.06)}

.actions{display:flex; gap:.6rem; align-items:center}
.lang{color:var(--muted); font-weight:600}
.lang:hover{color:var(--text)}

.hamburger{display:none; font-size:1.6rem; background:none; border:none; color:var(--text)}

.mobile-nav{display:none; flex-direction:column; gap:.6rem; padding: .8rem 1rem; border-top:1px solid rgba(255,255,255,.06)}
.mobile-nav a{color:var(--text); font-weight:500}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.9rem 1.2rem; border-radius:14px; border:0; cursor:pointer; font-weight:800;
  box-shadow: var(--shadow);
}
.btn-secondary{background:#1a2439; color:var(--text)}
.btn-secondary:hover{filter:brightness(1.1)}

.btn-cta{
  background: linear-gradient(135deg, var(--cta-start), var(--cta-end));
  color:#04121a; text-shadow: 0 1px 0 rgba(255,255,255,.4);
  letter-spacing:.3px; position:relative; overflow:hidden;
}
.btn-cta:hover{filter:brightness(1.1); transform: translateY(-1px)}
.btn-xl{font-size:1.05rem; padding:1.1rem 1.4rem}

.btn-cta::after{
  content:''; position:absolute; inset:-2px; border-radius:16px;
  background: linear-gradient(135deg, rgba(255,255,255,.25), transparent 60%);
  mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
  mask-composite: exclude;
  padding:2px; pointer-events:none;
}
@media (prefers-reduced-motion: no-preference){
  .btn-cta{animation: pulse 2.2s infinite ease-in-out}
  @keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(0,224,184,.35)} 50%{box-shadow:0 0 0 12px rgba(0,224,184,0)}}
}

.hero{
  padding: 7rem 0 5rem;
  background:
    radial-gradient(800px 400px at 30% 0%, rgba(0,162,255,.14), transparent 60%),
    radial-gradient(800px 400px at 100% 30%, rgba(255,210,63,.08), transparent 60%);
  position:relative;
}
.hero-inner{display:grid; grid-template-columns: 1.2fr 1fr; gap:2rem; align-items:center}
.headline{font-size: clamp(2rem, 4.3vw, 3.4rem); line-height:1.1; margin:0 0 .6rem}
.sub{font-size: clamp(1rem, 2vw, 1.2rem); color:var(--muted); margin:0 0 1.2rem}
.cta-row{display:flex; gap:.8rem; flex-wrap:wrap}
.trust-row{display:flex; gap:1rem; flex-wrap:wrap; color:var(--muted); margin-top:1rem}

.hero-art{display:flex; flex-direction:column; gap:1rem; align-items:center}
.partner-card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:16px; padding:1rem; width:100%; max-width:320px; text-align:center; box-shadow: var(--shadow)}
.partner-title{color:var(--muted); font-weight:700; letter-spacing:.3px; margin-bottom:.4rem; text-transform:uppercase; font-size:.8rem}
.partner-link{display:flex; align-items:center; justify-content:center; gap:.6rem; color:var(--text); text-decoration:none}
.partner-logo{width:100px; height:48px; border-radius:12px; background:#0f1729; padding:.2rem; object-fit:cover}
.partner-name{font-weight:800; font-size:1.1rem}

.scroll-down{
  position:absolute; bottom:12px; left:50%; transform:translateX(-50%);
  font-size:2rem; text-decoration:none; color:var(--muted);
  animation: bob 2s infinite;
}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-6px)}}

.section{padding: 4rem 0}
.section.alt{background: var(--bg-alt)}
.section h2{font-size: clamp(1.6rem, 3.4vw, 2.2rem); margin:0 0 1rem}
.grid3{display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem}
.card{background:var(--card); border:1px solid rgba(255,255,255,.06); border-radius:16px; padding:1rem; box-shadow: var(--shadow)}
.card h3{margin:.2rem 0 .4rem; font-size:1.25rem}

.steps{display:grid; grid-template-columns: repeat(4, 1fr); gap:1rem}
.step{background:var(--card); border:1px solid rgba(255,255,255,.06); padding:1rem; border-radius:16px; text-align:center; font-weight:700}

.benefits{display:grid; grid-template-columns: repeat(2, 1fr); gap:.6rem; list-style:none; padding-left: 0}
.benefits li{background:var(--card); border:1px solid rgba(255,255,255,.06); padding:.8rem 1rem; border-radius:14px}

.quotes{display:grid; gap:.8rem}
blockquote{margin:0; background:var(--card); border-left:4px solid var(--accent); padding:1rem; border-radius:12px}

.final-band{padding: 3rem 0; background: linear-gradient(135deg, rgba(0,162,255,.2), rgba(0,224,184,.2)); text-align:center}
.final-band h3{margin:.2rem 0 .6rem; font-size: clamp(1.4rem, 3vw, 2rem)}

.footer{background:#0b1020; padding:2rem 0; border-top:1px solid rgba(255,255,255,.06)}
.footer-grid{display:grid; grid-template-columns: 1fr 1fr; gap:1rem; align-items:flex-start}
.copy{color:var(--muted); text-align:right}

.sticky-cta-mobile{
  position: fixed; bottom: 12px; left:50%; transform:translateX(-50%);
  z-index: 60; display:none;
}
.sticky-cta-mobile .btn{padding:.9rem 1.4rem}

.reveal{opacity:0; transform: translateY(16px); transition: .5s ease all}
.reveal.in{opacity:1; transform: translateY(0)}

/* Responsivo */
@media (max-width: 960px){
  .hero-inner{grid-template-columns: 1fr; text-align:center}
  .copy{text-align:left}
  .steps{grid-template-columns: 1fr 1fr}
  .grid3{grid-template-columns: 1fr}
  .benefits{grid-template-columns: 1fr}
  .partner-card{max-width: 420px}
}
@media (max-width: 720px){
  .nav{display:none}
  .hamburger{display:none} /* não mostrar menu no mobile */
  .mobile-nav{display:none !important} /* garantir que não apareça */
  .sticky-cta-mobile{display:block}
  .steps{grid-template-columns: 1fr}
  .footer-grid{grid-template-columns: 1fr}
  .headline{font-size: clamp(1.8rem, 7vw, 2.4rem)}
  .sub{font-size:1rem}
  .btn-xl{width:100%}
}
