/* pricing.html only — loaded after site.css. Classes are prefixed pr- so nothing here collides with the legacy
   .price/.tier/.addon/.pfaq/.pending rules still in site.css. Light theme only; the site's tokens are reused as-is. */

.pr{padding-block:0 28px}

/* draft notice: one quiet line */
.draftbar{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin:12px 0 0;padding:6px 12px;border:1px solid var(--brand-200);background:var(--brand-50);color:var(--brand-800);font-size:13px;font-weight:500;line-height:1.4}
.draftbar b{font-weight:700;letter-spacing:.04em}

/* intro */
.pr-intro{display:grid;gap:12px;padding:22px 0 14px}
.pr-h1__b{display:block}
@media (max-width:699px){.pr-h1__b{display:inline}}
.pr-intro .hero__eyebrow{margin-bottom:6px}
.pr-intro h1{font-size:clamp(1.7rem,2.6vw,2.25rem);letter-spacing:-.03em;line-height:1.08;max-width:44ch;color:var(--ink)}
.pr-intro__terms{font-size:15px;line-height:1.45;color:var(--ink-soft);max-width:40ch}
@media (min-width:900px){
  .pr-intro{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:32px}
  .pr-intro__terms{text-align:right;padding-bottom:5px}
}

/* folder tabs, attached to the sheet below */
.pr-tabs{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.pr-tab{position:relative;display:grid;gap:3px;justify-items:start;text-align:left;min-width:0;margin:0;padding:11px 18px 12px;border:1px solid var(--line);border-bottom:0;border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--quiet);color:var(--ink-soft);font-family:var(--font-sans);cursor:pointer;transition:background-color .16s ease,color .16s ease}
.pr-tab:hover{background:#eef3f9;color:var(--ink)}
.pr-tab:focus-visible{outline:2px solid var(--brand-600);outline-offset:-5px}
.pr-tab__name{font:600 17px/1.2 var(--font-display);letter-spacing:-.015em}
.pr-tab__sum{font-size:13.5px;line-height:1.35;text-wrap:pretty}
.pr-tab[aria-selected="true"]{background:#fff;color:var(--ink);cursor:default}
.pr-tab[aria-selected="true"] .pr-tab__name{color:var(--brand-700)}
.pr-tab[aria-selected="true"]::before{content:"";position:absolute;left:18px;top:-1px;width:34px;height:3px;border-radius:0 0 3px 3px;background:var(--brand-600)}
.pr-tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#fff}

/* the sheet that holds the active tab */
.pr-sheet{position:relative;display:grid;gap:16px;min-width:0;padding:20px 24px;background:#fff;border:1px solid var(--line);border-radius:0 0 var(--r-xl) var(--r-xl);box-shadow:var(--shadow-md)}
.pr-sheet__h{font-size:1.25rem;letter-spacing:-.02em}
.js .pr-sheet__h{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html:not(.js) .pr-tabs{display:none}
html:not(.js) .pr-sheet{margin-top:16px;border-radius:var(--r-xl)}

/* the family journey: three stops on one thread */
.pr-journey{--gap:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);padding:2px 0 4px}
.pr-step{position:relative;min-width:0;padding-top:24px}
.pr-step::before{content:"";position:absolute;z-index:1;left:0;top:0;width:13px;height:13px;border-radius:50%;background:#fff;border:1.5px solid var(--brand-400)}
.pr-step:not(:last-child)::after{content:"";position:absolute;top:6px;left:16px;right:calc(var(--gap) * -1);height:1.5px;background:var(--rule)}
.pr-step--lit::before{background:var(--brand-600);border-color:var(--brand-600);box-shadow:0 0 0 4px rgba(30,111,232,.14)}
.pr-step__k{font:600 14px/1.3 var(--font-display);letter-spacing:-.01em;color:var(--ink-soft)}
.pr-amt{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-top:4px;font:700 2.15rem/1 var(--font-display);letter-spacing:-.035em;color:var(--ink)}
.pr-amt small{font:600 14px/1.3 var(--font-sans);letter-spacing:0;color:var(--ink-soft)}
.pr-amt--text{font-size:1.6rem;letter-spacing:-.025em}
.pr-step__alt{margin-top:5px;font-size:14px;font-weight:600;color:var(--brand-700)}
.pr-step__d{margin-top:5px;font-size:13.5px;line-height:1.45;color:var(--ink-soft);max-width:36ch}
.pr-step__d b{color:var(--ink);font-weight:700}

/* comparison matrix */
.pr-matrix-wrap{position:relative;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.pr-matrix{width:100%;min-width:640px;border-collapse:collapse;font-size:14px;line-height:1.35}
.pr-matrix caption{caption-side:bottom;padding-top:9px;text-align:left;font-size:13px;line-height:1.45;color:var(--ink-soft)}
.pr-matrix th,.pr-matrix td{padding:8px 10px;border-bottom:1px solid var(--line-soft);text-align:center;vertical-align:middle}
.pr-matrix thead th{padding:6px 10px 9px;border-bottom:1px solid var(--line);vertical-align:bottom;font:600 14px/1.2 var(--font-display);letter-spacing:-.01em;color:var(--ink)}
.pr-matrix thead th small{display:block;margin-top:3px;font:600 12.5px/1.3 var(--font-sans);letter-spacing:0;color:var(--ink-soft)}
.pr-matrix th[scope="row"]{width:40%;text-align:left;font:500 14px/1.35 var(--font-sans);color:var(--ink)}
.pr-matrix th[scope="row"] small{font-size:12.5px;color:var(--ink-faint)}
.pr-matrix thead th:first-child{text-align:left}
.pr-matrix col.pr-col--stop{background:var(--brand-50)}
.pr-matrix .ck{display:inline-block;width:18px;height:18px;padding:3px;margin:0;vertical-align:middle}
.pr-matrix .pr-no{color:var(--ink-faint)}
.pr-matrix .pr-ro{display:inline-block;padding:2px 9px;border-radius:var(--r-full);border:1px solid var(--brand-200);background:#fff;color:var(--brand-800);font-size:12.5px;font-weight:600;line-height:1.35;white-space:nowrap}
.pr-matrix__hint{display:none}

/* notes + call to action */
.pr-act{display:grid;gap:14px 20px;align-items:center;padding-top:14px;border-top:1px solid var(--line-soft)}
.pr-notes{display:grid;gap:10px 20px}
.pr-notes li{padding-left:12px;border-left:2px solid var(--brand-200);font-size:13.5px;line-height:1.45;color:var(--ink-soft)}
.pr-notes b{color:var(--ink);font-weight:600}
.pr-act .btn{justify-self:start}
@media (min-width:900px){
  .pr-act{grid-template-columns:minmax(0,1fr) auto}
  .pr-notes{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pr-act .btn{justify-self:end}
}

/* professionals */
.pr-pro{display:grid;gap:12px}
.pr-card{display:grid;gap:8px;align-content:start;min-width:0;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card-muted)}
.pr-card--seat{background:linear-gradient(180deg,var(--brand-50),#fff 60%);border-color:var(--brand-200)}
.pr-card h3{font-size:1.05rem;letter-spacing:-.015em;line-height:1.2}
.pr-card .pr-amt{margin-top:0}
.pr-card p:not(.pr-amt){font-size:14px;line-height:1.45;color:var(--ink-soft)}
.pr-outs{display:grid;gap:7px;margin-top:2px}
.pr-outs li{display:flex;gap:9px;font-size:14px;line-height:1.4;color:var(--ink-soft)}
.pr-outs .ck{width:18px;height:18px;padding:3px;margin-top:1px}
.pr-card .btn{justify-self:start;margin-top:6px}
@media (min-width:860px){
  .pr-pro{grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-auto-rows:auto}
  .pr-card--seat{grid-row:1 / span 2}
}

/* questions */
.pr-faq{display:grid;gap:8px;margin-top:22px}
.pr-faq h2{font-size:1.15rem;letter-spacing:-.02em}
.pr-faq__grid{display:grid;gap:0 32px}
.pr-q{border-top:1px solid var(--line)}
.pr-q summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 2px 11px 0;list-style:none;font:600 15px/1.3 var(--font-display);letter-spacing:-.01em;color:var(--ink);cursor:pointer}
.pr-q summary::-webkit-details-marker{display:none}
.pr-q summary::after{content:"";flex:none;width:8px;height:8px;margin:0 6px 3px 0;border-right:1.5px solid var(--ink-faint);border-bottom:1.5px solid var(--ink-faint);transform:rotate(45deg);transition:transform .2s ease}
.pr-q[open] summary::after{transform:rotate(-135deg);margin-bottom:-3px}
.pr-q summary:hover{color:var(--brand-700)}
.pr-q p{padding:0 0 14px;font-size:14px;line-height:1.5;color:var(--ink-soft);max-width:62ch}
@media (min-width:860px){
  .pr-faq__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pr-q:nth-child(-n+2){border-top:1px solid var(--line)}
}

/* decisions pending: deliberately quiet, closed by default */
.pr-draft{margin-top:16px;border:1px dashed var(--line);border-radius:var(--r-md);color:var(--ink-faint);font-size:13px}
.pr-draft summary{display:flex;align-items:center;gap:8px;padding:7px 12px;list-style:none;font-weight:600;color:var(--ink-faint);cursor:pointer}
.pr-draft summary::-webkit-details-marker{display:none}
.pr-draft summary::before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .2s ease}
.pr-draft[open] summary::before{transform:rotate(45deg)}
.pr-draft summary:hover{color:var(--ink-soft)}
.pr-draft ul{display:grid;gap:3px;padding:2px 14px 10px 30px;list-style:disc;color:var(--ink-soft);line-height:1.45}

/* narrow screens */
@media (max-width:899px){
  .pr-journey{grid-template-columns:1fr;gap:18px}
  .pr-step{padding-top:0;padding-left:26px}
  .pr-step::before{top:3px}
  .pr-step:not(:last-child)::after{top:19px;bottom:-18px;left:6px;right:auto;width:1.5px;height:auto}
  .pr-step__d{max-width:none}
  .pr-sheet{padding:18px 16px}
  .pr-tabs{gap:4px}
  .pr-tab{padding:10px 12px 12px}
  .pr-tab__name{font-size:15.5px}
  .pr-tab__sum{font-size:12.5px}
  .pr-matrix{min-width:600px}
  .pr-matrix th[scope="row"]{position:sticky;left:0;z-index:1;width:auto;min-width:168px;max-width:200px;background:#fff;box-shadow:inset -1px 0 0 var(--line-soft)}
  .pr-matrix thead th:first-child{position:sticky;left:0;z-index:2;background:#fff}
  .pr-matrix thead th small{display:none}
  .pr-matrix__hint{display:block;font-size:12.5px;color:var(--ink-faint)}
  .pr-matrix caption{padding-top:8px}
}
@media (max-width:420px){
  .pr-sheet{padding:16px 14px}
  .pr-card{padding:16px}
  .pr-amt{font-size:2rem}
}

/* note under the matrix lives outside the horizontal scroller so it wraps on phones */
.pr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pr-matrix__note{margin:9px 0 0;font-size:13px;line-height:1.45;color:var(--ink-soft)}