/* Página do bônus no padrão do site Milia (14/10/2026): mesmas fontes e cores da página principal.
 * Carregado DEPOIS do site.css da página. O palco da animação continua creme porque os quadros
 * (vídeo convertido em imagens) têm esse fundo gravado; o resto da página segue o padrão. */

:root{
  --paper:#ffffff;
  --cream:var(--mp-paper);
  --navy:var(--mp-navy);
  --ink:var(--mp-navy);
  --teal:var(--mp-teal-ink);
  --terra:var(--mp-teal-ink);     /* destaque terracota vira o verde-água da marca */
  --muted:var(--mp-muted);
  --line:var(--mp-line);
  font-family:var(--mp-font);
  background:var(--mp-paper);
}
body{background:var(--mp-paper)}

/* títulos e números grandes: Manrope 800 como na página principal (antes era serifada) */
h1,h2{font-family:var(--mp-font);font-weight:800;letter-spacing:-.058em;line-height:1.08}
h1 em,h2 em{color:var(--mp-teal-ink)}
.inline-example strong,.mini-equation,.balance-readout strong,.service-steps h3,.points-field input,
.range-heading output,.result-total strong,.plan-card h3,.plan-price strong{font-family:var(--mp-font);font-weight:800;letter-spacing:-.05em}
.service-steps h3,.plan-card h3{letter-spacing:-.04em}

/* destaques e barras do simulador no verde-água */
.result-bar #bonus-bar,.dot.extra{background:var(--mp-teal)}
.closing-inner h2 em{color:var(--mp-mint)}

/* botões no mesmo desenho da página principal */
main .button{border-radius:999px;font-family:var(--mp-font);font-weight:800}
main .button:not(.button-light){background:var(--mp-navy);color:#fff}
main .button:not(.button-light):hover{background:#164b66}

/* simulador e blocos claros: verdes-claros da página principal no lugar do bege */
.calculator-section{background:#e9f4f0}
.calculator{border-color:#cfe3de;border-radius:14px;overflow:hidden}
.calculator-result{background:#edf5f3;border-color:#cfe3de}
.bonus-options button{border-color:#cfe3de;border-radius:999px}
.bonus-options button[aria-pressed=true]{background:#e3f4ee;border-color:var(--mp-teal-ink)}
select{border-color:#cfe3de;border-radius:8px}
.result-bar{background:#dbe9e5;border-radius:99px}
.button-light:hover{background:#e3f4ee}

/* planos: cartões brancos arredondados e seletor em pílula, como na página principal */
.billing-toggle{padding:5px;background:#e0eceb;border:1px solid #cbdeda;border-radius:99px;gap:3px}
.billing-toggle button{border-radius:99px;padding:13px 23px;color:#466876;font-size:12px;font-weight:800}
.billing-toggle button[aria-pressed=true]{background:var(--mp-navy);color:#fff;box-shadow:0 3px 8px #08243a20}
.billing-toggle span{font-size:9px;font-weight:600;color:#197264;background:#c4eadf;border-radius:99px;padding:5px 8px}
.billing-toggle button[aria-pressed=true] span{color:#197264}
.plans-grid{gap:16px;border:0;align-items:stretch}
.plan-card,.plan-card:first-child,.plan-card:last-child{background:#fff;border:1px solid #d9e6e6;border-radius:13px;padding:29px 23px 31px}
.plan-featured,.plan-featured:last-child{background:#103449;color:#fff;border-color:#103449;box-shadow:0 15px 30px #123b4717}
.plan-featured .plan-tag{color:#90ead0}
.plan-featured .plan-description,.plan-featured .plan-billing,.plan-featured .price-period,.plan-featured .price-currency,.plan-featured .check-list li{color:#c0d7df}
.plan-featured .check-list{border-color:#83b8b738}
main .plan-featured .plan-cta{background:var(--mp-mint);color:#073831}
main .plan-featured .plan-cta:hover{background:#beffe8}
@media(max-width:700px){.plans-grid{grid-template-columns:1fr;gap:18px}.plan-card,.plan-card:first-child,.plan-card:last-child{padding:28px}.billing-toggle button{padding:12px 17px;font-size:11px}}