/* ============================================
   PRICING PAGE
   ============================================ */
.pricing-page { padding-top: var(--space-7); }
.pricing-page-header { text-align: center; margin-bottom: var(--space-7); }
.pricing-page-header p { max-width: 480px; margin: var(--space-3) auto 0; }

.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: var(--space-5); max-width: 960px; margin: 0 auto; }

.plan-card { display: flex; flex-direction: column; }
.plan-card .card { flex: 1; display: flex; flex-direction: column; }
.plan-header { margin-bottom: var(--space-5); }
.plan-name { font-size: var(--text-xl); font-weight: var(--weight-bold); margin-bottom: var(--space-1); }
.plan-price { margin-bottom: var(--space-2); }
.plan-price .amount { font-size: var(--text-4xl); font-weight: var(--weight-bold); }
.plan-price .period { font-size: var(--text-sm); color: var(--text-muted); }
.plan-yearly-note { font-size: var(--text-xs); color: var(--text-muted); }

.plan-features { flex: 1; display: flex; flex-direction: column; gap: var(--space-3); margin-bottom: var(--space-5); }
.plan-feature { display: flex; align-items: flex-start; gap: var(--space-2); font-size: var(--text-sm); }
.plan-feature-icon { flex-shrink: 0; margin-top: 2px; }
.plan-feature-icon.check { color: var(--success); }
.plan-feature-icon.x { color: var(--text-muted); }

.plan-cta { margin-top: auto; }

/* Current plan indicator */
.plan-current { border-color: var(--success); }
.plan-current-badge { font-size: var(--text-xs); color: var(--success); font-weight: var(--weight-semibold); margin-bottom: var(--space-2); }

/* Usage bars */
.usage-section { max-width: 600px; margin: var(--space-7) auto 0; }
.usage-bar-group { margin-bottom: var(--space-4); }
.usage-bar-header { display: flex; justify-content: space-between; margin-bottom: var(--space-2); font-size: var(--text-sm); }

/* FAQ */
.faq-section { max-width: 700px; margin: var(--space-7) auto 0; }
.faq-item { border-bottom: 1px solid var(--border-subtle); }
.faq-item summary {
  padding: var(--space-4) 0; font-size: var(--text-base); font-weight: var(--weight-medium);
  cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; font-size: var(--text-xl); color: var(--text-muted); }
.faq-item[open] summary::after { content: '−'; }
.faq-answer { padding-bottom: var(--space-4); font-size: var(--text-sm); color: var(--text-secondary); line-height: var(--line-relaxed); }