.membership{padding-block:112px 40px;scroll-snap-align:start}
.membership-heading{max-width:680px;margin-bottom:42px}
.membership-heading .eyebrow{color:var(--muted);margin-bottom:18px}
.membership-heading h2{font-size:clamp(38px,5vw,60px);line-height:1.08}
.membership-heading>p{font-size:19px;max-width:580px;margin-top:22px;color:#626660}
.membership-plans{display:grid;grid-template-columns:1.1fr 1fr;gap:20px}
.membership-plan{padding:36px;border:1px solid #e1e3de;border-radius:28px;display:flex;flex-direction:column;min-width:0}
.membership-free{background:#f5f6f3}
.membership-plan .eyebrow{color:#656960;font-size:10px}
.membership-plan h3{font-size:27px;line-height:1.2;margin-top:18px}
.membership-free h3{font-size:72px;letter-spacing:-.06em;color:var(--blue);line-height:1}
.trial-count{font-weight:inherit;font-variant-numeric:tabular-nums;display:inline-block;min-width:2ch;text-align:right}
.membership-free h3 span{font-size:20px;letter-spacing:-.02em;color:var(--ink);display:inline-block;margin-left:6px;max-width:150px;line-height:1.2}
.trial-squares{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;max-width:330px;margin:30px 0 23px}
.trial-squares i{aspect-ratio:1;border-radius:6px;background:var(--blue)}
.trial-motion-toggle{align-self:flex-end;background:none;border:0;padding:6px 0 6px 12px;margin:-21px 0 9px;color:#73766f;font:11px Mono,monospace;min-height:32px}
.trial-motion-toggle:hover{color:var(--blue)}
.membership-rule{font-size:17px;line-height:1.5;color:var(--ink);font-weight:500}
.membership-note{font-size:15px;line-height:1.65;margin-top:12px}
.membership-signin{margin-top:auto;padding-top:28px}
.membership-signin .button{font-size:14px;gap:20px;padding:14px 22px}
.membership-signin p{font-size:12px;margin-top:13px;color:#626660}
.membership-price{display:flex;align-items:baseline;gap:9px;margin-top:26px;flex-wrap:wrap}
.membership-price strong{font-size:53px;font-weight:500;letter-spacing:-.06em;line-height:1}
.membership-price span{font-size:17px;color:#626660}
.membership-equivalent{font:12px/1.6 Mono,monospace;margin-top:10px;color:#646861}
.membership-monthly{margin-top:22px;padding-block:18px;border-block:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;font-size:16px;color:var(--ink)}
.membership-monthly strong{font-weight:500}
.membership-paid .membership-note{margin-top:20px}
.membership-terms{font-size:12px;line-height:1.6;margin-top:auto;padding-top:24px;color:#73766f}
.membership-record{display:flex;justify-content:space-between;align-items:baseline;gap:24px;margin-top:26px;padding:22px 0;border-bottom:1px solid var(--line)}
.membership-record strong{font-size:18px;font-weight:500;white-space:nowrap}
.membership-record p{font-size:14px;text-align:right}
@media(max-width:700px){.membership{padding-block:64px 10px}.membership-heading{margin-bottom:28px}.membership-heading>p{font-size:17px;margin-top:18px}.membership-plans{grid-template-columns:1fr;gap:16px}.membership-plan{padding:27px;border-radius:24px}.membership-free h3{font-size:66px}.membership-free h3 span{font-size:18px}.trial-squares{gap:6px;margin-block:24px 20px}.trial-squares i{border-radius:4px}.membership-price strong{font-size:47px}.membership-record{display:block;margin-top:16px}.membership-record p{text-align:left;margin-top:8px}.membership-heading h2{font-size:39px}.membership-rule{font-size:16px}}

/* Playful 20: the app keeps your training history. */
.membership .membership-record{display:grid;grid-template-columns:minmax(220px,32%) 1fr;align-items:center;gap:48px;margin-top:32px;padding:32px 0 40px;scroll-margin-top:100px}
.membership-record .record-illustration{display:block;width:100%;height:auto;max-width:330px}
.membership-record .record-copy strong{display:block;font-size:28px;line-height:1.15;letter-spacing:-.035em;white-space:normal}
.membership-record .record-copy p{font-size:17px;line-height:1.5;text-align:left;margin:14px 0 0;max-width:480px}
@media(max-width:700px){.membership .membership-record{grid-template-columns:1fr;gap:24px;padding:28px 0 36px;margin-top:20px}.membership-record .record-illustration{width:min(100%,280px);margin:auto}.membership-record .record-copy strong{font-size:25px}.membership-record .record-copy p{font-size:16px;margin-top:12px}}