/* FirstCall shared plan-card layout (Oct 27, 2026).
   Every page with a Plans section links this file: /pricing/ and every /samples/*/ page.
   Rule: the "Most popular" badge never pushes a card's content down. It floats on the card's top edge,
   every card is an equal-height flex column, and the onboarding fee + button sit on the bottom line.
   Selectors use two classes so they win over older inline page CSS without !important.
   Never hand-roll plan-card CSS on a new page: link /assets/plans.css and check it with tools/layout_check.js.
   Source copy lives in assets/plans.css (build.py copies it to dist/assets/); keep both identical. */

/* Sample-page markup: .plans > article.plan (h3, .per, .price, ul, .fee, .pbtn; optional .pop badge on the top edge,
   optional .badge "Recommended for ..." label floating just above the card) */
.plans{align-items:stretch;padding-top:12px}
.plans .plan{position:relative;display:flex;flex-direction:column;height:100%;min-width:0}
.plans .plan .pop{position:absolute;top:0;left:20px;transform:translateY(-50%);margin:0;z-index:2;white-space:nowrap;background:var(--card,#fff);color:var(--pine);box-shadow:0 0 0 1px var(--line,#ddd)}
.plans .plan .per{white-space:nowrap}
.plans .plan .fee{margin-top:auto;line-height:1.45;min-height:calc(2.9em + 11px);box-sizing:border-box}
.plans .plan .pbtn{align-self:stretch;min-width:0;margin-top:6px}
.plans .plan > .badge{position:absolute;left:0;bottom:calc(100% + 18px);max-width:100%;margin:0;z-index:2}
.plans:has(.plan > .badge){padding-top:52px}
@media (max-width:1100px){.plans{row-gap:26px}.plans:has(.plan > .badge){row-gap:64px}}

/* Pricing-page markup: .prices4 > .card.price (h3, .vol, .amt, .setup, ul, .btn; optional .badge) */
.prices4{align-items:stretch;padding-top:12px}
.prices4 .card.price{position:relative;display:flex;flex-direction:column;height:100%}
.prices4 .card.price .badge{position:absolute;top:0;left:24px;transform:translateY(-50%);margin:0;z-index:2;white-space:nowrap}
.prices4 .card.price .btn{margin-top:auto}
@media (max-width:900px){.prices4{row-gap:26px}}

/* Pricing-page secondary link under each plan button (Oct 31, 2026): same height on every card, so buttons stay aligned. */
.prices4 .card.price .alt-link{display:block;margin-top:10px;text-align:center;font-size:14px;line-height:1.4;color:var(--pine)}