/* Pricing + buy-credits pages — Dark Ember variables from marketing.css */

.bw-pricing-page h1,
.bw-credits-page h1 {
  margin-top: 0;
}

.bw-pricing-grid,
.bw-metrics-row--engage {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  margin: 18px 0 28px;
}

.bw-plan,
.bw-card--metric {
  border-radius: var(--radius, 18px);
  border: 1px solid rgba(255, 170, 60, 0.22);
  background: rgba(12, 10, 16, 0.65);
  padding: 18px 16px;
}

.bw-plan h2,
.bw-card--metric h3 {
  margin: 0 0 8px;
  font-size: 1.1rem;
}

.bw-metrics-row--engage .bw-card--metric h3 {
  margin: 0 0 8px;
  font-size: clamp(1.25rem, 2.8vw, 1.65rem);
  font-weight: 900;
}

.bw-card--metric .engage-metric-caption {
  margin: 4px 0;
  font-size: 0.93rem;
  color: var(--muted, rgba(245, 230, 207, 0.78));
}

.engage-metric-stub-note {
  font-size: 0.78rem !important;
  margin-top: 8px !important;
}


.bw-plan .bw-plan-price {
  font-size: 1.45rem;
  font-weight: 900;
  color: var(--text, #f5e6cf);
}

.bw-calculator {
  max-width: 480px;
  border-radius: var(--radius, 18px);
  border: 1px solid rgba(255, 170, 60, 0.25);
  padding: 20px;
  background: rgba(8, 7, 12, 0.55);
  margin: 20px 0;
}

.bw-calculator label {
  display: block;
  font-weight: 800;
  font-size: 0.82rem;
  margin: 14px 0 6px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted, rgba(245, 230, 207, 0.82));
}

.bw-calculator input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255, 170, 60, 0.25);
  background: rgba(5, 6, 10, 0.7);
  color: var(--text);
}

.bw-calculator #calcBtn {
  margin-top: 16px;
}

.bw-calculator #calcResult {
  margin-top: 16px;
}

/* Engage dashboard metric + automation additions */
.bw-automation-panel {
  border-radius: var(--radius, 18px);
  border: 1px solid rgba(255, 170, 60, 0.2);
  padding: 18px 20px;
  background: rgba(12, 10, 16, 0.55);
  margin-bottom: 20px;
}

.bw-automation-panel h3 {
  margin: 0 0 10px;
}

.bw-automation-panel p {
  margin: 6px 0;
  color: var(--muted);
}
