/* The buy and welcome pages, in the site's colours and type. */
.buy{padding:clamp(48px,6vw,90px) 0}
.buy h1{font-size:clamp(48px,5.4vw,80px);margin-bottom:32px}
.tiers{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.tier{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:19px;padding:clamp(24px,3vw,42px);background:#0a232b}
.tier.recurring{background:linear-gradient(140deg,#143f45,#0e292f)}
.tier h2{font-size:clamp(30px,3vw,40px)}
.tier .desc{color:var(--sub);margin:10px 0 22px}
.tier .tabs{align-self:flex-start;margin-bottom:18px}
.tier .price{color:var(--sub);margin:0 0 20px}
.tier .price b{font-size:30px;font-weight:450;color:var(--ink);letter-spacing:-.02em}
.tier ul{list-style:none;padding:0;margin:0 0 28px;flex:1}
.tier li{padding:10px 0;border-top:1px solid var(--line);color:var(--sub)}
.tier .button{align-self:flex-start}
.buy .fine{margin-top:8px}
.welcome .txn{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:8px 0 20px}
/* Open Jellipace hands the purchase to the Mac app (docs/paddle-plan.md Part 3). */
.welcome .open{margin-top:22px}
.welcome code{font:500 17px/1.5 ui-monospace,Menlo,monospace;color:var(--ink);background:#0a232b;border:1px solid var(--line);border-radius:10px;padding:8px 14px}
@media(max-width:700px){.tiers{grid-template-columns:1fr}}