:root{
  --navy:#0B2B3A; --navy-2:#10384B; --navy-ink:#A9C6CF; --pulse:#35E0B5;
  --teal:#0E9F8E; --teal-2:#0B8577; --teal-soft:#DDF3EF;
  --bg:#F4F8F8; --surface:#FFFFFF; --ink:#0D2230; --muted:#56707A; --line:#D6E1E3;
  --warn:#D94B3D; --amber:#F2A33A;
  --sans:"Red Hat Text",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --disp:"Red Hat Display","Red Hat Text",system-ui,sans-serif;
  --r:16px; --w:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--teal-2)}
h1,h2,h3{font-family:var(--disp);letter-spacing:-.02em;line-height:1.15;margin:0}
.wrap{max-width:var(--w);margin:0 auto;padding:0 20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 16px var(--disp);padding:13px 22px;border-radius:999px;text-decoration:none;border:2px solid transparent;cursor:pointer;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--teal);color:#fff}
.btn-primary:hover{background:var(--teal-2)}
.btn-ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
.btn-ghost:hover{border-color:#fff}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
:focus-visible{outline:3px solid var(--pulse);outline-offset:3px}

/* topo */
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:24px;height:72px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy);flex-shrink:0}
.logo img{width:40px;height:40px;border-radius:11px}
.logo span{font:800 20px var(--disp);letter-spacing:-.02em}
.logo small{display:block;font:700 10px var(--sans);letter-spacing:.14em;color:var(--teal);text-transform:uppercase;margin-top:-2px}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{font:600 15px var(--sans);color:var(--ink);text-decoration:none;padding:8px 12px;border-radius:8px}
.nav a:hover{background:var(--teal-soft)}
.top .entrar{padding:10px 20px;font-size:15px}
.menu-btn{display:none;margin-left:auto;background:none;border:none;padding:8px;cursor:pointer;color:var(--navy)}
.menu-btn svg{width:28px;height:28px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round}

/* destaque */
.hero{background:radial-gradient(900px 500px at 85% 0%,var(--navy-2),transparent 70%),var(--navy);color:#fff;position:relative;overflow:hidden}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:36px;height:120px;opacity:.14;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='120' viewBox='0 0 600 120'%3E%3Cpolyline fill='none' stroke='%2335E0B5' stroke-width='3' points='0,60 200,60 225,60 240,30 255,60 275,60 295,8 320,112 340,60 370,60 390,45 410,60 600,60'/%3E%3C/svg%3E") repeat-x center/600px 120px}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center;padding-top:80px;padding-bottom:96px;position:relative;z-index:1}
.hero .wrap>*{min-width:0}
.eyebrow{display:inline-block;font:700 13px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--pulse);margin-bottom:16px}
.hero h1{font-size:clamp(34px,5vw,56px);font-weight:800;text-wrap:balance}
.hero h1 em{font-style:normal;color:var(--pulse)}
.hero p.lead{font-size:19px;color:#CFE3E8;margin:20px 0 32px;max-width:36em}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero .chips{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:36px;padding:0;list-style:none;color:var(--navy-ink);font-size:15px}
.hero .chips li::before{content:"✓";color:var(--pulse);font-weight:800;margin-right:8px}

/* mock do app */
.mock{position:relative}
.mock-card{background:#fff;color:var(--ink);border-radius:18px;box-shadow:0 40px 80px rgba(0,0,0,.35);overflow:hidden}
.mock-bar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line)}
.mock-bar b{font:800 16px var(--disp)}
.mock-bar small{color:var(--muted);font-size:13px}
.mock-tag{font:700 12px var(--sans);background:var(--teal-soft);color:var(--teal-2);padding:4px 10px;border-radius:999px}
.mock-grid{display:grid;grid-template-columns:64px repeat(5,minmax(0,1fr));font-size:12px}
.mock-grid>div{padding:8px 6px;border-bottom:1px solid #EEF3F4;border-right:1px solid #EEF3F4;min-height:44px}
.mock-grid .h{font:700 11px var(--sans);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;min-height:auto;background:#F7FAFA;text-align:center}
.mock-grid .h b{display:block;font:800 16px var(--disp);color:var(--ink);letter-spacing:0}
.mock-grid .t{font:700 11px var(--sans);color:var(--muted);display:flex;flex-direction:column;justify-content:center}
.mock-grid .t span{font-weight:500}
.s{display:block;border-radius:7px;padding:5px 6px;font:700 11.5px var(--sans);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s.a{background:#DDF3EF;color:#0B6F63}.s.b{background:#E3ECFA;color:#28518F}.s.c{background:#FFF1E2;color:#A45A12}.s.d{background:#F1E8FA;color:#6B3F99}
.s.v{background:#fff;border:1.5px dashed #F2A33A;color:#A45A12}
.float{position:absolute;background:#fff;color:var(--ink);border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.28);padding:12px 14px;display:flex;align-items:center;gap:10px;font-size:13.5px;line-height:1.3}
.float i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-style:normal;font-size:17px;flex-shrink:0}
.float b{display:block;font:800 14px var(--disp)}
.f1{left:24px;bottom:-50px}.f1 i{background:var(--teal-soft)}
.f2{right:24px;top:-52px}.f2 i{background:#FFF1E2}

/* seções */
section{padding:96px 0}
.sec-h{max-width:720px;margin:0 auto 52px;text-align:center}
.sec-h .eyebrow{color:var(--teal)}
.sec-h h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;text-wrap:balance}
.sec-h p{color:var(--muted);font-size:18px;margin:14px 0 0}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px}
.card .ic{width:48px;height:48px;border-radius:13px;background:var(--teal-soft);display:grid;place-items:center;margin-bottom:16px}
.card .ic svg{width:24px;height:24px;fill:none;stroke:var(--teal-2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-size:19px;font-weight:800;margin-bottom:8px}
.card p{margin:0;color:var(--muted);font-size:16px}

.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:passo;list-style:none;padding:0;margin:0}
.steps li{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:28px;position:relative}
.steps li::before{counter-increment:passo;content:counter(passo);display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--navy);color:var(--pulse);font:800 20px var(--disp);margin-bottom:16px}
.steps h3{font-size:19px;font-weight:800;margin-bottom:8px}
.steps p{margin:0;color:var(--muted);font-size:16px}

.dark{background:var(--navy);color:#fff}
.dark .sec-h p{color:var(--navy-ink)}
.dark .sec-h .eyebrow{color:var(--pulse)}
.perfis{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.perfil{background:var(--navy-2);border:1px solid rgba(255,255,255,.08);border-radius:var(--r);padding:28px}
.perfil h3{font-size:21px;font-weight:800;margin-bottom:6px}
.perfil .sub{color:var(--pulse);font:700 13px var(--sans);letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.perfil ul{margin:0;padding-left:0;list-style:none;color:#D5E6EA;font-size:16px}
.perfil li{padding:7px 0 7px 26px;position:relative;border-top:1px solid rgba(255,255,255,.07)}
.perfil li::before{content:"";position:absolute;left:2px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--pulse)}

.seg{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.seg h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;margin-bottom:16px;text-wrap:balance}
.seg p{color:var(--muted)}
.seg .lista{display:grid;gap:14px}
.seg .item{display:flex;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px}
.seg .item svg{width:26px;height:26px;flex-shrink:0;fill:none;stroke:var(--teal-2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.seg .item b{display:block;font:800 16px var(--disp);margin-bottom:2px}
.seg .item span{color:var(--muted);font-size:15px}

.sobre{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sobre .wrap{max-width:820px;text-align:center}
.sobre h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;margin-bottom:18px}
.sobre p{color:var(--muted);font-size:18px}
.sobre blockquote{margin:28px auto 0;font:600 22px/1.45 var(--disp);color:var(--navy);max-width:640px}

.contato .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.contato h2{font-size:clamp(28px,3.6vw,40px);font-weight:800;margin-bottom:14px}
.contato .txt p{color:var(--muted)}
.form{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:28px;display:grid;gap:14px;box-shadow:0 20px 40px rgba(11,43,58,.06)}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{display:grid;gap:6px;font:600 14px var(--sans)}
.form input,.form select,.form textarea{font:16px var(--sans);padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);width:100%}
.form textarea{min-height:120px;resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.form .hp{position:absolute;left:-9999px}
.form small{color:var(--muted);font-size:13px}

.cta-final{background:linear-gradient(120deg,var(--teal),#0B7E71);color:#fff;border-radius:22px;padding:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px}
.cta-final h2{font-size:clamp(24px,3vw,32px);font-weight:800}
.cta-final p{margin:6px 0 0;color:#E2F7F3}
.cta-final .btn{background:#fff;color:var(--navy)}

footer{background:var(--navy);color:var(--navy-ink);padding:48px 0 32px;font-size:15px}
footer .wrap{display:flex;flex-wrap:wrap;gap:24px 48px;justify-content:space-between;align-items:flex-start}
footer .logo{color:#fff}
footer nav{display:flex;flex-wrap:wrap;gap:10px 22px}
footer a{color:var(--navy-ink);text-decoration:none}
footer a:hover{color:#fff}
footer .copy{flex-basis:100%;border-top:1px solid rgba(255,255,255,.1);padding-top:20px;font-size:13px}

@media (max-width:980px){
  .nav,.top .entrar{display:none}
  .menu-btn{display:block}
  .top.aberto .nav{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:72px;background:#fff;border-bottom:1px solid var(--line);padding:10px 20px 20px;gap:2px}
  .top.aberto .nav a{padding:12px}
  .top.aberto .nav .m-entrar{display:flex;margin-top:8px;color:#fff}
  .hero .wrap{grid-template-columns:1fr;gap:64px;padding-top:56px}
  .mock{margin:0 12px}
  .grid3,.steps,.perfis{grid-template-columns:1fr 1fr}
  .seg,.contato .wrap{grid-template-columns:1fr;gap:36px}
}
.nav .m-entrar{display:none}
@media (max-width:640px){
  body{font-size:16px}
  section{padding:68px 0}
  .grid3,.steps,.perfis{grid-template-columns:1fr}
  .form .two{grid-template-columns:1fr}
  .mock-grid{grid-template-columns:52px repeat(3,minmax(0,1fr))}
  .mock-grid .x{display:none}
  .f1{left:8px;bottom:-52px}.f2{right:8px;top:-56px}
  .hero .wrap{gap:88px}
  .cta-final{padding:30px}
  .hero .ctas .btn{flex:1 1 100%}
}

/* WhatsApp */
.btn-wa{background:#25D366;color:#fff}
.btn-wa:hover{background:#1EBE5A}
.btn-wa svg{width:20px;height:20px}
.wa-flutuante{position:fixed;right:20px;bottom:20px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25D366;color:#fff;display:grid;place-items:center;box-shadow:0 10px 28px rgba(0,0,0,.25)}
.wa-flutuante svg{width:32px;height:32px}
.wa-flutuante[hidden],.btn-wa[hidden]{display:none}
