/* pricing-page sections (page-specific; the shared shell lives in site/site.css;
   tier/table grammar mirrors services.html; round-9 five-section structure per the exhaustive sheet) */
.tiers{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem;margin-top:3rem}
.tiers--4{grid-template-columns:repeat(4,minmax(0,1fr));gap:1.4rem}
.tier{border:1px solid var(--hair-strong);padding:2rem 1.9rem;display:flex;flex-direction:column}
.tiers--4 .tier{padding:1.8rem 1.5rem}
.tiers--4 .btn{padding:0.95rem 1.15rem}   /* round-11 arrow rule: one notch down so the nowrap consultation label never overflows the 4-up card */
.tier--rec{border-color:rgba(92,144,255,0.5)}   /* accent as state: the recommended tier */
/* round 11: names step up to the h3 register (.offer-h's casting, 1.5rem) in all five
   sections — the scan order on a pricing card is name, then price, then promise */
.tier h3{font-family:var(--serif);font-weight:600;font-size:1.5rem;letter-spacing:var(--track-h3)}
.tier-price{margin-top:0.9rem;font-family:var(--serif);font-weight:600;font-size:1.6rem;white-space:nowrap}
.tier-price--words{white-space:normal;font-size:1.15rem;line-height:1.4}   /* All-In: a composition, not a number */
/* round 14 alignment: in the 4-up, the words line occupies the EXACT price-slot
   height: line-height 2.64rem is the $ lockups' rendered line box (1.6rem x
   --lh-body 1.65), and all four cards carry the same 1.2rem .tier-body margin
   (round 17: the three tier inclusion lists became .tier-body twins of the
   services copy, so the round-14 list/body split is gone and the alignment is
   structural; the RECOMMENDED pill sits inline on All-In's name line since
   round 35, when the recommended state moved from Accelerate to All-In) */
.tiers--4 .tier-price--words{line-height:2.64rem}
.tiers--pair .tier-price--words{line-height:2.64rem}   /* round 49: the Content pair's Custom-pricing words line takes the same $-lockup line box (1.6rem x --lh-body), so the two cards' body-copy lines share one top: a matched header zone, the round-14 class of fix, not a margin */
.tiers--4 .tier>p.tier-body{margin-top:1.2rem}
.tier-price span{font-size:var(--t-small);font-weight:var(--w-4);color:var(--lt-3)}
.tier-tag{margin-top:0.9rem;font-weight:var(--w-5)}
.tier>p.tier-body{margin-top:0.6rem;color:var(--lt-2);flex:1 1 auto}   /* round 50: the description takes the card's free height, so the Read-about link and the Buy button beneath it share one baseline across the Diagnose pair whatever the copy length (the card was already a flex column; only .tier-cta rode an auto margin) */
.tier .svc-link{margin-top:1.6rem}
/* batch-2 pin: the Content pair's two "Read about..." links sit level — the card is already
   a flex column, so the link anchors to the card's bottom edge; padding keeps the 1.6rem floor */
.tiers--pair .tier .svc-link{margin-top:auto;padding-top:1.6rem}
.tier-cta{margin-top:auto;padding-top:1.6rem}
.svc-link{margin-top:2.2rem}
.sec-fact{margin-top:1.4rem;font-weight:var(--w-5);color:var(--lt)}   /* round 55: the section head's fact line in the tier TAGLINE register (.tier-tag: body size, 500 weight, full ink), its own line one stack step (1.4rem) below .sec-sub; no max-width so it takes the 38em head column and holds one line at 1440, 1200 and 992. Was round 47's lede-size, 30em line. Rule and copy are a verbatim twin across /pricing#growth and /services#growth; edits land in both files or neither */
.offer-band{border:1px solid rgba(92,144,255,0.4);background:var(--field-2);padding:2.6rem;display:flex;justify-content:space-between;align-items:center;gap:2.5rem;flex-wrap:wrap;margin-top:3rem}
.offer-h{font-family:var(--serif);font-weight:600;font-size:1.5rem;letter-spacing:var(--track-h3)}
/* round 55: the Website card carries the Growth tier card's four text roles, rule for rule:
   .offer-h = .tier h3 (1.5rem/600), .offer-price = .tier-price (1.6rem/600, nowrap) with the
   same --t-small unit slot ("starting at" where the tiers set "/mo"), .offer-tag = .tier-tag
   (body/500, 0.9rem above), .offer-sub = .tier-body (body/400, --lt-2, 0.6rem above);
   .offer-note stays the fine-print register (--t-small, --lt-3). The tier rules are untouched. */
.offer-price{margin-top:0.9rem;font-family:var(--serif);font-weight:600;font-size:1.6rem;white-space:nowrap}
.offer-price span{font-size:var(--t-small);font-weight:var(--w-4);color:var(--lt-3)}
.offer-tag{margin-top:0.9rem;font-weight:var(--w-5)}
.offer-sub{margin-top:0.6rem;color:var(--lt-2);max-width:34em}
.offer-note{margin-top:1rem;font-size:var(--t-small);color:var(--lt-3);max-width:34em}
/* round 11: the Marketing rows became an enriched rate card — name at the stepped-up
   register, a one-line descriptor beneath it, price right-aligned in tabular figures */
.rows{margin-top:3rem;border:1px solid var(--hair)}
.rows-table{width:100%;border-collapse:collapse;text-align:left}
.rows-table th,.rows-table td{padding:1.3rem 1.2rem;border-bottom:1px solid var(--hair);font-weight:var(--w-4);font-size:var(--t-body);vertical-align:top}
.rows-table td{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;padding-top:1.55rem}
.rows-table tr:last-child th,.rows-table tr:last-child td{border-bottom:0}
.rows-table a{color:inherit;border-bottom:1px solid var(--hair-strong);transition:border-color 0.3s var(--ease),color 0.3s var(--ease)}
.rows-table a:hover,.rows-table a:focus-visible{color:var(--peri);border-color:var(--peri)}
.rate-name{font-family:var(--serif);font-weight:600;font-size:1.5rem;letter-spacing:var(--track-h3);line-height:var(--lh-head)}
.rate-desc{margin-top:0.4rem;font-weight:var(--w-4);color:var(--lt-2);max-width:38em}
.rows-cta{margin-top:2rem}
@media (max-width:1240px){.tiers--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:991px){.tiers,.tiers--4{grid-template-columns:1fr}}
/* round 11: the Content pair mirrors the Diagnose-and-fix pair and stacks below 800 */
@media (min-width:801px){.tiers--pair{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.rows-table th,.rows-table td{padding:1.1rem 0.8rem}}