/* ============================================================
   calculadoras-price-x-sac.css
   Estilos específicos desta página.
   Depende de: base.css + calculadoras.css + theme.css
   ============================================================ */

.nav-links a{color:var(--muted-1);text-decoration:none;font-size:0.875rem;font-weight:400;transition:color 0.2s;}

.page-header{padding:8rem 2.5rem 3rem;max-width:1200px;margin:0 auto;}

.page-header p{color:var(--muted-1);font-size:0.95rem;font-weight:300;max-width:560px;line-height:1.7;}

.calc-wrapper{max-width:1200px;margin:0 auto;padding:0 2.5rem 6rem;}

/* ── Formulário ──────────────────────────────────────────── */
.form-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.5rem;}

.form-group input,
.form-group select{background:var(--bg-2);border:1px solid var(--muted-3);border-radius:8px;padding:0.85rem 1rem;color:var(--white);font-family:"Outfit",sans-serif;font-size:0.95rem;transition:border-color 0.2s,box-shadow 0.2s;outline:none;width:100%;}

.btn-calc{width:100%;background:var(--green);color:var(--bg);border:none;padding:1rem 2rem;border-radius:8px;font-family:"Outfit",sans-serif;font-weight:700;font-size:1rem;cursor:pointer;transition:transform 0.2s,box-shadow 0.2s;margin-top:0.5rem;letter-spacing:0.3px;}

.btn-calc:active{transform:translateY(0);}

/* ── Banner de diferença ─────────────────────────────────── */
.results-diff-banner{display:none;background:linear-gradient(135deg,rgba(0,200,83,0.08),rgba(0,200,83,0.04));border:1px solid var(--green-border);border-radius:12px;padding:1rem 1.5rem;margin-bottom:1.5rem;font-size:0.92rem;color:var(--muted-1);line-height:1.6;}

.results-diff-banner strong{color:var(--green);font-weight:600;}

/* ── Grid comparativo (dois cards lado a lado) ───────────── */
.results-compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;}

.results-hero{background:linear-gradient(135deg,#0E1F15,#0A1A11);border:1px solid var(--green-border);border-radius:16px;padding:2rem;position:relative;}

.results-hero--price{border-color:rgba(95,168,255,0.25);background:linear-gradient(135deg,#0D1824,#0A1218);}

.results-hero--sac{border-color:var(--green-border);background:linear-gradient(135deg,#0E1F15,#0A1A11);}

.results-hero-system{font-size:0.65rem;letter-spacing:3px;text-transform:uppercase;font-weight:700;margin-bottom:1.25rem;padding-bottom:0.75rem;border-bottom:1px solid rgba(221,231,226,0.1);}

.results-hero--price .results-hero-system{color:#5FA8FF;}

.results-hero--sac .results-hero-system{color:var(--green);}

.results-hero-left{margin-bottom:1.25rem;}

.results-hero-label{font-size:0.68rem;letter-spacing:2px;text-transform:uppercase;font-weight:500;margin-bottom:0.5rem;}

.results-hero--price .results-hero-label{color:#5FA8FF;}

.results-hero--sac .results-hero-label{color:var(--green);}

.results-hero-value{font-family:"Playfair Display",serif;font-size:clamp(1.6rem,3vw,2.4rem);font-weight:900;line-height:1;letter-spacing:-1px;margin-bottom:0.4rem;}

.results-hero--price .results-hero-value{color:#5FA8FF;}

.results-hero--sac .results-hero-value{color:var(--green);}

.results-hero-sub{font-size:0.78rem;color:rgba(221,231,226,0.5);font-weight:300;line-height:1.4;}

.results-hero-right{display:flex;flex-direction:column;gap:0.85rem;}

.result-item{display:flex;flex-direction:column;gap:0.2rem;padding-bottom:0.85rem;border-bottom:1px solid rgba(221,231,226,0.08);}

.result-item:last-child{border-bottom:none;padding-bottom:0;}

.result-item-label{font-size:0.65rem;letter-spacing:1.5px;text-transform:uppercase;color:rgba(221,231,226,0.45);font-weight:500;}

.result-item-value{font-family:"Playfair Display",serif;font-size:1.05rem;font-weight:700;color:#DDE7E2;}

/* ── Gráfico ─────────────────────────────────────────────── */
.chart-card{background:var(--bg-card);border:1px solid var(--muted-3);border-radius:16px;padding:2rem;margin-bottom:1.5rem;}

.chart-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;flex-wrap:wrap;gap:1rem;}

.chart-card-title{font-size:0.7rem;letter-spacing:2px;text-transform:uppercase;color:var(--muted-2);font-weight:500;}

.chart-tabs{display:flex;gap:0.4rem;flex-wrap:wrap;}

.chart-tab{background:none;border:1px solid var(--muted-3);border-radius:6px;padding:0.35rem 0.85rem;font-size:0.78rem;font-weight:500;font-family:"Outfit",sans-serif;color:var(--muted-2);cursor:pointer;transition:all 0.2s;}

.chart-tab:hover{color:var(--white);border-color:var(--muted-2);}

.chart-tab--active{background:var(--green-soft);border-color:var(--green-border);color:var(--green);}

.chart-legend{display:flex;gap:1.25rem;flex-wrap:wrap;}

.legend-item{display:flex;align-items:center;gap:0.4rem;font-size:0.75rem;color:var(--muted-2);}

.legend-dot{width:8px;height:8px;border-radius:2px;flex-shrink:0;}

.legend-dot--price{background:#5FA8FF;}

.legend-dot--sac{background:var(--green);}

/* ── Tabela de amortização ───────────────────────────────── */
.amort-table-card{background:var(--bg-card);border:1px solid var(--muted-3);border-radius:16px;overflow:hidden;margin-bottom:1.5rem;}

.amort-table-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;border-bottom:1px solid var(--muted-3);flex-wrap:wrap;gap:0.75rem;}

.amort-table-toggle{display:flex;background:var(--bg-2);border:1px solid var(--muted-3);border-radius:6px;overflow:hidden;}

.amort-tab{background:none;border:none;padding:0.4rem 1.1rem;font-size:0.78rem;font-weight:600;font-family:"Outfit",sans-serif;color:var(--muted-2);cursor:pointer;transition:all 0.2s;letter-spacing:0.5px;}

.amort-tab--price.amort-tab--active{background:rgba(95,168,255,0.12);color:#5FA8FF;}

.amort-tab--sac.amort-tab--active{background:var(--green-soft);color:var(--green);}

.table-scroll-wrap{overflow-x:auto;}

.amort-table{width:100%;border-collapse:collapse;font-size:0.85rem;}

.amort-table thead tr{background:var(--bg-2);}

.amort-table th{padding:0.85rem 1.25rem;text-align:right;font-size:0.68rem;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted-2);font-weight:500;border-bottom:1px solid var(--muted-3);white-space:nowrap;}

.amort-table th.col-num{text-align:center;}

.amort-table td{padding:0.85rem 1.25rem;text-align:right;color:var(--muted-1);border-bottom:1px solid var(--muted-3);white-space:nowrap;}

.amort-table td.col-num{text-align:center;color:var(--muted-2);font-size:0.8rem;}

.amort-table tbody tr:last-child td{border-bottom:none;}

.amort-table tbody tr:hover{background:var(--bg-hover);}

.td-price{color:#5FA8FF !important;font-weight:600;font-family:"Playfair Display",serif;}

.td-sac{color:var(--green) !important;font-weight:600;font-family:"Playfair Display",serif;}

.td-amort{color:var(--white) !important;}

.td-juros{color:var(--muted-1);}

.td-saldo{color:var(--muted-1);}

/* ── Paginação ───────────────────────────────────────────── */
.amort-pagination{display:flex;align-items:center;justify-content:center;gap:0.35rem;padding:1rem;flex-wrap:wrap;}

.pg-btn{background:none;border:1px solid var(--muted-3);border-radius:6px;padding:0.35rem 0.7rem;font-size:0.8rem;font-family:"Outfit",sans-serif;color:var(--muted-2);cursor:pointer;transition:all 0.2s;min-width:34px;}

.pg-btn:hover:not(:disabled){color:var(--white);border-color:var(--muted-2);}

.pg-btn--active{background:var(--green-soft);border-color:var(--green-border);color:var(--green);}

.pg-btn:disabled{opacity:0.3;cursor:default;}

.pg-ellipsis{font-size:0.8rem;color:var(--muted-2);padding:0 0.25rem;}

/* ── Guia / fórmulas ─────────────────────────────────────── */
.seo-content{max-width:1200px;margin:0 auto;padding:0 2.5rem 2rem;}

.seo-panel{background:linear-gradient(135deg,rgba(17,24,21,0.98),rgba(14,20,18,0.96));border:1px solid var(--muted-3);border-radius:18px;padding:2rem;}

.guide-kicker{font-size:0.7rem;letter-spacing:2px;text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:0.85rem;}

.seo-content h2{font-family:"Playfair Display",serif;font-size:clamp(1.5rem,3vw,2rem);line-height:1.15;margin-bottom:1rem;letter-spacing:-0.4px;}

.seo-content h3{font-size:1rem;margin:1.35rem 0 0.55rem;color:var(--white);}

.seo-content p{color:var(--muted-1);line-height:1.75;font-size:0.95rem;margin-bottom:0.9rem;}

.seo-grid{display:grid;grid-template-columns:1.15fr 0.85fr;gap:2rem;align-items:start;}

.seo-highlight{background:var(--bg-2);border:1px solid var(--green-border);border-radius:14px;padding:1.5rem;}

.formula-label{font-size:0.65rem;letter-spacing:2px;text-transform:uppercase;color:var(--green);font-weight:600;margin-bottom:0.5rem;}

.formula-main{font-family:"Playfair Display",serif;font-size:1.25rem;color:var(--green);font-weight:900;margin-bottom:0.75rem;line-height:1.3;}

.formula-list{list-style:none;display:flex;flex-direction:column;gap:0.45rem;color:var(--muted-1);font-size:0.88rem;}

.formula-list strong{color:var(--white);font-weight:600;}

.seo-cta-row{display:flex;flex-wrap:wrap;gap:0.8rem;margin-top:1.25rem;}

.seo-cta{display:inline-flex;align-items:center;justify-content:center;gap:0.45rem;background:var(--green);color:var(--bg);border-radius:8px;padding:0.78rem 1rem;text-decoration:none;font-weight:700;font-size:0.9rem;transition:transform 0.2s,box-shadow 0.2s;}

.seo-cta:hover{transform:translateY(-1px);box-shadow:0 8px 26px rgba(0,200,83,0.22);}

.seo-link{display:inline-flex;align-items:center;justify-content:center;color:var(--muted-1);border:1px solid var(--muted-3);border-radius:8px;padding:0.78rem 1rem;text-decoration:none;font-weight:600;font-size:0.9rem;transition:border-color 0.2s,color 0.2s;}

.seo-link:hover{color:var(--green);border-color:var(--green-border);}

/* ── FAQ ─────────────────────────────────────────────────── */
.faq-section{max-width:1200px;margin:0 auto;padding:0 2.5rem 5rem;}

.faq-card{background:var(--bg-card);border:1px solid var(--muted-3);border-radius:16px;padding:2rem;}

.faq-card h2{font-family:"Playfair Display",serif;font-size:clamp(1.4rem,3vw,2rem);margin-bottom:1rem;}

.faq-item{border-top:1px solid var(--muted-3);padding:1.1rem 0;}

.faq-item:first-of-type{border-top:none;}

.faq-item h3{font-size:1rem;margin-bottom:0.45rem;color:var(--white);}

.faq-item p{color:var(--muted-1);line-height:1.65;font-size:0.93rem;}

.disclaimer-box{margin-top:1rem;color:var(--muted-2);font-size:0.78rem;line-height:1.6;}

/* ── Botões PDF / Share ──────────────────────────────────── */
.btn-pdf,.btn-share{display:inline-flex;align-items:center;gap:0.5rem;background:none;border:1px solid var(--muted-3);border-radius:8px;padding:0.55rem 1rem;font-size:0.8rem;font-family:"Outfit",sans-serif;color:var(--muted-2);cursor:pointer;transition:all 0.2s;}

.btn-pdf svg,.btn-share svg{width:13px;height:13px;flex-shrink:0;}

.btn-pdf:hover{color:var(--white);border-color:var(--muted-2);}

.btn-share:hover{color:var(--green);border-color:var(--green-border);}

.btn-pdf.loading{opacity:0.6;pointer-events:none;}

/* ── Errors ──────────────────────────────────────────────── */
.form-error-message{display:none;margin:1rem 0 0;padding:.85rem 1rem;border-radius:10px;border:1px solid rgba(255,107,107,.35);background:rgba(255,107,107,.11);color:#ff9a9a;font-size:.88rem;line-height:1.5;font-weight:500;}

.form-error-message.show{display:block;}

.field-invalid{border-color:rgba(255,107,107,.75)!important;box-shadow:0 0 0 3px rgba(255,107,107,.14)!important;}

html.light-mode .form-error-message,html[data-theme="light"] .form-error-message{background:rgba(190,32,32,.08);border-color:rgba(190,32,32,.28);color:#9f1d1d;}

/* ── ApexCharts ──────────────────────────────────────────── */
.apexcharts-canvas{background:transparent !important;}

.apexcharts-svg{background:transparent !important;}

/* ── Light mode ──────────────────────────────────────────── */
html.light-mode .results-hero--price,html[data-theme="light"] .results-hero--price{background:linear-gradient(135deg,#E8F2FF,#F0F6FF);border-color:rgba(29,95,165,0.25);}

html.light-mode .results-hero--sac,html[data-theme="light"] .results-hero--sac{background:linear-gradient(135deg,#E8F5EE,#F0FAF2);border-color:rgba(0,150,60,0.25);}

html.light-mode .results-hero-value,html[data-theme="light"] .results-hero-value,
html.light-mode .result-item-value,html[data-theme="light"] .result-item-value{color:#132019;}

html.light-mode .results-hero-sub,html[data-theme="light"] .results-hero-sub{color:rgba(19,32,25,0.5);}

html.light-mode .results-diff-banner,html[data-theme="light"] .results-diff-banner{background:rgba(0,150,60,0.06);border-color:rgba(0,150,60,0.2);}

html.light-mode .results-diff-banner strong,html[data-theme="light"] .results-diff-banner strong{color:#0F6030;}

html.light-mode .amort-table-card,html[data-theme="light"] .amort-table-card,
html.light-mode .chart-card,html[data-theme="light"] .chart-card,
html.light-mode .faq-card,html[data-theme="light"] .faq-card{background:#fff;}

html.light-mode .amort-table thead tr,html[data-theme="light"] .amort-table thead tr{background:#F0F4F1;}

/* ── Responsivo ──────────────────────────────────────────── */
@media(max-width:960px){
  .form-grid{grid-template-columns:1fr 1fr;}
  .results-compare-grid{grid-template-columns:1fr;}
}

@media(max-width:768px){
  .page-header{padding:6rem 1.25rem 2rem;}
  .calc-wrapper{padding:0 1.25rem 4rem;}
  .form-card{padding:1.5rem;}
  .form-grid{grid-template-columns:1fr;}
  .chart-card{padding:1.25rem;}
  .chart-card-header{flex-direction:column;align-items:flex-start;gap:0.75rem;}
  .amort-table-header{flex-direction:column;align-items:flex-start;}
  .seo-content{padding:0 1.25rem 1.5rem;}
  .seo-panel{padding:1.35rem;}
  .seo-grid{grid-template-columns:1fr;gap:1.25rem;}
  .seo-cta,.seo-link{width:100%;}
  .faq-section{padding:0 1.25rem 4rem;}
  .faq-card{padding:1.35rem;}
  footer{flex-direction:column;align-items:flex-start;padding:2rem 1.25rem;}
  .footer-links{flex-wrap:wrap;gap:1rem;}
}