/* ============================================================
   BRAXTRADE · Tema "cinematográfico" escuro premium
   Navy profundo + glow dourado/azul · cards e botões luminosos.
   Carregado por último — sobrescreve as folhas de base.
   ============================================================ */

:root{
  /* texto invertido p/ canvas escuro */
  --t-strong:#F4F1E8;
  --t-body:#AEB6C7;
  --t-muted:#828DA1;
  /* superfícies escuras (cascateiam p/ .card, tabelas, forms via var(--paper)) */
  --paper:#0a1126;
  --cream-2:#121a36;
  --line:rgba(255,255,255,.09);
}

/* ---------- canvas / fundo ---------- */
body{
  background:
    radial-gradient(1200px 760px at 82% -10%, rgba(46,123,255,.11), transparent 60%),
    radial-gradient(1000px 720px at -10% 12%, rgba(203,163,78,.06), transparent 58%),
    #05080F;
  color:var(--t-body);
}

/* seções: ritmo sutil + brilho de topo */
.section-cream{background:#070d20}
.section-paper{background:#04070f}
.section{position:relative; isolation:isolate}
.section-cream::before,.section-paper::before,.section-dark::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(1100px 460px at 50% -180px, rgba(46,123,255,.09), transparent 72%);
}
.section-cream h1,.section-cream h2,.section-cream h3,.section-cream h4,
.section-paper h1,.section-paper h2,.section-paper h3,.section-paper h4{color:var(--cream)}

/* eyebrow mais luminoso no escuro */
.eyebrow{color:var(--gold-400)}
.lead,.muted{color:var(--t-on-dark-mut)}
.divider{background:var(--line)}

/* ---------- CARDS luminosos ---------- */
.card{
  background:linear-gradient(168deg, rgba(22,36,76,.5), rgba(7,11,26,.92));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 60px rgba(2,5,12,.5);
}
.card:hover{
  transform:translateY(-5px);
  border-color:rgba(203,163,78,.55);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 0 0 1px rgba(203,163,78,.22), 0 30px 70px rgba(2,5,12,.6), 0 0 46px rgba(203,163,78,.12);
}
.card h3,.card h4{color:var(--cream)}
.card p,.card .muted{color:var(--t-on-dark-mut)}
.card-dark{background:linear-gradient(165deg, rgba(20,34,74,.55), rgba(6,10,24,.95))}

/* ícone de feature: quadrado com glow */
.feat-ic{
  background:radial-gradient(120% 120% at 30% 18%, rgba(46,123,255,.26), rgba(8,14,32,.55));
  border:1px solid rgba(203,163,78,.38);
  box-shadow:inset 0 0 16px rgba(46,123,255,.2), 0 0 24px rgba(203,163,78,.14);
  color:var(--gold-300);
}

/* ---------- BOTÕES ---------- */
.btn-outline{
  background:linear-gradient(180deg, rgba(14,24,54,.7), rgba(6,10,22,.7));
  color:var(--gold-300); border:1px solid rgba(203,163,78,.6);
  box-shadow:0 0 0 1px rgba(203,163,78,.08), 0 0 26px rgba(203,163,78,.16), inset 0 0 18px rgba(203,163,78,.06);
}
.btn-outline:hover{background:rgba(203,163,78,.12); color:var(--cream); border-color:var(--gold); box-shadow:0 0 36px rgba(203,163,78,.34)}
.btn-ghost{border-color:rgba(236,214,147,.35); color:var(--cream)}
.btn-ghost:hover{background:rgba(236,214,147,.1)}

/* pill escuro */
.pill{background:rgba(255,255,255,.05); border-color:var(--line); color:var(--t-on-dark-mut)}

/* ---------- TABELA DE MERCADO ---------- */
.mkt{background:linear-gradient(168deg, rgba(16,28,64,.5), rgba(6,10,22,.92)); border-color:rgba(255,255,255,.08)}
.mkt-tabs{border-bottom-color:rgba(255,255,255,.08)}
.mkt-tab{color:var(--t-on-dark-mut)}
.mkt-tab:hover{background:rgba(255,255,255,.06); color:var(--cream)}
.mkt-tab.active{background:linear-gradient(180deg,var(--gold-400),var(--gold)); color:#06101f}
.mkt-table th{color:var(--t-on-dark-mut); border-bottom-color:rgba(255,255,255,.09)}
.mkt-table td{border-bottom-color:rgba(255,255,255,.07)}
.mkt-table tbody tr:hover{background:rgba(46,123,255,.07)}
.mkt-name b{color:var(--cream)} .mkt-name span{color:var(--t-on-dark-mut)}
.mkt-ic{background:rgba(46,123,255,.14); color:var(--gold-300)}
.mkt-px{color:var(--cream)}
.mkt-buy{background:linear-gradient(180deg,var(--gold-400),var(--gold)); color:#06101f}
.mkt-buy:hover{filter:brightness(1.08)}

/* ---------- TABELA COMPARATIVA ---------- */
.ptable{background:linear-gradient(168deg, rgba(16,28,64,.45), rgba(6,10,22,.92)); border-color:rgba(255,255,255,.08)}
.ptable th,.ptable td{border-bottom-color:rgba(255,255,255,.08); color:var(--t-on-dark-mut)}
.ptable td:first-child{color:var(--cream)}
.ptable tbody tr:hover{background:rgba(46,123,255,.06)}
.ptable .no{color:var(--t-muted)}
.ptable .hl{background:rgba(203,163,78,.09)}

/* ---------- FORM ---------- */
.form{background:linear-gradient(168deg, rgba(18,30,68,.5), rgba(6,10,22,.92)); border-color:rgba(255,255,255,.08)}
.field label{color:var(--cream)}
.field input,.field select{background:rgba(6,11,26,.7); border-color:rgba(255,255,255,.14); color:var(--cream)}
.field input::placeholder{color:var(--t-muted)}
.field input:focus,.field select:focus{background:rgba(6,11,26,.95); border-color:var(--gold)}
.field select option{background:#0a1126; color:var(--cream)}
.consent{color:var(--t-on-dark-mut)}

/* ---------- FAQ ---------- */
.faq-item{border-bottom-color:rgba(255,255,255,.09)}
.faq-q{color:var(--cream)}
.faq-a{color:var(--t-on-dark-mut)}

/* ---------- CONTATO / REG / COURSE ---------- */
.ccard{background:linear-gradient(168deg, rgba(20,34,74,.5), rgba(7,11,26,.9)); border-color:rgba(255,255,255,.08)}
.ccard h4{color:var(--cream)} .ccard p{color:var(--t-on-dark-mut)}
.reg{background:linear-gradient(168deg, rgba(20,34,74,.5), rgba(7,11,26,.9)); border-color:rgba(255,255,255,.08)}
.reg .ic{background:radial-gradient(120% 120% at 30% 18%, rgba(46,123,255,.24), rgba(8,14,32,.5)); border:1px solid rgba(203,163,78,.32); color:var(--gold-300)}
.reg b{color:var(--cream)} .reg span{color:var(--t-on-dark-mut)}
.course .meta{border-top-color:rgba(255,255,255,.09)}
.course .meta b{color:var(--cream)}
.lvl-bar{background:rgba(255,255,255,.08)}

/* ---------- LEADERBOARD ---------- */
.lboard{background:linear-gradient(168deg, rgba(16,28,64,.5), rgba(6,10,22,.92)); border-color:rgba(255,255,255,.08)}
.lboard .row{border-bottom-color:rgba(255,255,255,.08)}
.lboard .row:hover{background:rgba(46,123,255,.06)}
.lb-trader b{color:var(--cream)}
.lb-rank{color:var(--t-on-dark-mut)}

/* ---------- PRIZE ---------- */
.prize{background:linear-gradient(168deg, rgba(20,34,74,.5), rgba(7,11,26,.92)); border-color:rgba(255,255,255,.08)}
.prize .rk{color:var(--gold-400)} .prize .amt{color:var(--cream)} .prize .desc{color:var(--t-on-dark-mut)}
.prize.gold-1{background:linear-gradient(165deg, rgba(40,32,12,.7), rgba(10,16,38,.95)); border-color:var(--gold);
  box-shadow:0 0 0 1px rgba(203,163,78,.25), 0 30px 70px rgba(2,5,12,.55), 0 0 50px rgba(203,163,78,.16)}
.prize.gold-1 .amt{color:var(--gold-300)}

/* ---------- ACCOUNT CARDS ---------- */
.acct-price{color:var(--cream)}
.acct-card.feature{box-shadow:0 0 0 1px rgba(203,163,78,.3), 0 30px 80px rgba(2,5,12,.6), 0 0 60px rgba(203,163,78,.18)}

/* ---------- CTA band: borda luminosa ---------- */
.cta-band{border:1px solid rgba(203,163,78,.28); box-shadow:0 0 0 1px rgba(203,163,78,.12), 0 30px 80px rgba(2,5,12,.55), 0 0 70px rgba(46,123,255,.12)}

/* ---------- PLATFORM MOCK: glow + reflexo azul ---------- */
.pmock{box-shadow:0 30px 90px rgba(2,5,12,.6), 0 0 60px rgba(46,123,255,.16), inset 0 1px 0 rgba(255,255,255,.05); border-color:rgba(46,123,255,.25)}
.pmock-chart{border-right-color:rgba(255,255,255,.08)}

/* trust strip: leve borda luminosa */
.trust{border-top-color:rgba(46,123,255,.18); border-bottom-color:rgba(46,123,255,.18)}

/* reduz movimento */
@media (prefers-reduced-motion:reduce){ body{background-attachment:scroll} }
