/* pricing.css — Pricing page specific styles only (shared styles in brand.css) */

/* ── Billing toggle ── */
.toggle-track {
  width: 48px; height: 24px; border-radius: 12px;
  background: #cbd5e1; transition: background .3s;
  position: relative; cursor: pointer; display: inline-block;
}
.toggle-track.on { background: #4f46e5; }
.toggle-thumb {
  position: absolute; top: 2px; left: 2px;
  width: 20px; height: 20px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2);
  transition: left .25s cubic-bezier(.34,1.56,.64,1);
}
.toggle-track.on .toggle-thumb { left: 26px; }

/* ── Featured plan card ── */
.card-featured {
  background: #0a0f1e;
  border-radius: 16px;
  padding: 28px;
  box-shadow: 0 25px 50px rgba(10,15,30,.3);
  margin-top: -8px;
}

/* ── FAQ accordion ── */
details { border-radius: 12px; border: 1px solid #e2e8f0; overflow: hidden; }
details summary {
  list-style: none; cursor: pointer;
  padding: 20px 24px;
  display: flex; align-items: center; gap: 12px;
  user-select: none;
}
details summary::-webkit-details-marker { display: none; }
details[open] .faq-chevron { transform: rotate(180deg); }
.faq-chevron { transition: transform .25s; flex-shrink: 0; }
.faq-body { padding: 0 24px 20px 60px; font-size: .875rem; color: #64748b; line-height: 1.7; }