/* Pricing page only. Sitewide chrome/primitives live in base.css, nav.css, footer.css. */

/* PAGE HERO */
.pricing-hero { position: relative; overflow: hidden; background: var(--obsidian); color: var(--ivory); padding: 100px 0 80px; }
.pricing-hero h1 { margin-top: 18px; max-width: 700px; font-size: clamp(32px, 4.4vw, 52px); line-height: 1.16; color: var(--ivory); font-weight: 500; }

/* BUILD PRICE CARDS */
.price-cards { background: var(--ivory); }
.price-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--hair); border-left: 1px solid var(--hair); }
.price-full-card { border-right: 1px solid var(--hair); border-bottom: 1px solid var(--hair); padding: 38px 30px; display: flex; flex-direction: column; min-width: 0; }
.price-full-card h3 { margin-top: 14px; font-size: 21px; color: var(--obsidian); }
.price-full-card .amt { margin-top: 16px; font-family: var(--font-serif); font-size: 36px; font-weight: 500; color: var(--gold); }
.price-full-card ul { list-style: none; margin-top: 24px; border-top: 1px solid var(--hair); flex-grow: 1; }
.price-full-card li { padding: 12px 0; border-bottom: 1px solid var(--hair); font-size: 14.5px; color: var(--stone); }
.price-full-card p, .price-full-card li { overflow-wrap: break-word; }
.price-full-card .btn { margin-top: 28px; align-self: flex-start; }

/* MANAGED CARE */
.care-full { background: var(--obsidian); color: var(--ivory); }
.care-full-tiers { margin-top: 48px; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--hair-dark); }
.care-full-tier { padding: 34px 30px 0 0; border-right: 1px solid var(--hair-dark); }
.care-full-tier:last-child { border-right: none; padding-left: 30px; }
.care-full-tier h3 { font-size: 20px; color: var(--ivory); font-weight: 500; }
.care-full-tier .amt { margin-top: 16px; font-family: var(--font-serif); font-size: 38px; font-weight: 500; color: var(--gold); }
.care-full-tier p { margin-top: 12px; color: var(--fog); font-size: 14.5px; }

/* UPDATE SCOPE EXPLAINER */
/* Last section on the page, before the footer — needs its own bottom padding
   now that the generic `section{}` rule (base.css) only supplies top padding. */
.update-scope { background: var(--ivory); padding-bottom: 110px; }
.update-scope .section-head { margin-bottom: 0; }
.update-scope-body { margin-top: 24px; max-width: 720px; color: var(--stone); font-size: 16px; line-height: 1.9; }
.update-scope-body b { color: var(--obsidian); font-weight: 600; }

@media (max-width: 920px) {
  .pricing-hero { padding: 72px 0 56px; }
  .update-scope { padding-bottom: 64px; }
  .price-cards-grid { grid-template-columns: 1fr; }
  .care-full-tiers { grid-template-columns: 1fr; }
  .care-full-tier { border-right: none; border-bottom: 1px solid var(--hair-dark); padding: 0 0 26px; }
  .care-full-tier:last-child { padding: 26px 0 0; }
}