:root{
  --ground:#FFFFFF;
  --surface:#FFFFFF;
  --surface-2:#F6F8F8;
  --line:#E7ECEC;
  --ink:#16201F;
  --ink-soft:#647676;
  --accent:#0F5A5F;
  --accent-soft:#EDF5F5;
  --coral:#DB4A26;
  --petroleo:var(--accent);
  --bubble-in:#F4F6F6;
  --bubble-out:#EAF4F4;
  --danger:#A32D2D;
}
@media (prefers-color-scheme: dark){
  :root{
    --ground:#091413; --surface:#10201F; --surface-2:#182B2A; --line:#254040;
    --ink:#E7F1F0; --ink-soft:#8FA8A7; --accent:#4FC3C8; --accent-soft:#11322F;
    --coral:#FF7A55; --bubble-in:#182625; --bubble-out:#123638; --danger:#FF8F8F;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:76px}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:16px; line-height:1.65; -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:Sora,Manrope,system-ui,sans-serif; text-wrap:balance; letter-spacing:-.025em; margin:0}
a{color:inherit}
[hidden]{display:none!important}

.wrap{max-width:1080px; margin:0 auto; padding-inline:22px}
section{padding-block:clamp(58px,8.5vw,112px)}
.eyebrow{
  font-size:12px; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); margin:0 0 14px;
}
.sec-title{font-size:clamp(26px,3.6vw,38px); font-weight:600; max-width:22ch; margin-bottom:34px}
.note{font-size:13.5px; color:var(--ink-soft); margin:14px 0 0}

.nav{
  position:sticky; top:0; z-index:20;
  background:color-mix(in srgb, var(--ground) 90%, transparent);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line);
}
.nav-in{display:flex; align-items:center; gap:18px; padding-block:14px}
.mark{display:flex; align-items:center; gap:9px; font-family:Sora; font-size:18px; letter-spacing:-.04em}
.mark b{font-weight:600}
.mark span{font-weight:500; color:var(--ink-soft)}
.glyph{width:26px; height:26px; flex:none}
.nav-links{margin-left:auto; display:flex; gap:22px; font-size:14px; font-weight:500; color:var(--ink-soft)}
.nav-links a{text-decoration:none}
.nav-links a:hover{color:var(--ink)}
@media(max-width:760px){.nav-links{display:none}.nav .btn{margin-left:auto}}

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:Sora; font-weight:600; font-size:15px; text-decoration:none;
  padding:12px 20px; border-radius:11px; border:1px solid transparent;
  background:var(--coral); color:#FFFFFF; transition:transform .15s ease, filter .15s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-1px); filter:brightness(1.08)}
@media (prefers-color-scheme: dark){ .btn:not(.ghost){color:#2B1007} }
.btn.ghost{background:transparent; border-color:var(--line); color:var(--ink)}
.btn.sm{padding:9px 16px; font-size:14px}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px; border-radius:6px}

.hero{
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,5vw,64px);
  align-items:start; padding-block:clamp(34px,5vw,60px) clamp(58px,8.5vw,112px);
}
@media(max-width:860px){.hero{grid-template-columns:1fr; gap:36px}}
.hero h1{font-size:clamp(34px,5vw,54px); font-weight:600; line-height:1.07}
.hero h1 em{font-style:normal; color:var(--accent)}
.hero p.lead{font-size:clamp(17px,2vw,19px); color:var(--ink-soft); max-width:46ch; margin:20px 0 28px}
.hero-actions{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.vagas{
  display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600;
  background:var(--accent-soft); color:var(--accent); padding:6px 13px; border-radius:20px;
  margin-bottom:20px; letter-spacing:.01em;
}
.dot{width:7px; height:7px; border-radius:50%; background:var(--coral); flex:none}

.phone{
  background:var(--surface); border:1px solid var(--line); border-radius:22px;
  padding:16px; max-width:380px; margin-inline:auto; width:100%;
}
.phone-bar{
  display:flex; align-items:center; gap:10px; padding:4px 6px 14px;
  border-bottom:1px solid var(--line); margin-bottom:14px;
}
.avatar{
  width:34px; height:34px; border-radius:50%; background:var(--surface-2);
  border:1px solid var(--line); display:grid; place-items:center; flex:none;
  font-family:Sora; font-weight:600; font-size:14px; color:var(--ink-soft);
}
.phone-bar .who{font-family:Sora; font-weight:600; font-size:14.5px; line-height:1.2}
.phone-bar .sub{font-size:11.5px; color:var(--ink-soft)}
.replay{
  margin-left:auto; background:none; border:1px solid var(--line); color:var(--ink-soft);
  font:inherit; font-size:12px; padding:5px 11px; border-radius:16px; cursor:pointer;
}
.replay:hover{color:var(--ink); border-color:var(--accent)}
.thread{display:flex; flex-direction:column; gap:9px}
.msg{
  max-width:84%; padding:10px 13px; border-radius:15px; font-size:14.5px; line-height:1.5;
  transition:opacity .28s ease, transform .28s ease;
}
.msg.in{background:var(--bubble-in); border-bottom-left-radius:5px; align-self:flex-start}
.msg.out{background:var(--bubble-out); border-bottom-right-radius:5px; align-self:flex-end}
.msg .time{display:block; font-size:10.5px; color:var(--ink-soft); margin-top:4px; font-variant-numeric:tabular-nums}
.msg.hidden{opacity:0; transform:translateY(8px)}
.opt{
  display:block; background:color-mix(in srgb,var(--ground) 45%, transparent);
  border:1px solid var(--line); border-radius:9px; padding:7px 11px; margin-top:7px; font-size:13.5px;
}
.opt.pick{border-color:var(--accent); color:var(--accent); font-weight:600}
.pix{
  display:block; margin-top:8px; padding:9px 11px; border-radius:9px; border:1px dashed var(--line);
  font-size:12.5px; color:var(--ink-soft); font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  word-break:break-all;
}

.calc{background:var(--surface-2); border-radius:18px; padding:clamp(26px,4vw,40px)}
.calc h2{font-size:clamp(23px,3vw,30px); font-weight:600; margin-bottom:8px}
.calc .sub{color:var(--ink-soft); font-size:15px; margin:0 0 28px; max-width:60ch}
.fields{display:grid; grid-template-columns:repeat(3,1fr); gap:24px}
@media(max-width:700px){.fields{grid-template-columns:1fr}}
.field label{display:block; font-size:14px; font-weight:600; margin-bottom:5px}
.field .val{
  font-family:Sora; font-weight:600; font-size:22px; color:var(--accent);
  font-variant-numeric:tabular-nums; letter-spacing:-.02em;
}
.field input[type=range]{width:100%; accent-color:var(--accent); margin-top:10px; height:22px}
.result{
  margin-top:30px; padding-top:28px; border-top:1px solid var(--line);
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
}
@media(max-width:620px){.result{grid-template-columns:1fr}}
.res .cap{font-size:12px; font-weight:600; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.12em}
.res .big{
  font-family:Sora; font-weight:600; font-variant-numeric:tabular-nums;
  font-size:clamp(32px,5vw,46px); letter-spacing:-.04em; line-height:1.1; margin-top:10px;
}
.res.perda .big{color:var(--coral)}
.res.ganho .big{color:var(--petroleo)}
.res p{margin:10px 0 0; font-size:14px; color:var(--ink-soft)}

.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
@media(max-width:820px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.steps{grid-template-columns:1fr}}
.step{border-top:2px solid var(--line); padding-top:16px}
.step:first-child{border-top-color:var(--accent)}
.step b{display:block; font-family:Sora; font-weight:500; font-size:12.5px; color:var(--accent); letter-spacing:.1em; margin-bottom:7px}
.step h3{font-size:16.5px; font-weight:600; margin-bottom:6px}
.step p{margin:0; font-size:14px; color:var(--ink-soft)}

.bento{display:grid; grid-template-columns:repeat(6,1fr); gap:12px}
.tile{grid-column:span 2; border:1px solid var(--line); border-radius:14px; padding:24px}
.tile.wide{grid-column:span 3}
.tile.destaque{background:var(--accent-soft); border-color:transparent}
.tile h3{font-size:18px; font-weight:600; margin-bottom:8px}
.tile p{margin:0; font-size:14.5px; color:var(--ink-soft)}
.ico{width:26px; height:26px; margin-bottom:14px; display:block; color:var(--accent)}
@media(max-width:820px){
  .bento{grid-template-columns:repeat(2,1fr)}
  .tile,.tile.wide{grid-column:span 2}
}

.segs{border-top:1px solid var(--line)}
.seg-row{
  display:grid; grid-template-columns:220px 1fr auto; gap:clamp(14px,3vw,36px); align-items:baseline;
  padding-block:24px; border-bottom:1px solid var(--line); text-decoration:none;
  transition:background .15s ease;
}
.seg-row:hover{background:var(--surface-2)}
.seg-row h3{font-size:18px; font-weight:600}
.seg-row p{margin:0; font-size:15px; color:var(--ink-soft); max-width:56ch}
.seg-row .ver{font-size:14px; font-weight:600; color:var(--accent); white-space:nowrap}
@media(max-width:700px){
  .seg-row{grid-template-columns:1fr; gap:6px; padding-block:20px}
}

.planos{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:start}
@media(max-width:820px){.planos{grid-template-columns:1fr}}
.plano{border-top:1px solid var(--line); padding:20px 0 0}
.plano.destaque{border-top:2px solid var(--accent); padding-top:19px}
.plano .nome{font-family:Sora; font-weight:600; font-size:15px; letter-spacing:.02em}
.plano.destaque .nome{color:var(--accent)}
.plano .valor{font-family:Sora; font-weight:600; font-size:38px; letter-spacing:-.04em; margin:10px 0 2px; font-variant-numeric:tabular-nums}
.plano .valor small{font-size:14px; font-weight:500; color:var(--ink-soft); letter-spacing:0}
.plano .valor.texto{font-size:26px}
.plano ul{list-style:none; margin:18px 0 0; padding:0; display:flex; flex-direction:column; gap:9px; font-size:14.5px; color:var(--ink-soft)}
.plano li::before{content:"—"; color:var(--accent); margin-right:9px}

.fecho{background:var(--accent-soft); border-radius:20px; padding:clamp(34px,5vw,60px); text-align:center}
.fecho h2{font-size:clamp(26px,3.6vw,38px); font-weight:600; max-width:20ch; margin-inline:auto}
.fecho .texto{color:var(--ink-soft); max-width:52ch; margin:16px auto 26px}
.fecho .alt{margin:18px 0 0; font-size:13.5px}
.fecho .alt a{color:var(--accent); text-decoration:underline}
.selo-vagas{
  display:inline-block; margin-bottom:14px; padding:5px 12px; border-radius:999px;
  background:var(--coral); color:#fff; font-size:12px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase;
}
@media (prefers-color-scheme: dark){ .selo-vagas{color:#2B1007} }

form#form-espera{display:flex; gap:10px; max-width:440px; margin:0 auto; flex-wrap:wrap; justify-content:center}
form#form-espera input[type="email"]{
  flex:1; min-width:220px; height:48px; padding:0 14px; font:inherit; font-size:15px;
  border:1px solid var(--line); border-radius:11px; background:var(--surface); color:var(--ink);
}
form#form-espera input[type="email"]:focus-visible{outline:2px solid var(--accent); outline-offset:1px}
form#form-espera .btn{height:48px}
.btn:disabled{opacity:.6; cursor:wait; transform:none}
.campo-isca{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.aviso-lgpd{font-size:12.5px; color:var(--ink-soft); margin:14px auto 0; max-width:52ch}
.retorno{font-size:14px; margin:14px auto 0; max-width:52ch; display:none}
.retorno--ok{display:block; color:var(--accent); font-weight:600}
.retorno--erro{display:block; color:var(--danger)}

footer{border-top:1px solid var(--line); padding-block:28px; font-size:13.5px; color:var(--ink-soft)}
.foot-in{display:flex; flex-wrap:wrap; gap:14px; align-items:center}
.foot-in nav{margin-left:auto; display:flex; flex-wrap:wrap; gap:18px}
.foot-in a{text-decoration:none}
.foot-in a:hover{color:var(--ink); text-decoration:underline}
@media (prefers-reduced-motion: reduce){*{transition:none!important; animation:none!important} html{scroll-behavior:auto}}
