/* ==========================================================
   WEALTHIER CONNECT
   Painéis brancos flutuando sobre cinza, tipografia de peso
   médio, chips inline, parágrafos bicolores.
   ========================================================== */
:root{
  --bg:#EBEBE9;
  --panel:#FFFFFF;
  --panel-soft:#F5F5F7;
  --panel-lav:#EFF0F7;
  --panel-blue:#EDF3FF;
  --dark:#0E0E10;
  --dark-2:#191A1D;

  --ink:#101012;
  --ink-2:#656570;      /* ≥4.5:1 sobre branco, sobre --panel-soft e sobre o cinza da página */
  --ink-3:#8A8A93;
  --ink-mute:#94949E;   /* metade cinza do parágrafo bicolor, só em texto grande */
  --line:#E7E7EA;
  --line-soft:#F0F0F2;

  --snow:#FAFAFA;
  --snow-2:#A8A8B0;

  --brand:#1E6BFF;
  --brand-2:#38C6FF;
  --sky:#2E9BFF;
  --long:#00A86B;
  --short:#F04452;

  --font:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,Helvetica,Arial,sans-serif;
  --display:"Plus Jakarta Sans","Inter",system-ui,sans-serif;

  --maxw:1240px;
  --gap:clamp(10px,1.1vw,14px);
  --pad:clamp(26px,4.4vw,72px);
  --r-panel:clamp(24px,2.6vw,36px);
  --r-card:clamp(18px,1.8vw,24px);
  --shadow:0 1px 2px rgba(16,16,18,.04),0 10px 30px -18px rgba(16,16,18,.16);
  --ease:cubic-bezier(.2,.7,.3,1);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:104px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:600;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
::selection{background:rgba(30,107,255,.15)}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px;border-radius:8px}

/* ---------- shell ---------- */
.shell{max-width:var(--maxw);margin:0 auto;padding:var(--gap)}
.panel{
  background:var(--panel);border-radius:var(--r-panel);
  padding:var(--pad);margin-bottom:var(--gap);position:relative;overflow:hidden;
  box-shadow:var(--shadow);
}
.panel.night{background:var(--dark);color:var(--snow)}
.panel.night h1,.panel.night h2,.panel.night h3,.panel.night h4{color:#fff}

/* ---------- tipografia ---------- */
.h-hero{font-size:clamp(2.15rem,5.2vw,4.05rem);letter-spacing:-.038em;line-height:1.04}
.h-sec{font-size:clamp(1.75rem,3.5vw,2.85rem);letter-spacing:-.034em}
.h-sub{font-size:clamp(1.28rem,2vw,1.6rem);letter-spacing:-.028em}
.h-card{font-size:clamp(1.12rem,1.5vw,1.32rem);letter-spacing:-.026em}

.duotone{
  font-family:var(--display);font-weight:500;
  font-size:clamp(1.5rem,2.5vw,2.05rem);line-height:1.32;letter-spacing:-.028em;
  color:var(--ink);max-width:min(22ch,100%);
}
.duotone .g{color:var(--ink-mute)}

.lede{font-size:clamp(1.02rem,1.25vw,1.14rem);line-height:1.55;color:var(--ink-2);max-width:min(52ch,100%);margin-top:18px}
.lede b{color:var(--ink);font-weight:600}
.panel.night .lede{color:var(--snow-2)}
.panel.night .lede b{color:#fff}
.body{font-size:1rem;line-height:1.62;color:var(--ink-2)}
.body b{color:var(--ink);font-weight:600}
.body + .body{margin-top:14px}
.panel.night .body{color:var(--snow-2)}
.panel.night .body b{color:#fff}
.tiny{font-size:.86rem;line-height:1.5;color:var(--ink-2)}

.label{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.85rem;font-weight:500;color:var(--ink-2);
  background:var(--panel-soft);border-radius:999px;padding:7px 14px;margin-bottom:22px;
}
.label i{width:6px;height:6px;border-radius:50%;background:var(--brand);flex:0 0 auto;animation:pulse 2.6s ease-in-out infinite}
.panel.night .label{background:rgba(255,255,255,.07);color:var(--snow-2)}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(30,107,255,.5)}50%{box-shadow:0 0 0 5px rgba(30,107,255,0)}}
@keyframes iconpulse{0%,100%{opacity:1}50%{opacity:0.4}}

/* chip inline no título */
.hchip{
  display:inline-grid;place-items:center;vertical-align:-.14em;
  width:.92em;height:.92em;border-radius:.26em;background:var(--brand);margin-inline:.12em;
  animation:chipIn .7s var(--ease) both .35s;
}
.hchip svg{width:.55em;height:.55em;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.hchip.dk{background:var(--ink)}
@keyframes chipIn{from{transform:scale(.4) rotate(-18deg);opacity:0}to{transform:none;opacity:1}}

.sec-head{max-width:min(660px,100%);margin-bottom:clamp(32px,4vw,52px)}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head.center .lede{margin-inline:auto}
.sec-head.center .label{margin-inline:auto}

/* ---------- botões ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--font);font-weight:600;font-size:.95rem;letter-spacing:-.012em;
  padding:14px 24px;min-height:44px;border-radius:999px;border:1px solid transparent;cursor:pointer;
  transition:transform .2s var(--ease),background .2s,color .2s,border-color .2s,box-shadow .25s;
  white-space:nowrap;
}
.btn:active{transform:scale(.985)}
.btn .go{transition:transform .25s var(--ease)}
.btn:hover .go{transform:translateX(3px)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2A2A2E;transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(16,16,18,.8)}
.btn-light{background:#fff;color:var(--ink);border-color:var(--line)}
.btn-light:hover{border-color:var(--ink-3);transform:translateY(-2px)}
.panel.night .btn-light{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:#fff}
.panel.night .btn-light:hover{background:rgba(255,255,255,.14)}
.btn-snow{background:#fff;color:var(--ink)}
.btn-snow:hover{background:#EDEDEF;transform:translateY(-2px)}
.btn-lead{padding-left:8px}
.btn-lead .av{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.16);display:grid;place-items:center;flex:0 0 auto}
.btn-lead .av svg{width:14px;height:14px;fill:#fff}
.btn-block{width:100%}
.btn-wa{
  background:linear-gradient(180deg,#2AD96F 0%,#18B95A 100%);color:#fff;
  font-weight:700;font-size:1.05rem;padding:15px 30px;border:0;overflow:hidden;
  background-clip:padding-box;box-shadow:0 12px 30px -10px rgba(37,211,102,.42)
}
.btn-wa:hover{background:linear-gradient(180deg,#31E377 0%,#1FC463 100%);transform:translateY(-2px)}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}

/* ---------- NAV ---------- */
.nav-wrap{position:relative;padding-inline:var(--gap);max-width:var(--maxw);margin:clamp(14px, 2vw, 24px) auto 0}
.nav{
  background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(18px);
  -webkit-backdrop-filter:saturate(180%) blur(18px);
  border-radius:999px;box-shadow:0 1px 2px rgba(16,16,18,.05),0 12px 30px -18px rgba(16,16,18,.28);
  display:flex;align-items:center;gap:26px;padding:9px 9px 9px 20px;
}
.nav.stuck{background:rgba(255,255,255,.94);box-shadow:0 1px 2px rgba(16,16,18,.06),0 18px 40px -20px rgba(16,16,18,.4)}
.mark{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.mark img{height:24px;width:auto;transition:transform .4s var(--ease)}
.mark:hover img{transform:rotate(-8deg) scale(1.08)}
.mark .nm{font-family:var(--display);font-weight:700;font-size:1rem;letter-spacing:-.032em;white-space:nowrap}
.mark .nm span{font-weight:500;color:var(--ink-2)}
.nav-links{display:flex;gap:24px;margin-left:6px}
.nav-links a{font-size:.92rem;font-weight:450;color:var(--ink-2);transition:color .18s;white-space:nowrap;position:relative}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1.5px;background:var(--ink);border-radius:2px;transition:right .28s var(--ease)}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{right:0}
.nav-end{margin-left:auto;display:flex;align-items:center;gap:8px}
.burger{display:none;margin-left:auto;width:42px;height:42px;border:0;background:var(--panel-soft);cursor:pointer;border-radius:50%;align-items:center;justify-content:center}
.burger i{display:block;width:17px;height:1.6px;background:var(--ink);border-radius:2px;position:relative;transition:background .2s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:17px;height:1.6px;background:var(--ink);border-radius:2px;transition:transform .25s var(--ease)}
.burger i::before{top:-5.5px}.burger i::after{top:5.5px}
.burger[aria-expanded="true"] i{background:transparent}
.burger[aria-expanded="true"] i::before{transform:translateY(5.5px) rotate(45deg)}
.burger[aria-expanded="true"] i::after{transform:translateY(-5.5px) rotate(-45deg)}
.drawer{display:none;margin-top:8px;background:#fff;border-radius:24px;padding:12px 20px 20px;box-shadow:var(--shadow)}
.drawer.open{display:block;animation:drawerIn .3s var(--ease)}
@keyframes drawerIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.drawer a{display:block;padding:13px 0;font-size:1.02rem;font-weight:500;border-bottom:1px solid var(--line-soft)}
.drawer .btn{margin-top:16px}
@media(max-width:1020px){.nav-links,.nav-end{display:none}.burger{display:flex}}

/* ---------- HERO ---------- */
.hero{text-align:center;padding-top:clamp(60px,7.5vw,105px);padding-bottom:clamp(30px,3.6vw,48px)}
.hero::before{
  content:"";position:absolute;left:50%;top:-42%;width:132%;height:112%;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(30,107,255,.13),rgba(56,198,255,.06) 58%,transparent 78%);
  pointer-events:none;animation:drift 22s ease-in-out infinite;
}
@keyframes drift{
  0%,100%{transform:translateX(-50%) translateY(0) scale(1)}
  50%{transform:translateX(-46%) translateY(3%) scale(1.09)}
}
.hero > *{position:relative}
.hero-badge{
  display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:6px 15px 6px 7px;font-size:.85rem;color:var(--ink-2);
  box-shadow:0 1px 2px rgba(16,16,18,.04);margin-bottom:26px;
}
.hero-badge img{height:19px;width:auto}
.hero-badge b{color:var(--ink);font-weight:600}
.hero h1{max-width:min(15ch,100%);margin-inline:auto}
.hero .lede{margin-inline:auto;max-width:min(50ch,100%);text-align:center}
.hero .btn-row{justify-content:center}
.btn:hover .go.down{transform:translateY(3px)}

.compat{margin-top:clamp(36px,4vw,52px);padding-top:clamp(24px,2.6vw,32px);border-top:1px solid var(--line-soft)}
.compat .t{font-size:.85rem;color:var(--ink-2);margin-bottom:18px}
.compat .row{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,3vw,40px);align-items:center}
/* logos de compatibilidade: dessaturados em repouso, cor no hover */
.compat .logo{
  height:clamp(24px,2.8vw,32px);width:auto;max-width:clamp(120px,15vw,170px);
  object-fit:contain;
  filter:grayscale(1);opacity:.5;
  transition:filter .35s var(--ease),opacity .35s var(--ease);
}
.compat .logo:hover{filter:grayscale(0);opacity:1}
.compat-note{margin-top:18px;font-size:.83rem;color:var(--ink-2)}

/* ---------- image slot ---------- */
.shot{
  position:relative;border-radius:var(--r-card);overflow:hidden;background:var(--panel-soft);
  transition:transform .5s var(--ease),box-shadow .5s;
}
.shot.big{margin-top:clamp(34px,4vw,52px);aspect-ratio:16/9;box-shadow:0 30px 70px -34px rgba(16,16,18,.4)}
.shot.wide{aspect-ratio:16/10}
/* NÃO renomear para .card: colide com o seletor .card e herda o padding dele */
.shot.inset{aspect-ratio:16/10;margin-top:2px}
.panel.night .shot{background:var(--dark-2)}
.shot image-slot{display:block;width:100%;height:100%;min-height:180px}
.js-rv .shot.rv{transform:translateY(26px) scale(.975)}
.js-rv .shot.rv.in{transform:none}
.shot-cap{
  margin-top:12px;font-size:.84rem;color:var(--ink-2);text-align:center;
}
.panel.night .shot-cap{color:var(--snow-2)}

/* ---------- recriação fiel da janela do NT8 Copier ----------
   Reproduz o AddOn real no Control Center do NinjaTrader.
   Feito em HTML para ficar nítido em qualquer densidade de tela. */
.appwin{
  border-radius:10px;overflow:hidden;background:#F0F0F0;
  border:1px solid #B9B9B9;box-shadow:0 24px 60px -30px rgba(16,16,18,.55);
  font-family:"Segoe UI",Tahoma,system-ui,sans-serif;color:#1F1F1F;
  container-type:inline-size;
}
.aw-bar{display:flex;align-items:stretch;background:#F0F0F0;border-bottom:1px solid #CFCFCF}
.aw-title{background:#E0491C;color:#fff;font-size:12px;font-weight:600;padding:6px 14px;letter-spacing:.01em}
.aw-btns{margin-left:auto;display:flex;align-items:center;gap:0}
.aw-btns i{width:30px;text-align:center;font-style:normal;font-size:11px;color:#333;line-height:1}
.aw-body{padding:14px}
.aw-group{border:1px solid #C9C9C9;background:#fff;border-radius:2px;padding:12px 14px 14px;margin-bottom:14px}
.aw-legend{font-size:11.5px;font-weight:600;color:#333;letter-spacing:.06em;margin-bottom:12px}
.aw-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.aw-lab{font-size:11.5px;color:#333;flex:0 0 auto}
.aw-field{
  flex:1 1 160px;min-width:0;background:#E9E9E9;border:1px solid #ABABAB;color:#6E6E6E;
  font-size:11.5px;padding:5px 9px;display:flex;align-items:center;justify-content:center;position:relative;
}
.aw-field.sel::after{content:"";position:absolute;right:8px;border:4px solid transparent;border-top-color:#555;margin-top:3px}
.aw-field.ok{border-color:#4CAF50;background:#fff}
.aw-ok{color:#2E9E4F;font-size:11.5px;font-weight:600;flex:0 0 auto}
/* a tabela rola dentro da janela em telas estreitas, em vez de perder colunas */
.aw-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.aw-tbl{width:100%;min-width:430px;border-collapse:collapse;font-size:11.5px}
.aw-tbl th{
  background:#F2F2F2;color:#333;font-weight:600;text-align:center;
  padding:6px 8px;border:1px solid #C6C6C6;white-space:nowrap;
}
.aw-tbl td{padding:7px 8px;border:1px solid #D4D4D4;text-align:center;color:#333;background:#fff}
.aw-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#22C55E}
.aw-chk{display:inline-block;width:12px;height:12px;border:1px solid #8A8A8A;background:#fff;position:relative;vertical-align:-2px}
.aw-chk.on::after{content:"";position:absolute;left:3px;top:.5px;width:3.5px;height:7px;border:solid #333;border-width:0 1.6px 1.6px 0;transform:rotate(42deg)}
.aw-empty{height:52px;background:#fff;border:1px solid #D4D4D4;border-top:0}
.aw-foot{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:2px 0}
.aw-on{background:#4CAF50;color:#fff;font-size:12.5px;font-weight:700;letter-spacing:.04em;padding:11px 30px;border-radius:2px}
.aw-stat{font-size:11.5px;font-weight:700;color:#2E9E4F;letter-spacing:.03em}
.aw-lic{margin-left:auto;font-size:11.5px;font-weight:700;color:#2E9E4F;letter-spacing:.03em}
.aw-conn{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:10px 12px;align-items:center}
.aw-conn .aw-full{grid-column:2/-1;min-width:0}
.aw-field.path{
  background:#fff;border-color:#ABABAB;color:#1F1F1F;display:block;text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.75;
}
.aw-btnrow{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.aw-btn{
  background:#E4E4E4;border:1px solid #B4B4B4;color:#8C8C8C;
  font-size:11.5px;font-weight:600;padding:7px 16px;letter-spacing:.03em;
}
@container (max-width:620px){
  .aw-lic{margin-left:0}
  .aw-conn{grid-template-columns:auto 1fr}
  .aw-conn .aw-full{grid-column:1/-1}
  .aw-conn .aw-lab.aw-full{grid-column:1/-1;margin-top:4px}
  .aw-foot{gap:10px}
  .aw-on{padding:10px 22px}
}

/* ---------- recriação do painel do EA no gráfico do MT5 ---------- */
.mt5win{
  border-radius:10px;overflow:hidden;border:1px solid #B9B9B9;
  box-shadow:0 24px 60px -30px rgba(16,16,18,.55);
  font-family:"Segoe UI",Tahoma,system-ui,sans-serif;
}
.m5-bar{
  display:flex;align-items:center;gap:10px;background:#F0F0F0;border-bottom:1px solid #C9C9C9;
  padding:5px 10px;font-size:11px;color:#1F1F1F;
}
.m5-tt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.m5-ea{margin-left:auto;display:flex;align-items:center;gap:6px;white-space:nowrap;color:#333}
.m5-ea i{font-style:normal;color:#2E9E4F;font-size:12px}
.m5-chart{position:relative;background:#000;aspect-ratio:16/5;min-height:210px;overflow:hidden}
.m5-chart svg{position:absolute;inset:0;width:100%;height:100%}
.m5-panel{
  position:absolute;left:5%;top:12%;background:rgba(24,24,24,.94);
  border:1px solid #2E2E2E;padding:14px 20px;min-width:min(300px,72%);
}
.m5-row{display:grid;grid-template-columns:1fr auto;gap:26px;padding:5px 0;font-size:12px;align-items:baseline}
.m5-row span{color:#C8C8C8}
.m5-row b{font-weight:600;text-align:right}
.m5-blue{color:#4A9EFF}
.m5-green{color:#22C55E}
.m5-white{color:#F0F0F0}
@media(max-width:560px){
  .m5-panel{left:4%;right:4%;top:10%;min-width:0;padding:11px 14px}
  .m5-row{gap:14px;font-size:11.5px}
}

/* ---------- tiles de número ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--gap);margin-top:clamp(34px,4vw,48px)}
.stat{background:var(--panel-soft);border-radius:var(--r-card);padding:clamp(22px,2.4vw,30px);transition:transform .4s var(--ease)}
.stat:hover{transform:translateY(-4px)}
.stat.dk{background:var(--dark);color:#fff}
.stat .n{
  font-family:var(--display);font-weight:600;font-size:clamp(1.15rem,1.6vw,1.4rem);
  letter-spacing:-.024em;line-height:1.25;margin-bottom:8px;
}
.stat.dk .n{color:#fff}
.stat .d{font-size:.93rem;line-height:1.5;color:var(--ink-2)}
.stat.dk .d{color:var(--snow-2)}
.stat .tagdot{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;color:var(--snow-2);margin-bottom:14px}
.stat .tagdot i{width:6px;height:6px;border-radius:50%;background:var(--long);animation:pulse 2.6s ease-in-out infinite}
@media(max-width:880px){.stats{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.stats{grid-template-columns:1fr}}

/* ---------- split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,64px);align-items:center}
.split.a-start{align-items:start}
@media(max-width:900px){.split{grid-template-columns:1fr;gap:34px}}

/* ---------- cards ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
@media(max-width:880px){.duo{grid-template-columns:1fr}}
.card{
  background:var(--panel-soft);border-radius:var(--r-card);
  padding:clamp(26px,2.8vw,36px);display:flex;flex-direction:column;gap:16px;
  transition:transform .4s var(--ease),box-shadow .4s;
}
.card.lift:hover{transform:translateY(-5px);box-shadow:0 24px 50px -28px rgba(16,16,18,.4)}
.card.dk{background:var(--dark);color:#fff}
.card.dk .body{color:var(--snow-2)}
.card.dk .body b{color:#fff}
.card.lav{background:var(--panel-lav)}
.card.blue{background:var(--panel-blue)}
.ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--brand);color:#fff;flex:0 0 auto;transition:transform .4s var(--ease)}
.card:hover .ico{transform:scale(1.08) rotate(-5deg)}
.ico svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ico.cy{background:var(--brand-2)}
.ico.sk{background:var(--sky)}
.ico.dk{background:var(--ink)}
.ico.soft{background:#fff;color:var(--brand)}
.card.dk .ico.soft{background:rgba(255,255,255,.1);color:#fff}
.panel.night .card{background:rgba(255,255,255,0.04);color:#fff}
.panel.night .card .h-card{color:#fff}
.panel.night .card .body{color:var(--snow-2)}
.panel.night .card .ico.soft{background:rgba(255,255,255,.1);color:#fff}
.panel.night .card.lav,.panel.night .card.blue{background:rgba(255,255,255,0.04)}

.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:6px}
.tags span{font-size:.83rem;font-weight:450;color:var(--ink-2);background:#fff;border-radius:999px;padding:8px 14px}
.card.dk .tags span{background:rgba(255,255,255,.1);color:#fff}
.card.lav .tags span,.card.blue .tags span{background:rgba(255,255,255,.75)}

/* ---------- fluxo de contas ---------- */
.flow{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap}
.acct{flex:1 1 190px;background:#fff;border-radius:18px;padding:18px 20px;display:flex;flex-direction:column;gap:5px;min-width:0}
.card.dk .acct,.panel.night .acct{background:var(--dark-2)}
.acct .k{font-size:.8rem;color:var(--ink-2)}
.acct .v{font-family:var(--display);font-weight:600;font-size:1.04rem;letter-spacing:-.026em;color:var(--ink)}
.panel.night .acct .v,.card.dk .acct .v{color:#fff}
.panel.night .acct .k,.card.dk .acct .k{color:#9B9CA6}
.acct .m{font-size:.85rem;color:var(--ink-2);margin-top:2px}
.panel.night .acct .m,.card.dk .acct .m{color:var(--snow-2)}
.acct.hi{background:var(--brand);color:#fff}
.acct.hi .k{color:rgba(255,255,255,.75)}
.acct.hi .v,.acct.hi .m{color:#fff}
.arw{flex:0 0 auto;align-self:center;width:26px;height:26px;border-radius:50%;background:var(--panel-soft);display:grid;place-items:center;color:var(--ink-2)}
.panel.night .arw,.card.dk .arw{background:rgba(255,255,255,.1);color:var(--snow-2)}
.arw svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;animation:nudge 2.4s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(2.5px)}}
.side{display:flex;flex-direction:column;gap:10px;flex:1 1 190px}
@media(max-width:560px){
  .flow:not([style*="flex-direction:column"]){flex-wrap:wrap}
  .flow:not([style*="flex-direction:column"]) .acct{flex:1 1 100%}
  .flow:not([style*="flex-direction:column"]) .arw{transform:rotate(90deg);align-self:center;margin-block:2px}
}

.sidepill{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:6px 13px;font-size:.83rem;font-weight:600;width:fit-content}
.sidepill.buy{background:rgba(0,168,107,.12);color:var(--long)}
.sidepill.sell{background:rgba(240,68,82,.12);color:var(--short)}
.panel.night .sidepill.buy,.card.dk .sidepill.buy{background:rgba(0,168,107,.18);color:#3DD9A0}
.panel.night .sidepill.sell,.card.dk .sidepill.sell{background:rgba(240,68,82,.18);color:#FF8A94}

/* ---------- motor ---------- */
#motor .mt5win,#motor .shot-cap{display:none}
#motor .pain-card{
  background:color-mix(in srgb,var(--short) 5%,var(--panel-soft));
  border:1px solid color-mix(in srgb,var(--short) 18%,transparent)
}
#motor .pain-card:hover{
  border-color:color-mix(in srgb,var(--short) 34%,transparent);
  box-shadow:0 24px 50px -30px rgba(240,68,82,.38)
}
#motor .pain-card .ico{background:var(--short);box-shadow:0 10px 24px -14px rgba(240,68,82,.8)}
#motor .pain-card .h-card{max-width:25ch}
#motor .risk-impact{
  display:flex;align-items:flex-start;gap:9px;margin-top:auto;
  background:rgba(240,68,82,.09);border-radius:12px;padding:11px 13px;
  color:#A52D39;font-size:.82rem;font-weight:600;line-height:1.42
}
#motor .risk-impact::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--short);
  box-shadow:0 0 0 4px rgba(240,68,82,.1);margin-top:.35em;flex:0 0 auto
}
#motor .solution-verdict{background:var(--brand);color:#fff;border-color:transparent}
#motor .solution-verdict .ico{background:rgba(255,255,255,.16);color:#fff}
#motor .solution-verdict .h-card{color:#fff;font-size:clamp(1.2rem,1.7vw,1.5rem)}
#motor .solution-verdict .body{color:rgba(255,255,255,.8)}
#motor .solution-label{
  width:fit-content;background:rgba(255,255,255,.14);border-radius:999px;padding:6px 10px;
  color:#fff;font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase
}

/* ---------- grades ---------- */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
@media(max-width:940px){.grid3{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.grid3{grid-template-columns:1fr}}
.grid3 .card{gap:13px}

.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--gap)}
@media(max-width:960px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.steps{grid-template-columns:1fr}}
.step{background:var(--dark-2);border-radius:var(--r-card);padding:clamp(22px,2.3vw,28px);display:flex;flex-direction:column;gap:9px;transition:transform .4s var(--ease)}
.step:hover{transform:translateY(-4px)}
.step .n{width:30px;height:30px;border-radius:10px;background:rgba(255,255,255,.09);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:.88rem;color:#fff;margin-bottom:6px}
.step p{font-size:.92rem;line-height:1.55;color:var(--snow-2)}
.setup-visuals{display:grid;gap:clamp(18px,2.2vw,26px);margin-top:clamp(30px,3.6vw,44px)}
.setup-figure{margin:0}
.setup-frame{
  overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:var(--r-card);
  box-shadow:0 26px 60px -34px rgba(0,0,0,.72)
}
.setup-frame img{display:block;width:100%;height:auto}
.setup-terminal .setup-frame{background:#000}
.setup-copier .setup-frame{background:#E7E8EA}
.setup-figure figcaption{margin-top:10px;text-align:center;font-size:.82rem;color:var(--snow-2)}

/* ---------- specs ---------- */
.specs{border-radius:var(--r-card);overflow:hidden;background:var(--panel-soft)}
.srow{display:grid;grid-template-columns:280px 1fr;border-top:1px solid #E9E9EC}
.srow:first-child{border-top:0}
.srow .k{padding:17px 24px;font-size:.92rem;font-weight:500;color:var(--ink-2)}
.srow .v{padding:17px 24px;font-size:.96rem;color:var(--ink-2);line-height:1.55;background:#fff}
.srow .v b{color:var(--ink);font-weight:600}
@media(max-width:680px){.srow{grid-template-columns:1fr}.srow .k{padding-bottom:4px}.srow .v{padding-top:8px}}

/* ---------- oferta ---------- */
.offer{display:grid;grid-template-columns:1.02fr .98fr;gap:var(--gap);align-items:stretch}
@media(max-width:900px){.offer{grid-template-columns:1fr}}

.vstack{background:var(--dark-2);border-radius:var(--r-card);padding:clamp(24px,2.8vw,34px);display:flex;flex-direction:column}
.vrow{display:grid;grid-template-columns:1fr auto;gap:18px;padding:17px 0;border-top:1px solid rgba(255,255,255,.09);align-items:start}
.vrow:first-of-type{border-top:0;padding-top:0}
.vrow .vt{font-size:.99rem;color:#fff;font-weight:500;line-height:1.4}
.vrow .vs{font-size:.87rem;color:var(--snow-2);margin-top:5px;line-height:1.5}
.vrow .vp{font-family:var(--display);font-weight:600;font-size:1.06rem;color:#fff;white-space:nowrap;letter-spacing:-.02em}
.vrow.sum .vt,.vrow.sum .vp{color:var(--snow-2)}
.vrow.sum .vp{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:#FF8A94}

.pricebox{background:linear-gradient(158deg,#2E9BFF 0%,#1E6BFF 48%,#1247D6 100%);border-radius:var(--r-card);padding:clamp(26px,3vw,38px);display:flex;flex-direction:column;color:#fff}
.pricebox .pk{font-size:.87rem;color:rgba(255,255,255,.82)}
.price{font-family:var(--display);font-weight:600;font-size:clamp(2.7rem,5.8vw,4.1rem);letter-spacing:-.046em;line-height:1;margin:12px 0 6px}
.price small{font-size:.4em;font-weight:600;letter-spacing:-.02em;vertical-align:.42em;margin-right:.1em}
.price-usd{font-size:1.02rem;color:rgba(255,255,255,.88)}
.parcel{margin-top:16px;background:rgba(255,255,255,.17);border-radius:14px;padding:13px 17px;font-size:.94rem;line-height:1.5}
.parcel b{font-weight:600}
.incl{display:flex;flex-direction:column;gap:11px;margin-top:20px}
.incl li{position:relative;padding-left:26px;font-size:.94rem;line-height:1.5;color:rgba(255,255,255,.93)}
.incl li::before{content:"";position:absolute;left:0;top:3px;width:17px;height:17px;border-radius:50%;background:rgba(255,255,255,.24)}
.incl li::after{content:"";position:absolute;left:5.6px;top:7px;width:4px;height:7.5px;border:solid #fff;border-width:0 1.9px 1.9px 0;transform:rotate(42deg)}
.pricebox .foot{margin-top:auto;padding-top:24px}

/* escopo da licença, precisa ficar sem ambiguidade */
.scope{margin-top:var(--gap);background:var(--panel-blue);border-radius:var(--r-card);padding:clamp(22px,2.6vw,30px);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.scope .ic{width:34px;height:34px;border-radius:11px;background:var(--brand);display:grid;place-items:center;color:#fff}
.scope .ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.scope p{font-size:.96rem;line-height:1.62;color:var(--ink-2)}
.scope p b{color:var(--ink);font-weight:600}
@media(max-width:600px){.scope{grid-template-columns:1fr}}

/* upsell PRO */
.pro{margin-top:var(--gap);background:var(--dark);border-radius:var(--r-card);padding:clamp(26px,3vw,38px);color:#fff;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(24px,3.4vw,48px);align-items:center}
@media(max-width:820px){.pro{grid-template-columns:1fr;gap:26px}}
.pro h3{color:#fff}
.pro .body{color:var(--snow-2)}
.pro .body b{color:#fff}
.pro-tag{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border-radius:999px;padding:7px 14px;font-size:.85rem;color:#fff;margin-bottom:16px;font-weight:600}
.pro .feat{display:flex;flex-direction:column;gap:11px}
.pro .feat li{position:relative;padding-left:26px;font-size:.95rem;line-height:1.5;color:var(--snow-2)}
.pro .feat li b{color:#fff;font-weight:600}
.pro .feat li::before{content:"";position:absolute;left:0;top:3px;width:17px;height:17px;border-radius:50%;background:rgba(56,198,255,.2)}
.pro .feat li::after{content:"";position:absolute;left:5.6px;top:7px;width:4px;height:7.5px;border:solid var(--brand-2);border-width:0 1.9px 1.9px 0;transform:rotate(42deg)}
.pro .feat li.no-mark{padding-left:0;margin-top:8px}
.pro .feat li.no-mark::before,.pro .feat li.no-mark::after{display:none}

/* ---------- oferta, palco comercial ---------- */
.offer-stage{
  background:radial-gradient(720px 420px at 50% -8%,rgba(30,107,255,.18),transparent 62%),#08080A;
  color:var(--snow)
}
.offer-stage .offer-head{max-width:820px;margin:0 auto clamp(38px,5vw,62px);text-align:center}
.offer-stage .offer-head .label{
  margin-inline:auto;background:rgba(30,107,255,.14);border:1px solid rgba(56,198,255,.18);color:#9BC7FF
}
.offer-stage .offer-head .lede{max-width:62ch;margin-inline:auto;color:var(--snow-2)}
.offer-pitch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.offer-pitch-card{
  min-width:0;min-height:250px;background:#15161A;border:1px solid rgba(255,255,255,.09);
  border-radius:var(--r-card);padding:clamp(24px,2.7vw,34px);display:flex;flex-direction:column;
  transition:transform .4s var(--ease),border-color .4s,box-shadow .4s
}
.offer-pitch-card:hover{transform:translateY(-5px);border-color:rgba(56,198,255,.3);box-shadow:0 26px 54px -34px rgba(30,107,255,.65)}
.pitch-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:clamp(24px,3vw,34px)}
.pitch-number{
  width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--brand);
  color:#fff;font-family:var(--display);font-size:.82rem;font-weight:600
}
.pitch-kicker{font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8FB8FF;text-align:right}
.offer-pitch-card .h-card{color:#fff;font-size:clamp(1.22rem,1.8vw,1.55rem);line-height:1.16;max-width:18ch}
.offer-pitch-card .body{margin-top:13px;color:var(--snow-2);font-size:.94rem;line-height:1.58}
.pitch-result{
  width:fit-content;margin-top:auto;padding-top:24px;color:#fff;font-size:.79rem;font-weight:600;
  letter-spacing:.02em
}
.pitch-result span{display:inline-flex;background:rgba(30,107,255,.16);border:1px solid rgba(56,198,255,.18);border-radius:999px;padding:8px 12px}
.offer-reveal{max-width:760px;margin:clamp(48px,6vw,76px) auto 28px;text-align:center}
.offer-reveal .eyebrow{
  display:inline-flex;background:rgba(255,255,255,.08);border-radius:999px;padding:7px 13px;
  color:#9BC7FF;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase
}
.offer-reveal h3{margin-top:16px;color:#fff;font-size:clamp(1.55rem,3vw,2.35rem)}
.offer-reveal p{margin:12px auto 0;max-width:54ch;color:var(--snow-2);font-size:1rem;line-height:1.6}
.offer-stage .vstack{border:1px solid rgba(255,255,255,.08)}
.offer-stage .pricebox{border:1px solid rgba(255,255,255,.14);box-shadow:0 28px 64px -36px rgba(30,107,255,.8)}
.offer-stage .saving{
  width:fit-content;margin-bottom:18px;background:rgba(255,255,255,.16);border-radius:999px;
  padding:7px 12px;color:#fff;font-size:.76rem;font-weight:700;letter-spacing:.04em
}
.offer-stage .pricebox .btn-snow{min-height:50px}
.offer-stage .price-micro{margin-top:10px;text-align:center;color:rgba(255,255,255,.7);font-size:.78rem}
.offer-stage .scope{background:rgba(30,107,255,.1);border:1px solid rgba(56,198,255,.14)}
.offer-stage .scope p{color:var(--snow-2)}
.offer-stage .scope p b{color:#fff}
.offer-stage .pro{background:#15161A;border:1px solid rgba(255,255,255,.09)}
.offer-stage .pro-tag{background:rgba(30,107,255,.16);color:#9BC7FF}
.offer-stage .pro .btn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}
.offer-stage .pro .btn:hover{background:rgba(255,255,255,.14)}
@media(max-width:900px){.offer-pitch-grid{grid-template-columns:1fr}.offer-pitch-card{min-height:0}}
.offer-card-grid{display:grid;grid-template-columns:.9fr .9fr 1.2fr;gap:var(--gap);align-items:stretch}
.module-offer-card,.bundle-offer-card{
  min-width:0;border-radius:var(--r-card);padding:clamp(24px,2.7vw,34px);display:flex;flex-direction:column
}
.module-offer-card{background:#15161A;border:1px solid rgba(255,255,255,.09)}
.module-offer-card:hover{border-color:rgba(255,255,255,.18)}
.offer-type{
  width:fit-content;background:rgba(255,255,255,.07);border-radius:999px;padding:6px 10px;
  color:var(--snow-2);font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase
}
.module-offer-card .h-card{margin-top:20px;color:#fff;line-height:1.18}
.module-offer-card .body{margin-top:12px;color:var(--snow-2);font-size:.9rem;line-height:1.55}
.module-price{margin-top:clamp(26px,3vw,40px);font-family:var(--display);font-size:clamp(2rem,3.4vw,2.8rem);font-weight:600;line-height:1;color:#fff;letter-spacing:-.04em}
.module-price small{font-size:.42em;vertical-align:.38em;margin-right:3px}
.module-feat{display:flex;flex-direction:column;gap:9px;margin-top:22px}
.module-feat li{position:relative;padding-left:16px;color:var(--snow-2);font-size:.84rem;line-height:1.45}
.module-feat li::before{content:"";position:absolute;left:0;top:.55em;width:5px;height:5px;border-radius:50%;background:#6F89B8}
.bundle-offer-card{
  background:linear-gradient(158deg,#2E9BFF 0%,#1E6BFF 48%,#1247D6 100%);color:#fff;
  border:1px solid rgba(255,255,255,.16);box-shadow:0 28px 64px -36px rgba(30,107,255,.85);
  transform:translateY(-10px)
}
.bundle-label{
  width:fit-content;background:rgba(255,255,255,.17);border-radius:999px;padding:7px 11px;
  color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase
}
.bundle-offer-card .h-card{margin-top:18px;color:#fff;font-size:clamp(1.35rem,2vw,1.7rem)}
.bundle-price{margin-top:16px;font-family:var(--display);font-size:clamp(3.1rem,6vw,4.7rem);font-weight:600;line-height:.95;letter-spacing:-.05em}
.bundle-price small{font-size:.36em;vertical-align:.46em;margin-right:4px}
.bundle-usd{margin-top:7px;color:rgba(255,255,255,.82);font-size:.94rem}
.bundle-saving{margin-top:16px;background:rgba(255,255,255,.17);border-radius:12px;padding:11px 13px;font-size:.86rem;font-weight:600}
.bundle-feat{display:flex;flex-direction:column;gap:9px;margin-top:18px}
.bundle-feat li{position:relative;padding-left:22px;color:rgba(255,255,255,.92);font-size:.86rem;line-height:1.45}
.bundle-feat li::before{content:"✓";position:absolute;left:0;top:0;color:#fff;font-weight:700}
.bundle-offer-card .foot{margin-top:auto;padding-top:22px}
.bundle-offer-card .btn-snow{min-height:50px}
.bundle-micro{margin-top:10px;text-align:center;color:rgba(255,255,255,.72);font-size:.75rem;line-height:1.45}
@media(max-width:920px){
  .offer-card-grid{grid-template-columns:1fr}
  .bundle-offer-card{order:-1;transform:none}
}

/* ---------- planos ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap);align-items:stretch}
@media(max-width:920px){.plans{grid-template-columns:1fr}}
.plan{background:var(--panel-soft);border-radius:var(--r-card);padding:clamp(26px,2.8vw,34px);display:flex;flex-direction:column;gap:13px;position:relative;transition:transform .4s var(--ease),box-shadow .4s}
.plan:hover{transform:translateY(-5px);box-shadow:0 24px 50px -28px rgba(16,16,18,.34)}
.plan.dk{background:var(--dark);color:#fff}
.plan.dk .body{color:var(--snow-2)}
.plan .kk{font-size:.85rem;color:var(--ink-2)}
.plan.dk .kk{color:var(--snow-2)}
.plan .feat{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.plan .feat li{position:relative;padding-left:20px;font-size:.93rem;line-height:1.5;color:var(--ink-2)}
.plan .feat li::before{content:"";position:absolute;left:2px;top:8px;width:5px;height:5px;border-radius:50%;background:var(--brand)}
.plan.dk .feat li{color:var(--snow-2)}
.plan.dk .feat li::before{background:#fff}
.plan .foot{margin-top:auto;padding-top:24px}
.plan .rib{position:absolute;top:clamp(26px,2.8vw,34px);right:clamp(26px,2.8vw,34px);font-size:.78rem;font-weight:600;background:#fff;color:var(--ink);border-radius:999px;padding:6px 12px}

/* ---------- FAQ ---------- */
.faq{width:100%}
.qa{border-bottom:1px solid var(--line)}
.qa:first-child{border-top:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;padding:23px 46px 23px 0;position:relative;font-family:var(--display);font-weight:600;font-size:1.05rem;letter-spacing:-.026em;transition:color .2s}
.qa summary:hover{color:var(--brand)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after,.qa summary::before{content:"";position:absolute;right:10px;top:50%;background:var(--ink);border-radius:2px;transition:transform .3s var(--ease),opacity .22s}
.qa summary::after{width:13px;height:1.7px;margin-top:-.85px}
.qa summary::before{width:1.7px;height:13px;margin-top:-6.5px;right:15.65px}
.qa[open] summary::after{transform:rotate(180deg)}
.qa[open] summary::before{transform:rotate(90deg);opacity:0}
.qa .a{padding:0 46px 25px 0;font-size:.99rem;line-height:1.65;color:var(--ink-2)}
.qa[open] .a{animation:faqIn .36s var(--ease)}
@keyframes faqIn{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:none}}
.qa .a b{color:var(--ink);font-weight:600}
.qa .a p + p{margin-top:12px}

/* ---------- nota ---------- */
.note{margin-top:clamp(30px,3.4vw,42px);background:var(--dark-2);border-radius:var(--r-card);padding:clamp(22px,2.6vw,30px);display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start}
.note .ic{width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.09);display:grid;place-items:center;color:#fff}
.note .ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.note p{font-size:.94rem;line-height:1.65;color:var(--snow-2)}
.note p b{color:#fff;font-weight:600}
@media(max-width:600px){.note{grid-template-columns:1fr}}

/* ---------- CTA ---------- */
.cta{text-align:center}
.cta::before{content:"";position:absolute;left:50%;top:-50%;width:120%;height:130%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(30,107,255,.24),transparent 72%);pointer-events:none;animation:drift 22s ease-in-out infinite}
.cta > *{position:relative}
.cta h2{max-width:16ch;margin-inline:auto}
.cta .lede{margin-inline:auto;text-align:center}
.cta .btn-row{justify-content:center}
.assure{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:30px}
.assure span{font-size:.88rem;color:var(--snow-2);background:rgba(255,255,255,.07);border-radius:999px;padding:9px 16px}

/* ---------- footer ---------- */
.foot{background:transparent;box-shadow:none;padding-top:clamp(30px,3.4vw,42px)}
.foot-grid{display:grid;grid-template-columns:2.2fr 1fr 1fr 1fr;gap:clamp(26px,4vw,44px)}
.foot-about{margin-top:18px;font-size:.92rem;line-height:1.65;color:var(--ink-2);max-width:42ch}
.foot-col h5{font-family:var(--display);font-size:.92rem;font-weight:600;letter-spacing:-.02em;margin:0 0 14px}
.foot-col a{display:block;padding:6px 0;font-size:.93rem;color:var(--ink-2);transition:color .18s,transform .18s}
.foot-col a:hover{color:var(--ink);transform:translateX(3px)}
@media(max-width:820px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media(max-width:480px){.foot-grid{grid-template-columns:1fr}}
.risk{margin-top:clamp(30px,3.4vw,42px);padding-top:24px;border-top:1px solid #DEDEDC;font-size:.82rem;line-height:1.68;color:var(--ink-2)}
.risk b{color:var(--ink)}
.legal{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:22px var(--gap) 30px;font-size:.83rem;color:var(--ink-2);max-width:var(--maxw);margin:0 auto}

/* ---------- reveal ----------
   O estado oculto só existe com .js-rv no <html>, adicionado por script.
   Sem JS, com erro ou com movimento reduzido, tudo nasce visível. */
.js-rv .rv{opacity:0;transform:translateY(18px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
.js-rv .rv.in{opacity:1;transform:none}
.js-rv .d1{transition-delay:.06s}
.js-rv .d2{transition-delay:.12s}
.js-rv .d3{transition-delay:.18s}
/* ==========================================================
   WEALTHIER OS HERO COMPONENT STYLES
   ========================================================== */
.wealthier-win {
  border-radius: 18px;
  overflow: hidden;
  background: #0E0E10;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 24px 70px -18px rgba(0, 0, 0, 0.85);
  margin-top: 24px;
  position: relative;
}
.w-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #15161A;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding: 10px 18px;
  position: relative;
}
.w-dots { display: flex; align-items: center; gap: 7px; }
.w-dots .dot { width: 11px; height: 11px; border-radius: 50%; display: inline-block; }
.w-dots .dot.red { background: #FF5F56; border: 0.5px solid #E0443E; }
.w-dots .dot.yellow { background: #FFBD2E; border: 0.5px solid #DEA123; }
.w-dots .dot.green { background: #27C93F; border: 0.5px solid #1AAB29; }

.w-title {
  display: flex; align-items: center; gap: 8px;
  font-family: var(--display); font-size: 0.85rem; font-weight: 600; color: #fff;
}
.w-title img { height: 16px; width: auto; }

.w-mode-switcher {
  position: absolute; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 4px;
  background: rgba(0,0,0,0.45); border: 1px solid rgba(255,255,255,0.12);
  padding: 3px; border-radius: 999px;
}
.w-mode-btn {
  display: inline-flex; align-items: center; gap: 5px;
  background: transparent; border: none; color: var(--snow-2);
  padding: 4px 10px; border-radius: 999px; cursor: pointer;
  transition: all 0.3s var(--ease);
}
.btn-logo {
  width: 15px; height: 15px; object-fit: contain; border-radius: 2px; flex-shrink: 0;
}
.btn-arrow {
  font-size: 10px; color: rgba(255,255,255,0.5); line-height: 1;
}
.w-mode-btn.active .btn-arrow { color: rgba(255,255,255,0.9); }
.w-mode-btn:hover { color: #fff; }
.w-mode-btn.active {
  background: var(--brand); color: #fff;
  box-shadow: 0 2px 10px rgba(30, 107, 255, 0.4);
}

.w-right { margin-left: auto; flex-shrink: 0; }
.w-pill {
  font-size: 0.75rem; font-weight: 600; color: var(--brand-2);
  background: rgba(30, 107, 255, 0.15); border: 1px solid rgba(56, 198, 255, 0.25);
  padding: 4px 11px; border-radius: 999px; display: flex; align-items: center; gap: 6px;
}
.w-pill i.live-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--brand-2); animation: pulse 1.8s infinite;
}

.w-body { padding: 20px; background: #0E0E10; position: relative; }
.w-topbar {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  background: #16171D; border: 1px solid rgba(255, 255, 255, 0.07); border-radius: 10px;
  padding: 9px 14px; margin-bottom: 18px; font-family: var(--font); font-size: .8rem; flex-wrap: wrap;
}
.w-topbar .metric { display: flex; align-items: center; gap: 6px; color: var(--snow-2); }
.w-topbar .metric b { color: #fff; font-weight: 600; }

.w-stage {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 32px; padding: 14px 0;
}
.w-svg-layer { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }

.acct {
  position: relative; z-index: 2; width: 220px; flex: 0 0 auto;
  background: var(--dark-2); border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px;
  transition: transform 0.4s var(--ease), border-color 0.4s, box-shadow 0.4s;
  font-family: var(--font); height: auto !important; align-self: center; text-align: left;
}
.acct-hdr { display: flex; align-items: center; gap: 7px; margin-bottom: 2px; }
.card-logo { width: 18px; height: 18px; flex-shrink: 0; object-fit: contain; border-radius: 3px; }

.acct .k { font-size: .7rem; color: #9B9CA6; font-weight: 600; letter-spacing: 0.05em; }
.acct .v { font-family: var(--display); font-weight: 600; font-size: 0.95rem; letter-spacing: -.024em; color: #fff; line-height: 1.2; }
.acct .m { font-size: .77rem; color: var(--snow-2); margin-top: 1px; }

.acct.hi { background: var(--brand); border-color: var(--sky); }
.acct.hi .k { color: rgba(255, 255, 255, .78); }
.acct.hi .v, .acct.hi .m { color: #fff; }

.pill-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.sidepill {
  display: inline-flex; align-items: center; gap: 4px; border-radius: 999px;
  padding: 2.5px 8px; font-size: .72rem; font-weight: 600; width: fit-content; transition: background 0.3s, color 0.3s;
}
.sidepill.buy { background: rgba(0, 168, 107, .18); color: #3DD9A0; }
.sidepill.sell { background: rgba(240, 68, 82, .18); color: #FF8A94; }
.sidepill.cross { background: rgba(56, 198, 255, .18); color: var(--brand-2); }
.acct.hi .sidepill { background: rgba(255, 255, 255, .2); color: #fff; }

.side-stack {
  position: relative; z-index: 2; display: flex; flex-direction: column; gap: 12px;
  width: 250px; flex: 0 0 auto; justify-content: center; align-self: center;
}
.side-stack .acct { width: 100%; flex: 0 0 auto; }

.acct.active-trigger { transform: translateY(-2px) scale(1.02); border-color: var(--brand-2) !important; box-shadow: 0 0 20px rgba(56, 198, 255, 0.4); }
.acct.active-executed-buy { transform: translateY(-2px) scale(1.02); border-color: var(--long) !important; box-shadow: 0 0 20px rgba(0, 168, 107, 0.4); }
.acct.active-executed-cross { transform: translateY(-2px) scale(1.02); border-color: var(--brand-2) !important; box-shadow: 0 0 24px rgba(56, 198, 255, 0.5); }
.acct.active-executed-sell { transform: translateY(-2px) scale(1.02); border-color: var(--short) !important; box-shadow: 0 0 20px rgba(240, 68, 82, 0.4); }

.w-foot {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: #15161A; border-top: 1px solid rgba(255, 255, 255, 0.08); padding: 10px 18px; border-radius: 0 0 16px 16px; font-family: var(--font); font-size: 0.78rem;
}
.w-on { background: #00A86B; color: #fff; font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 4px 14px; border-radius: 999px; }
.w-stat { font-size: 11.5px; font-weight: 600; color: var(--snow-2); }
.w-stat b { color: #fff; }

.w-ticker {
  background: #14151A; border-radius: 6px; border: 1px solid rgba(255,255,255,0.06); padding: 6px 12px; margin-top: 12px; font-family: monospace; font-size: 11px; color: #38C6FF; display: flex; align-items: center; gap: 8px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left;
}
.w-ticker span { color: #8A8A93; flex-shrink: 0; }
#hero-ticker-text { overflow: hidden; text-overflow: ellipsis; }

/* Stage Flow Grid Desktop */
.stage-flow-grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 16px;
  align-items: center;
}

@media (max-width: 880px) {
  .w-body { padding: 12px 10px; }
  .w-bar { padding: 10px 12px; position: relative; justify-content: space-between; }
  .w-mode-switcher {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-top: 0 !important;
    width: auto !important;
    justify-content: center !important;
  }
  .w-mode-btn {
    padding: 4px 10px !important;
    font-size: 0.78rem !important;
  }
  .w-right { display: none; }
  .w-topbar { flex-direction: column; align-items: flex-start; gap: 4px; padding: 8px 10px; }
  .w-stage { flex-direction: column; align-items: stretch; min-height: auto; gap: 28px !important; padding: 10px 0 !important; }
  .acct { width: 100% !important; flex: 1 1 100% !important; padding: 10px 12px !important; }
  .side-stack { width: 100% !important; display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; gap: 6px !important; }
  .side-stack .acct { padding: 8px 6px !important; text-align: center !important; align-items: center !important; }
  .side-stack .acct .k { font-size: 0.6rem !important; white-space: nowrap !important; text-overflow: ellipsis !important; overflow: hidden !important; max-width: 100% !important; }
  .side-stack .acct .v { font-size: 0.76rem !important; margin-block: 2px !important; }
  .side-stack .acct .m { font-size: 0.68rem !important; line-height: 1.2 !important; }
  .side-stack .acct .sidepill.cross { display: none !important; }
  .side-stack .acct .sidepill { font-size: 0.62rem !important; padding: 2px 6px !important; }
  .w-svg-layer { display: block !important; position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
  .w-foot { gap: 8px; padding: 10px 12px; }
}

@keyframes mobilePulse {
  0%, 100% { opacity: 0.4; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(3px); color: #3DD9A0; }
}

/* ==========================================================
   MOBILE EXCELLENCE & RESPONSIVE REFINEMENT (<= 768px)
   ========================================================== */
@media (max-width: 768px) {
  :root {
    --gap: 16px;
    --r-card: 18px;
  }

  body {
    font-size: 15px;
  }

  .shell {
    padding-inline: 14px;
  }

  /* Header & Navigation Mobile */
  .nav-wrap {
    margin-top: 10px;
    padding-inline: 12px;
  }
  .nav {
    padding: 8px 12px !important;
  }
  .mark .nm {
    font-size: 0.88rem;
  }
  .mark img {
    height: 20px;
  }
  .nav-end .btn {
    padding: 8px 14px !important;
    font-size: 0.78rem !important;
  }

  /* Hero Section Mobile */
  .panel.hero {
    padding-top: clamp(48px, 10vw, 68px) !important;
  }
  .hero .h-hero {
    font-size: clamp(1.95rem, 8.5vw, 2.6rem) !important;
    letter-spacing: -0.04em !important;
    line-height: 1.1 !important;
    text-align: center !important;
  }
  .hero .lede {
    font-size: 0.98rem !important;
    line-height: 1.55 !important;
    text-align: center !important;
    margin-inline: auto !important;
  }
  .hero .btn-row {
    justify-content: center !important;
  }

  /* Cards & Grids Mobile Stacking */
  .grid2, .grid3, .grid4, .plans, .offer-pitch-grid, .offer-card-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .card, .panel, .article {
    padding: 20px 18px !important;
    border-radius: 16px !important;
  }

  /* Motor & Pain Cards */
  .pain-card {
    padding: 20px 18px !important;
  }
  .risk-impact {
    font-size: 0.78rem !important;
  }

  /* Wealthier OS Hero Interactive Component Mobile */
  .wealthier-win {
    border-radius: 14px;
    margin-top: 18px;
  }
  .w-mode-switcher {
    position: relative;
    left: 0;
    transform: none;
    margin-top: 6px;
    width: 100%;
    justify-content: center;
  }
  .w-mode-btn {
    padding: 5px 12px;
    font-size: 0.78rem;
  }

  /* Diagram & Interactive Beam */
  #boxMainProp, #boxMainPersonal {
    padding: 14px !important;
  }

  /* Pricebox & Offer Cards Mobile */
  .pricebox {
    padding: 24px 18px !important;
    border-radius: 20px !important;
    text-align: center !important;
  }
  .pricebox .price {
    font-size: clamp(2.4rem, 11vw, 3.4rem) !important;
  }
  .pricebox .incl {
    padding-left: 0 !important;
    width: max-content !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    font-size: 0.88rem !important;
    text-align: left !important;
  }
  .pricebox .incl li {
    font-size: 0.88rem !important;
    line-height: 1.45 !important;
    text-align: left !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }

  /* Modules Card (Avulsos) Mobile Stacking & Badges */
  .vstack .vrow {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
    text-align: left !important;
  }
  .vstack .vrow.sum {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  .vstack .vt {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
    text-align: left !important;
  }
  .vstack .vt span[style*="LICENÇA ANUAL"], .vstack .vt span[style*="Licença Anual"] {
    margin-left: 0 !important;
    margin-top: 4px !important;
    align-self: flex-start !important;
    display: inline-block !important;
  }

  /* Stage Flow Grid & Privacy Banner Mobile Fixes */
  #privacidade .card {
    padding: 20px 14px !important;
  }
  .stage-flow-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  .flow-step-card {
    width: 100% !important;
    padding: 18px 14px !important;
  }
  .flow-arrow {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 8px 0 !important;
  }
  .flow-arrow svg {
    width: 44px !important;
    height: 36px !important;
    transform: rotate(90deg) !important;
    overflow: visible !important;
  }
  .flow-arrow svg path {
    stroke-width: 4px !important;
  }
  .flow-arrow span {
    writing-mode: horizontal-tb !important;
    font-size: 0.72rem !important;
    font-weight: 800 !important;
    margin-bottom: 4px;
    letter-spacing: 0.05em;
  }
  .privacy-banner {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }
  .privacy-banner span[style*="100% Privado"] {
    align-self: flex-start;
  }

  /* Modo Hedge Window Cards Mobile Fix */
  #hedge-wealthier-win div[style*="grid-template-columns:1fr auto 1fr"] {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  #hedge-wealthier-win div[style*="min-width:140px"] {
    min-width: auto !important;
    margin: 6px 0 !important;
  }
  #hedge-wealthier-win svg[width="140"] {
    width: 24px !important;
    height: 40px !important;
    transform: rotate(90deg) !important;
  }
}