/* Pricing page. Shares the Chat page grid, hero, buttons, results panel, and FAQ bubbles. */
.rp-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.rp-hero { padding-bottom: 96px; }
.rp-hero-copy { max-width: 900px; }
.rp-hero h1 { margin-bottom: 20px; }

/* ---------- Billing toggle and currency ---------- */
.rp-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 32px; }
.rp-billing-toggle { position: relative; display: inline-grid; grid-template-columns: 1fr 1fr; padding: 4px; border: 1px solid #e4dcec; border-radius: 14px; background: #ffffffb3; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.rp-toggle-pill { position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc(50% - 4px); border-radius: 10px; background: #17121f; box-shadow: 0 4px 14px #17121f33; transition: transform 420ms var(--ruut-ease-soft); }
.rp-billing-toggle[data-billing="yearly"] .rp-toggle-pill { transform: translateX(100%); }
.rp-billing-toggle button { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 8px 18px; border: 0; border-radius: 10px; background: none; color: #4c4357; font-size: 14px; font-weight: 500; white-space: nowrap; transition: color 300ms ease; }
.rp-billing-toggle button[aria-pressed="true"] { color: #fff; }
.rp-toggle-save { padding: 2px 7px; border-radius: 99px; background: #e5f7ec; color: #1d8a4f; font-size: 11px; font-weight: 600; transition: background-color 300ms ease, color 300ms ease; }
.rp-billing-toggle button[aria-pressed="true"] .rp-toggle-save { background: #ffffff26; color: #b9f2cf; }
.rp-billing-toggle button:focus-visible,.rp-currency select:focus-visible { outline: 3px solid #a06bda; outline-offset: 3px; }
.rp-currency { position: relative; display: inline-flex; align-items: center; }
.rp-currency select { min-height: 50px; padding: 0 40px 0 16px; border: 1px solid #e4dcec; border-radius: 14px; background: #ffffffb3; color: #17121f; font: inherit; font-size: 14px; font-weight: 500; appearance: none; -webkit-appearance: none; cursor: pointer; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: border-color 200ms ease, background-color 200ms ease; }
.rp-currency svg { position: absolute; right: 14px; color: #6f6878; pointer-events: none; }

/* ---------- Plan cards ---------- */
.rp-plans { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin-top: 56px; align-items: stretch; }
.rp-plan { position: relative; display: flex; flex-direction: column; padding: 30px; border: 1px solid #ebe5f1; border-radius: 24px; background: #fff; box-shadow: 0 1px 2px #25183d0a,0 18px 50px #25183d0d; transition: transform 600ms var(--ruut-ease-soft), box-shadow 600ms var(--ruut-ease-soft); }
.rp-plan.is-popular { border-color: transparent; background: linear-gradient(#fff,#fff) padding-box,linear-gradient(150deg,#b46cf0,#ff8fd8 55%,#ffb26b) border-box; border: 1.5px solid transparent; box-shadow: 0 24px 60px #7a2fc426; }
.rp-plan-enterprise { background: #17121f; border-color: #17121f; color: #f4f2f7; }
.rp-plan-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 28px; }
.ruut-chat-page .rp-plan h2 { margin: 0 auto 0 0; font-size: 22px; font-weight: 500; line-height: 1.2; letter-spacing: -.5px; }
.rp-badge { padding: 4px 10px; border-radius: 99px; background: linear-gradient(135deg,#8f45bc,#c255d6); color: #fff; font-size: 11.5px; font-weight: 600; }
.rp-save { padding: 4px 10px; border-radius: 99px; background: #e5f7ec; color: #1d8a4f; font-size: 11.5px; font-weight: 600; }
.rp-tagline { margin-top: 10px; color: #6f6878; font-size: 14.5px; line-height: 1.55; }
.rp-plan-enterprise .rp-tagline,.rp-plan-enterprise .rp-billing,.rp-plan-enterprise .rp-lead { color: #a9a3b3; }
.rp-price-block { margin: 22px 0 24px; }
.rp-price-top { display: flex; align-items: center; gap: 10px; min-height: 26px; margin-bottom: 6px; }
.rp-price-top.is-empty { visibility: hidden; }
.rp-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.rp-amount { font-family: var(--ruut-font-heading) !important; font-size: 52px; font-weight: 400; line-height: 1; letter-spacing: -2px; font-variant-numeric: tabular-nums; }
.rp-custom { font-size: 46px; }
.rp-was { color: #a39bad; font-size: 16px; font-variant-numeric: tabular-nums; }
.rp-plan-enterprise .rp-was { color: #7d768a; }
.rp-per { flex-basis: 100%; color: #6f6878; font-size: 14px; }
.rp-billing { margin-top: 12px; color: #6f6878; font-size: 13.5px; line-height: 1.5; }
.rp-cta { width: 100%; }
.rp-plan-enterprise .rp-cta { border-color: #ffffff40; color: #fff !important; }
.rp-lead { margin-top: 28px; padding-top: 22px; border-top: 1px solid #efeaf4; color: #3d3646; font-size: 13.5px; font-weight: 600; }
.rp-plan-enterprise .rp-lead { border-color: #ffffff14; }
.rp-features { display: grid; gap: 12px; margin: 16px 0 0; padding: 0; list-style: none; }
.rp-features li { display: flex; gap: 10px; color: #3d3646; font-size: 14.5px; line-height: 1.45; }
.rp-plan-enterprise .rp-features li { color: #dcd8e2; }
.rp-features svg { flex: none; margin-top: 2px; color: #8f45bc; }
.rp-plan-enterprise .rp-features svg { color: #d6aef8; }
.rp-note { max-width: 760px; margin: 28px auto 0; color: #7d748a; font-size: 13px; text-align: center; }

/* ---------- Comparison table ---------- */
.rp-compare { background: #fff; }
.rp-compare-heading { text-align: center; }
.ruut-pricing-page .rp-compare h2 > span { color: #9a91a5; }
.rp-table-wrap { position: relative; overflow: clip; border: 1px solid #ece8f1; border-radius: 22px; }
/* Collapsed: show the first rows and fade out the rest. */
.rp-table-wrap.is-collapsed { max-height: 760px; }
.rp-table-wrap.is-collapsed::after { content: ''; position: absolute; inset: auto 0 0; height: 180px; background: linear-gradient(#fff0,#fff 85%); pointer-events: none; }
.rp-table-more { display: flex; justify-content: center; margin-top: 24px; }
.rp-table-more .rc-button { background: #fff; border-color: #e6e3ec; box-shadow: 0 2px 4px #25183d0a; }
.rp-footnote { margin-top: 18px; color: #807489; font-size: 13px; text-align: center; }
.rp-table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: 14.5px; }
.rp-table th,.rp-table td { padding: 15px 22px; border-bottom: 1px solid #f1edf5; text-align: center; }
.rp-table thead th { position: sticky; top: 72px; z-index: 2; padding-block: 22px; background: #fff; font-family: var(--ruut-font-heading) !important; font-size: 17px; font-weight: 500; }
.rp-table thead th small { display: block; margin-top: 4px; color: #807489; font-family: var(--ruut-font-body) !important; font-size: 13px; font-weight: 400; font-variant-numeric: tabular-nums; }
.rp-table th[scope="row"] { width: 38%; color: #3d3646; font-weight: 400; text-align: left; }
.rp-table .rp-group th { padding-top: 28px; background: #fcfaff; color: #8050aa; font-size: 12px; font-weight: 600; letter-spacing: .8px; text-align: left; text-transform: uppercase; }
.rp-table .is-popular { background: #faf5ff; }
.rp-table tbody tr:last-child > * { border-bottom: 0; }
.rp-yes { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #f3e8fd; color: #7a3fb0; }
.rp-dash { color: #c9c2d1; }
.rp-text { color: #3d3646; font-size: 13.5px; }
.rp-faq { padding-top: 96px; }

@media (hover: hover) and (pointer: fine) {
  .rp-plan:hover { transform: translateY(-6px); box-shadow: 0 2px 4px #25183d0a,0 28px 60px #25183d1a; }
  .rp-plan.is-popular:hover { box-shadow: 0 30px 70px #7a2fc433; }
  .rp-billing-toggle button[aria-pressed="false"]:hover { color: #17121f; }
  .rp-currency select:hover { border-color: #cdbfdc; background: #fff; }
  .rp-plan-enterprise .rp-cta:hover { background: #ffffff14 !important; }
}
@media (max-width: 1100px) {
  .rp-plans { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; }
}
@media (max-width: 760px) {
  .rp-hero { padding-bottom: 64px; }
  .rp-controls { gap: 10px; }
  .rp-billing-toggle { width: 100%; }
  .rp-currency,.rp-currency select { width: 100%; }
  .rp-plans { margin-top: 36px; gap: 16px; }
  .rp-plan { padding: 24px; border-radius: 20px; }
  .rp-amount { font-size: 44px; }
  .rp-table-wrap { overflow-x: auto; }
  .rp-table thead th { position: static; }
  .rp-table { min-width: 0; table-layout: fixed; font-size: 13px; }
  .rp-table th,.rp-table td { padding: 11px 6px; }
  .rp-table th[scope="row"] { width: 40%; padding-left: 14px; }
  .rp-table thead th { padding-block: 16px; font-size: 13px; line-height: 1.25; }
  .rp-table thead th small { font-size: 11px; }
  .rp-table .rp-group th { padding: 20px 14px 10px; font-size: 11px; }
  .rp-yes { width: 22px; height: 22px; }
  .rp-text { font-size: 12px; }
  .rp-faq { padding-top: 64px; }
}
@media (prefers-reduced-motion: reduce) {
  .rp-toggle-pill,.rp-plan { transition-duration: 0s; }
  .rp-plan:hover { transform: none; }
}