/* Pricing v3 — the Apple-style language for the two PRICING pages (agency pricing.php, Studio-Tools
   tools-pricing.php). Opt-in: class "pr3" on <main> + this sheet linked right after it.
   Both pages paint from one grey/blue SCALE token family (--grey-50…900, --blue-50…900, --green-*,
   --bg-*, --text-*, --border*). tools-pricing declares them on main.tp itself, so the remap sits at
   .pr3.pr3 (beats `.tp{…}`); pricing.php declares them on :root. --blue-700 is mostly TEXT (links,
   labels) → #0066cc; --blue-600 is text AND fill → fills that carry white type are pinned below. */

.pr3.pr3{
  --blue-900:#1d1d1f; --blue-800:#1d1d1f; --blue-700:#0066cc; --blue-600:#0066cc; --blue-500:#0071e3;   /* -600 is text on tints too: #0071e3 measured 4.36:1 there */ --blue-400:#2997ff;
  --blue-200:#cfe0f5; --blue-100:#e8f1fc; --blue-50:#f2f7fd;
  --green-700:#146c2e; --green-600:#1a7f37; --green-200:#bfe3c8; --green-50:#eaf6ed;
  --amber-700:#9a4a00; --amber-200:#f5d9a8; --amber-50:#fdf5ea;
  --grey-50:#f5f5f7; --grey-100:#f5f5f7; --grey-200:#d2d2d7; --grey-300:#d2d2d7; --grey-400:#636366; --grey-500:#636366;
  --grey-600:#424245; --grey-700:#424245; --grey-800:#1d1d1f; --grey-900:#1d1d1f;
  --white:#ffffff; --bg-base:#ffffff; --bg-card:#ffffff; --bg-section:#f5f5f7; --bg-dark:#1d1d1f; --bg-dark2:#000000;
  --text-primary:#1d1d1f; --text-secondary:#424245; --border:#d2d2d7; --border-blue:#cfe0f5;
  --shadow-xs:none; --shadow-sm:none; --shadow-md:none; --shadow-lg:none;
  --radius-md:14px; --radius-lg:18px; --radius-xl:22px;
  --link:#0066cc; --tint:rgba(0,113,227,.1); --tint-ink:#0055b3;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
  letter-spacing:-.011em; -webkit-font-smoothing:antialiased; background:#fff;
}
html.dark .pr3.pr3{
  --blue-900:#f5f5f7; --blue-800:#f5f5f7; --blue-700:#2997ff; --blue-600:#2997ff; --blue-500:#2997ff; --blue-400:#64b5ff;
  --blue-200:#1f3a5c; --blue-100:#10233a; --blue-50:#0b1a2c;
  --green-700:#30d158; --green-600:#30d158; --green-200:#1f4a2c; --green-50:#0f2a17;
  --amber-700:#ffb340; --amber-200:#4a3412; --amber-50:#2b1d08;
  --grey-50:#161617; --grey-100:#1d1d1f; --grey-200:#424245; --grey-300:#424245; --grey-400:#a1a1a6; --grey-500:#a1a1a6;
  --grey-600:#d2d2d7; --grey-700:#d2d2d7; --grey-800:#f5f5f7; --grey-900:#f5f5f7;
  --white:#1d1d1f; --bg-base:#000000; --bg-card:#1d1d1f; --bg-section:#161617; --bg-dark:#161617; --bg-dark2:#000000;
  --text-primary:#f5f5f7; --text-secondary:#d2d2d7; --border:#424245; --border-blue:#1f3a5c;
  --link:#2997ff; --tint:rgba(41,151,255,.18); --tint-ink:#64b5ff;
  background:#000;
}
body.site-2026:has(main.pr3){background:#fff}
html.dark body.site-2026:has(main.pr3){--v3-bg:#000;--v3-bg2:#161617;--v3-line:#424245;--v3-pop:#1d1d1f;background:#000 !important}
html.dark:has(main.pr3){background:#000 !important}

/* type: headings in the Apple weights, no gradient text, labels in sentence case */
.pr3.pr3 :is(h1,h2,h3){font-family:inherit;text-transform:none}
.pr3.pr3 h1{font-weight:600;letter-spacing:-.028em;line-height:1.06}
.pr3.pr3 h2{font-weight:600;letter-spacing:-.022em}
.pr3.pr3 h3{font-weight:600;letter-spacing:-.015em}
.pr3 :is(.tp-grad,.grad,.gradient-text,.text-gradient){background:none;-webkit-text-fill-color:currentColor;color:var(--grey-500)}

/* tools-pricing: hero label, buttons */
.pr3 .tp-pill,html.dark .pr3 .tp-pill{background:transparent;border:0;padding:0;color:var(--tint-ink);font-size:17px;font-weight:600;letter-spacing:-.01em;text-transform:none}
.pr3 .tp-pill .dot{display:none}
.pr3 .tp-cta{border-radius:980px;font-weight:400;font-size:17px;padding:11px 24px;transform:none;box-shadow:none}
.pr3 .tp-cta.primary,html.dark .pr3 .tp-cta.primary{background:#0071e3;color:#fff}
.pr3 .tp-cta.primary:hover{background:#0077ed;transform:none;box-shadow:none}
.pr3 .tp-cta.ghost,html.dark .pr3 .tp-cta.ghost{background:var(--tint);color:var(--tint-ink);box-shadow:none}
.pr3 .tp-cta.ghost:hover{background:rgba(0,113,227,.17);transform:none;box-shadow:none}

/* fills that carry WHITE type keep Apple's fill blue in both modes (dark lifts --blue-600 to a TEXT blue) */
.pr3 :is(.sample-cta-btn,.card-badge.badge-popular,.tracker-open-tag,.tracker-btn-primary,.step-num,.tp-badge,.tp-pcta.solid,.tp-sticky-btn.solid,.fbtn-primary,th.col-best),
html.dark .pr3 :is(.sample-cta-btn,.card-badge.badge-popular,.tracker-open-tag,.tracker-btn-primary,.step-num,.tp-badge,.tp-pcta.solid,.tp-sticky-btn.solid,.fbtn-primary,th.col-best){background:#0071e3;color:#fff;border-color:#0071e3}
.pr3 :is(.cc-save-badge,.tp-roi-save),html.dark .pr3 :is(.cc-save-badge,.tp-roi-save){background:#1a7f37;color:#fff}
/* typed colours that read too faint: the Starter card's cyan, the tracker chips */
.pr3 .pcard.starter :is(.plan-name,.monthly-price){color:#0e7490}
.pr3 .tracker-chip.orange{color:#9a4a00}
html.dark .pr3 .tracker-chip.orange{color:#ffb340}
html.dark .pr3 .tracker-chip.red{color:#ff6961}
html.dark .pr3 .tracker-chip.green{color:#30d158}
html.dark .pr3 .pill:is(.pill-payg,.pill-hours){background:var(--grey-100);color:var(--grey-600);border-color:var(--border)}
html.dark .pr3 .tp-ag-tag{background:var(--blue-50);color:var(--blue-700)}
/* panels painted with the darkest scale token turn near-WHITE in dark under white type — keep them dark */
html.dark .pr3 :is(.tracker-browser-bar,.cost-table thead th,.tp-ag,.tp-band){background:#1d1d1f}
html.dark .pr3 .tp-cta.light{background:#f5f5f7;color:#1d1d1f}
/* dark-2026.css paints these with its navy greys — Apple's dark greys instead */
html.dark body.site-2026 .pr3 :is(.choice-tag,.pcard,.save-badge,.scale-savings,.stp-sc-eyebrow,.stp-sc-card,.stp-sc-tag,.strip-section,
  .tracker-section,.tracker-browser,.tracker-point,.sp-pill,.trust-item,.who-card,.cert-group,.creds-bar,.cost-card,.cost-table-wrap,
  .savings-callout,.step-card,.calc-cta,.faq-item,.pm-step,.tp-cycle,.tp-plan,.tp-pcta.line,.tp-pfoot,.eyebrow,.tp-cmp,.row.head,.tp-detail,
  .tp-table,.tp-row.head,.tp-addons,.tp-faqi,.tp-sticky){background:var(--grey-100);border-color:var(--border)}
html.dark body.site-2026 .pr3 :is(.service-row,.best-for-box,.strip-icon,.cgt,td.col-best,.tp-lic-rule){background:var(--blue-50);border-color:var(--blue-200)}
/* the leftovers: dark-2026 pins .col-best with !important; the tracker chips and the "included" tags */
html.dark .pr3 td.col-best{background:var(--blue-50) !important;color:var(--grey-900)}
html.dark .pr3 th.col-best,.pr3 th.col-best{background:#0071e3 !important;color:#fff}
html.dark .pr3 .tracker-chip,html.dark .pr3 .tp-incl span{background:var(--grey-100);border-color:var(--border)}
html.dark .pr3 .pcard.starter :is(.plan-name,.monthly-price){color:#5ac8fa}