/* Pricing: Free beside Pro; Pro lists what it adds once, its three passes sit inside it. */
.plans { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); overflow: hidden; }
.plan { padding: var(--s5); display: flex; flex-direction: column; }
.plan + .plan { border-left: 1px solid var(--line); }
.plan h3 { font-size: 1rem; font-stretch: 100%; font-weight: 600; letter-spacing: 0; }
.price { font-stretch: 62%; font-weight: 800; font-size: 3.5rem; line-height: 1; margin: var(--s2) 0 var(--s4); font-variant-numeric: tabular-nums; }
.plan ul { list-style: none; margin: 0 0 var(--s5); padding: 0; font-size: 0.9375rem; }
.plan li { padding: 4px 0; }
.plan > .btn { margin-top: auto; }
.pro-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s5); margin-top: var(--s3) !important; }
.passes { margin-top: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.pass { display: flex; flex-direction: column; padding: var(--s4); border: 1px solid var(--line); border-radius: var(--radius-s); }
.pass span { font-size: 0.9375rem; font-weight: 600; white-space: nowrap; }
.pass .price { font-size: 2.75rem; margin: var(--s2) 0 var(--s4); }
.pass .btn { margin-top: auto; }
.pass.pick { border: 2px solid var(--ink); }
.best { margin-left: 6px; padding: 1px 6px; font-size: 0.6875rem; font-weight: 700; color: #1E1B18; background: var(--gold); border-radius: 3px; vertical-align: 2px; }
.plans-note { grid-column: 1 / -1; font-size: 0.9375rem; margin: 0; max-width: 80ch; }

@media (max-width: 960px) {
  .plans { grid-template-columns: 1fr; }
  .plan + .plan { border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 560px) {
  .pro-list { grid-template-columns: 1fr; }
  .passes { grid-template-columns: 1fr; }
  .pass { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "label price" "btn btn"; align-items: center; column-gap: var(--s3); }
  .pass span { grid-area: label; }
  .pass .price { grid-area: price; font-size: 2rem; margin: 0; }
  .pass .btn { grid-area: btn; margin-top: var(--s3); }
}
.offer-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 700; letter-spacing: 0.04em; padding: 1px 6px; border: 1px dashed currentColor; border-radius: 3px; }
.copy-code { margin-left: 4px; padding: 0; font: inherit; font-size: 0.8125rem; color: inherit; background: none; border: 0; text-decoration: underline; cursor: pointer; }
.copy-code:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }