/* A compact pricing chapter using the landing page’s shared shell and tokens. */
.pricingPage .siteHeader{transform:translateX(-50%);--shell-offset:0px}
.pricingPage .siteNav a[aria-current]{color:var(--accent-ink)}
.pricingPage h1,.pricingPage h2{margin:0;font-weight:400;letter-spacing:-.04em;line-height:1;text-wrap:balance}
.pricingPage h1{font-size:clamp(32px,4vw,56px)}
.pricingPage h2{font-size:clamp(30px,3.4vw,48px)}
.pricingPage p{font-size:16px;line-height:1.65}
.pricingOffers{padding-top:125px;padding-bottom:42px}
.offerStatus{font-size:13px!important;color:var(--muted);margin:18px 0 24px}
.pricingTiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3.5vw,56px);margin-top:32px}
.pricingTier{display:flex;flex-direction:column;min-width:0;padding-top:24px}
.pricingPage .tierName{font-size:16px;font-weight:700;letter-spacing:0;line-height:1.35}
.pricingTier:nth-child(n+2) .tierName{color:var(--accent-ink)}
.pricingPage .price{font-size:clamp(42px,4vw,56px);font-weight:700;letter-spacing:-.04em;margin:16px 0 10px;line-height:1;font-variant-numeric:tabular-nums}
.pricingPage .priceTerm{font-size:13px;margin:0;line-height:1.5;color:var(--muted)}
.tierDescription{padding-block:30px}
.tierDescription h3{font-size:clamp(18px,1.65vw,22px);font-weight:600;letter-spacing:-.025em;line-height:1.3;margin:0 0 14px;text-wrap:balance}
.tierDescription p{font-size:15px;line-height:1.7;margin:0;color:var(--muted)}
.tierFeatures{list-style:none;padding:18px 0 0;margin:0;margin-top:auto}
.tierFeatures li{font-size:13px;line-height:1.6;padding-block:5px}
.tierFeatures a{text-decoration:underline;text-underline-offset:4px}
.offerFootnotes{display:flex;align-items:center;justify-content:space-between;gap:32px;margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.offerFootnotes p{font-size:13px;margin:0;max-width:65ch;color:var(--muted)}
.offerFootnotes .actionLink{flex-shrink:0;font-size:14px}
.pricingPage .offerSmall{font-size:12px;color:var(--muted);margin:18px 0 0;max-width:115ch;line-height:1.6}
.extractionNote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:6vw;align-items:center;padding-block:60px;background:#090b0c;color:#eff3f0;scroll-margin-top:110px}
.extractionCopy h2{margin-bottom:24px}
.extractionNote p{margin:0 0 18px;color:#b7bfba;max-width:58ch}.extractionNote strong{color:#eff3f0}
.creditDetails{margin-top:24px;padding-top:12px}
.creditDetails summary{cursor:pointer;padding-block:8px;font-size:13px;font-weight:600;color:#b7bfba}
.creditDetails summary:hover{color:var(--accent-on-dark)}
.creditDetails p{font-size:13px;margin:10px 0 0}
.pricingTerms{padding-top:8px;padding-bottom:40px;display:flex;align-items:end;justify-content:space-between;gap:40px}
.pricingPage .pricingTerms h2{font-size:20px;font-weight:600;line-height:1.3;letter-spacing:-.02em;margin-bottom:14px}
.pricingTerms p{font-size:14px;color:var(--muted);margin:0 0 10px;max-width:72ch}
.pricingTerms p:last-child{margin-bottom:0}
.pricingTerms a{font-size:13px;white-space:nowrap;text-decoration:underline;text-underline-offset:4px;padding-block:8px}
.pricingPage a:focus-visible,.creditDetails summary:focus-visible{outline:2px solid var(--accent-ink);outline-offset:5px}
.extractionNote a:focus-visible,.creditDetails summary:focus-visible{outline-color:var(--accent-on-dark)}
@media(max-width:760px){.pricingOffers{padding-top:110px;padding-bottom:30px}.offerStatus{margin:12px 0 18px;font-size:12px!important}.pricingTiers{grid-template-columns:1fr;gap:32px;margin-top:24px}.pricingTier{padding-top:24px}.tierDescription{padding-block:24px}.tierDescription h3{font-size:22px}.tierDescription p{max-width:60ch}.tierFeatures{padding-top:14px}.offerFootnotes{display:block}.offerFootnotes .actionLink{margin-top:18px}.extractionNote{grid-template-columns:1fr;gap:32px;padding-block:40px}.pricingTerms{display:block}.pricingTerms a{display:inline-block;margin-top:14px}}
@media(prefers-reduced-motion:reduce){.pricingPage{scroll-behavior:auto}}

/* Keep the comparison on one continuous surface in both themes. */
.extractionExample{width:100%;max-width:680px;margin:0;justify-self:center}
/* The file is cropped to the card, so this frames rather than crops. The
   previous rule carried a zoom and two negative offsets tuned to one specific
   screenshot, which meant swapping the capture silently re-framed it. Replacing
   the image is now a file swap and nothing else. */
/* The radius is a PERCENTAGE because it has to match the radius already drawn
   on the card inside the screenshot, and that one scales with the image. The
   card is 2076x1398 inside the capture and its own radius is ~55px, so 2.65%
   / 3.93%. The value used is 12% larger, which clips marginally INTO the card's
   corner on purpose: under-clipping leaves a light background sliver that reads
   as a second arc, while over-clipping a dark rounded corner is invisible.
   Measured off the source, not estimated — an earlier 42px estimate came from a
   brightness threshold and was wrong, which is what produced the double arc. */
/* Percentage, and two values, because the rounded corner is already drawn INTO
   the capture and has to scale with the rendered width. The card is 2076x1400
   inside the file and its corner is a 64px circle: 3.08% / 4.57%. Used 8%
   larger so it clips marginally into the card rather than leaving a light
   sliver outside it, which is what reads as a second arc. Same figure and
   same value as the guide's .shotCard; change both together. */
.extractionImage{overflow:hidden;border-radius:3.33% / 4.94%;background:#202626}
.extractionImage img{display:block;width:100%;height:auto}
.pricingPalm{margin:0;padding-top:48px;padding-bottom:28px}
.pricingPalm>div{overflow:hidden;border-radius:16px;background:#fff}
.pricingPalm img{display:block;width:100%;height:auto;aspect-ratio:16/7;object-fit:cover;object-position:50% 37%}
@media(max-width:760px){.pricingPalm{padding-top:28px}.pricingPalm img{aspect-ratio:4/3}}