/* pricing.css — /pricing (pages/pricing.html), after brand.css.
 *
 * The per-plan fee table, a worked $4.99 example per plan, the notes, and
 * refunds and chargebacks. On a phone the table becomes one card per plan,
 * so each plan's row — its forgiveness included — reads as a unit.
 */
.branded.pricing main{background:var(--ground)}
.fees{padding-block:56px 72px}
.fees .wrap{display:grid;gap:18px}
.fees h1{font-size:clamp(34px,5vw,52px);font-weight:800}
.fees h2{font-size:clamp(26px,3.4vw,36px);font-weight:800;margin-top:36px}
.fees-lede{font-size:18px;color:var(--muted);max-width:44rem}
.fees-lede strong{color:var(--fg)}
.fee-table-wrap{margin-top:8px}
.fee-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--rule);border-radius:16px;font-size:15px}
.fee-table thead th:first-child{border-top-left-radius:15px}.fee-table thead th:last-child{border-top-right-radius:15px}
.fee-table caption{text-align:left;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-bottom:10px}
.fee-table th,.fee-table td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--rule);vertical-align:top}
.fee-table thead th{font:600 13px var(--body);color:var(--muted);background:color-mix(in srgb, var(--rule) 30%, var(--surface))}
.fee-table tbody th{font:700 17px var(--display)}
.fee-table td{font-variant-numeric:tabular-nums}
.fee-table td[data-rate="platform"],.fee-table td[data-rate="network"]{white-space:nowrap}
.fee-table tr:last-child > *{border-bottom:0}
.fees .fee-ex-h{font-size:24px;font-weight:800;margin-top:28px}
.fee-ex-note{color:var(--muted);max-width:44rem}
.fee-ex-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.fee-plan{background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:20px;display:grid;gap:10px}
.fee-plan h3{font-size:19px;font-weight:800}
.fee-mode{font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.fee-mode.fee-none{text-transform:none;letter-spacing:0;font:14px/1.4 var(--body)}
.fee-ex{margin:0;display:grid;gap:4px;font-variant-numeric:tabular-nums}
.fee-ex div{display:flex;justify-content:space-between;gap:12px}
.fee-ex dt{color:var(--muted)}
.fee-ex dd{margin:0}
.fee-ex .sub dt,.fee-ex .sub dd{font-size:14px;color:var(--muted)}
.fee-ex .sub dt{padding-left:12px}
.fee-ex .keep{border-top:1px dashed var(--rule);padding-top:6px;margin-top:2px;font-weight:700}
.fee-ex .keep dt{color:var(--fg)}
.fee-notes{margin:10px 0 0;padding-left:1.2em;display:grid;gap:8px;color:var(--muted);max-width:52rem}
.fee-notes strong{color:var(--fg)}
@media (max-width:900px){.fee-ex-grid{grid-template-columns:minmax(0,1fr)}}
/* the rate table becomes one card per plan */
@media (max-width:760px){
  .fee-table,.fee-table tbody,.fee-table tr,.fee-table th,.fee-table td{display:block}
  .fee-table{background:none;border:0;border-radius:0;overflow:visible}
  .fee-table caption{display:block}
  .fee-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .fee-table tbody{display:grid;gap:12px}
  .fee-table tr{background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:6px 0}
  .fee-table th,.fee-table td{border:0;padding:6px 16px}
  .fee-table td{display:flex;justify-content:space-between;gap:16px;text-align:right}
  .fee-table td::before{content:attr(data-label);color:var(--muted);text-align:left;flex:none}
}


/* refunds and chargebacks */
.fees.rc{border-top:1px solid var(--rule);padding-top:48px}
.fees.rc h2{margin-top:0}
.rc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0}
.rc-grid > div{background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:20px;display:grid;gap:6px;align-content:start}
.rc-grid dt{font:700 18px/1.25 var(--display)}
.rc-grid dd{margin:0;color:var(--muted)}
.rc-note{max-width:52rem;color:var(--muted)}
.rc-note strong{color:var(--fg)}
@media (max-width:900px){.rc-grid{grid-template-columns:minmax(0,1fr)}}
