.pricing-page { --accent: #704b00; --label-secondary: #574f48; --label-tertiary: #655d56; background: var(--bg-primary); color: var(--label-primary); font-family: var(--font-sans); }
/* Page-local light tokens otherwise override the inherited dark palette (same values as the agency page). */
:root[data-theme="dark"] .pricing-page { --accent: #e5b94f; --label-secondary: #c7c1bb; --label-tertiary: #b6aea6; }
.pricing-shell { width: min(100% - 48px, 1180px); margin-inline: auto; }
.pricing-nav { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--separator-nonopaque); background: color-mix(in srgb, var(--bg-primary) 92%, transparent); backdrop-filter: blur(18px); }
.pricing-nav__inner { min-height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.pricing-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--label-primary); text-decoration: none; }
.pricing-brand img { display: block; }
.pricing-brand span { display: flex; flex-direction: column; line-height: 1.08; }
.pricing-brand strong { color: var(--brand-text); font-family: Nunito, var(--font-sans); font-size: 21px; font-weight: 800; }
.pricing-brand small { color: var(--label-tertiary); font-size: 9px; font-weight: 500; letter-spacing: .04em; }
.pricing-nav nav, .pricing-footer nav { display: flex; align-items: center; gap: 24px; }
.pricing-nav nav a, .pricing-footer a { color: var(--label-secondary); font-size: 14px; font-weight: 650; text-decoration: none; }
.pricing-nav nav a:hover, .pricing-footer a:hover { color: var(--accent); }
.pricing-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 20px; border: 2px solid var(--accent); border-radius: 999px; background: var(--accent); color: #fff; font-weight: 750; text-align: center; text-decoration: none; }
.pricing-button:hover { filter: brightness(.88); }
.pricing-button--compact { min-height: 42px; padding: 8px 17px; font-size: 14px; }
.pricing-button--secondary { background: transparent; color: var(--accent); }
.pricing-hero { background: radial-gradient(circle at 84% 18%, rgba(200,150,10,.14), transparent 34%), linear-gradient(180deg, var(--bg-secondary), var(--bg-primary)); }
.pricing-hero__inner { display: flex; min-height: 610px; flex-direction: column; align-items: center; justify-content: center; padding-block: 92px; text-align: center; }
.pricing-eyebrow { margin: 0 0 16px; color: var(--accent); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.pricing-hero h1 { max-width: 13ch; margin: 0; font-size: clamp(48px, 7vw, 82px); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.pricing-lede { max-width: 650px; margin: 28px 0 0; color: var(--label-secondary); font-size: 19px; line-height: 1.62; }
.billing-toggle { display: inline-flex; gap: 4px; margin: 36px 0 0; padding: 4px; border: 1px solid var(--separator-nonopaque); border-radius: 999px; background: var(--bg-grouped-primary); }
.billing-toggle legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.billing-toggle button { min-height: 44px; padding: 9px 16px; border: 0; border-radius: 999px; background: transparent; color: var(--label-secondary); font: inherit; font-weight: 750; cursor: pointer; }
.billing-toggle button[aria-pressed="true"] { background: var(--label-primary); color: var(--bg-primary); }
.billing-toggle span { margin-left: 4px; font-size: 11px; }
.pricing-terms-summary { max-width: 680px; margin: 18px 0 0; color: var(--label-tertiary); font-size: 13px; line-height: 1.55; }
.pricing-section { padding-block: 104px; scroll-margin-top: 76px; }
.section-heading { max-width: 720px; }
.section-heading .billing-toggle { margin-top: 26px; }
.section-heading h2, .terms-grid h2 { margin: 0; font-size: clamp(36px, 5vw, 56px); line-height: 1.04; letter-spacing: -.045em; text-wrap: balance; }
.plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 52px; }
.plan-card { display: flex; min-width: 0; flex-direction: column; padding: 30px; border: 1px solid var(--separator-nonopaque); border-radius: 24px; background: var(--bg-grouped-primary); box-shadow: var(--shadow-1); }
.plan-card--featured { border: 2px solid var(--accent); box-shadow: var(--shadow-2); }
.plan-card h3 { margin: 4px 0 0; font-size: 30px; line-height: 1.1; }
.plan-kicker { margin: 0; color: var(--label-tertiary); font-size: 12px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.plan-price { display: flex; align-items: baseline; gap: 7px; margin: 28px 0 0; }
.plan-price span { font-size: 48px; font-weight: 850; letter-spacing: -.045em; transition: none; }
.plan-price small, .plan-billed { color: var(--label-tertiary); }
.plan-billed { min-height: 20px; margin: 2px 0 0; font-size: 12px; }
.plan-card ul { display: grid; flex: 1; gap: 11px; margin: 28px 0; padding-left: 20px; color: var(--label-secondary); font-size: 14px; line-height: 1.45; }
.plan-option { display: grid; }
.plan-option + .plan-option { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--separator-nonopaque); }
.plan-apply { margin-top: auto; }
.plan-option:last-of-type { margin-bottom: 24px; }
.pilot-places { display: inline-flex; align-items: center; gap: 8px; margin: 16px 0 0; padding: 6px 14px; border-radius: 999px; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--label-primary); font-size: 14px; font-weight: 700; }
.pilot-places::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #2e9d57; }
.pilot-places[data-state="full"]::before { background: #c9861a; }
.pricing-lede + .pricing-button { margin-top: 28px; }
.checkout-terms { margin: 10px 2px 0; color: var(--label-tertiary); font-size: 11px; line-height: 1.45; }
.plan-card--developer { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(180px,.5fr) minmax(280px,1fr) auto; gap: 30px; align-items: center; }
.plan-card--developer > p { margin: 0; color: var(--label-secondary); line-height: 1.55; }
.developer-callout { color: var(--label-primary) !important; font-size: 28px; font-weight: 850; }
.pricing-section--quiet { background: var(--bg-secondary); }
.terms-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 90px; }
.terms-copy { display: grid; gap: 20px; }
.terms-copy p { margin: 0; color: var(--label-secondary); font-size: 16px; line-height: 1.65; }
.pricing-footer { border-top: 1px solid var(--separator-nonopaque); background: var(--bg-grouped-primary); }
.pricing-footer .pricing-shell { display: flex; min-height: 110px; align-items: center; justify-content: space-between; gap: 28px; }
.pricing-footer p { max-width: 650px; margin: 0; color: var(--label-tertiary); font-size: 12px; line-height: 1.55; }
.pricing-page a:focus-visible, .pricing-page button:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
[hidden] { display: none !important; }
@media (max-width: 900px) { .plan-grid { grid-template-columns: 1fr 1fr; } .plan-card--developer { grid-column: 1 / -1; grid-template-columns: 1fr; } .terms-grid { grid-template-columns: 1fr; gap: 42px; } }
@media (max-width: 680px) { .pricing-shell { width: min(100% - 32px, 1180px); } .pricing-nav__inner { min-height: 64px; } .pricing-nav nav { display: none; } .pricing-nav .pricing-button { display: none; } .pricing-hero__inner { min-height: 540px; padding-block: 70px; } .pricing-hero h1 { font-size: clamp(42px, 14vw, 60px); } .billing-toggle span { display: block; margin: 1px 0 0; } .plan-grid { grid-template-columns: 1fr; } .plan-card--developer { grid-column: auto; } .pricing-section { padding-block: 76px; } .pricing-footer .pricing-shell { align-items: flex-start; flex-direction: column; justify-content: center; padding-block: 28px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0s !important; animation-duration: 0s !important; } }
.pricing-footer .preferred-source--footer { min-height: 0; border-top: 0; border-bottom: 1px solid var(--separator-nonopaque); }