/* ==========================================================================
   /tech/precos — estilos da página de preços
   ==========================================================================
   Saíram do <style> dentro do HTML. Usam direto os tokens da pele escura
   (tech.css) em vez dos nomes legados da paleta v2, que só existiam como
   ponte.

   Dois defeitos corrigidos na passagem:
   - As listas de recursos tinham o recuo do navegador (40px) e um `::before`
     de conteúdo vazio, que antes carregava um emoji: sobrava um vão sem
     marcador na frente de cada item. Agora o marcador é o broto em pixel art,
     o mesmo da sobrelinha.
   - A FAQ ficava centrada numa coluna de 800px enquanto o título da seção
     alinhava à esquerda: dois eixos na mesma seção.
   ========================================================================== */

/* ── Alternância mensal/anual ─────────────────────────────────────────── */
.billing-toggle-wrap {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: var(--e-2); margin-bottom: var(--e-5);
}
.billing-label {
  font-size: var(--t-sm); font-variation-settings: 'wght' 600, 'wdth' 94;
  color: var(--texto-2); cursor: pointer; transition: color var(--rapido);
}
.billing-label.is-active { color: var(--limao); }
.toggle-switch {
  position: relative; width: 56px; height: 30px; flex: none; cursor: pointer;
  background: var(--sup-2); border: 1px solid var(--borda); border-radius: var(--r-pill);
  transition: background var(--medio), border-color var(--medio);
}
.toggle-switch.is-annual { background: #3f6a08; border-color: var(--limao); }
.toggle-knob {
  position: absolute; top: 3px; left: 3px; width: 22px; height: 22px;
  background: var(--texto); border-radius: 50%; box-shadow: 0 2px 6px rgba(0,0,0,.3);
  transition: transform var(--medio) var(--decidido);
}
.toggle-switch.is-annual .toggle-knob { transform: translateX(26px); }
.savings-badge {
  font-size: var(--t-xs); font-variation-settings: 'wght' 650, 'wdth' 92; letter-spacing: .06em;
  color: var(--limao); background: rgba(171,205,48,.1); border: 1px solid var(--borda);
  padding: 4px 12px; border-radius: var(--r-pill);
}

/* ── Módulos avulsos ──────────────────────────────────────────────────── */
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--e-3); }
.pricing-card, .suite-card {
  position: relative; display: flex; flex-direction: column;
  background: linear-gradient(160deg, var(--sup-2), var(--sup-1));
  border: 1px solid var(--borda); border-radius: var(--r-md);
  padding: var(--e-4); box-shadow: 0 20px 50px rgba(0,0,0,.45), inset 0 1px 0 rgba(238,243,226,.08);
  transition: transform var(--medio) var(--brota), border-color var(--medio);
}
.pricing-card:hover, .suite-card:hover { transform: translateY(-6px); border-color: var(--limao); }
.pricing-card.is-featured, .suite-card.is-popular {
  border-color: var(--limao);
  box-shadow: 0 0 0 1px var(--limao), 0 24px 60px rgba(171,205,48,.12);
}
.card-plan-badge, .suite-badge {
  font-size: .68rem; font-variation-settings: 'wght' 700, 'wdth' 90; letter-spacing: .1em;
  text-transform: uppercase; white-space: nowrap;
  background: var(--limao); color: #16200c; padding: 4px 12px; border-radius: var(--r-pill);
}
.card-plan-badge { position: absolute; top: var(--e-2); right: var(--e-2); }
.card-plan-badge--apagado, .suite-badge--apagado { background: var(--sup-2); color: var(--texto-2); border: 1px solid var(--borda); }

.plan-name, .suite-name { color: var(--texto); font-size: var(--t-lg); margin: 0 0 4px; }
.plan-desc { font-size: var(--t-sm); color: var(--texto-2); margin-bottom: var(--e-3); line-height: 1.5; min-height: 3em; }
.plan-price-wrap { margin-bottom: var(--e-3); padding-bottom: var(--e-3); border-bottom: 1px solid var(--borda); }
.plan-price, .suite-price-row { display: flex; align-items: baseline; gap: 6px; }
.plan-currency { font-size: 1.15rem; font-variation-settings: 'wght' 600, 'wdth' 90; color: var(--limao); }
.plan-amount { font-size: 3rem; line-height: 1; font-variation-settings: 'wght' 700, 'wdth' 70; color: var(--limao); }
.plan-period { font-size: var(--t-sm); color: var(--texto-2); }
.plan-billed { font-size: .8rem; color: var(--texto-2); margin: 6px 0 0; }
.plan-original { font-size: .82rem; color: var(--texto-2); text-decoration: line-through; margin: 2px 0 0; opacity: .8; }

.plan-features, .suite-features { list-style: none; margin: 0 0 var(--e-4); padding: 0; }
.plan-features { flex: 1; }
.plan-features li, .suite-features li {
  display: flex; align-items: baseline; gap: 10px;
  font-size: var(--t-sm); color: var(--texto); padding: 7px 0;
}
.plan-features li + li { border-top: 1px solid rgba(171,205,48,.1); }
.plan-features li::before, .suite-features li::before {
  content: ''; flex: none; width: 10px; height: 12px; translate: 0 1px;
  background: url('../images/pixel/broto.svg') center / contain no-repeat;
  filter: brightness(1.4);
}
.plan-cta { margin-top: auto; }
.plan-cta .btn { width: 100%; }

/* ── Suítes ───────────────────────────────────────────────────────────── */
.suites-section { border-block: 1px solid var(--borda); }
.suites-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--e-3); }
.suite-card { padding: var(--e-5) var(--e-4) var(--e-4); }
.suite-header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e-2); margin-bottom: var(--e-3); }
.suite-modules { font-size: var(--t-sm); color: var(--texto-2); margin: 0; }
.suite-price-row .plan-amount { font-size: 2.6rem; }
.suite-savings {
  display: inline-block; align-self: flex-start; margin-top: var(--e-1);
  font-size: .78rem; font-variation-settings: 'wght' 650, 'wdth' 92;
  color: var(--limao); background: rgba(171,205,48,.1); padding: 3px 10px; border-radius: var(--r-pill);
}
.suite-features {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--e-3);
  margin: var(--e-3) 0 var(--e-4); padding-top: var(--e-3); border-top: 1px solid var(--borda);
}
.suite-features li.is-highlight { color: var(--limao); font-variation-settings: 'wght' 600, 'wdth' 96; }
.suite-card .plan-cta { margin-top: auto; }

/* ── Confiança ────────────────────────────────────────────────────────── */
.trust-section { padding-block: var(--e-7); }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--e-3); }
.tech-page .trust-item { padding: var(--e-3); border-radius: var(--r-sm); }
.trust-item h3 { font-size: var(--t-md); margin: 0 0 6px; }
.trust-item h3::before {
  content: ''; display: block; width: 18px; height: 22px; margin-bottom: var(--e-2);
  background: url('../images/pixel/broto.svg') center / contain no-repeat; filter: brightness(1.4);
}
.trust-item p { font-size: var(--t-sm); color: var(--texto-2); margin: 0; }

/* ── FAQ ──────────────────────────────────────────────────────────────── */
.pricing-faq .faq-wrap { max-width: 54rem; }

@media (max-width: 992px) {
  .pricing-grid { grid-template-columns: 1fr; max-width: 460px; margin-inline: auto; }
  .suites-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
  .trust-grid { grid-template-columns: repeat(2, 1fr); }
  .suite-features { grid-template-columns: 1fr; }
  .plan-desc { min-height: 0; }
}
@media (max-width: 640px) {
  .trust-grid { grid-template-columns: 1fr; }
  .suite-header { flex-direction: column; }
}