.pricing-section{--pricing-background-rest:1;position:relative;isolation:isolate;background:var(--cream);padding:72px 32px;scroll-margin-top:110px}
/* Figma's inset surface expands independently of the heading and cards. */
.pricing-section::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--brand);clip-path:inset(calc(40px * var(--pricing-background-rest)) calc(clamp(12px,4.17vw,80px) * var(--pricing-background-rest)) round calc(32px * var(--pricing-background-rest)))}
@media(prefers-reduced-motion:reduce){.pricing-section{--pricing-background-rest:0!important}}
.pricing-section>h2{margin:0 0 72px;color:var(--cream);font-size:24px;font-weight:800;line-height:34px;text-align:center}
.pricing-grid{max-width:1159px;margin:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;align-items:center}
.pricing-card{--plan-color:#4e789f;--plan-fill:#fffff1;--smooth-fill:var(--plan-fill);color:var(--plan-color);background:var(--plan-fill);border-radius:24px;min-height:566px;padding:22px 32px 32px;display:flex;flex-direction:column}
.pricing-card header{text-align:center}
.pricing-card h3{font-size:24px;font-weight:800;line-height:34px;margin:0 0 16px}
.pricing-amount{display:flex;align-items:baseline;justify-content:center;margin:0;line-height:1}
.pricing-currency{font-size:32px;font-weight:500;align-self:flex-start;margin:16px 4px 0 0}
.pricing-amount strong{font-size:80px;font-weight:800}
.pricing-period{font-size:16px;opacity:.5}
.pricing-offer{font-size:16px;line-height:22px;font-weight:600;color:#8e8e87;margin:8px 0 0}
.pricing-card ul{list-style:none;padding:31px 0 0;margin:32px 0;border-top:1px solid color-mix(in srgb,var(--plan-color) 25%,transparent);display:grid;gap:12px}
.pricing-card li{display:flex;gap:9px;align-items:flex-start;font-size:16px;line-height:24px;font-weight:600}
.pricing-card li img{flex-shrink:0}
.pricing-card .pricing-cta{--smooth-fill:var(--plan-color);--smooth-stroke:transparent;color:var(--plan-fill);background:var(--plan-color);border:0;border-radius:30px;align-self:center;margin-top:auto;min-height:48px;font-size:16px}
.pricing-card .pricing-cta:hover{--smooth-fill:var(--plan-color);opacity:.85}
.pricing-standard{--plan-color:var(--brand);--plan-fill:var(--cream);min-height:700px;padding-top:32px}
.pricing-standard .pricing-amount strong{font-size:96px}
.pricing-premium{--plan-color:#fffff1;--plan-fill:#7fa2c1}
.pricing-premium h3{margin-bottom:6px}
.pricing-custom{font-size:48px;line-height:48px;font-weight:800;margin:0}
.pricing-premium .pricing-offer{color:#fffff199;margin-top:12px}
.pricing-premium .pricing-cta{color:#4e789f}
.pricing-card{position:relative;transform-origin:center;transition:transform 400ms cubic-bezier(.22,1,.36,1)}
@media(hover:hover) and (pointer:fine){.pricing-card:hover{transform:scale(1.035);z-index:1}}
@media(prefers-reduced-motion:reduce){.pricing-card{transition:none}}
@media(max-width:1100px){.pricing-section{padding:96px 24px 64px}.pricing-grid{gap:20px}.pricing-card{padding-left:20px;padding-right:20px}}
@media(max-width:900px){.pricing-grid{grid-template-columns:1fr;max-width:420px;gap:24px}.pricing-section{padding:64px 24px}.pricing-card,.pricing-standard{min-height:0;padding:32px}.pricing-card ul{margin-bottom:32px}.pricing-card .pricing-cta{margin-top:0}.pricing-standard .pricing-amount strong{font-size:80px}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}