1<!DOCTYPE html><!-- Last Published: Fri Oct 02 2026 12:23:51 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="outseta-2024.webflow.io" data-wf-page="6a84a4109b19e301c1f89597" data-wf-site="663cf90ca192fe7e5bcb8bd7" lang="en"><head><meta charset="utf-8"/><link href="https://cdn.prod.website-files.com" rel="preconnect" crossorigin="anonymous"/><title>Pricing | Outseta</title><meta content="Grow your membership with fewer tools and lower fees. No contracts and no per user fees. Try free." name="description"/><meta content="Pricing | Outseta" property="og:title"/><meta content="Grow your membership with fewer tools and lower fees. No contracts and no per user fees. Try free." property="og:description"/><meta content="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/67043a32f6c2257015aaa4ad_og-homepage.jpg" property="og:image"/><meta content="Pricing | Outseta" name="twitter:title"/><meta content="Grow your membership with fewer tools and lower fees. No contracts and no per user fees. Try free." name="twitter:description"/><meta content="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/67043a32f6c2257015aaa4ad_og-homepage.jpg" name="twitter:image"/><meta property="og:type" content="website"/><meta content="summary_large_image" name="twitter:card"/><meta content="width=device-width, initial-scale=1" name="viewport"/><meta content="rkbLA5nWQxG_4mhY9Kyi1lGFRxUYUIUm5USbQXCIyfY" name="google-site-verification"/><link href="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/css/outseta-2024.shared.9718bbe91.min.css" rel="stylesheet" type="text/css" integrity="sha384-lxi76RwxJXkPkkNTv3x/KRbiBBqApz6WNwUlkctdIllsY2FEOcb1HxbRUQIsi5Pa" crossorigin="anonymous"/><style>html.w-mod-js:not(.w-mod-ix3) :is(:is(*:has(> :is(.tooltip1_element-wrapper, .tooltip1_element-wrapper)) > .tooltip1_tooltip-wrapper:not(:is(.tooltip1_element-wrapper, .tooltip1_element-wrapper)), *:has(> :is(.tooltip1_element-wrapper, .tooltip1_element-wrapper) ~ :is(.tooltip1_element-wrapper, .tooltip1_element-wrapper)) > .tooltip1_tooltip-wrapper)) {visibility: hidden !important;}</style><link href="https://fonts.googleapis.com" rel="preconnect"/><link href="https://fonts.gstatic.com" rel="preconnect" crossorigin="anonymous"/>
1<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js" type="text/javascript"></script>
1<script type="text/javascript">WebFont.load({ google: { families: ["Caveat:300,400,500,600,700","Caveat Brush:300,400,500,600,700","Chakra Petch:300,400,500,600,700","Fraunces:300,400,500,600,700","Geist Mono:300,400,500,600,700","Permanent Marker:300,400,500,600,700"] }});</script>
1<script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
1<link href="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66eecaacfd5fecee18b038f8_favicon.svg" rel="shortcut icon" type="image/x-icon"/><link href="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/67379fb5cb6c37c64792aa02_webclip-2.png" rel="apple-touch-icon"/><link href="https://www.outseta.com/pricing" rel="canonical"/>
1<script type="application/ld+json"> 2{ 3 "@context": "https://schema.org", 4 "@type": "FAQPage", 5 "mainEntity": [ 6 { 7 "@type": "Question", 8 "name": "What are transaction fees and how are they calculated?", 9 "acceptedAnswer": { 10 "@type": "Answer", 11 "text": "Transaction fees are what you pay each time a customer's payment is processed. With Outseta, you'll pay Stripe's standard fees (typically 2.9% + 30¢ in the US) plus Outseta's feeâ2% on our entry level plan, 1% on all other plans." 12 } 13 }, 14 { 15 "@type": "Question", 16 "name": "How does Outseta's pricing compare to other membership software?", 17 "acceptedAnswer": { 18 "@type": "Answer", 19 "text": "Outseta is priced similarly to alternatives like Memberstack or Memberspace, but includes more features for the entire customer lifecycleâpayments, authentication, gated content, CRM, email, and support tools. Our transaction fees (2% starter, 1% on higher plans) are among the lowest in the industry and decrease as your business grows." 20 } 21 }, 22 { 23 "@type": "Question", 24 "name": "What does \"no per-user fees\" mean?", 25 "acceptedAnswer": { 26 "@type": "Answer", 27 "text": "You can invite unlimited team members to use Outseta at no extra cost. Add your developer to handle integrations, your community manager to respond to support tickets, your co-founder to manage reporting. Everyone gets their own login. Whether you have 2 people or 20 people on your team, your price stays the same. Most tools charge $10-50 per user per month." 28 } 29 }, 30 { 31 "@type": "Question", 32 "name": "Does Outseta require a contract or long-term commitment?", 33 "acceptedAnswer": { 34 "@type": "Answer", 35 "text": "No contracts. Ever. You can cancel anytimeâmonthly or annual plans both let you walk away when you want. Outseta's pricing is designed for founders and business owners who want flexibility." 36 } 37 }, 38 { 39 "@type": "Question", 40 "name": "What's included in the free trial?", 41 "acceptedAnswer": { 42 "@type": "Answer", 43 "text": "You get full access to all featuresâCRM, billing, email marketing, help desk, and authenticationâfor 7 days. Your trial converts to a paid plan after 7 days unless you cancel. We'll send you an email reminder before you're charged." 44 } 45 } 46 ] 47} 48</script>
vendor: 86 bytes, line 48
48<script src="https://www.google.com/recaptcha/api.js" type="text/javascript"></script>
48<!---⨠Custom UTM Snippet ---->
49<script> 50 var UtmValues = JSON.parse(localStorage.getItem("outseta.utm")); 51 if (!UtmValues) { 52 var params = new URL(window.location).searchParams; 53 var UtmSource = params.get("utm_source"); 54 var UtmCampaign = params.get("utm_campaign"); 55 var UtmMedium = params.get("utm_medium"); 56 if (UtmSource || UtmCampaign || UtmMedium) { 57 // Sets first touch UTM values if one is present 58 UtmValues = { UtmSource, UtmCampaign, UtmMedium }; 59 localStorage.setItem("outseta.utm", JSON.stringify(UtmValues)); 60 } 61 } 62</script>
62 63<!--- Custom UTM Snippet ⨠----> 64 65<!--- ⨠Start: Custom Referring Domain Snippet ---->
66<script> 67 var ReferringDomain = localStorage.getItem("o-snippet.referring-domain"); 68 if (!ReferringDomain && document.referrer) { 69 const ReferrerURL = new URL(document.referrer); 70 // Sets first touch Referrer value if one is present 71 ReferringDomain = ReferrerURL.hostname; 72 localStorage.setItem("o-snippet.referring-domain", ReferringDomain); 73 } 74</script>
74 75<!--- Custom Referring Domain Snippet: End ⨠----> 76 77<!-- Optibase Script -->
78<script src="https://app.optibase.io/script.js" public-api-key="cmdesc5t00q6qlb07r20aoiby"></script>
78 79 80<!-- Outseta quick start script -->
81<script> 82 var o_options = { 83 domain: 'go.outseta.com', 84 load: 'auth,customForm,emailList,support,leadCapture', 85 support: { 86 selector: '#support' 87 }, 88 auth: { 89 registrationDefaults: { 90 Account: { 91 ...UtmValues, 92 ReferringDomain, 93 } 94 }, 95 requireProduct: true, 96 requireProductSignupUrl: 'https://www.outseta.com/pricing' 97 } 98 }; 99</script>
99 100 101<!-- Outseta External Script -->
102<script src="https://cdn.outseta.com/outseta.min.js" data-options="o_options"></script>
102 103 104<!-- Custom CSS that shouldn't be in the global embed --> 105<style> 106 body { 107 -webkit-font-smoothing: antialiased; 108 -moz-font-smoothing: antialiased; 109 -o-font-smoothing: antialiased; 110 } 111 112 /*Text Selection Color*/ 113 ::selection { 114 background: var(--colors-general--primary); 115 color: var(--colors-page-wrapper--text); 116 } 117 ::-moz-selection { 118 background: var(--colors-general--primary); 119 color: var(--colors-page-wrapper--text); 120 } 121 122 /*Reset apple form styles*/ 123 input, textarea, select { 124 -webkit-appearance: none; 125 -moz-appearance: none; 126 appearance: none; border-radius: 0; 127 background-image: none; 128 } 129</style> 130 131<!-- [Attributes by Finsweet] Input Active Class -->
132<script defer src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-inputactive@1/inputactive.js"></script>
132 133 134<!-- GSAP -->
135<script defer src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
135 136 137<!-- General custom JS -->
138<script defer src="https://cdn.jsdelivr.net/gh/outseta/[email protected]/general.js"></script>
138 139 140<!-- Rewardful Script -->
141<script>(function(w,r){w._rwq=r;w[r]=w[r]||function(){(w[r].q=w[r].q||[]).push(arguments)}})(window,'rewardful');</script>
vendor: 1 bytes, line 141
141
142<script async src='https://r.wdfl.co/rw.js' data-rewardful='b43c8a'></script>
142 143 144<!-- Plausible Analytics Script -->
145<script defer data-domain="outseta.com" src="https://plausible.io/js/script.js"></script>
145 146 147<!-- [Attributes by Finsweet] Copy to clipboard -->
148<script defer src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-copyclip@1/copyclip.js"></script>
148 149 150</head><body><div class="page-wrapper"><div class="styles__global-embed-code"><div class="u-d-none w-embed"><!-- Phosphor Icon Fonts --> 151<link rel="stylesheet" href="https://unpkg.com/@phosphor-icons/[email protected]/src/regular/style.css" /> 152<link rel="stylesheet" href="https://unpkg.com/@phosphor-icons/[email protected]/src/bold/style.css" /> 153<link rel="stylesheet" href="https://unpkg.com/@phosphor-icons/[email protected]/src/fill/style.css" /> 154 155<!-- Font Awesome Brand Icons --> 156<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" /> 157 158<style> 159 :root { 160 /* Shadows */ 161 --shadow-color: 293deg 100% 7%; 162 --shadow-sm: 163 0 0 0 1px hsl(var(--shadow-color) / 0.11); 164 --shadow-sm-inset: 165 inset 0 0 0 1px hsl(var(--shadow-color) / 0.11); 166 --shadow-md: 167 0 0 0 1px hsl(var(--shadow-color) / 0.11), 168 0 2px 2px 0 hsl(var(--shadow-color) / 0.05); 169 --shadow-input: 170 0 1px 2px 0 hsl(var(--shadow-color) / 0.05); 171 --shadow-card: 172 0 0 0 1px var(--_theme---card--border-color), 173 0 2px 2px 0 hsl(var(--shadow-color) / 0.05); 174 --drop-shadow-card: 175 drop-shadow(0 0 1px var(--_theme---general--border)) 176 drop-shadow(0 2px 2px hsl(var(--shadow-color) / 0.11)); 177 --shadow-card-hover: 178 0 0 0 1px var(--colors-black--400), 179 0 2px 2px 0 hsl(var(--shadow-color) / 0.05); 180 --shadow-overlay: 181 0px 0px 0px 1px hsl(var(--shadow-color) / 0.11), 182 0px 1px 1.5px 0px hsl(var(--shadow-color) / 0.01), 183 0px 2px 3px 0px hsl(var(--shadow-color) / 0.02), 184 0px 4px 6px 0px hsl(var(--shadow-color) / 0.03), 185 0px 8px 12px 0px hsl(var(--shadow-color) / 0.04), 186 0px 16px 24px 0px hsl(var(--shadow-color) / 0.05), 187 0px 24px 36px 0px hsl(var(--shadow-color) / 0.06), 188 0px 36px 54px 0px hsl(var(--shadow-color) / 0.07), 189 0px 54px 81px 0px hsl(var(--shadow-color) / 0.08); 190 --shadow-highlight: 191 0px 0px 0px 1px hsl(var(--shadow-color) / 0.11), 192 0px 1px 1.5px 0px hsl(var(--shadow-color) / 0.01), 193 0px 2px 3px 0px hsl(var(--shadow-color) / 0.02), 194 0px 4px 6px 0px hsl(var(--shadow-color) / 0.03), 195 0px 8px 12px 0px hsl(var(--shadow-color) / 0.04), 196 0px 16px 24px 0px hsl(var(--shadow-color) / 0.05); 197 --shadow-insane: 198 0px 0px 0px 1px hsl(var(--shadow-color) / 1), 199 0px 1px 1.5px 0px hsl(var(--shadow-color) / 0.01), 200 0px 2px 3px 0px hsl(var(--shadow-color) / 0.02), 201 0px 4px 6px 0px hsl(var(--shadow-color) / 0.03), 202 0px 8px 12px 0px hsl(var(--shadow-color) / 0.04), 203 0px 16px 24px 0px hsl(var(--shadow-color) / 0.05), 204 0px 24px 36px 0px hsl(var(--shadow-color) / 0.06), 205 0px 36px 54px 0px hsl(var(--shadow-color) / 0.07), 206 0px 54px 81px 0px hsl(var(--shadow-color) / 0.08); 207 --shadow-btn: 208 0 1px 2px hsl(var(--shadow-color) / 0.05), 209 inset 0 10px 24px -10px hsl(0deg 0% 100% / 0.4); 210 /*inset 0 1px 1px hsl(0deg 0% 100% / 0.4)*/ 211 --shadow-app-icon: 212 inset 0 6px 12px hsl(0deg 0% 100% / 0.2), 213 inset 0 1px 1px hsl(0deg 0% 100% / 0.4); 214 215 /* Gradients */ 216 --gradient-1: 217 linear-gradient( 218 145deg, 219 hsl(340deg 100% 87%), 220 hsl(47deg 100% 87%) 40%, 221 hsl(47deg 100% 87%) 60%, 222 hsl(47deg 100% 53%) 223 ); 224 --gradient-2: 225 linear-gradient( 226 135deg, 227 hsl(60deg 95% 50%), 228 hsl(320deg 72% 55% / 0.5) 229 ); 230 --gradient-3: 231 linear-gradient( 232 145deg, 233 hsl(47deg 100% 87%), 234 var(--colors-black--100) 30% 235 ); 236 --gradient-4: 237 linear-gradient( 238 180deg, 239 transparent 30%, 240 var(--colors-black--300) 241 ); 242 --gradient-webflow: 243 linear-gradient( 244 145deg, 245 hsl(216deg 92% 52%), 246 hsl(216deg 92% 92%) 50% 247 ); 248 --btn-gradient: 249 radial-gradient(100% 100% at 100% 0%, 250 rgba(255, 255, 255, 0.37) 0%, 251 rgba(255, 255, 255, 0) 100% 252 ); 253 --gradient-5: 254 linear-gradient( 255 145deg, 256 hsl(340deg 100% 87% / 0.5), 257 hsl(60deg 95% 50% / 0.5) 258 ); 259 } 260 261 .u-bg-black { 262 --shadow-sm: 263 0 0 0 1px var(--colors-white--200); 264 } 265
266 /* Backgrounds */ 267 .u-bg-gradient-1 { 268 background-image: var(--gradient-1); 269 } 270/* 271 .u-bg-gradient-2 { 272 background-image: var(--gradient-2); 273 } 274*/ 275 .u-bg-gradient-3 { 276 background-image: var(--gradient-3); 277 } 278 279 .u-bg-gradient-4 { 280 background-image: var(--gradient-4); 281 } 282 283 .u-bg-gradient-5 { 284 background-image: var(--gradient-5); 285 } 286 287 .u-bg-gradient-webflow { 288 background-image: var(--gradient-webflow); 289 } 290 291 .u-bg-grid { 292 background-image: 293 linear-gradient(to right, var(--_theme---general--border) 1px, transparent 1px), 294 linear-gradient(to bottom, var(--_theme---general--border) 1px, transparent 1px); 295 background-size: 32px 32px; 296 background-position: center; 297 -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 298 mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 299 } 300 301.u-bg-diamond { 302 background-image: 303 linear-gradient(45deg, transparent 49%, var(--_theme---general--border) 49%, var(--_theme---general--border) 51%, transparent 51%), 304 linear-gradient(-45deg, transparent 49%, var(--_theme---general--border) 49%, var(--_theme---general--border) 51%, transparent 51%); 305 background-size: 40px 40px; 306 background-position: center; 307 -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 308 mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 309} 310 311 .u-bg-dots { 312 background-image: 313 radial-gradient(circle at 1px 1px, var(--_theme---general--dots-inactive) 1px, transparent 0); 314 background-size: 16px 16px; 315 background-position: center top; 316 -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 317 mask-image: radial-gradient(ellipse 60% 60% at 50% 50%, #000 0%, transparent 90%); 318 } 319 320 /* Remove top margin on rich text first child */ 321 .w-richtext>:first-child, 322 .w-richtext>:first-child h2, 323 .w-richtext>:first-child p { 324 margin-top: 0; 325 } 326 327 /* Remove bottom margin of rich text and col last child */ 328 .w-richtext>:last-child, 329 .w-richtext ol li:last-child, 330 .w-richtext ul li:last-child, 331 .col>:last-child, 332 .card-body>:last-child, 333 .u-text-center>:last-child, 334 .u-text-center-md>:last-child { 335 margin-bottom: 0; 336 } 337 338 /* Line clamp modifiers */ 339 .u-text-clamp-2 { 340 -webkit-line-clamp: 2; 341 -webkit-box-orient: vertical; 342 } 343 .u-text-clamp-3 { 344 -webkit-line-clamp: 3; 345 -webkit-box-orient: vertical; 346 } 347 348 /* Alternate gutter layout */ 349 .row { 350 &.row-no-gutters, 351 &.row-no-h-gutters { 352 > .col { 353 padding-left: 0; 354 padding-right: 0; 355 } 356 } 357 358 &.row-lg-gutters { 359 > .col { 360 padding-left: var(--_layout---grid--gap); 361 padding-right: var(--_layout---grid--gap); 362 } 363 } 364 365 &.row-sm-gutters { 366 > .col { 367 padding-left: calc(var(--_layout---grid--gap) / 4); 368 padding-right: calc(var(--_layout---grid--gap) / 4); 369 } 370 } 371 372 &.row-xs-gutters { 373 > .col { 374 padding-left: calc(var(--_layout---grid--gap) / 8); 375 padding-right: calc(var(--_layout---grid--gap) / 8); 376 } 377 } 378 } 379 380 /* Cards in rows with no gutters */ 381 @media (min-width: 992px) { 382 .row.row-no-gutters > .col, 383 .row.row-no-h-gutters > .col { 384 &:first-child > .card { 385 border-top-right-radius: 0; 386 border-bottom-right-radius: 0; 387 } 388 389 &:last-child > .card { 390 border-top-left-radius: 0; 391 border-bottom-left-radius: 0; 392 } 393 394 &:not(:first-child, :last-child) > .card { 395 border-radius: 0; 396 } 397 } 398 } 399 400 /* Make fonts pretty */ 401 body { 402 -webkit-font-smoothing: antialiased; 403 -moz-font-smoothing: antialiased; 404 -o-font-smoothing: antialiased; 405 } 406 407 body { 408 font-feature-settings: 'ss02', 'cv11', 'calt'; 409 } 410 411 /* Heading styles */ 412 h1, .h1, h2, .h2, h3, .h3, h4, .h4 { 413 font-feature-settings: 'ss03'; 414 text-wrap: balance; 415 416 strong { 417 font-weight: inherit; 418 } 419 } 420 421 /* Paragraph styles */ 422 p { 423 text-wrap: pretty; 424 } 425 426 /* Icon styles */ 427 [class*="icon"] svg { 428 width: 100% !important; 429 height: 100% !important; 430 display: flex; 431 } 432 433 /* Navbar dropdown link hover */ 434 .navbar_dropdown-link .u-text-muted { 435 transition: color .2s ease-in-out; 436 } 437 438 .navbar_dropdown-link:hover .u-text-muted { 439 color: var(--colors-page-wrapper--text); 440 } 441 442 /* Blog row hover */ 443 .blog-item-row-link { 444 &:after { 445 content: ""; 446 position: absolute; 447 top: 0; 448 left: 1rem; 449 right: 1rem; 450 height: 1px; 451 background-color: var(--_theme---general--border); 452 transition: background-color .2s ease-in-out; 453 } 454 &:first-child { 455 &:after { 456 background-color: transparent; 457 } 458 } 459 &:hover { 460 &:after { 461 background-color: transparent; 462 }
463 + .blog-item-row-link { 464 &:after { 465 background-color: transparent; 466 } 467 } 468 } 469 } 470 471 /* Blog image border */ 472 .border-img-wrapper, 473 .w-richtext figure div:not(.no-border), 474 .rich-text-p figure div:not(.no-border) { 475 position: relative; 476 477 &::after { 478 content: ""; 479 position: absolute; 480 inset: 0; 481 border: 1px solid var(--_theme---general--border); 482 border-radius: var(--component-card--border-radius); 483 } 484 } 485 486 /* Hide */ 487 .u-d-none { 488 display: none; 489 } 490 491 /* Logo component props */ 492 [data-logo-size="28"] { width: 28px; height: 28px; } 493 [data-logo-size="40"] { width: 40px; height: 40px; } 494 [data-logo-size="64"] { width: 64px; height: 64px; } 495 [data-logo-size="80"] { width: 80px; height: 80px; } 496 497 /* Font Awesome resize */ 498 .fab, .fa, .fa-brands { 499 display: inline-flex; 500 align-items: center; 501 justify-content: center; 502 503 &::before { 504 transform: scale(.9) translateY(-0.05em); 505 } 506 } 507 508 /* Specificity fixes */ 509 .u-pb-0 { 510 padding-bottom: 0 !important; 511 } 512 513 .u-pt-0 { 514 padding-top: 0 !important; 515 } 516 517 .u-w-auto { 518 width: auto !important; 519 } 520 521 /* Featured icon hover */ 522 a { 523 &:hover { 524 .featured-icon { 525 &:not(.cc-no-hover) { 526 background-color: var(--color-lemon--500); 527 } 528 } 529 } 530 } 531 532 /* Featured icon current and completed tabs */ 533 .w--current { 534 .featured-icon { 535 color: var(--colors-white--1000); 536 background-color: var(--colors-general--secondary); 537 box-shadow: none; 538 } 539 } 540 .is-completed { 541 .featured-icon { 542 color: var(--colors-white--1000); 543 background-color: var(--colors-black--1000); 544 box-shadow: none; 545 } 546 } 547 548 549 /* Card hover */ 550 .card { 551 &.cc-hover { 552 &:hover { 553 border-color: var(--colors-black--400); 554 } 555 } 556 } 557 558 .card { 559 &:hover { 560 .card-top-right-corner { 561 &.cc-hover { 562 opacity: 1; 563 } 564 } 565 } 566 } 567 568 /* Weird fix to make range slider sync work on the pricing page */ 569 .pricing_tabs { 570 .w-tab-pane { 571 &:not(.w--tab-active) { 572 display: block; 573 opacity: 0; 574 height: 0; 575 pointer-events: none; 576 } 577 } 578 } 579 580 /* Navbar hero spacing */ 581 .section { 582 &.cc-hero { 583 .navbar_component { 584 margin-bottom: 3rem; 585 } 586 } 587 } 588 589 /* Card variatons */ 590 .card { 591 &.cc-sm { 592 --component-card--card-body-padding-lg: 16px; 593 } 594 } 595 596 @media screen and (min-width: 992px) { 597 .card { 598 &.cc-airy { 599 background-color: transparent; 600 .card-body { 601 padding: calc(var(--component-card--card-body-padding-lg) * 1.5); 602 } 603 &.cc-large { 604 padding: calc(var(--component-card--card-body-padding-lg) * 2); 605 } 606 } 607 &.cc-large { 608 --component-card--card-body-padding-lg: 32px; 609 } 610 &.cc-xl { 611 --component-card--card-body-padding-lg: 64px; 612 } 613 } 614 615 .col-lg-3:nth-of-type(4n+1) { 616 > .card { 617 &.cc-airy { 618 border-left: none; 619 .card-body { 620 padding-left: 1px; 621 } 622 } 623 } 624 } 625 626 .col-lg-4:nth-of-type(3n+1) { 627 > .card { 628 &.cc-airy { 629 border-left: none; 630 .card-body { 631 padding-left: 1px; 632 } 633 } 634 } 635 } 636 637 .col-lg-6:nth-of-type(odd) { 638 > .card { 639 &.cc-airy { 640 border-left: none; 641 .card-body { 642 padding-left: 1px; 643 } 644 } 645 } 646 } 647 } 648 649 @media screen and (max-width: 991px) { 650 .card { 651 &.cc-airy { 652 background-color: transparent; 653 border-left: none; 654 border-right: none; 655 .card-body { 656 padding: 24px 0; 657 } 658 } 659 } 660 } 661 662 /* Chrome tab corner */ 663 .chrome_tab-link { 664 &.w--current { 665 &::before { 666 background-image: url("https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66f40d1337e539a889cb05f3_chrome-corner.svg"); 667 content: ""; 668 position: absolute; 669 height: 1.375rem; 670 width: 1.375rem; 671 bottom: 0; 672 left: -1.375rem; 673 } 674 &::after { 675 background-image: url("https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66f40d1337e539a889cb05f3_chrome-corner.svg"); 676 transform: rotate(90deg); 677 content: ""; 678 position: absolute; 679 height: 1.375rem; 680 width: 1.375rem; 681 bottom: 0; 682 right: -1.375rem; 683 } 684 &.cc-large { 685 &::before { 686 height: 2.875rem; 687 width: 2.875rem; 688 left: -2.875rem; 689 } 690 &::after { 691 height: 2.875rem; 692 width: 2.875rem; 693 right: -2.875rem; 694 } 695 } 696 } 697 } 698 699 .u-bg-black, 700 .btn.cc-dark { 701 .u-text-muted, 702 [data-icon-color="text-muted"] 703 { 704 color: var(--colors-white--600); 705 } 706 } 707 708 /* Section inset inner border */ 709 .section-inset, 710 .section.cc-inset { 711 &::after { 712 content: ""; 713 position: absolute; 714 inset: 0; 715 border: 1px solid var(--colors-black--200); 716 border-radius: var(--radius--x-large); 717 } 718 } 719 720 @media screen and (max-width: 448px) { 721 .section-inset, 722 .section.cc-inset { 723 &::after { 724 border-radius: var(--radius--large); 725 } 726 } 727 } 728 729 .section.cc-inset { 730 &::after { 731 z-index: 1; 732 pointer-events: none; 733 } 734 } 735 736 /* Heading anchor hash component */ 737 .anchor_component { 738 &:hover { 739 .anchor_link { 740 opacity: 1; 741 } 742 } 743 } 744 745 /* Borders in dark sections */ 746 .u-bg-black { 747 --_theme---general--border: var(--colors-white--200); 748 --component-button--border-color: transparent; 749 } 750 751 /* Custom list markers */ 752 .w-richtext ul li { 753 list-style-type: none; 754 } 755 756 .w-richtext ul li::marker { 757 content: ''; 758 } 759 760 .w-richtext ul li::before { 761 content: '\e184'; 762 font-family: "Phosphor-Fill" !important; 763 margin-left: -1.5em; 764 margin-right: .5em; 765 color: var(--colors-general--primary); 766 position: relative; 767 top: .075em; 768 } 769 770 /* Mobile nav z-index fix */ 771 .w-nav-overlay { 772 z-index: -1; 773 } 774 775 /* Link child hover */ 776 a { 777 &:hover { 778 .u-link-child-hover { 779 opacity: 1; 780 } 781 } 782 } 783 784 /* Parent/child hover states */ 785 .u-hover-parent { 786 &:hover { 787 .u-hover-child { 788 opacity: 1; 789 790 &.cc-move-down { 791 transform: translateY(1rem); 792 } 793 &.cc-move-up { 794 transform: translateY(-1rem); 795 } 796 } 797 } 798 } 799 800 .gallery_tag:last-child .gallery_tags-comma { 801 display: none; 802 } 803 804 /* Code blocks */ 805
806 pre.w-code-block code { 807 all: unset; 808 white-space: break-spaces !important; 809 } 810 811 .u-code-block pre { 812 margin: 0; 813 814 code.hljs { 815 padding: 0; 816 } 817 } 818 819 .rich-text pre { 820 padding: 1.5rem !important; 821 } 822 823 .avatar-list_item { 824 &:first-child { 825 margin-right: 0; 826 } 827 } 828 829 /* Rich text figure mods */ 830 @media screen and (min-width: 992px) { 831 .w-richtext .w-richtext-align-floatright { 832 position: absolute; 833 margin-top: 1rem; 834 width: 16%; 835 left: auto; 836 right: 0; 837 bottom: auto; 838 transform: rotate(5deg); 839 filter: var(--drop-shadow-card); 840 border-radius: 0; 841 display: flex; 842 843 div::after { 844 border: none !important; 845 } 846 } 847 848 .w-richtext .w-richtext-align-floatleft { 849 position: absolute; 850 margin-top: 1rem; 851 width: 16%; 852 left: 0; 853 right: auto; 854 bottom: auto; 855 transform: rotate(-5deg); 856 filter: var(--drop-shadow-card); 857 border-radius: 0; 858 display: flex; 859 860 div::after { 861 border: none !important; 862 } 863 } 864 865 .w-richtext .w-richtext-align-floatright img, 866 .w-richtext .w-richtext-align-floatleft img { 867 border-radius: 0; 868 } 869 } 870 871 .w-richtext figure .figure-p-2 { 872 padding: 2rem !important; 873 } 874 875 /* Features section */ 876 .features-tabs .col { 877 position: relative; 878 } 879 880 .features-tabs .features-tab-link:not(:last-child)::after { 881 content: ''; 882 position: absolute; 883 top: 1.25rem; 884 left: 50%; 885 right: -50%; 886 height: 1px; 887 background: linear-gradient( 888 90deg, 889 var(--_theme---general--border) 40%, 890 var(--colors-general--secondary) 50%, 891 var(--_theme---general--border) 60% 892 ); 893 background-size: 400% 100%; 894 animation: glow-travel 6s linear infinite; 895 animation-delay: var(--glow-delay, 0s); 896 z-index: -1; /* changed from -1 */ 897 } 898 899 .features-tabs .features-tab-link.is-completed:not(:last-child)::after { 900 background: var(--_theme---general--text); 901 animation: none; 902 } 903 904 /* Last completed segment (adjacent to current) â fade to pink */ 905.features-tabs .features-tab-link.is-completed-last:not(:last-child)::after { 906 background: linear-gradient( 907 90deg, 908 var(--_theme---general--text) 0%, 909 var(--colors-general--secondary) 75% /* â your pink */ 910 ); 911 animation: none; 912} 913 914 @keyframes glow-travel { 915 0% { background-position: 400% center; } 916 100% { background-position: -400% center; } 917 } 918 919 /* Button with leading icon present â reduce left padding by 25% */ 920 .button-size:has(> .button-icon:first-child) { 921 padding-left: calc(var(--_components---component-button--horizontal-padding) * 0.75); 922 } 923 924 /* Button with trailing icon present â reduce right padding by 25% */ 925 .button-size:has(> .button-icon:last-child) { 926 padding-right: calc(var(--_components---component-button--horizontal-padding) * 0.75); 927 } 928</style></div><div><div><div class="u-d-none w-embed"><style> 929 /* Marquee */ 930 @keyframes marquee-scroll-left { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } 931 @keyframes marquee-scroll-right { 0% { transform: translateX(-100%); } 100% { transform: translateX(0); } } 932 @keyframes marquee-scroll-up { 0% { transform: translateY(0); } 100% { transform: translateY(-100%); } } 933 @keyframes marquee-scroll-down { 0% { transform: translateY(-100%); } 100% { transform: translateY(0); } } 934 .marquee-component[data-marquee-pause-on-hover="true"]:hover .marquee-group { 935 animation-play-state: paused; 936 } 937 .marquee-component[data-marquee-reverse="false"] .marquee-group { 938 animation: marquee-scroll-left var(--marquee-duration) linear infinite; 939 } 940 .marquee-component[data-marquee-reverse="true"] .marquee-group { 941 animation: marquee-scroll-right var(--marquee-duration) linear infinite; 942 } 943 .marquee-component[data-wf--marquee--settings-orientation="vertical"][data-marquee-reverse="false"] .marquee-group { 944 animation: marquee-scroll-down var(--marquee-duration) linear infinite; 945 } 946 .marquee-component[data-wf--marquee--settings-orientation="vertical"][data-marquee-reverse="true"] .marquee-group { 947 animation: marquee-scroll-up var(--marquee-duration) linear infinite; 948 } 949 .marquee-component:not([data-wf--marquee--settings-orientation="vertical"])[data-marquee-fade-edges="true"] { 950 -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%); 951 mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%); 952 } 953 .marquee-component[data-wf--marquee--settings-orientation="vertical"][data-marquee-fade-edges="true"] { 954 -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%); 955 mask-image: linear-gradient(to bottom, transparent 0%, black 10%, black 90%, transparent 100%); 956 } 957</style></div></div><div><div class="u-d-none w-embed"><style> 958 /* Accordion */ 959 :root { 960 interpolate-size: allow-keywords; /* To animate accordions */ 961 } 962 details[open] .accordion-icon{ 963 transform: rotate(45deg); 964 } 965 summary::-webkit-details-marker { 966 display: none; /* Hide older Safari's default disclosure arrow */ 967 } 968 .w-dyn-item:first-child .accordion-item { 969 border-top: 1px solid var(--colors-general--border); 970 } 971</style></div><div class="u-d-none w-embed w-script"><!-- Mast Accordion JS -->
972<script defer src="https://cdn.jsdelivr.net/gh/nocodesupplyco/mast@latest/accordion.min.js"></script>
972</div></div><div><div class="w-embed w-script">
972<script> 973 function initLogoWallCycle() { 974 const loopDelay = 1.5; // Loop Duration 975 const duration = 0.9; // Animation Duration 976 977 document.querySelectorAll('[data-logo-wall-cycle-init]').forEach((root) => { 978 const list = root.querySelector('[data-logo-wall-list]'); 979 const items = Array.from(list.querySelectorAll('[data-logo-wall-item]')); 980 981 const shuffleFront = root.getAttribute('data-logo-wall-shuffle') !== 'false'; 982 const originalTargets = items.map((item) => item.querySelector('[data-logo-wall-target]')).filter(Boolean); 983 984 let visibleItems = []; 985 let visibleCount = 0; 986 let pool = []; 987 let pattern = []; 988 let patternIndex = 0; 989 let tl; 990 991 function isVisible(el) { 992 return window.getComputedStyle(el).display !== 'none'; 993 } 994 995 function shuffleArray(arr) { 996 const a = arr.slice(); 997 for (let i = a.length - 1; i > 0; i--) { 998 const j = Math.floor(Math.random() * (i + 1)); 999 [a[i], a[j]] = [a[j], a[i]]; 1000 } 1001 return a; 1002 } 1003 1004 function setup() { 1005 if (tl) { 1006 tl.kill(); 1007 } 1008 visibleItems = items.filter(isVisible); 1009 visibleCount = visibleItems.length; 1010 1011 pattern = shuffleArray(Array.from({ length: visibleCount }, (_, i) => i)); 1012 patternIndex = 0; 1013 1014 // remove all injected targets 1015 items.forEach((item) => { 1016 item.querySelectorAll('[data-logo-wall-target]').forEach((old) => old.remove()); 1017 }); 1018 1019 pool = originalTargets.map((n) => n.cloneNode(true)); 1020 1021 let front, rest; 1022 if (shuffleFront) { 1023 const shuffledAll = shuffleArray(pool); 1024 front = shuffledAll.slice(0, visibleCount); 1025 rest = shuffleArray(shuffledAll.slice(visibleCount)); 1026 } else { 1027 front = pool.slice(0, visibleCount); 1028 rest = shuffleArray(pool.slice(visibleCount)); 1029 } 1030 pool = front.concat(rest); 1031 1032 for (let i = 0; i < visibleCount; i++) { 1033 const parent = visibleItems[i].querySelector('[data-logo-wall-target-parent]') || visibleItems[i]; 1034 parent.appendChild(pool.shift()); 1035 } 1036 1037 tl = gsap.timeline({ repeat: -1, repeatDelay: loopDelay }); 1038 tl.call(swapNext); 1039 tl.play(); 1040 } 1041 1042 function swapNext() { 1043 const nowCount = items.filter(isVisible).length; 1044 if (nowCount !== visibleCount) { 1045 setup(); 1046 return; 1047 } 1048 if (!pool.length) return; 1049 1050 const idx = pattern[patternIndex % visibleCount]; 1051 patternIndex++; 1052 1053 const container = visibleItems[idx]; 1054 const parent = container.querySelector('[data-logo-wall-target-parent]') || container.querySelector('*:has(> [data-logo-wall-target])') || container; 1055 const existing = parent.querySelectorAll('[data-logo-wall-target]'); 1056 if (existing.length > 1) return; 1057 1058 const current = parent.querySelector('[data-logo-wall-target]'); 1059 const incoming = pool.shift(); 1060 1061 gsap.set(incoming, { yPercent: 50, autoAlpha: 0 }); 1062 parent.appendChild(incoming); 1063 1064 if (current) { 1065 gsap.to(current, { 1066 yPercent: -50, 1067 autoAlpha: 0, 1068 duration, 1069 ease: 'expo.inOut', 1070 onComplete: () => { 1071 current.remove(); 1072 pool.push(current); 1073 }, 1074 }); 1075 } 1076 1077 gsap.to(incoming, { 1078 yPercent: 0, 1079 autoAlpha: 1, 1080 duration, 1081 delay: 0.1, 1082 ease: 'expo.inOut', 1083 }); 1084 } 1085 1086 setup(); 1087 1088 ScrollTrigger.create({ 1089 trigger: root, 1090 start: 'top bottom', 1091 end: 'bottom top', 1092 onEnter: () => tl.play(), 1093 onLeave: () => tl.pause(), 1094 onEnterBack: () => tl.play(), 1095 onLeaveBack: () => tl.pause(), 1096 }); 1097 1098 document.addEventListener('visibilitychange', () => (document.hidden ? tl.pause() : tl.play())); 1099 }); 1100 } 1101 1102 // Initialize Logo Wall Cycle 1103 document.addEventListener('DOMContentLoaded', () => { 1104 initLogoWallCycle(); 1105 }); 1106</script>
1106</div><div class="w-embed"><style> 1107 [data-logo-wall-list] [data-logo-wall-item]:nth-child(n + 9) { 1108 display: none; 1109 } 1110 1111 @media screen and (max-width: 991px) { 1112 [data-logo-wall-list] [data-logo-wall-item]:nth-child(n + 7) { 1113 display: none; 1114 } 1115 } 1116</style></div></div><div><div class="w-embed"><style> 1117.o--Reset--scope { 1118 --element-padding-v: 7px; 1119} 1120 1121.o--Widget--widget { 1122 1123 /* //////////////////// General typography //////////////////// */ 1124 1125 &.o--Widget--displayMode-light * { 1126 color: var(--colors-page-wrapper--text); 1127 } 1128 1129 --font-size-sm: .875rem; 1130 --font-size-xs: .75rem; 1131 1132 .o--text-xs { 1133 color: var(--colors-page-wrapper--text-muted) 1134 } 1135 1136 *:not(.material-icons) { 1137 font-family: Inter Var; 1138 } 1139 1140 strong { 1141 font-weight: 500; 1142 } 1143 1144 --weight-bold: 500; 1145 1146 .o--text-secondary { 1147 color: var(--colors-page-wrapper--text-muted); 1148 } 1149 1150 /* //////////////////// Plan info //////////////////// */ 1151 1152 &:not(.o--Widget--popup) { 1153 .o--plan-info { 1154 display: none; 1155 } 1156 } 1157 1158 /* //////////////////// Divider //////////////////// */ 1159 1160 .o--HrLabel--hrLabel:after { 1161 padding: 0 1rem; 1162 } 1163 1164 .o--HrLabel--displayMode-light:after { 1165 color: var(--colors-page-wrapper--text-muted); 1166 } 1167 1168 .o--HrLabel--displayMode-light:before { 1169 background: var(--_theme---general--border); 1170 } 1171 1172 .o--Separator--displayMode-light { 1173 border-top-color: var(--_theme---general--border); 1174 } 1175 1176 /* //////////////////// Headings //////////////////// */ 1177 1178 h1 { 1179 font-family: Kaio !important; 1180 font-weight: 700; 1181 } 1182 1183 h4 { 1184 font-weight: 500; 1185 } 1186 1187 /* //////////////////// Labels //////////////////// */ 1188 1189 label { 1190 &.o--Label--label { 1191 font-weight: 500; 1192 } 1193 1194 &.o--Label--displayMode-light { 1195 color: var(--colors-page-wrapper--text); 1196 } 1197 } 1198 1199 /* //////////////////// Inputs //////////////////// */ 1200 1201 .o--Input--input, 1202 .o--TextArea--textArea { 1203 box-shadow: var(--shadow-input); 1204 } 1205 1206 .o--Input--fieldStyle-light-border, 1207 .o--TextArea--fieldStyle-light-border { 1208 border: 1px solid var(--component-input--border-color); 1209 resize: vertical; 1210 1211 &:focus { 1212 border-color: var(--colors-black--1000); 1213 outline-color: var(--colors-black--1000); 1214 outline-offset: 0px; 1215 outline-style: solid; 1216 outline-width: 1px; 1217 } 1218 } 1219 1220 .o--Input--cornerShape-rounded, 1221 .o--TextArea--cornerShape-rounded { 1222 border-radius: var(--component-input--border-radius); 1223 } 1224 1225 .o--PasswordInput--passwordInput { 1226 div { 1227 span { 1228 color: var(--colors-page-wrapper--text-muted) !important; 1229 font-weight: 500; 1230 } 1231 .material-icons { 1232 font-size: 20px; 1233 } 1234 } 1235 } 1236 1237 @media screen and (max-width: 448px) { 1238 .o--Input--input, 1239 .o--TextArea--textArea { 1240 font-size: 1rem; 1241 } 1242 } 1243 1244 /* //////////////////// File upload //////////////////// */ 1245 1246 .o--FileUpload--FileUpload { 1247 &.o--FileUpload--displayMode-light { 1248 .o--FileUpload--dropzone { 1249 border: 1px dashed var(--component-input--border-color); 1250 border-radius: var(--component-input--border-radius); 1251 1252 p { 1253 i { 1254 margin-right: 4px; 1255 } 1256 } 1257 } 1258 1259 .o--FileUpload--file { 1260 align-items: center; 1261 border-radius: var(--component-input--border-radius); 1262 background-color: #fff; 1263 box-shadow: var(--shadow-input); 1264 border: 1px solid var(--component-input--border-color); 1265 overflow-wrap: anywhere; 1266 1267 i, a { 1268 line-height: inherit; 1269 } 1270 } 1271 } 1272 } 1273 1274 /* //////////////////// Selects //////////////////// */ 1275 1276 .o--Select--selectWrapper { 1277 &.o--Select--cornerShape-rounded { 1278 select { 1279 border-radius: var(--component-input--border-radius); 1280 border: 1px solid var(--component-input--border-color); 1281 box-shadow: var(--shadow-input); 1282 } 1283 } 1284 > span { 1285 &.material-icons { 1286 top: 50%; 1287 right: var(--component-button--horizontal-padding-small); 1288 transform: translateY(-50%); 1289 color: var(--colors-black--400); 1290 } 1291 } 1292 } 1293 1294 /* //////////////////// Buttons //////////////////// */ 1295 1296 .o--Button--btn { 1297 width: 100%; 1298 font-weight: 500; 1299 border-color: transparent; 1300 1301 &.o--Button--buttonStyle-solid { 1302 background-color: var(--colors-general--secondary); 1303 } 1304 1305 &:hover { 1306 box-shadow: inherit; 1307 } 1308 1309 &.o--Button--cornerShape-rounded { 1310 border-radius: var(--_components---component-button--border-radius); 1311 } 1312 } 1313 1314 a { 1315 font-weight: 500; 1316 1317 &:hover { 1318 color: inherit; 1319 } 1320 } 1321 1322 div:has(> .o--SignInWithGoogle--btnGoogleSignin) { 1323 width: 100%; 1324 height: 38px; 1325 } 1326 1327 .o--SignInWithGoogle--btnGoogleSignin { 1328 width: 100%; 1329 1330 & > div { 1331 display: flex; 1332 justify-content: center; 1333 1334 & >
1334 div:has([role="button"]) { 1335 width: 100%; 1336 } 1337 } 1338 1339 1340 } 1341 1342 /* //////////////////// Payment term toggle //////////////////// */ 1343 1344 .o--HorizontalToggle--horizontalToggle { 1345 &.o--HorizontalToggle--borderWidth-1px { 1346 li { 1347 a { 1348 padding: var(--component-button--vertical-padding-small) var(--component-button--horizontal-padding-small); 1349 border: 1px solid transparent; 1350 border-radius: var(--_components---component-button--border-radius); 1351 } 1352 1353 &.o--HorizontalToggle--active { 1354 a { 1355 border-color: var(--component-button--border-color); 1356 box-shadow: var(--shadow-btn); 1357 } 1358 } 1359 } 1360 } 1361 &.o--HorizontalToggle--displayMode-light { 1362 ul { 1363 background-color: var(--colors-black--50); 1364 border: 1px solid var(--colors-black--100); 1365 padding: .125rem; 1366 border-radius: calc(var(--_components---component-button--border-radius) + .125rem); 1367 1368 li { 1369 background: transparent; 1370 1371 a { 1372 color: var(--colors-page-wrapper--text-muted); 1373 } 1374 1375 &.o--HorizontalToggle--active { 1376 a { 1377 color: var(--colors-page-wrapper--text); 1378 } 1379 } 1380 } 1381 } 1382 } 1383 } 1384 1385 /* //////////////////// Charge summary //////////////////// */ 1386 1387 .o--ChargeSummary--chargeSummary { 1388 /* display: none; */ 1389 } 1390 1391 .o--ChargeSummary--invoiceRow { 1392 &.o--ChargeSummary--discount { 1393 gap: 16px; 1394 } 1395 1396 &:last-child { 1397 .o--ChargeSummary--invoiceRowWhen, 1398 .o--ChargeSummary--invoiceRowPrice { 1399 font-weight: 500; 1400 } 1401 } 1402 } 1403 1404 .o--ChargeSummary--info { 1405 display: none; 1406 } 1407 1408 .state-Checkout { 1409 .o--Separator--separator { 1410 &:nth-of-type(-n + 3) { 1411 display: none; 1412 } 1413 } 1414 } 1415 1416 /* //////////////////// Badge //////////////////// */ 1417 1418 .o--Badge--badge { 1419 font-size: 12px; 1420 gap: 4px; 1421 } 1422 1423 /* //////////////////// Popup specific styles //////////////////// */ 1424 1425 &.o--Widget--popup { 1426 max-width: 26rem; 1427 1428 &:has(.state-Register, .state-Checkout), 1429 &.o--App--leadCaptureWidget { 1430 max-width: 30rem; 1431 } 1432 1433 } 1434 1435 @media only screen and (min-width: 600px) { 1436 .o--Widget--widgetBody { 1437 padding: 3rem 2rem; 1438 } 1439 } 1440 1441 &.o--Widget--cornerShape-rounded { 1442 border-radius: var(--component-card--border-radius); 1443 } 1444 1445 /* //////////////////// Page embed specific styles //////////////////// */ 1446 1447 &:not(.o--Widget--popup) { 1448 &:not(.o--App--supportWidget) { 1449 .o--header, 1450 .o--SectionGroup--sectionGroup:has(h1) { 1451 display: none; 1452 } 1453 } 1454 1455 .o--Widget--widgetBody { 1456 padding: 0; 1457 } 1458 } 1459 1460} 1461</style></div></div><div><div class="w-embed w-script"><!-- Outseta AI Assistant --> 1462<link rel="stylesheet" href="https://cdn.outseta.com/static/css/outseta-assistant.css">
1463<script src="https://cdn.outseta.com/static/js/outseta-assistant.js"></script>
1463 1464 1465<iframe id="outseta-assistant" 1466 src="https://agent.outseta.com" 1467 title="Outseta Assistant"> 1468</iframe> 1469
1470<script> 1471 (function () { 1472 var outsetaAssistant = document.getElementById('outseta-assistant'); 1473 document.body.appendChild(outsetaAssistant); 1474 1475 window.OutsetaAssistant.connect( 1476 outsetaAssistant, 1477 { 1478 getAuthentication: function () { 1479 return { 1480 support: true, 1481 theme: 'light' 1482 }; 1483 }, 1484 onSupport: function () { 1485 if (window.Outseta 1486 && window.Outseta.support 1487 && window.Outseta.support.open) { 1488 window.Outseta.support.open(); 1489 } 1490 else { 1491 window.location.href = 'https://go.outseta.com/support/kb'; 1492 } 1493 } 1494 } 1495 ); 1496 }()); 1497</script>
1497 1498</div></div><div><div class="w-embed w-script">
1498<script> 1499function initInteractiveDotsGridBackground() { 1500 const elements = document.querySelectorAll('[data-dots-canvas-init]'); 1501 if (!elements.length) return; 1502 1503 const gap = '14px'; 1504 const dotSize = '2px'; 1505 const shape = 'circle'; // 'circle' or 'square' 1506 const dotColorInactive = 'var(--_theme---general--dots-inactive)'; 1507 const dotColorActive = 'var(--_theme---general--dots-active)'; 1508 const dotMaxScale = 1.5; 1509 const pressScale = 3; 1510 const hoverRadius = 12; 1511 const easeDuration = 1; 1512 1513 const hasPointer = matchMedia('(hover: hover) and (pointer: fine)').matches; 1514 const pointer = { x: 0, y: 0, cx: 0, cy: 0, active: false }; 1515 const hover = { value: 0, from: 0, to: 0, start: 0 }; 1516 const press = { value: 0, from: 0, to: 0, start: 0 }; 1517 const canvases = []; 1518 1519 let dpr, size, spacing, radius, raf, lastTime = performance.now(); 1520 1521 function toPx(value, element) { 1522 const probe = document.createElement('div'); 1523 probe.style.cssText = `position:absolute;visibility:hidden;width:${value};`; 1524 element.appendChild(probe); 1525 const px = probe.getBoundingClientRect().width; 1526 probe.remove(); 1527 return px; 1528 } 1529 1530 function parseColor(color, element) { 1531 const probe = document.createElement('span'); 1532 probe.style.color = color; 1533 element.appendChild(probe); 1534 const resolved = getComputedStyle(probe).color; 1535 probe.remove(); 1536 1537 const canvas = document.createElement('canvas'); 1538 const ctx = canvas.getContext('2d'); 1539 ctx.fillStyle = resolved; 1540 ctx.fillRect(0, 0, 1, 1); 1541 1542 const data = [...ctx.getImageData(0, 0, 1, 1).data]; 1543 data[3] /= 255; 1544 return data; 1545 } 1546 1547 function mixColor(a, b, p) { 1548 return `rgba(${a.map((v, i) => v + (b[i] - v) * p).join(',')})`; 1549 } 1550 1551 function setEase(state, to) { 1552 Object.assign(state, { from: state.value, to, start: performance.now() }); 1553 } 1554 1555 function updateEase(state, time) { 1556 if (!easeDuration) return state.value = state.to; 1557 const p = Math.min(Math.max((time - state.start) / (easeDuration * 1000), 0), 1); 1558 state.value = state.from + (state.to - state.from) * (1 - Math.pow(1 - p, 4)); 1559 } 1560 1561 elements.forEach((element) => { 1562 const canvas = document.createElement('canvas'); 1563 const ctx = canvas.getContext('2d'); 1564 1565 canvas.setAttribute('aria-hidden', 'true'); 1566 Object.assign(canvas.style, { position: 'absolute', inset: 0, width: '100%', height: '100%', pointerEvents: 'none' }); 1567 1568 if (getComputedStyle(element).position === 'static') element.style.position = 'relative'; 1569 1570 element.prepend(canvas); 1571 canvases.push({ 1572 element, canvas, ctx, width: 0, height: 0, visible: false, 1573 inactive: parseColor(element.getAttribute('data-dots-color-inactive') || dotColorInactive, element), 1574 active: parseColor(element.getAttribute('data-dots-color-active') || dotColorActive, element) 1575 }); 1576 }); 1577 1578 function pointerInside() { 1579 return canvases.some(({ element }) => { 1580 const r = element.getBoundingClientRect(); 1581 return pointer.x >= r.left && pointer.x <= r.right && pointer.y >= r.top && pointer.y <= r.bottom; 1582 }); 1583 } 1584 1585 function render(state, origin) { 1586 const rect = state.element.getBoundingClientRect(); 1587 const left = rect.left - origin.left; 1588 const top = rect.top - origin.top; 1589 const px = pointer.cx - origin.left; 1590 const py = pointer.cy - origin.top; 1591 const maxScale = dotMaxScale * (1 + (pressScale - 1) * press.value); 1592 1593 state.ctx.clearRect(0, 0, state.width, state.height); 1594 1595 const colStart = Math.floor(left / spacing); 1596 const colEnd = Math.ceil((left + state.width) / spacing); 1597 const rowStart = Math.floor(top / spacing); 1598 const rowEnd = Math.ceil((top + state.height) / spacing); 1599 1600 for (let row = rowStart; row <= rowEnd; row++) { 1601 const gy = row * spacing; 1602 const y = gy - top; 1603 1604 for (let col = colStart; col <= colEnd; col++) { 1605 const gx = col * spacing; 1606 const x = gx - left; 1607 const influence = hasPointer && hover.value ? Math.max(0, 1 - Math.hypot(gx - px, gy - py) / radius) * hover.value : 0; 1608 const currentSize = size * (1 + (maxScale - 1) * influence); 1609 1610 state.ctx.fillStyle = mixColor(state.inactive, state.active, influence); 1611 1612 if (shape === 'square') { 1613 state.ctx.fillRect(x - currentSize / 2, y - currentSize / 2, currentSize, currentSize); 1614 } else { 1615 state.ctx.beginPath(); 1616 state.ctx.arc(x, y, currentSize / 2, 0, Math.PI * 2); 1617 state.ctx.fill(); 1618 } 1619 } 1620 } 1621 } 1622 1623 function renderAll(visibleOnly = false) { 1624 const origin = elements[0].getBoundingClientRect();
1625 canvases.forEach(state => (!visibleOnly || state.visible) && render(state, origin)); 1626 } 1627 1628 function tick(time) { 1629 raf = null; 1630 if (!canvases.some(state => state.visible)) return; 1631 1632 const delta = Math.min((time - lastTime) / 1000, 0.1); 1633 lastTime = time; 1634 1635 updateEase(hover, time); 1636 updateEase(press, time); 1637 1638 if (!easeDuration) { 1639 pointer.cx = pointer.x; 1640 pointer.cy = pointer.y; 1641 } else { 1642 const strength = 1 - Math.exp(-delta * 6 / easeDuration); 1643 pointer.cx += (pointer.x - pointer.cx) * strength; 1644 pointer.cy += (pointer.y - pointer.cy) * strength; 1645 } 1646 1647 renderAll(true); 1648 raf = requestAnimationFrame(tick); 1649 } 1650 1651 function start() { 1652 if (hasPointer && !raf && canvases.some(state => state.visible)) { 1653 lastTime = performance.now(); 1654 raf = requestAnimationFrame(tick); 1655 } 1656 } 1657 1658 function resize() { 1659 dpr = Math.min(devicePixelRatio || 1, 2); 1660 size = toPx(dotSize, elements[0]); 1661 spacing = size + toPx(gap, elements[0]); 1662 radius = spacing * hoverRadius; 1663 1664 canvases.forEach(state => { 1665 const rect = state.element.getBoundingClientRect(); 1666 state.width = rect.width; 1667 state.height = rect.height; 1668 state.canvas.width = Math.round(rect.width * dpr); 1669 state.canvas.height = Math.round(rect.height * dpr); 1670 state.ctx.setTransform(dpr, 0, 0, dpr, 0, 0); 1671 }); 1672 1673 renderAll(); 1674 start(); 1675 } 1676 1677 if (hasPointer) { 1678 window.addEventListener('pointermove', e => { 1679 pointer.x = e.clientX; 1680 pointer.y = e.clientY; 1681 1682 const inside = pointerInside(); 1683 1684 if (inside !== pointer.active) { 1685 pointer.active = inside; 1686 setEase(hover, +inside); 1687 1688 if (inside) { 1689 pointer.cx = pointer.x; 1690 pointer.cy = pointer.y; 1691 } else { 1692 setEase(press, 0); 1693 } 1694 } 1695 1696 start(); 1697 }); 1698 1699 window.addEventListener('pointerdown', () => pointer.active && setEase(press, 1)); 1700 window.addEventListener('pointerup', () => setEase(press, 0)); 1701 } 1702 1703 const intersectionObserver = new IntersectionObserver(entries => { 1704 entries.forEach(entry => { 1705 const state = canvases.find(state => state.element === entry.target); 1706 if (state) state.visible = entry.isIntersecting; 1707 }); 1708 1709 hasPointer ? start() : renderAll(true); 1710 }); 1711 1712 const resizeObserver = new ResizeObserver(resize); 1713 1714 elements.forEach(element => { 1715 intersectionObserver.observe(element); 1716 resizeObserver.observe(element); 1717 }); 1718 1719 window.addEventListener('resize', resize); 1720 resize(); 1721} 1722 1723// Initialize Interactive Dots Grid (Background) 1724document.addEventListener('DOMContentLoaded', function() { 1725 initInteractiveDotsGridBackground(); 1726}); 1727</script>
1727</div></div><div><div class="w-embed"><style> 1728/* ------------------------------------------------------------------ 1729 Odometer structure. If you already have these rules for the 1730 odometer utility elsewhere, skip this first block. 1731------------------------------------------------------------------ */ 1732 1733/* Each digit's mask is as wide as the widest glyph in the roller (all ten 1734 digits stacked). With proportional figures the mask collapses to the 1735 final digit's own width at cleanup, so the number visibly tightens the 1736 instant the animation ends. Fixed-width figures make the two equal. */ 1737[data-odometer-element] { 1738 white-space: nowrap; 1739 font-variant-numeric: tabular-nums; 1740 font-feature-settings: "tnum" 1; 1741} 1742 1743[data-odometer-part="mask"] { 1744 display: inline-block; 1745 overflow: hidden; 1746 vertical-align: top; 1747} 1748 1749[data-odometer-part="roller"] { 1750 display: block; 1751 white-space: pre; 1752 will-change: transform; 1753} 1754 1755[data-odometer-part="static"] { 1756 display: inline-block; 1757 vertical-align: top; 1758} 1759 1760/* ------------------------------------------------------------------ 1761 Stack comparison 1762------------------------------------------------------------------ */ 1763 1764/* The odometer tweens the element's own width when the digit count 1765 changes ($221 -> $79). That only reads correctly if the element 1766 shrink-wraps its text instead of filling the column. 1767 1768 vertical-align matters here. An inline-block takes its baseline from its 1769 last line box, EXCEPT when overflow is not visible â then the baseline is 1770 the bottom margin edge. The odometer sets overflow:hidden for the width 1771 tween and clears it on cleanup, so the baseline would jump at the end of 1772 every roll and the parent line box would lose its descender space. Taking 1773 the element out of baseline alignment entirely makes the height constant. */ 1774[data-stack-total] { 1775 display: inline-block; 1776 vertical-align: top; 1777 white-space: nowrap; 1778} 1779 1780/* Both panels share a single grid cell. The wrapper is therefore always as 1781 tall as the taller panel, so switching to the one-line Outseta state 1782 reserves the five-row height instead of collapsing the card. */ 1783[data-stack-panels] { 1784 display: grid; 1785} 1786 1787[data-stack-panel] { 1788 grid-area: 1 / 1; 1789} 1790 1791/* The inactive panel keeps its space â visibility rather than display â so 1792 the reserved height holds. It stays out of the accessibility tree and 1793 can't be clicked or tabbed into. */ 1794[data-stack-panel][hidden] { 1795 visibility: hidden; 1796 pointer-events: none; 1797} 1798 1799/* Same reasoning as the panels: a utility class setting display would beat 1800 the UA rule for [hidden], so make it explicit. These pairs overlap or sit 1801 outside the flow, so display:none costs nothing in layout. Add any new 1802 swap pair's attribute to this list. */ 1803[data-stack-totals][hidden], 1804[data-stack-emoji][hidden] { 1805 display: none !important; 1806} 1807 1808/* The heading word slides on toggle, and transforms don't apply to inline 1809 boxes. inline-block keeps it sitting in the sentence as before. */ 1810[data-stack-new] { 1811 display: inline-block; 1812} 1813 1814@media (prefers-reduced-motion: reduce) { 1815 [data-odometer-part="roller"] { 1816 will-change: auto; 1817 } 1818} 1819</style></div></div></div></div><div data-animation="default" class="navbar_component w-nav" data-wf--navbar--variant="base" data-easing2="ease" fs-scrolldisable-element="smart-nav" data-easing="ease" data-collapse="medium" data-w-id="6f7abce1-6d4c-58a8-e7c3-2ef1cc29a5f7" role="banner" data-duration="200"><div class="navbar_container"><div class="navbar_wrapper"><div id="w-node-_206f8271-6936-516a-99ec-493e42cf6eb4-cc29a5f7" class="navbar_logo-wrap"><a href="/" class="navbar_logo-link context-menu-trigger w-nav-brand"><div><div class="u-d-none-portrait"><div class="u-d-flex cc-align-center cc-gap-0-5"><div STYLE="--logo-size: 32px"><div class="u-d-flex w-embed"><svg width="var(--logo-size)" height="var(--logo-size)" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1820<path d="M15 12C15 13.6569 13.6569 15 12 15C11.2338 15 10.7532 14.7182 10.3171 14.191C9.82211 13.5927 9.43011 12.7344 8.91101 11.5876C8.56931 10.8326 8.72151 10.2858 9.12871 9.8787C9.60041 9.407 10.5526 9 12 9C13.4208 9 14.0865 9.3903 14.4329 9.809C14.8114 10.2665 15 10.9822 15 12Z" fill="var(--colors-black--1000)"/> 1821<path fill-rule="evenodd" clip-rule="evenodd" d="M12 18C15.3137 18 18 15.3137 18 12C18 10.241 17.5148 8.7548 16.5819 7.7198C15.665 6.7025 14.207 6 12 6C9.77161 6 8.04771 6.717 7.00741 7.7574C5.9899 8.7748 5.5572 10.161 5.9681 11.7496C6.44541 13.5947 7.17281 15.1761 8.16811 16.2802C9.13801 17.3563 10.3758 18 12 18ZM16 12C16 14.2091 14.2091 16 12 16C9.81031 16 9.01411 14.2406 8.02641 12.0584L8.00001 12C7.00001 9.7909 8.79091 8 12 8C15.2091 8 16 9.7909 16 12Z" fill="var(--colors-black--1000)"/> 1822<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21C16.8385 21 20.0606 17.0986 21.016 11.8218C21.4533 9.4065 20.7083 7.4962 19.1397 6.0359C17.5277 4.5352 14.9935 3.4706 11.8485 2.98845C8.84681 2.52828 6.43401 3.33809 4.886 4.886C3.33809 6.434 2.52828 8.8468 2.98845 11.8485C3.4677 14.9746 4.523 17.2509 6.011 18.739C7.48131 20.2092 9.46321 21 12 21ZM12 19C15.866 19 19 15.866 19 12C19 8.134 16.866 5 12 5C7.13401 5 4 8.134 5 12C6 15.866 8.13401 19 12 19Z" fill="var(--colors-black--1000)"/> 1823<path fill-rule="evenodd" clip-rule="evenodd" d="M12 24C18.5619 24 22.8913 18.6541 23.8814 12.0596C24.8715 5.4651 19.552 1.1142 12 0.119168C4.448 -0.875873 -0.871545 4.47 0.118577 12.0596C1.1087 19.6491 5.4381 24 12 24ZM12 22C17.5228 22 21 17.5228 22 12C23 6.4772 18.5228 3 12 2C5.4772 0.999997 0.999998 5.4772 2 12C3 18.5228 6.47721 22 12 22Z" fill="var(--colors-black--1000)"/> 1824</svg> 1825</div></div><div id=""><div class="u-d-flex u-d-none-portrait w-embed">
1825<svg height="16" viewBox="0 0 283 48" fill="none" xmlns="http://www.w3.org/2000/svg"> 1826<path fill-rule="evenodd" clip-rule="evenodd" d="M25.6856 0C10.6516 0 0 9.16852 0 24C0 38.8316 10.6516 48 25.6856 48C40.7192 48 51.3708 38.8316 51.3708 24C51.3708 9.16852 40.7192 0 25.6856 0ZM25.6856 37.2136C18 37.2136 14.0224 32.2248 14.0224 24C14.0224 15.7753 18 10.7865 25.6856 10.7865C33.3708 10.7865 37.3484 15.7753 37.3484 24C37.3484 32.2248 33.3708 37.2136 25.6856 37.2136ZM99.0884 9.77528V20.4268H104.954V33.6404C104.954 43.6852 111.628 48 118.976 48C122.616 48 126.257 46.9888 129.493 45.1684L129.83 35.4608C128.212 36.3372 125.718 37.0788 123.426 37.0788C120.729 37.0788 118.437 35.9324 118.437 32.764V20.4268H129.426V9.77528H118.437V0.674159H115.605L106.639 9.77528H99.0884ZM211.422 20.4268V9.77528H218.973L227.94 0.674159H230.771V9.77528H241.76V20.4268H230.771V32.764C230.771 35.9324 233.063 37.0788 235.76 37.0788C238.052 37.0788 240.546 36.3372 242.164 35.4608L241.827 45.1684C238.591 46.9888 234.951 48 231.31 48C223.962 48 217.288 43.6852 217.288 33.6404V20.4268H211.422ZM272.114 47.2584L269.957 36.674C268.474 44.8316 262.946 48 257.283 48C250.541 48 246.226 43.618 246.226 37.2808C246.226 28.5844 254.249 22.3148 268.272 23.4608C266.654 20.6968 263.35 19.4832 259.575 19.4832C254.721 19.4832 249.193 21.3708 245.215 24.4044L245.552 14.2921C250.339 10.9888 256.743 9.03372 262.878 9.03372C273.193 9.03372 282.833 14.4944 282.833 28.2472V47.2584H272.114ZM258.698 33.236C258.698 36.2696 260.99 37.7528 263.35 37.7528C266.182 37.7528 269.35 35.6628 269.35 30.8764V29.84C269.35 29.368 269.35 27.8844 269.283 27.48C263.08 27.0756 258.698 28.9888 258.698 33.236ZM171.302 28.6516C171.302 40.382 179.325 48 192.269 48C198.606 48 203.729 46.1796 207.976 43.5504L208.314 33.9776C204.336 36.6068 199.482 37.8876 195.437 37.8876C189.842 37.8876 185.392 35.3932 184.853 29.5956L209.932 30.1348C211.752 16.7864 203.797 9.03372 191.594 9.03372C179.662 9.03372 171.302 16.6516 171.302 28.6516ZM191.257 17.36C195.84 17.36 197.325 21.1616 197.662 24.6H184.853C185.325 21.16 186.68 17.36 191.257 17.36ZM151.353 48C145.42 48 138.679 46.5168 133.286 43.7528L132.948 34.7192C137.87 37.146 144.612 38.6292 149.466 38.6292C153.78 38.6292 155.398 37.4156 155.398 35.7304C155.398 34.5844 154.589 33.7752 151.555 33.1684L142.994 31.4832C136.791 30.2696 132.342 26.8316 132.342 20.9664C132.342 13.1461 140.162 9.03372 149.87 9.03372C155.87 9.03372 162.072 10.5843 167.196 13.1461L167.533 22.1124C163.623 20.09 157.69 18.4044 151.96 18.4044C147.713 18.4044 145.96 19.4156 145.96 20.9664C145.96 21.8428 146.566 22.7192 149.398 23.326L157.892 25.2136C165.376 26.8988 169.016 30.6068 169.016 35.9324C169.016 43.3484 161.87 48 151.353 48ZM95.7544 9.77528V47.2584H85.0356L82.9456 35.7304C81.53 44.0224 76.6084 48 69.26 48C60.6308 48 55.5748 42.472 55.5748 31.2808V9.77528H69.058V30.1348C69.058 35.528 71.2152 37.9552 75.1252 37.9552C78.968 37.9552 82.2716 35.528 82.2716 30.0676V9.77528H95.7544Z" fill="var(--colors-black--1000)"/> 1827</svg> 1828</div></div></div></div><div class="u-d-block-portrait"><div STYLE="--logo-size: 32px"><div class="u-d-flex w-embed"><svg width="var(--logo-size)" height="var(--logo-size)" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> 1829<path d="M15 12C15 13.6569 13.6569 15 12 15C11.2338 15 10.7532 14.7182 10.3171 14.191C9.82211 13.5927 9.43011 12.7344 8.91101 11.5876C8.56931 10.8326 8.72151 10.2858 9.12871 9.8787C9.60041 9.407 10.5526 9 12 9C13.4208 9 14.0865 9.3903 14.4329 9.809C14.8114 10.2665 15 10.9822 15 12Z" fill="var(--colors-black--1000)"/> 1830<path fill-rule="evenodd" clip-rule="evenodd" d="M12 18C15.3137 18 18 15.3137 18 12C18 10.241 17.5148 8.7548 16.5819 7.7198C15.665 6.7025 14.207 6 12 6C9.77161 6 8.04771 6.717 7.00741 7.7574C5.9899 8.7748 5.5572 10.161 5.9681 11.7496C6.44541 13.5947 7.17281 15.1761 8.16811 16.2802C9.13801 17.3563 10.3758 18 12 18ZM16 12C16 14.2091 14.2091 16 12 16C9.81031 16 9.01411 14.2406 8.02641 12.0584L8.00001 12C7.00001 9.7909 8.79091 8 12 8C15.2091 8 16 9.7909 16 12Z" fill="var(--colors-black--1000)"/> 1831<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21C16.8385 21 20.0606 17.0986 21.016 11.8218C21.4533 9.4065 20.7083 7.4962 19.1397 6.0359C17.5277 4.5352 14.9935 3.4706 11.8485 2.98845C8.84681 2.52828 6.43401 3.33809 4.886 4.886C3.33809 6.434 2.52828 8.8468 2.98845 11.8485C3.4677 14.9746 4.523 17.2509 6.011 18.739C7.48131 20.2092 9.46321 21 12 21ZM12 19C15.866 19 19 15.866 19 12C19 8.134 16.866 5 12 5C7.13401 5 4 8.134 5 12C6 15.866 8.13401 19 12 19Z" fill="var(--colors-black--1000)"/> 1832<path fill-rule="evenodd" clip-rule="evenodd" d="M12 24C18.5619 24 22.8913 18.6541 23.8814 12.0596C24.8715 5.4651 19.552 1.1142 12 0.119168C4.448 -0.875873 -0.871545 4.47 0.118577 12.0596C1.1087 19.6491 5.4381 24 12 24ZM12 22C17.5228 22 21 17.5228 22 12C23 6.4772 18.5228 3 12 2C5.4772 0.999997 0.999998 5.4772 2 12C3 18.5228 6.47721 22 12 22Z" fill="var(--colors-black--1000)"/> 1833</svg> 1834</div></div></div></div></a><div class="context-menu"><div class="navbar_dropdown-list"><a fs-copyclip-message="Copied!" fs-copyclip-element="click" id="w-node-_044be52f-b587-5f9e-108a-8c88a3c38954-cc29a5f7" href="#" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-copy">â</span></div></div></div><div><div class="u-text-bold">Logo</div><div class="u-text-muted u-d-none-tablet">Copy SVGÂ code</div></div></a><a href="/brand" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-download-simple">â</span></div></div></div><div><div class="u-text-bold">Brand</div><div class="u-text-muted u-d-none-tablet">Download resources</div></div></a><div fs-copyclip-element="copy-this" class="u-d-none"><svg width="1000" height="240"
1834 viewBox="0 0 1000 240" fill="none" xmlns="http://www.w3.org/2000/svg"><br/><path d="M150 120C150 136.569 136.569 150 120 150C112.338 150 107.532 147.182 103.171 141.91C98.2213 135.927 94.301 127.344 89.1101 115.876C85.6925 108.326 87.2154 102.858 91.2868 98.7868C96.004 94.0695 105.527 90 120 90C134.208 90 140.865 93.9031 144.329 98.0902C148.114 102.665 150 109.822 150 120Z" fill="#240029"/><br/><path fill-rule="evenodd" clip-rule="evenodd" d="M120 180C153.137 180 180 153.137 180 120C180 102.41 175.148 87.548 165.819 77.1976C156.65 67.0247 142.07 60 120 60C97.7164 60 80.4769 67.1703 70.0736 77.5736C59.8993 87.7479 55.5722 101.61 59.6813 117.496C64.4541 135.947 71.7284 151.761 81.6806 162.802C91.3797 173.563 103.758 180 120 180ZM160 120C160 142.091 142.091 160 120 160C98.1034 160 90.1406 142.406 80.2641 120.584L80 120C70 97.9086 87.9086 80 120 80C152.091 80 160 97.9086 160 120Z" fill="#240029"/><br/><path fill-rule="evenodd" clip-rule="evenodd" d="M120 210C168.385 210 200.606 170.986 210.16 118.218C214.533 94.0647 207.083 74.9615 191.397 60.3586C175.277 45.3522 149.935 34.706 118.485 29.8845C88.4682 25.2828 64.3398 33.3809 48.8604 48.8604C33.3809 64.3398 25.2828 88.4682 29.8845 118.485C34.677 149.746 45.2298 172.509 60.1104 187.39C74.8127 202.092 94.6319 210 120 210ZM120 190C158.66 190 190 158.66 190 120C190 81.3401 168.66 50 120 50C71.3401 50 40 81.3401 50 120C60 158.66 81.3401 190 120 190Z" fill="#240029"/><br/><path fill-rule="evenodd" clip-rule="evenodd" d="M120 240C185.619 240 228.913 186.541 238.814 120.596C248.715 54.6507 195.52 11.142 120 1.19166C44.4795 -8.75869 -8.71542 44.7004 1.18577 120.596C11.087 196.491 54.3807 240 120 240ZM120 220C175.228 220 210 175.228 220 120C230 64.7715 185.228 30 120 20C54.7715 9.99998 9.99998 54.7715 20 120C30 185.228 64.7715 220 120 220Z" fill="#240029"/><br/><path fill-rule="evenodd" clip-rule="evenodd" d="M357.114 60C319.529 60 292.9 82.9213 292.9 120C292.9 157.079 319.529 180 357.114 180C394.698 180 421.327 157.079 421.327 120C421.327 82.9213 394.698 60 357.114 60ZM357.114 153.034C337.9 153.034 327.956 140.562 327.956 120C327.956 99.4382 337.9 86.9663 357.114 86.9663C376.327 86.9663 386.271 99.4382 386.271 120C386.271 140.562 376.327 153.034 357.114 153.034ZM540.621 84.4382V111.067H555.284V144.101C555.284 169.213 571.97 180 590.34 180C599.441 180 608.543 177.472 616.632 172.921L617.475 148.652C613.43 150.843 607.194 152.697 601.464 152.697C594.722 152.697 588.992 149.831 588.992 141.91V111.067H616.464V84.4382H588.992V61.6854H581.913L559.498 84.4382H540.621ZM821.456 111.067V84.4382H840.333L862.749 61.6854H869.827V84.4382H897.299V111.067H869.827V141.91C869.827 149.831 875.558 152.697 882.299 152.697C888.03 152.697 894.265 150.843 898.31 148.652L897.468 172.921C889.378 177.472 880.277 180 871.176 180C852.805 180 836.119 169.213 836.119 144.101V111.067H821.456ZM973.185 178.146L967.792 151.685C964.084 172.079 950.264 180 936.107 180C919.253 180 908.466 169.045 908.466 153.202C908.466 131.461 928.522 115.787 963.579 118.652C959.534 111.742 951.275 108.708 941.837 108.708C929.702 108.708 915.882 113.427 905.938 121.011L906.781 95.7303C918.747 87.4719 934.758 82.5843 950.095 82.5843C975.882 82.5843 999.983 96.2359 999.983 130.618V178.146H973.185ZM939.646 143.09C939.646 150.674 945.376 154.382 951.275 154.382C958.354 154.382 966.275 149.157 966.275 137.191V134.6C966.275 133.42 966.275 129.711 966.107 128.7C950.601 127.689 939.646 132.472 939.646 143.09ZM721.156 131.629C721.156 160.955 741.212 180 773.572 180C789.414 180 802.223 175.449 812.841 168.876L813.684 144.944C803.74 151.517 791.605 154.719 781.493 154.719C767.504 154.719 756.381 148.483 755.032 133.989L817.729 135.337C822.279 101.966 802.392 82.5843 771.886 82.5843C742.055 82.5843 721.156 101.629 721.156 131.629ZM771.043 103.4C782.5 103.4 786.212 112.904 787.055 121.5H755.032C756.212 112.9 759.6 103.4 771.043 103.4ZM671.283 180C656.451 180 639.597 176.292 626.114 169.382L625.271 146.798C637.575 152.865 654.429 156.573 666.564 156.573C677.35 156.573 681.395 153.539 681.395 149.326C681.395 146.461 679.372 144.438 671.788 142.921L650.384 138.708C634.878 135.674 623.755 127.079 623.755 112.416C623.755 92.8652 643.305 82.5843 667.575 82.5843C682.575 82.5843 698.08 86.4607 710.889 92.8652L711.732 115.281C701.957 110.225 687.125 106.011 672.799 106.011C662.182 106.011 657.799 108.539 657.799 112.416C657.799 114.607 659.316 116.798 666.395 118.315L687.631 123.034C706.339 127.247 715.44 136.517 715.44 149.831C715.44 168.371 697.575 180 671.283 180ZM532.286 84.4382V178.146H505.489L500.264 149.326C496.725 170.056 484.421 180 466.05 180C444.477 180 431.837 166.18 431.837 138.202V84.4382H465.545V135.337C4
183465.545 148.82 470.938 154.888 480.713 154.888C490.32 154.888 498.579 148.82 498.579 135.169V84.4382H532.286Z" fill="#240029"/><br/></svg></div></div></div></div><nav role="navigation" id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a5fb-cc29a5f7" class="navbar_menu is-page-height-tablet w-nav-menu"><div class="navbar_menu-container"><div class="navbar_menu-inner"><div data-hover="true" data-delay="200" class="navbar_menu-dropdown w-dropdown"><div class="navbar_dropdown-trigger w-dropdown-toggle"><div class="navbar_link-text">Learn</div><div class="dropdown-chevron"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="0-75-rem" class="icon-2 w-variant-3077f6d2-8aae-bf82-3844-06218a494311 ph-bold ph-caret-down">â</span></div></div></div><nav class="navbar_dropdown-wrapper w-dropdown-list"><div class="navbar_dropdown-list"><a id="w-node-d6d21e1f-190c-a13f-6c92-f9b09ddcb584-cc29a5f7" href="/is-outseta-for-me" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-puzzle-piece">â</span></div></div></div><div><div class="u-text-bold">Is Outseta for me?</div><div class="u-text-muted u-d-none-tablet">Find out if it's the right fit</div></div></a><a href="/demo" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-play">â</span></div></div></div><div><div class="u-text-bold">Product demo</div><div class="u-text-muted u-d-none-tablet">Watch a full product tour</div></div></a><a href="/customers" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-users-three">â</span></div></div></div><div><div class="u-text-bold">Customer showcase</div><div class="u-text-muted u-d-none-tablet">See what our customers are building</div></div></a><a href="/the-case-for-outseta" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-chats-circle">â</span></div></div></div><div><div class="u-text-bold">The case for Outseta</div><div class="u-text-muted u-d-none-tablet">As told by successful founders on X</div></div></a><a id="w-node-d6d21e1f-190c-a13f-6c92-f9b09ddcb5b5-cc29a5f7" href="/switch" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-arrow-square-in">â</span></div></div></div><div><div class="u-text-bold">Migrate to Outseta</div><div class="u-text-muted u-d-none-tablet">We make switching easy</div></div></a></div></nav></div><div data-hover="true" data-delay="200" class="navbar_menu-dropdown w-dropdown"><div class="navbar_dropdown-trigger w-dropdown-toggle"><div class="navbar_link-text">Product</div><div class="dropdown-chevron"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="0-75-rem" class="icon-2 w-variant-3077f6d2-8aae-bf82-3844-06218a494311 ph-bold ph-caret-down">â</span></div></div></div><nav class="navbar_dropdown-wrapper w-dropdown-list"><div class="navbar_dropdown-list"><a id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a636-cc29a5f7" href="/payments" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-currency-dollar">â</span></div></div></div><div><div class="u-text-bold">Payments</div><div class="u-text-muted u-d-none-tablet">Connect to Stripe and start selling</div></div></a><a id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a652-cc29a5f7" href="/authentication" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-lock-simple">â</span></div></div></div><div><div class="u-text-bold">Auth and Gating</div><div class="u-text-muted u-d-none-tablet">Create member-only access</div></div></a><a id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a63d-cc29a5f7" href="/crm" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-user">â</span></div></div></div><div><div class="u-text-bold">CRM</div><div class="u-text-muted u-d-none-tablet">Track prospects and customers</div></div></a><a id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a644-cc29a5f7" href="/email" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-at">â</span></div></div></div><div><div class="u-text-bold">Email</div><div class="u-text-muted u-d-none-tablet">Set up campaigns and automations</div></div></a><a id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a64b-cc29a5f7" href="/help-desk" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-lifebuoy">â</span></div></div></div><div><div class="u-text-bold">Help Desk</div><div class="u-text-muted u-d-none-tablet">Help your customers</div></div></a></div></nav></div><a href="/pricing" aria-current="page" class="navbar_link w-nav-link w--current">Pricing</a><div data-hover="true" data-delay="200" class="navbar_menu-dropdown w-dropdown"><div class="navbar_dropdown-trigger w-dropdown-toggle"><div class="navbar_link-text">Support</div><div class="dropdown-chevron"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="0-75-rem" class="icon-2 w-variant-3077f6d2-8aae-bf82-3844-06218a494311 ph-bold ph-caret-down">â</span></div></div></div><nav class="navbar_dropdown-wrapper w-dropdown-list"><div class="navbar_dropdown-list"><a href="https://go.outseta.com/support/kb/categories" target="_blank" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-question">â</span></div></div></div><div><div class="u-text-bold">Knowledge base</div><div class="u-text-muted u-d-none-tablet">Find answers</div></div></a><a href="https://docs.outseta.com/" target="_blank" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-code">â</span></div></div></div><div><div class="u-text-bold">API docs</div><div class="u-text-muted u-d-none-tablet">For AI agents and developers</div></div></a><a href="/guides" class="navbar_dropdown-link w-inline-block"><div data-wf--featured-icon--mode="light" class="u-d-inline-flex"><div data-wf--featured-icon-padding--variant="base" class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plug">â</span></div></div></div><div><div class="u-text-bold">Integration guides</div><div class="u-text-muted u-d-none-tablet">Connect your favorite tools</div></div></a></div></nav></div><a href="/company" class="navbar_link w-nav-link">Company</a><a href="/blog" class="navbar_link w-nav-link">Blog</a></div></div></nav>
1834<div id="w-node-_6f7abce1-6d4c-58a8-e7c3-2ef1cc29a67e-cc29a5f7" class="navbar_button-wrapper"><div class="navbar_desktop-buttons"><div><div data-wf--icon-button--variant="secondary" class="button w-variant-c14117c9-39e7-7e4c-9aae-b4cce2ee8cdd"><div data-wf--icon-button-size--variant="sm" class="icon-button-size w-variant-32bb09bd-9361-0159-2d36-627c6ed9fe96"><div class="button-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 fa-brands fa-github">â</span></div></div><div class="u-sr-only">Github</div></div><a target="_blank" href="https://github.com/outseta/agent-toolkit" class="u-link-cover w-inline-block"></a></div></div><div data-widget-mode="login" data-o-auth="1" data-o-anonymous="1" data-mode="popup"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032"><div data-wf--button-size--button-size="sm" class="button-size w-variant-c21b27d7-89d8-8ebb-cd7b-1c5422bf4a1d"><div class="button-text">Log in</div></div><a target="_self" href="#" class="u-link-cover w-inline-block"></a></div></div><div><div data-wf--button--variant="base" class="button"><div data-wf--button-size--button-size="sm" class="button-size w-variant-c21b27d7-89d8-8ebb-cd7b-1c5422bf4a1d"><div class="button-text">Sign up</div></div><a target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div></div><div class="navbar_menu-button w-nav-button"><div class="menu-icon2"><div class="menu-icon2_line-top"></div><div class="menu-icon2_line-middle"><div class="menu-icon_line-middle-inner"></div></div><div class="menu-icon2_line-bottom"></div></div></div></div></div></div></div><main id="main" class="page-main"><section class="section cc-hero-lg"><div class="container"><div class="u-z-index-2"><div class="u-mb-3-tablet"><div class="row"><div class="col col-shrink col-md-12"><div class="u-text-center-md"><h1 class="eyebrow">Pricing</h1><div class="h1">Pay for one tool<br/><span class="u-text-disabled">instead of five</span></div><p class="paragraph-longform"><span class="u-text-x-bold u-underline">No</span> contracts. <span class="u-text-x-bold u-underline">No</span> per user fees. <span class="u-text-x-bold u-underline">14-day free trial</span> with every plan.</p></div></div><div class="col u-d-none-tablet"><div class="row row-justify-center"><div class="col col-lg-8"><div class="u-position-relative"><div data-yearly-multiplier="12" data-stack="true" class="card no-border u-shadow-highlight cc-sm"><div class="card-body"><div><div class="u-z-index-1"><div class="u-d-flex cc-justify-space-between cc-align-center"><div class="u-d-flex cc-align-center cc-gap-1"><div class="featured-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b ph ph-stack">â</span></div></div><div class="u-text-mono u-text-x-bold"><div class="u-inline u-d-none-portrait">Your </div><div data-stack-new="true" class="u-inline u-text-primary-alt">old</div><div class="u-inline"> stack</div></div></div><div class="u-mb-0 paragraph-0-75 w-form"><form id="email-form" name="email-form" data-name="Email Form" method="get" data-wf-page-id="6a84a4109b19e301c1f89597" data-wf-element-id="d3c53cd5-5674-16e6-1282-d48cfa14e6d2"><label class="w-checkbox input-toggle-field cc-reverse"><div class="w-checkbox-input w-checkbox-input--inputType-custom input-toggle"></div><input type="checkbox" id="checkbox" name="checkbox" data-name="Checkbox" data-stack-toggle="true" style="opacity:0;position:absolute;z-index:-1"/><span data-stack-label="outseta" class="u-text-x-bold w-form-label" for="checkbox">Without Outseta</span></label></form><div class="w-form-done"><div>Thank you! Your submission has been received!</div></div><div class="w-form-fail"><div>Oops! Something went wrong while submitting the form.</div></div></div></div></div></div></div><div class="u-divider"></div><div class="card-body"><div data-stack-panels="true" class="paragraph-0-75"><div data-stack-panel="patched" class="u-d-flex cc-vertical cc-gap-0-25"><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">01</div></div><div>Payments and subscription billing</div></div><div class="u-text-x-bold u-text-mono u-text-nowrap"><div data-stack-price="true" class="u-inline">$49</div><div class="u-inline"> + 4% fee</div></div></div><div class="u-divider"></div><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">02</div></div><div>CRM</div></div><div class="u-text-x-bold u-text-mono u-text-nowrap"><div data-stack-price="true" class="u-inline">$50</div><div class="u-inline"> / user</div></div></div><div class="u-divider"></div><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">03</div></div><div>Content gating</div></div><div data-stack-price="true" class="u-text-x-bold u-text-mono">$25</div></div><div class="u-divider"></div><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">04</div></div><div>Email (marketing + transactional)</div></div><div data-stack-price="true" class="u-text-x-bold u-text-mono">$29</div></div><div class="u-divider"></div><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">05</div></div><div>
1834Help desk</div></div><div data-stack-price="true" class="u-text-x-bold u-text-mono">$49</div></div></div><div hidden="" data-stack-panel="outseta" class="u-d-flex cc-vertical cc-gap-0-25"><div data-stack-row="true" class="u-d-flex cc-justify-space-between cc-gap-1"><div class="u-d-flex cc-align-baseline cc-gap-0-5"><div class="stack-number-wrapper"><div class="u-text-mono u-text-muted paragraph-0-625">01</div></div><div><div class="u-text-bold">Outseta â all the tools, one platform</div><div class="u-text-muted">All your member data in one place.</div></div></div><div class="u-text-x-bold u-text-mono u-text-nowrap"><div data-stack-price="true" class="u-inline">$37</div><div class="u-inline"> + 2% fee</div></div></div></div></div></div><div class="card-body"><div class="u-z-index-1"><div class="paragraph-0-75"><div class="u-d-flex cc-justify-space-between cc-align-end"><div class="flex-grow"><div class="u-text-mono"><span class="u-text-x-bold">total </span><span class="u-text-muted stack-bills">â 5 bills</span></div><div data-odometer-element="true" data-stack-total="monthly" class="paragraph-1-5">$153/mo.</div></div><div class="u-absolute cc-emoji"><div data-stack-emoji="patched"></div></div><div class="u-absolute cc-emoji"><div hidden="" data-stack-emoji="outseta"><div class="h2 u-mb-0">ð</div></div></div><div><div class="u-text-right"><div class="u-text-mono u-text-x-bold u-text-muted">per year</div><div data-odometer-element="true" data-stack-total="yearly" class="paragraph-1-5">$1,836/yr.</div></div></div></div></div></div><div data-stack-totals="patched" class="u-absolute cc-inset-0-25 u-radius-sm-plus-plus u-border-all u-bg-secondary"></div><div hidden="" data-stack-totals="outseta" class="u-absolute cc-inset-0-25 u-radius-sm-plus-plus u-border-all u-bg-gradient-5"></div></div></div><div class="u-card-outset"></div><div class="callout-right-2"><div class="u-d-flex cc-align-center cc-justify-end cc-gap-1"><div class="u-text-primary-alt"><div class="u-d-flex w-embed"><svg width="48" height="120" viewBox="0 0 48 120" fill="none" xmlns="http://www.w3.org/2000/svg"> 1835<path d="M4.36322 115.179C6.22825 113.577 8.18915 112.13 10.3729 111.013C10.7108 110.841 11.4289 110.719 11.6022 111.176C11.7874 111.654 11.1785 112.079 10.8469 112.25C7.38293 114.022 4.52183 116.83 1.7148 119.558C1.30432 119.958 -0.228964 120.402 0.029078 119.338C1.19196 114.505 2.33042 109.645 2.60016 104.684C2.64686 103.813 4.69208
1835103.144 4.64068 104.136C4.47802 107.166 3.99217 110.153 3.37313 113.126C6.73043 105.594 10.7881 98.3952 15.4709 91.6641C20.9095 83.8455 27.1906 76.6369 34.14 70.2581C38.0505 66.673 42.1803 63.3443 46.4836 60.3054C46.8307 60.0599 47.5339 59.8305 47.8708 60.175C48.2261 60.5398 47.7671 61.0393 47.4722 61.2517C39.9923 66.5334 33.095 72.7181 26.9024 79.6189C20.7098 86.5197 15.2589 94.1638 10.6674 102.311C8.32687 106.471 6.2292 110.774 4.36322 115.179Z" fill="currentColor"/> 1836</svg></div></div><div class="u-text-hand u-text-primary-alt u-text-center u-rotate-7deg paragraph-1-25 u-text-nowrap">Try me!</div></div></div></div></div></div></div></div></div></div><div class="u-mb-4"><div data-current="Billed yearly" data-easing="linear" data-duration-in="0" data-duration-out="0" class="pricing_tabs u-d-flex cc-vertical cc-justify-center u-z-index-1 w-tabs"><div class="pricing_tabs-menu cc-align-left u-mb-2 w-tab-menu"><a data-w-tab="Billed yearly" class="pricing_tab-link cc-badge w-inline-block w-tab-link w--current"><div>Yearly</div><div class="badge cc-dark"><div class="u-d-none-portrait u-text-mono">~25% savings</div><div class="u-d-block-portrait">-25%</div></div></a><a data-w-tab="Billed monthly" class="pricing_tab-link w-inline-block w-tab-link"><div>Monthly</div></a></div><div class="u-overflow-visible w-tab-content"><div data-w-tab="Billed yearly" class="w-tab-pane w--tab-active"><div class="row row-no-h-gutters"><div class="col u-p-2-desktop"><div class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Start</div><div class="h2 u-text-body u-text-muted">$37/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 1,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-plus-circle">â</span></div></div><div>2% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Start here if you're a bootstrapped solopreneur.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlCcIYNQMRD6t7N61gpHJN" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div><div class="col col-md-first u-position-relative"><div class="u-card-outset"></div><div><div class="card u-h-100 u-shadow-insane u-z-index-1 no-border"><div class="pricing-card-popular-label u-shadow-sm"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-fire">â</span></div><div class="u-text-mono u-text-x-bold">Most popular</div></div><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Scale</div><div class="h2 u-text-body u-text-muted">$97/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="secondary" class="icon-color w-variant-92f1e884-642d-abc2-02e1-7ae9135987ab"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph-fill ph-arrow-circle-up">â</span></div></div><div>up to 10,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="secondary" class="icon-color w-variant-92f1e884-642d-abc2-02e1-7ae9135987ab"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph-fill ph-caret-circle-double-down">â</span></div></div><div class="u-strikethrough u-text-disabled">2%</div><div>1% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Cut your transaction fee <span class="u-underline u-text-bold">in half</span> compared to our entry level plan.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="base" class="button u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlEZIYNQMRD6t7ZIP5zaVo" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div><div class="pricing-card-popular-spacer"></div></div></div><div class="hero-blur-col u-bg-gradient-2"></div></div><div class="col u-p-2-desktop"><div id="cardYearly" class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Pro</div><div class="h2 u-text-body u-text-muted">$197/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 25,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-plus-circle">â</span></div></div><div class="u-strikethrough u-text-disabled">2%</div><div>1% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Get <span class="u-underline u-text-bold">priority support</span> from the people who build the software.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlGIIYNQMRD6t7EmSUBGP4" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div><div class="col u-p-2-desktop"><div id="cardYearly" class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Max</div><div class="h2 u-text-body u-text-muted">$697/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 100,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-x-circle">â</span></div></div><div class="u-strikethrough u-text-disabled">1%</div><div>No transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Transaction <span class="u-underline u-text-bold">fees vanish</span>, plus get <span class="u-underline u-text-bold">priority support</span>. You're royalty.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div>
1836<a data-o-price="price_1UDlIaIYNQMRD6t7n5OEA2mK" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div></div></div><div data-w-tab="Billed monthly" class="w-tab-pane"><div class="row row-no-h-gutters"><div class="col u-p-2-desktop"><div class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Start</div><div class="h2 u-text-body u-text-muted">$47/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 1,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-plus-circle">â</span></div></div><div>2% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Start here if you're a bootstrapped solopreneur.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlCcIYNQMRD6t70QxxS7qx" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div><div class="col col-md-first u-position-relative"><div class="u-card-outset"></div><div><div class="card u-h-100 u-shadow-insane u-z-index-1 no-border"><div class="pricing-card-popular-label u-shadow-sm"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-fire">â</span></div><div class="u-text-mono u-text-x-bold">Most popular</div></div><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Scale</div><div class="h2 u-text-body u-text-muted">$127/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="secondary" class="icon-color w-variant-92f1e884-642d-abc2-02e1-7ae9135987ab"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph-fill ph-arrow-circle-up">â</span></div></div><div>up to 10,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="secondary" class="icon-color w-variant-92f1e884-642d-abc2-02e1-7ae9135987ab"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph-fill ph-caret-circle-double-down">â</span></div></div><div class="u-strikethrough u-text-disabled">2%</div><div>1% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Cut your transaction fee <span class="u-underline u-text-bold">in half</span> compared to our entry level plan.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="base" class="button u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlEZIYNQMRD6t7f1jKmSOk" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div><div class="pricing-card-popular-spacer"></div></div></div><div class="hero-blur-col u-bg-gradient-2"></div></div><div class="col u-p-2-desktop"><div id="cardYearly" class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Pro</div><div class="h2 u-text-body u-text-muted">$247/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 25,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-plus-circle">â</span></div></div><div class="u-strikethrough u-text-disabled">2%</div><div>1% transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Get <span class="u-underline u-text-bold">priority support</span> from the people who build the software.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlGHIYNQMRD6t7vTwVECII" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div><div class="col u-p-2-desktop"><div id="cardYearly" class="card cc-shadow u-h-100 u-bg-translucent"><div class="card-body cc-space-between"><div class="u-mb-1-5"><div class="u-mb-1-5"><div class="h2 u-weight-400 u-mb-0">Max</div><div class="h2 u-text-body u-text-muted">$897/mo.</div></div><div class="u-mb-1-5"><div class="u-d-flex cc-vertical cc-gap-0-25 paragraph-0-875 u-text-mono u-text-x-bold"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-user">â</span></div></div><div>up to 100,000 contacts</div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-x-circle">â</span></div></div><div class="u-strikethrough u-text-disabled">1%</div><div>No transaction fee</div></div></div></div><div><p class="u-text-muted u-mb-0">Transaction <span class="u-underline u-text-bold">fees vanish</span>, plus get <span class="u-underline u-text-bold">priority support</span>. You're royalty.</p></div></div><div class="pricing-card-content-bottom"><div class="u-mb-1-5"><div data-wf--button--variant="secondary" class="button w-variant-c996a9ee-60e4-1216-b5e3-43b80b2b9032 u-w-100"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start free trial</div></div><a data-o-price="price_1UDlIZIYNQMRD6t7JW67IQqd" target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="u-d-flex cc-vertical cc-gap-0-5 paragraph-0-875"><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Unlimited seats for your team</span></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted">Individual and group memberships<br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Stripe payments</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Authentication</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Protected content</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">CRM</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Email</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">
1836Help desk</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Webhooks</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">MCP / API access</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Human support</span><br/></div></div><div class="u-d-flex cc-gap-0-5"><div class="u-d-flex cc-align-center u-h-lh"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-rem" class="icon-2 w-variant-e51a2178-4ae7-a982-87f8-faf6093949d1 ph-bold ph-check">â</span></div></div><div class="u-text-muted"><span class="u-text-muted">Free data migrations</span><br/></div></div></div></div></div></div></div></div></div></div></div></div><div class="row row-justify-center"><div class="col"><div class="u-text-center"><div class="eyebrow">30-day money back guarantee</div><p class="paragraph-1-5">If youâre not satisfied weâll refund your moneyâno questions asked.</p></div></div></div></div><div data-dots-canvas-init="" class="interactive-dots-grid"></div></section><section class="section u-bg-transparent u-pt-0"><div class="container"><div class="w-dyn-list"><div role="list" class="row row-justify-center w-dyn-items"><div role="listitem" class="col col-lg-4 w-dyn-item"><div class="card cc-space-between cc-shadow u-h-100 u-bg-translucent"><div class="card-body"><div class="paragraph-longform rich-text w-richtext"><p>Thinking about launching a community or SaaS product? </p><p>Outseta is your tool. </p><p>A CRM, payments, subscriptions, email automation, gated content, segmentation, etc...</p><p>Outseta is loaded with great features and functionality at an extremely fair price.</p></div></div><div class="card-body cc-shrink"><div class="u-d-flex cc-align-center cc-gap-0-75"><div class="u-position-relative"><img loading="lazy" src="https://cdn.prod.website-files.com/663e96ebe7e165e8a1394118/66f70e48fdc7bd73062fcda0_JustinWelshHeadshot.avif" alt="" class="avatar-xl"/><div class="avatar_border"></div></div><div><div class="u-mb-0-25"><div class="paragraph-1-25">Justin Welsh</div></div><div class="paragraph-0-75 u-text-mono u-text-muted">Creator and Solopreneur</div></div></div></div></div></div><div role="listitem" class="col col-lg-4 w-dyn-item"><div class="card cc-space-between cc-shadow u-h-100 u-bg-translucent"><div class="card-body"><div class="paragraph-longform rich-text w-richtext"><p>As the founder of a 400+ member founder community, I can confidently say that Outseta has been absolutely integral to our success. We simply wouldnât have been able to grow to our current size without them.</p></div></div><div class="card-body cc-shrink"><div class="u-d-flex cc-align-center cc-gap-0-75"><div class="u-position-relative"><img loading="lazy" src="https://cdn.prod.website-files.com/663e96ebe7e165e8a1394118/68020d1c077a3b0e0ad0028e_PatrickSearle.jpeg" alt="" class="avatar-xl"/><div class="avatar_border"></div></div><div><div class="u-mb-0-25"><div class="paragraph-1-25">Patrick Searle</div></div><div class="paragraph-0-75 u-text-mono u-text-muted">Founder, United Founders</div></div></div></div></div></div></div></div></div></section><section class="section u-pt-0"><div class="container"><div class="u-mb-4"><div class="row"><div class="col"><div class="u-text-center"><h2 class="eyebrow">What does Outseta do?</h2><p class="h3">Outseta commonly replaces these tools</p></div></div></div></div><div class="row row-justify-center"><div class="col col-lg-10"><div class="u-position-relative"><div class="card no-border u-shadow-highlight"><div class="paragraph-0-875 u-text-center u-text-mono u-text-muted"><div class="row row-no-gutters"><div class="col col-lg-6 u-border-r-lg-b-md"><div class="u-pt-1 u-pb-1 u-border-bottom u-bg-tertiary"><div>Memberships + Gating</div></div><div class="row row-no-gutters"><div class="col"><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a8799a28c921f7de30a6eda_Memberclicks.png" loading="lazy" width="Auto" height="Auto" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a8799a28c921f7de30a6eda_Memberclicks-p-500.png 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a8799a28c921f7de30a6eda_Memberclicks-p-800.png 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a8799a28c921f7de30a6eda_Memberclicks-p-1080.png 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a8799a28c921f7de30a6eda_Memberclicks.png 1458w" sizes="100vw" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84af20d21a18978b23bc73_Memberspace.png" loading="lazy" width="Auto" alt="" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84af97429bbe40540eb212_5869fe7cabc8fd9e1e82da3567f785fa_Memberful.png" loading="lazy" width="Auto" alt="" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress.webp" loading="lazy" width="Auto" sizes="100vw" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-500.webp 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-800.webp 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-1080.webp 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-1600.webp 1600w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-2000.webp 2000w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress-p-2600.webp 2600w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b7952f333ef165a6a248_Memberpress.webp 3000w" class="replaces-logo"/></div></div><div class="col"><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b0f33438b99f406d059d_GlueUpLogo.webp" loading="lazy" width="Auto" sizes="100vw" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b0f33438b99f406d059d_GlueUpLogo-p-500.webp 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b0f33438b99f406d059d_GlueUpLogo-p-800.webp 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b0f33438b99f406d059d_GlueUpLogo-p-1080.webp 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b0f33438b99f406d059d_GlueUpLogo.webp 1822w" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b026508e6d3a8900cd25_JoinIt.png" loading="lazy" width="Auto" height="Auto" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b026508e6d3a8900cd25_JoinIt-p-500.png 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b026508e6d3a8900cd25_JoinIt.png 634w" sizes="100vw" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b5d5d9ce19028f432142_0091a46b26675d79bab810c7df636502_WildApricot.png" loading="lazy" width="Auto" alt="" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b74d517a52cbd8dc2e25_9d0c916f10cc775450ff36dac66f135a_CircleLogo.png" loading="lazy" width="Auto" sizes="100vw" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b74d517a52cbd8dc2e25_9d0c916f10cc775450ff36dac66f135a_CircleLogo-p-500.png 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b74d517a52cbd8dc2e25_9d0c916f10cc775450ff36dac66f135a_CircleLogo.png 786w" class="replaces-logo"/></div></div></div></div><div class="col u-border-r-lg-b-md"><div class="u-pt-1 u-pb-1 u-border-bottom u-bg-tertiary"><div>CRM</div></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec6011fea8964b59f78707_hubspot.png" loading="lazy" width="Auto" alt="Hubspot" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec60127d8ad9a226b581b1_pipedrive.png" loading="lazy" width="Auto" alt="Pipedrive" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b1b42f333ef165a27ce4_1044ef30d6ea0bcd7f2a8094e1ab890a_Attio.png" loading="lazy" width="Auto" sizes="100vw" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b1b42f333ef165a27ce4_1044ef30d6ea0bcd7f2a8094e1ab890a_Attio-p-500.png 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b1b42f333ef165a27ce4_1044ef30d6ea0bcd7f2a8094e1ab890a_Attio-p-800.png 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b1b42f333ef165a27ce4_1044ef30d6ea0bcd7f2a8094e1ab890a_Attio-p-1080.png 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a84b1b42f333ef165a27ce4_1044ef30d6ea0bcd7f2a8094e1ab890a_Attio.png 1222w" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201.png" loading="lazy" width="Auto" sizes="100vw" alt="" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201-p-500.png 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201-p-800.png 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201-p-1080.png 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201-p-1600.png 1600w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6a91c300e5400be883fbdebb_google-sheets-logo-with-text-cf97%201.png 2000w" class="replaces-logo"/></div></div><div class="col"><div class="u-pt-1 u-pb-1 u-border-bottom u-bg-tertiary"><div>Email + Support</div></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec6012f895360354ff2422_665e8f3e496f861bd30a53cb86a126da_mailchimp.png" loading="lazy" width="Auto" alt="Mailchimp" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec60120fba737e6649089d_convertkit.png" loading="lazy" width="Auto" alt="ConvertKit" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec6011a8c2d8516f041af3_intercom.png" loading="lazy" width="Auto" alt="Intercom" class="replaces-logo"/></div><div class="u-p-1"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/66ec60121884946145cba68a_zendesk.png" loading="lazy" width="Auto" alt="Zendesk" class="replaces-logo"/></div></div></div></div></div><div class="u-card-outset"></div></div></div></div></div></section><section class="section u-pt-0"><div class="container"><div class="u-mb-3"><div class="u-text-center"><h2 class="eyebrow">Testimonials</h2><div class="h3">What people are saying</div></div></div><div class="w-embed w-iframe w-script">
1836<script type="text/javascript" src="https://testimonial.to/js/iframeResizer.min.js"></script>
1836 1837<iframe id='testimonialto-outseta-tag-all-light' src="https://embed-v2.testimonial.to/w/outseta?theme=light&card=base&loadMore=on&initialCount=20&tag=all" frameborder="0" scrolling="no" width="100%"></iframe>
1838<script type="text/javascript">iFrameResize({log: false, checkOrigin: false}, '#testimonialto-outseta-tag-all-light');</script>
1838</div></div></section><section id="faq" class="section u-pt-0"><div class="container"><div class="row"><div class="col col-lg-4"><h2 class="h3 u-text-center-md">Frequently asked questions</h2></div><div class="col"><div class="u-border-top w-dyn-list"><div role="list" class="w-dyn-items"><div role="listitem" class="w-dyn-item"><details id="" open="" name="" STYLE="" data-accordion-start-open="false" role="listitem" class="accordion-item"><summary class="accordion-trigger"><label class="accordion-title paragraph-1-25">What are transaction fees and how are they calculated?</label><div xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 32" fill="none" class="accordion-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plus">â</span></div></div></summary><div data-accordion="content" class="accordion-content"><div class="accordion-content_spacer"><div class="rich-text u-text-muted w-richtext"><p>Transaction fees are paid each time you process a payment. Outseta's fees are charged in addition to Stripe's standard fees (typically 2.9% + 30¢ in the US). Our fee is 2% on our entry level plan, then 1% on most other Outseta plans. We also offer 0% fee plan for our largest customers.</p></div></div></div></details></div><div role="listitem" class="w-dyn-item"><details id="" open="" name="" STYLE="" data-accordion-start-open="false" role="listitem" class="accordion-item"><summary class="accordion-trigger"><label class="accordion-title paragraph-1-25">How does Outseta's pricing compare to other membership software?</label><div xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 32" fill="none" class="accordion-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plus">â</span></div></div></summary><div data-accordion="content" class="accordion-content"><div class="accordion-content_spacer"><div class="rich-text u-text-muted w-richtext"><p>Outseta is priced similarly to alternatives like Memberstack or Memberspace, but includes more features for the entire customer lifecycleâpayments, authentication, gated content, CRM, email, and support tools. As a result, you should consider Outseta's price versus the cost of the other software tools it displaces. Our transaction fees are among the lowest in the industry and decrease as your business grows.</p></div></div></div></details></div><div role="listitem" class="w-dyn-item"><details id="" open="" name="" STYLE="" data-accordion-start-open="false" role="listitem" class="accordion-item"><summary class="accordion-trigger"><label class="accordion-title paragraph-1-25">What does "no per-user fees" mean?</label><div xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 32" fill="none" class="accordion-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plus">â</span></div></div></summary><div data-accordion="content" class="accordion-content"><div class="accordion-content_spacer"><div class="rich-text u-text-muted w-richtext"><p>You can invite anyone that you work with to have access to your Outseta account at no additional cost. We don't charge based on "seats"âin fact, we actively encourage you to invite your whole team!</p><p>Add your developer to handle integrations, your community manager to respond to support tickets, your co-founder to manage reporting. Everyone gets their own login. Whether you have 2 people or 20 people on your team, your price stays the same. Most comparable tools charge $10-50 per user per month.</p></div></div></div></details></div><div role="listitem" class="w-dyn-item"><details id="" open="" name="" STYLE="" data-accordion-start-open="false" role="listitem" class="accordion-item"><summary class="accordion-trigger"><label class="accordion-title paragraph-1-25">Does Outseta require a contract or long-term commitment?</label>
1838<div xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 32" fill="none" class="accordion-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plus">â</span></div></div></summary><div data-accordion="content" class="accordion-content"><div class="accordion-content_spacer"><div class="rich-text u-text-muted w-richtext"><p><strong>No contracts. Ever.</strong> You can cancel anytimeâmonthly or annual plans both let you walk away when you want. Outseta's pricing is designed for business owners who want flexibility.</p></div></div></div></details></div><div role="listitem" class="w-dyn-item"><details id="" open="" name="" STYLE="" data-accordion-start-open="false" role="listitem" class="accordion-item"><summary class="accordion-trigger"><label class="accordion-title paragraph-1-25">What's included in the free trial?</label><div xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 32 32" fill="none" class="accordion-icon"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-5-rem" class="icon-2 w-variant-62141078-fb62-0852-5cdd-84c5f492501c ph ph-plus">â</span></div></div></summary><div data-accordion="content" class="accordion-content"><div class="accordion-content_spacer"><div class="rich-text u-text-muted w-richtext"><p>You get full access to all featuresâCRM, billing, email marketing, help desk, and authenticationâfor 14 days. You can choose to subscribe to a paid plan at the end of the trial period if you'd like to.</p></div></div></div></details></div></div></div></div></div></div></section></main><footer><section class="section cc-inset u-mode-dark"><div class="container"><div class="row"><div class="col col-lg-5"><div><h2>Get started with Outseta today</h2><p class="paragraph-longform u-text-muted u-mb-2">Try Outseta free for 14 daysâyou'll have access to every feature. Cancel any time.</p></div><div data-wf--button--variant="base" class="button"><div data-wf--button-size--button-size="base" class="button-size"><div class="button-text">Start your free trial</div></div><a target="_self" href="/get-started" class="u-link-cover w-inline-block"></a></div></div><div class="col"><div class="footer_skew-wrapper"><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6700431fc3dc3762b59884e8_cdc5cff098435a0a7f0259a36fdbdab8_cleanshot-2024-10-04-15-33-33.avif" loading="lazy" sizes="100vw" srcset="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6700431fc3dc3762b59884e8_cdc5cff098435a0a7f0259a36fdbdab8_cleanshot-2024-10-04-15-33-33-p-500.avif 500w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6700431fc3dc3762b59884e8_cdc5cff098435a0a7f0259a36fdbdab8_cleanshot-2024-10-04-15-33-33-p-800.avif 800w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6700431fc3dc3762b59884e8_cdc5cff098435a0a7f0259a36fdbdab8_cleanshot-2024-10-04-15-33-33-p-1080.avif 1080w, https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6700431fc3dc3762b59884e8_cdc5cff098435a0a7f0259a36fdbdab8_cleanshot-2024-10-04-15-33-33.avif 2000w" alt="Outseta dashboard showing user activity and billing information. The left panel includes navigation options such as Home, CRM, Email, and Help Desk. A detailed activity feed is displayed. On the right, graphs show metrics like monthly recurring revenue and subscriber count." class="u-skew-right u-position-absolute-inset-0 u-position-static-tablet u-vw-50 u-shadow-sm"/><div class="u-skew-right u-position-absolute-inset-0 u-vw-50 u-bg-gradient-4"></div></div></div></div></div><div class="u-position-absolute-inset-0 u-bg-dots"></div></section><section class="section"><div class="container"><div class="row"><div class="col col-lg-3"><div class="u-d-flex cc-vertical cc-justify-space-between u-h-100 cc-gap-2"><div class="u-d-flex cc-vertical cc-gap-1"><div><img src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/6706f3d631e27efba4769e10_outseta-logo.png" loading="lazy" width="Auto" height="32" alt=""/></div></div><div class="u-d-flex cc-vertical cc-gap-1"><div class="u-d-flex cc-align-center cc-gap-1"><a href="https://x.com/outseta" target="_blank" class="btn cc-icon-only cc-secondary w-inline-block"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b fab fa-x-twitter">â</span></div></a><a href="https://bsky.app/profile/outseta.com" target="_blank" class="btn cc-icon-only cc-secondary w-inline-block"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b fab fa-bluesky">â</span></div></a><a href="https://www.linkedin.com/company/outseta" target="_blank" class="btn cc-icon-only cc-secondary w-inline-block"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b fab fa-linkedin">â</span></div></a><a href="https://www.youtube.com/@outseta" target="_blank" class="btn cc-icon-only cc-secondary w-inline-block"><div data-wf--icon--color="inherit" class="icon-color"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b fab fa-youtube">â</span></div></a></div></div></div></div><div class="col col-md-6"><div class="u-d-flex cc-vertical cc-gap-0-75"><div class="paragraph-0-875 u-text-bold">Product</div><a href="/payments" class="footer_link">Payments</a><a href="/authentication" class="footer_link">Auth and gating</a><a href="/crm" class="footer_link">CRM</a><a href="/email" class="footer_link">Email</a><a href="/help-desk" class="footer_link">
1838Help desk</a><a href="/pricing" aria-current="page" class="footer_link w--current">Pricing</a></div></div><div class="col col-md-6"><div class="u-d-flex cc-vertical cc-gap-0-75"><div class="paragraph-0-875 u-text-bold">Company</div><a href="/company" class="footer_link">About us</a><a href="/blog" class="footer_link">Blog</a><a href="/partners" class="footer_link">Partner program</a><a href="/privacy-policy" class="footer_link">Privacy policy</a><a href="/terms-of-service" class="footer_link">Terms of service</a></div></div><div class="col col-md-6"><div class="u-d-flex cc-vertical cc-gap-0-75"><div class="paragraph-0-875 u-text-bold">Comparisons</div><a href="/vs/memberstack" class="footer_link">vs. Memberstack</a><a href="/vs/framerauth" class="footer_link">vs. FrameAuth</a><a href="/vs/hubspot" class="footer_link">vs. Hubspot</a><a href="/vs/clerk-dev" class="footer_link">vs. Clerk</a><a href="/vs/whop" class="footer_link">vs. Whop</a><a href="/vs/chargebee" class="footer_link">vs. Chargebee</a><a href="/vs/wild-apricot" class="footer_link">vs. Wild Apricot</a><a href="/vs/kajabi" class="footer_link">vs. Kajabi</a></div></div><div class="col col-md-6"><div class="u-d-flex cc-vertical cc-gap-0-75"><div class="paragraph-0-875 u-text-bold">Use Cases</div><a href="/use-cases/association-management-software" class="footer_link">Associations</a><a href="/association-and-club-website-examples" class="footer_link">Clubs</a><a href="/association-and-club-website-examples" class="footer_link">Communities</a><a href="/membership-site-examples" class="footer_link">Non-profits</a><a href="/membership-site-examples" class="footer_link">Membership sites</a><a href="/online-course-examples" class="footer_link">Courses</a><a href="/digital-product-examples" class="footer_link">SaaS</a></div></div><div class="col col-md-6"><div class="u-d-flex cc-vertical cc-gap-0-75"><div class="paragraph-0-875 u-text-bold">Resources</div><a href="/switch" class="footer_link">Switch to Outseta</a><a href="https://go.outseta.com/support/kb/categories" target="_blank" class="footer_link">Help desk</a><a href="https://docs.outseta.com/" target="_blank" class="footer_link">API docs</a><a href="https://go.outseta.com/support/kb/articles/z9M2EyW4/outseta-mcp-server-for-ai-assistants" target="_blank" class="footer_link">MCP server</a><a href="https://github.com/outseta/agent-toolkit" target="_blank" class="footer_link">Outseta AI Agent Toolkit</a><a href="https://www.outseta.com/use-cases/ai" class="footer_link">Building with AI</a><a href="https://www.outseta.com/guides" class="footer_link">Integrations</a><a href="https://www.outseta.com/posts/best-membership-management-software" class="footer_link">Best membership software</a></div></div></div><div class="u-mt-3 u-mb-3"><div class="u-border-bottom"></div></div><div class="row row-align-center"><div class="col"><div class="paragraph-0-875 u-text-muted">© <span id="year">2026</span> Outseta</div></div><div class="col col-shrink"><div class="u-d-flex cc-gap-1 cc-wrap"><div class="badge cc-large"><div class="u-d-flex cc-gap-0-5 cc-align-center"><div class="u-d-flex w-embed"><svg width="18" height="18" viewBox="0 0 192 192" fill="none" xmlns="http://www.w3.org/2000/svg"> 1839<rect width="192" height="192" rx="32" fill="#635BFF"/> 1840<path d="M99.2284 57.8385C95.0253 57.8385 91.5699 58.4329 89.1506 59.8666C86.6871 61.3264 85.3425 63.6312 85.3425 66.8835C85.3425 69.2627 86.3575 71.1946 88.0766 72.8277C89.7814 74.4473 92.1898 75.7857 95.0209 77.0147C97.8563 78.2455 101.159 79.3843 104.673 80.5859C104.819 80.6355 104.964 80.6852 105.11 80.7351C108.503 81.8947 112.09 83.1206 115.676 84.5565C123.161 87.553 130.594 91.4455 136.166 97.4863C141.725 103.512 145.461 111.708 145.5 123.377C145.5 137.392 139.935 148.4 130.337 155.916C120.725 163.444 107.026 167.5 90.7244 167.5C77.3395 167.5 62.7143 164.86 48.2323 158.651V122.161C61.3862 129.26 77.7868 134.478 90.7244 134.478C95.1613 134.478 99.0452 133.884 101.835 132.317C103.239 131.529 104.372 130.491 105.152 129.157C105.932 127.822 106.343 126.219 106.343 124.325C106.343 119.291 102.324 116.074 96.7075 113.393C93.8782 112.043 90.5848 110.801 87.0793 109.522C86.4784 109.303 85.8712 109.082 85.2588 108.86C82.2913 107.783 79.2007 106.662 76.1093 105.407C68.6478 102.378 61.2458 98.5973 55.7093 92.89C50.1891 87.1996 46.5 79.5705 46.5 68.7824C46.5 54.9156 51.757 43.8658 60.9445 36.2733C70.1429 28.6719 83.3266 24.5 99.2284 24.5C112.139 24.5 124.886 26.5151 137.783 31.6184V67.6318C125.864 61.3516 111.035 57.8385 99.2284 57.8385Z" fill="white"/> 1841</svg></div><div class="u-text-mono u-text-muted paragraph-0-875">Stripe verified partner</div></div></div><div class="badge cc-large"><div class="u-d-flex cc-gap-0-5 cc-align-center"><div data-wf--icon--color="disabled" class="icon-color w-variant-5e1bfc4b-a548-cc1f-3c41-3f784ac9e961"><span data-wf--icon-size--variant="1-25-rem" class="icon-2 w-variant-6c1f864d-5e0f-c2cb-8e27-e814c497c73b ph-fill ph-seal-check">â</span></div><div class="u-text-mono u-text-muted paragraph-0-875">gdpr compliant</div></div></div><a href="https://status.outseta.com/" target="_blank" class="badge cc-large w-inline-block"><div class="u-d-flex cc-gap-0-5 cc-align-center"><div class="u-d-flex w-embed"><img src="https://ohdear.app/badges/site/01hn3vts0qe3zhhth4qn37vbpt/uptime/small" alt="uptime status badge" /></div><div class="u-text-mono u-text-muted paragraph-0-875">Status</div></div></a></div></div></div></div></section><div class="u-d-none w-embed w-script">
1841<script>document.getElementById('year').textContent = new Date().getFullYear();</script>
1841</div></footer></div>
1841<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=663cf90ca192fe7e5bcb8bd7" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/js/outseta-2024.schunk.01b56ef8c8bd111c.js" type="text/javascript" integrity="sha384-iYCaTaSJwo7SLv+5Fpais23xfjuXE4ZoLekLYLRLibhpj99yMyQiXSRZk4pg0rtX" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/js/outseta-2024.schunk.10ce4b34893c4859.js" type="text/javascript" integrity="sha384-KKKE+ueK9g7ICAbWM+C13JY6TZcKgX1C5KDZWdhPRlTcuuQRDsj+9MPrEshJ/2iR" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/js/outseta-2024.schunk.104dd09a36d5fdf8.js" type="text/javascript" integrity="sha384-nYAsaDh5sfVhzU8jixHFOKyxodeHbRTWs3WQmmJatudshC+mDZgvzDpKi//LgdLy" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/js/outseta-2024.schunk.3af2cea43fab8f58.js" type="text/javascript" integrity="sha384-QNrpDysHCHmTH3QJX3z0Fe8Ugi9Tb5GqjGWdA2sjj1F9ElrzXqUfTXfF/M7rZAvA" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/663cf90ca192fe7e5bcb8bd7/js/outseta-2024.36df6e5f.f0c944cdcfe4bc42.js" type="text/javascript" integrity="sha384-3TV1j295obTTcp08/lzEtORF2v8FtBlV1iyLE3MLEOU+7x33uIi2wBKvOH5otJZs" crossorigin="anonymous"></script>
1841<script src="https://cdn.prod.website-files.com/gsap/3.15.0/gsap.min.js" type="text/javascript"></script>
1841<script> 1842 (function() { 1843 var urlParams = new URLSearchParams(window.location.search); 1844 var gclid = urlParams.get('gclid'); 1845 if (gclid) { 1846 localStorage.setItem('gclid_outseta_2026', gclid); 1847 } 1848 })(); 1849</script>
1849 1850 1851<!-- Google tag (gtag.js) -->
vendor: 64 bytes, lines 1851-1852
1851 1852<script async src="https://www.googletagmanager.com/gtag/js?id=
1852AW-863147903
vendor: 12 bytes, line 1852
1852"></script>
1853<script> 1854
vendor: 134 bytes, lines 1854-1858
1854window.dataLayer = window.dataLayer || []; 1855 function gtag(){dataLayer.push(arguments);} 1856 gtag('js', new Date()); 1857 1858 gtag('config', '
1858AW-863147903
vendor: 4 bytes, line 1858
1858');
1859</script>
1859<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>
vendor: 1 bytes, line 1859
1859
1860<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js"></script>
vendor: 1 bytes, line 1860
1860
1861<script> 1862gsap.registerPlugin(ScrollTrigger); 1863 1864function initNumberOdometer() { 1865 const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches 1866 const initFlag = 'data-odometer-initialized' 1867 const activeTweens = new WeakMap() 1868 1869 // Configuration 1870 const defaults = { 1871 duration: 1, 1872 ease: 'power3.out', 1873 elementStagger: 0.1, 1874 digitStagger: 0.04, 1875 revealDuration: 0.5, 1876 revealEase: 'power2.out', 1877 triggerStart: 'top 80%', 1878 staggerOrder: 'left', 1879 digitCycles: 2 1880 } 1881 1882 // Scroll-triggered groups 1883 document.querySelectorAll('[data-odometer-group]').forEach(group => { 1884 if (group.hasAttribute(initFlag)) return 1885 group.setAttribute(initFlag, '') 1886 1887 const elements = Array.from(group.querySelectorAll('[data-odometer-element]')) 1888 if (!elements.length || prefersReducedMotion) return 1889 1890 const staggerOrder = group.getAttribute('data-odometer-stagger-order') || defaults.staggerOrder 1891 const triggerStart = group.getAttribute('data-odometer-trigger-start') || defaults.triggerStart 1892 const elementStagger = parseFloat(group.getAttribute('data-odometer-stagger')) || defaults.elementStagger 1893 1894 const elementData = elements.map(el => { 1895 const originalText = el.textContent.trim() 1896 const hasExplicitStart = el.hasAttribute('data-odometer-start') 1897 const startValue = parseFloat(el.getAttribute('data-odometer-start')) || 0 1898 const duration = parseFloat(el.getAttribute('data-odometer-duration')) || defaults.duration 1899 const step = getLineHeightRatio(el) 1900 1901 let segments = parseSegments(originalText) 1902 segments = mapStartDigits(segments, startValue) 1903 segments = markHiddenSegments(segments, startValue) 1904 1905 const grow = shouldGrow(el, hasExplicitStart, startValue, segments) 1906 const { rollers, revealEls } = buildRollerDOM(el, segments, step, grow) 1907 1908 const fontSize = parseFloat(getComputedStyle(el).fontSize) 1909 const revealData = revealEls.map(revealEl => { 1910 const widthEm = revealEl.offsetWidth / fontSize 1911 gsap.set(revealEl, { width: 0, overflow: 'hidden' }) 1912 return { el: revealEl, widthEm } 1913 }) 1914 1915 return { el, rollers, duration, step, revealData, originalText } 1916 }) 1917 1918 const ordered = applyStaggerOrder(elementData, staggerOrder) 1919 1920 const tl = gsap.timeline({ 1921 scrollTrigger: { 1922 trigger: group, 1923 start: triggerStart, 1924 once: true 1925 }, 1926 onComplete() { 1927 elementData.forEach(({ el, originalText, step }) => { 1928 cleanupElement(el, originalText) 1929 }) 1930 } 1931 }) 1932 1933 ordered.forEach((data, orderIdx) => { 1934 const { rollers, duration, step, revealData } = data 1935 const offset = orderIdx * elementStagger 1936 1937 revealData.forEach(({ el, widthEm }) => { 1938 tl.to(el, { 1939 width: widthEm + 'em', 1940 opacity: 1, 1941 duration: defaults.revealDuration, 1942 ease: defaults.revealEase 1943 }, offset) 1944 }) 1945 1946 rollers.forEach(({ roller, targetPos }, digitIdx) => { 1947 const reversedIdx = rollers.length - 1 - digitIdx 1948 tl.to(roller, { 1949 y: -targetPos * step + 'em', 1950 duration, 1951 ease: defaults.ease, 1952 force3D: true 1953 }, offset + reversedIdx * defaults.digitStagger) 1954 }) 1955 }) 1956 }) 1957 1958 // Programmatic update (optional add-on) 1959 return function updateOdometer(el, newText, options = {}) { 1960 const currentText = el.textContent.trim() 1961 if (currentText === newText) return 1962 1963 const duration = options.duration || defaults.duration 1964 const ease = options.ease || defaults.ease 1965 const step = getLineHeightRatio(el) 1966 1967 // Kill any running animation and clear its inline style locks 1968 const existing = activeTweens.get(el) 1969 if (existing) { 1970 existing.kill() 1971 gsap.set(el, { clearProps: 'width,overflow' }) 1972 } 1973 1974 // Measure current width before rebuilding (in em for responsive scaling) 1975 const fontSize = parseFloat(getComputedStyle(el).fontSize) 1976 const oldWidthEm = el.getBoundingClientRect().width / fontSize 1977 1978 // Parse current text as start, new text as end 1979 const startSegments = parseSegments(currentText) 1980 const startDigitsStr = startSegments 1981 .filter(s => s.type === 'digit') 1982 .map(s => s.char) 1983 .join('') 1984 const startValue = parseInt(startDigitsStr, 10) || 0 1985 1986 let segments = parseSegments(newText) 1987 segments = mapStartDigits(segments, startValue) 1988 segments = markHiddenSegments(segments, startValue) 1989 const { rollers, revealEls } = buildRollerDOM(el, segments, step, true) 1990 1991 // Measure new natural width (in em) 1992 const newWidthEm = el.getBoundingClientRect().width / fontSize 1993 const widthChanged = Math.abs(oldWidthEm - newWidthEm) > 0.01 1994 1995 // Lock to old width for smooth transition 1996 if (widthChanged) { 1997 gsap.set(el, { width: oldWidthEm + 'em', overflow: 'hidden' }) 1998 } 1999 2000 const tl = gsap.timeline({ 2001 onComplete() { 2002 cleanupElement(el, newText) 2003 activeTweens.delete(el) 2004 } 2005 }) 2006 activeTweens.set(el, tl) 2007 2008 // Animate element width 2009 if (widthChanged) { 2010 tl.to(el, { 2011 width: newWidthEm + 'em', 2012 duration: defaults.revealDuration, 2013 ease: defaults.revealEase 2014 }, 0) 2015 } 2016 2017 // Fade in hidden statics
2018 revealEls.forEach(revealEl => { 2019 if (revealEl.getAttribute('data-odometer-part') === 'static') { 2020 tl.to(revealEl, { opacity: 1, duration: 0.2 }, 0) 2021 } 2022 }) 2023 2024 // Roll digits 2025 rollers.forEach(({ roller, targetPos }, digitIdx) => { 2026 const reversedIdx = rollers.length - 1 - digitIdx 2027 tl.to(roller, { 2028 y: -targetPos * step + 'em', 2029 duration, 2030 ease, 2031 force3D: true 2032 }, reversedIdx * defaults.digitStagger) 2033 }) 2034 } 2035 2036 // Helpers 2037 function getLineHeightRatio(el) { 2038 const cs = getComputedStyle(el) 2039 const lh = cs.lineHeight 2040 if (lh === 'normal') return 1.2 2041 return parseFloat(lh) / parseFloat(cs.fontSize) 2042 } 2043 2044 function parseSegments(text) { 2045 return [...text].map(char => ({ 2046 type: /\d/.test(char) ? 'digit' : 'static', 2047 char 2048 })) 2049 } 2050 2051 function mapStartDigits(segments, startValue) { 2052 const digitSlots = segments.filter(s => s.type === 'digit') 2053 const padded = String(Math.floor(Math.abs(startValue))) 2054 .padStart(digitSlots.length, '0') 2055 .slice(-digitSlots.length) 2056 let di = 0 2057 return segments.map(s => 2058 s.type === 'digit' 2059 ? { ...s, startDigit: parseInt(padded[di++], 10) } 2060 : s 2061 ) 2062 } 2063 2064 function markHiddenSegments(segments, startValue) { 2065 const totalDigits = segments.filter(s => s.type === 'digit').length 2066 const absStart = Math.floor(Math.abs(startValue)) 2067 const startDigitCount = absStart === 0 ? 1 : String(absStart).length 2068 const leadingZeros = Math.max(0, totalDigits - startDigitCount) 2069 if (leadingZeros === 0) return segments 2070 let digitsSeen = 0 2071 let firstDigitSeen = false 2072 let prevDigitHidden = false 2073 return segments.map(seg => { 2074 if (seg.type === 'digit') { 2075 firstDigitSeen = true 2076 const hidden = digitsSeen < leadingZeros 2077 prevDigitHidden = hidden 2078 digitsSeen++ 2079 return { ...seg, hidden } 2080 } 2081 const hidden = firstDigitSeen && prevDigitHidden 2082 return { ...seg, hidden } 2083 }) 2084 } 2085 2086 function shouldGrow(el, hasExplicitStart, startValue, segments) { 2087 if (el.hasAttribute('data-odometer-grow')) { 2088 return el.getAttribute('data-odometer-grow') !== 'false' 2089 } 2090 if (!hasExplicitStart) return false 2091 const absStart = Math.floor(Math.abs(startValue)) 2092 const startDigitCount = absStart === 0 ? 1 : String(absStart).length 2093 const endDigitCount = segments.filter(s => s.type === 'digit').length 2094 return startDigitCount < endDigitCount 2095 } 2096 2097 function buildRollerDOM(el, segments, step, grow) { 2098 el.innerHTML = '' 2099 el.style.height = '' 2100 const rollers = [] 2101 const revealEls = [] 2102 const totalCells = 10 * defaults.digitCycles 2103 segments.forEach(seg => { 2104 if (seg.type === 'static') { 2105 const span = document.createElement('span') 2106 span.setAttribute('data-odometer-part', 'static') 2107 span.style.height = step + 'em' 2108 span.style.lineHeight = step 2109 span.textContent = seg.char 2110 el.appendChild(span) 2111 if (grow && seg.hidden) { 2112 gsap.set(span, { opacity: 0 }) 2113 revealEls.push(span) 2114 } 2115 return 2116 } 2117 const mask = document.createElement('span') 2118 mask.setAttribute('data-odometer-part', 'mask') 2119 mask.style.height = step + 'em' 2120 mask.style.lineHeight = step 2121 const roller = document.createElement('span') 2122 roller.setAttribute('data-odometer-part', 'roller') 2123 roller.style.lineHeight = step 2124 2125 const digits = [] 2126 for (let d = 0; d < totalCells; d++) { 2127 digits.push(d % 10) 2128 } 2129 roller.textContent = digits.join('\n') 2130 mask.appendChild(roller) 2131 el.appendChild(mask) 2132 const startDigit = seg.startDigit || 0 2133 const isReveal = grow && seg.hidden 2134 gsap.set(roller, { y: isReveal ? step + 'em' : -startDigit * step + 'em' }) 2135 const endDigit = parseInt(seg.char, 10) 2136 const targetPos = endDigit > startDigit ? endDigit : 10 + endDigit 2137 rollers.push({ roller, targetPos }) 2138 if (isReveal) revealEls.push(mask) 2139 }) 2140 return { rollers, revealEls } 2141 } 2142 2143 function cleanupElement(el, originalText) { 2144 el.style.overflow = '' 2145 el.style.height = '' 2146 2147 // Remove rollers, set final digit, clear inline bloat (but preserve width) 2148 const digits = [...originalText].filter(c => /\d/.test(c)) 2149 let di = 0 2150 2151 el.querySelectorAll('[data-odometer-part="mask"]').forEach(mask => { 2152 const roller = mask.querySelector('[data-odometer-part="roller"]') 2153 if (roller) roller.remove() 2154 mask.textContent = digits[di++] || '' 2155 mask.style.opacity = '' 2156 mask.style.overflow = '' 2157 }) 2158 2159 el.querySelectorAll('[data-odometer-part="static"]').forEach(stat => { 2160 stat.style.opacity = '' 2161 }) 2162 } 2163 2164 function recalcOnResize() { 2165 document.querySelectorAll('[data-odometer-element]').forEach(el => { 2166 // Force-complete any running programmatic animation 2167 const running = activeTweens.get(el) 2168 if (running) { 2169 running.progress(1) 2170 activeTweens.delete(el) 2171 } 2172 2173 const hasRollers = el.querySelector('[data-odometer-part="roller"]') 2174 2175 if (hasRollers) { 2176 // Pre-triggered: recalculate step-based inline styles 2177 const step = getLineHeightRatio(el) 2178 el.querySelectorAll('[data-odometer-part="mask"]').forEach(mask => { 2179 mask.style.height = step + 'em' 2180 mask.style.lineHeight = step 2181 }) 2182 el.querySelectorAll('[data-odometer-part="roller"]').forEach(roller => { 2183 roller.style.lineHeight = step 2184 }) 2185 el.querySelectorAll('[data-odometer-part="static"]').forEach(stat => { 2186 stat.style.lineHeight = step 2187 }) 2188 } 2189 // Completed elements: width is em-based, scales automatically, don't touch 2190 }) 2191 ScrollTrigger.refresh() 2192 } 2193 2194 let resizeTimer 2195 let lastWidth = window.innerWidth 2196 window.addEventListener('resize', () => { 2197 clearTimeout(resizeTimer) 2198 resizeTimer = setTimeout(() => { 2199 if (window.innerWidth === lastWidth) return 2200 lastWidth = window.innerWidth 2201 recalcOnResize() 2202 }, 250) 2203 }) 2204 2205 function applyStaggerOrder(items, order) { 2206 const arr = [...items] 2207 if (order === 'right') return arr.reverse() 2208 if (order === 'random') return shuffleArray(arr) 2209 return arr 2210 } 2211 2212 function shuffleArray(arr) { 2213 for (let i = arr.length - 1; i > 0; i--) { 2214 const j = Math.floor(Math.random() * (i + 1)) 2215 ;[arr[i], arr[j]] = [arr[j], arr[i]] 2216 } 2217 return arr 2218 } 2219} 2220 2221// Initialize Number Odometer 2222// CHANGED: capture the returned update function so other scripts can drive it. 2223document.addEventListener("DOMContentLoaded", () => { 2224 window.updateOdometer = initNumberOdometer(); 2225}); 2226</script>
vendor: 1 bytes, line 2226
2226
2227<script> 2228/* ------------------------------------------------------------------ 2229 Outseta â "Your stack" cost comparison 2230 2231 Requires GSAP 3. The number-odometer utility is optional: without it 2232 the toggle still works, the totals just swap instead of rolling. 2233 2234 If you're using the odometer, load it BEFORE this file and change its 2235 init block to capture the returned update function: 2236 2237 document.addEventListener("DOMContentLoaded", () => { 2238 window.updateOdometer = initNumberOdometer(); 2239 }); 2240 2241 Totals are never hardcoded here â they're summed from whatever rows 2242 are in the markup, so prices stay editable in Webflow. 2243 2244 Which state the card opens in comes from the checkbox's own default. 2245 Tick "Checked by default" on the Checkbox in the Designer to open on 2246 the Outseta side; untick it to open on the patched side. 2247------------------------------------------------------------------ */ 2248 2249function initStackComparison(updateOdometer) { 2250 const hasGsap = typeof gsap !== 'undefined'; 2251 const reduced = 2252 !hasGsap || window.matchMedia('(prefers-reduced-motion: reduce)').matches; 2253 2254 // Fallback copy for the two elements whose text changes with the state. 2255 // Override either per element with data-text-patched / data-text-outseta. 2256 const COPY = { 2257 label: { patched: 'Without Outseta', outseta: 'With Outseta' }, 2258 word: { patched: 'old', outseta: 'new' } 2259 }; 2260 2261 const TIMING = { 2262 odometer: 0.9, // digit roll 2263 fadeOut: 0.18, // outgoing panel 2264 rowIn: 0.35, // incoming rows 2265 rowStagger: 0.045, 2266 textOut: 0.15, // text crossfade, out 2267 textIn: 0.2, // text crossfade, in 2268 wordOut: 0.15, // sliding text swap, out 2269 wordIn: 0.3, // sliding text swap, in 2270 wordRise: 6, // px the word travels, same feel as the rows 2271 bgFade: 0.28 // totals backdrop crossfade 2272 }; 2273 2274 const roots = document.querySelectorAll('[data-stack]'); 2275 2276 if (!roots.length) { 2277 warn('No [data-stack] element found. The attribute is missing from the card, or this script ran before the markup existed.'); 2278 return; 2279 } 2280 if (!hasGsap) { 2281 warn('GSAP is not loaded. The toggle will work, but without animation.'); 2282 } 2283 2284 roots.forEach(setup); 2285 2286 function setup(root) { 2287 const input = root.querySelector('[data-stack-toggle]'); 2288 const wrap = root.querySelector('[data-stack-panels]'); 2289 const billsEl = root.querySelector('[data-stack-bills], .stack-bills'); 2290 const labelEl = root.querySelector('[data-stack-label]'); 2291 const wordEl = root.querySelector('[data-stack-new]'); 2292 const monthlyEl = root.querySelector('[data-stack-total="monthly"]'); 2293 const yearlyEl = root.querySelector('[data-stack-total="yearly"]'); 2294 2295 const panels = { 2296 patched: root.querySelector('[data-stack-panel="patched"]'), 2297 outseta: root.querySelector('[data-stack-panel="outseta"]') 2298 }; 2299 2300 // Pairs of elements that swap with the state â one tagged "patched", 2301 // one tagged "outseta". Add a line here to wire up another pair. 2302 // 'fade' crossfades both at once; 'slide' matches the new/old word. 2303 const pairs = [ 2304 { attr: 'data-stack-totals', style: 'fade' }, 2305 { attr: 'data-stack-emoji', style: 'slide' } 2306 ].map(def => ({ 2307 attr: def.attr, 2308 style: def.style, 2309 patched: root.querySelector('[' + def.attr + '="patched"]'), 2310 outseta: root.querySelector('[' + def.attr + '="outseta"]') 2311 })).filter(pair => { 2312 if (pair.patched && pair.outseta) return true; 2313 if (pair.patched || pair.outseta) { 2314 warn('Only one half of the [' + pair.attr + '] pair was found, so it will not swap. Both elements need the attribute, one set to "patched" and one to "outseta".', root); 2315 } 2316 return false; 2317 }); 2318 2319 // The backdrops are marked old/new in the markup; map them onto the 2320 // script's state names rather than renaming the attributes. 2321 const backdrops = { 2322 patched: root.querySelector('[data-stack-totals="old"]'), 2323 outseta: root.querySelector('[data-stack-totals="new"]') 2324 }; 2325 const hasBackdrops = !!(backdrops.patched && backdrops.outseta); 2326 if (!hasBackdrops && (backdrops.patched || backdrops.outseta)) { 2327 warn('Found one [data-stack-totals] element but not both, so the backdrop will not swap. Expected data-stack-totals="old" and data-stack-totals="new".', root); 2328 } 2329 2330 // Bail loudly rather than silently â a missing attribute is the most 2331 // likely reason this component does nothing. 2332 const missing = []; 2333 if (!input) missing.push('[data-stack-toggle] on the checkbox input'); 2334 if (!wrap) missing.push('[data-stack-panels] on the wrapper around both row lists'); 2335 if (!panels.patched) missing.push('[data-stack-panel="patched"]'); 2336 if (!panels.outseta) missing.push('[data-stack-panel="outseta"]'); 2337 if (missing.length) { 2338 warn('Missing required markup, so this card was skipped:\n \u2022 ' + missing.join('\n \u2022 '), root); 2339 return; 2340 } 2341 2342 const multiplier = parseFloat(root.getAttribute('data-yearly-multiplier')) || 12; 2343 const totals = { 2344 patched: readPanel(panels.patched, multiplier), 2345 outseta: readPanel(panels.outseta, multiplier) 2346 }; 2347 2348 if (!totals.patched.count || !totals.outseta.count) { 2349 warn('A panel has no [data-stack-row] children, so its total will be $0.', root); 2350 } 2351 2352 const canRoll = !reduced && typeof updateOdometer === 'function'; 2353 let state = input.checked ? 'outseta' : 'patched'; 2354 let introPlayed = false;
2355 let panelTl = null; 2356 const textTls = new Map(); 2357 2358 reserveLabelWidth(); 2359 render(state, false); 2360 2361 if (canRoll && monthlyEl && yearlyEl) { 2362 // park the totals at zero so they can roll up when the card comes into view 2363 monthlyEl.textContent = '$0/mo.'; 2364 yearlyEl.textContent = '$0/yr.'; 2365 whenVisible(root, () => whenFontsReady(playIntro)); 2366 } else { 2367 introPlayed = true; 2368 } 2369 2370 input.addEventListener('change', () => { 2371 introPlayed = true; 2372 render(input.checked ? 'outseta' : 'patched', true); 2373 }); 2374 2375 function playIntro() { 2376 if (introPlayed) return; 2377 introPlayed = true; 2378 renderTotals(true); 2379 } 2380 2381 function render(next, animate) { 2382 const previous = state; 2383 state = next; 2384 2385 // Webflow's form script owns the .w-checkbox-input visual state. Don't 2386 // touch it â two scripts toggling the same class fight and desync. 2387 if (input.checked !== (state === 'outseta')) input.checked = state === 'outseta'; 2388 2389 fadeSwap(labelEl, copyFor(labelEl, COPY.label), animate); 2390 fadeSwap(wordEl, copyFor(wordEl, COPY.word), animate, true); 2391 fadeSwap(billsEl, billsText(), animate); 2392 2393 swapPanels(panels[previous], panels[state], animate && previous !== state); 2394 pairs.forEach(pair => swapPair(pair, previous, animate && previous !== state)); 2395 renderTotals(animate); 2396 } 2397 2398 function renderTotals(animate) { 2399 if (!monthlyEl || !yearlyEl) return; 2400 const totalsForState = totals[state]; 2401 const monthlyText = money(totalsForState.monthly) + '/mo.'; 2402 const yearlyText = money(totalsForState.yearly) + '/yr.'; 2403 2404 // The odometer locks an inline width for its width tween and leaves it 2405 // in place on cleanup. Left there, the next roll measures that stale 2406 // value as the element's natural width, decides nothing changed, and 2407 // skips the tween â so the box keeps the previous number's width and 2408 // the new one overflows it. Clearing first restores a true measurement. 2409 clearLockedWidth(monthlyEl); 2410 clearLockedWidth(yearlyEl); 2411 2412 if (!animate || !canRoll) { 2413 monthlyEl.textContent = monthlyText; 2414 yearlyEl.textContent = yearlyText; 2415 return; 2416 } 2417 2418 updateOdometer(monthlyEl, monthlyText, { duration: TIMING.odometer }); 2419 updateOdometer(yearlyEl, yearlyText, { duration: TIMING.odometer }); 2420 } 2421 2422 function clearLockedWidth(el) { 2423 if (!el) return; 2424 el.style.width = ''; 2425 el.style.overflow = ''; 2426 } 2427 2428 function billsText() { 2429 const count = totals[state].count; 2430 return '\u2014 ' + count + (count === 1 ? ' bill' : ' bills'); 2431 } 2432 2433 // Per-element override wins, so copy stays editable in the Designer. 2434 function copyFor(el, fallback) { 2435 const override = el && el.getAttribute('data-text-' + state); 2436 return override || fallback[state]; 2437 } 2438 2439 // slide=true sends the old word up and out and brings the new one up 2440 // from below, matching how the rows enter. Needs the element to be 2441 // inline-block â transforms don't apply to inline boxes. 2442 function fadeSwap(el, text, animate, slide) { 2443 if (!el) return; 2444 2445 // A killed timeline can leave the element mid-fade. Even when the text 2446 // is already right, that inline opacity has to be cleaned up. 2447 const running = textTls.get(el); 2448 if (running) { 2449 running.kill(); 2450 textTls.delete(el); 2451 gsap.set(el, { clearProps: 'opacity,transform' }); 2452 } 2453 2454 if (el.textContent.trim() === text) return; 2455 2456 if (!animate || reduced) { 2457 el.textContent = text; 2458 return; 2459 } 2460 2461 const tl = gsap.timeline({ 2462 onComplete() { 2463 textTls.delete(el); 2464 gsap.set(el, { clearProps: 'opacity,transform' }); 2465 } 2466 }); 2467 textTls.set(el, tl); 2468 2469 if (!slide) { 2470 tl.to(el, { 2471 opacity: 0, 2472 duration: TIMING.textOut, 2473 ease: 'power2.out', 2474 onComplete() { el.textContent = text; } 2475 }) 2476 .to(el, { opacity: 1, duration: TIMING.textIn, ease: 'power2.out' }); 2477 return; 2478 } 2479 2480 tl.to(el, { 2481 opacity: 0, 2482 y: -TIMING.wordRise,
2483 duration: TIMING.wordOut, 2484 ease: 'power2.in', 2485 onComplete() { el.textContent = text; } 2486 }) 2487 .fromTo(el, 2488 { opacity: 0, y: TIMING.wordRise }, 2489 { opacity: 1, y: 0, duration: TIMING.wordIn, ease: 'power2.out' }); 2490 } 2491 2492 // "Without Outseta" is wider than "With Outseta", so a bare text swap 2493 // would shove the switch sideways. Hold the label at the width of its 2494 // longest possible value, in em so it survives a breakpoint change. 2495 function reserveLabelWidth() { 2496 if (!labelEl) return; 2497 2498 const cs = getComputedStyle(labelEl); 2499 const fontSize = parseFloat(cs.fontSize); 2500 if (!fontSize) return; 2501 2502 const probe = document.createElement('span'); 2503 probe.style.cssText = 'position:absolute;visibility:hidden;white-space:nowrap;top:0;left:-9999px'; 2504 ['fontFamily', 'fontSize', 'fontWeight', 'fontStyle', 'letterSpacing', 'textTransform'] 2505 .forEach(prop => { probe.style[prop] = cs[prop]; }); 2506 document.body.appendChild(probe); 2507 2508 let widest = 0; 2509 Object.keys(COPY.label).forEach(key => { 2510 probe.textContent = labelEl.getAttribute('data-text-' + key) || COPY.label[key]; 2511 widest = Math.max(widest, probe.getBoundingClientRect().width); 2512 }); 2513 probe.remove(); 2514 2515 if (!widest) return; 2516 labelEl.style.display = 'inline-block'; 2517 labelEl.style.minWidth = (widest / fontSize) + 'em'; 2518 labelEl.style.textAlign = 'right'; 2519 } 2520 2521 // Paired elements overlap or sit outside the flow, so both can be 2522 // present mid-swap without disturbing layout. 2523 // 2524 // Every callback below resolves visibility from `state` rather than from 2525 // the outEl/inEl captured when the timeline was built. On rapid toggles a 2526 // superseded callback would otherwise hide the element the new swap had 2527 // just revealed, leaving both halves hidden. 2528 function swapPair(pair, previous, animate) { 2529 if (pair.tl) { 2530 pair.tl.kill(); 2531 pair.tl = null; 2532 } 2533 2534 const outEl = pair[previous]; 2535 const inEl = pair[state]; 2536 2537 if (!animate || reduced || outEl === inEl) { 2538 gsap.set([pair.patched, pair.outseta], { clearProps: 'opacity,transform' }); 2539 settlePair(pair); 2540 return; 2541 } 2542 2543 gsap.set([outEl, inEl], { clearProps: 'opacity,transform' }); 2544 2545 const tl = gsap.timeline({ 2546 onComplete() { 2547 pair.tl = null; 2548 settlePair(pair); 2549 gsap.set([pair.patched, pair.outseta], { clearProps: 'opacity,transform' }); 2550 } 2551 }); 2552 pair.tl = tl; 2553 2554 if (pair.style === 'slide') { 2555 gsap.set(inEl, { opacity: 0, y: TIMING.wordRise }); 2556 inEl.hidden = false; 2557 tl.to(outEl, { 2558 opacity: 0, 2559 y: -TIMING.wordRise, 2560 duration: TIMING.wordOut, 2561 ease: 'power2.in' 2562 }) 2563 .to(inEl, { 2564 opacity: 1, 2565 y: 0, 2566 duration: TIMING.wordIn, 2567 ease: 'power2.out' 2568 }); 2569 return; 2570 } 2571 2572 gsap.set(inEl, { opacity: 0 }); 2573 inEl.hidden = false; 2574 tl.to(outEl, { opacity: 0, duration: TIMING.bgFade, ease: 'power2.inOut' }, 0) 2575 .to(inEl, { opacity: 1, duration: TIMING.bgFade, ease: 'power2.inOut' }, 0); 2576 } 2577 2578 function settlePair(pair) { 2579 pair.patched.hidden = state !== 'patched'; 2580 pair.outseta.hidden = state !== 'outseta'; 2581 } 2582 2583 // Both panels live in the same CSS grid cell, so the wrapper is always 2584 // as tall as the taller of the two and nothing reflows on toggle. That 2585 // means no height tween and no absolute positioning â just a crossfade. 2586 function swapPanels(outPanel, inPanel, animate) { 2587 if (panelTl) { 2588 panelTl.kill(); 2589 panelTl = null; 2590 } 2591 2592 const allChildren = wrap.querySelectorAll('[data-stack-row], .u-divider'); 2593 2594 if (!animate || reduced || outPanel === inPanel) { 2595 gsap.set([panels.patched, panels.outseta], { clearProps: 'opacity,transform' }); 2596 if (allChildren.length) gsap.set(allChildren, { clearProps: 'opacity,transform' }); 2597 settlePanels(); 2598 return; 2599 } 2600 2601 gsap.set([outPanel, inPanel], { clearProps: 'opacity,transform' }); 2602 if (allChildren.length) gsap.set(allChildren, { clearProps: 'opacity,transform' }); 2603 2604 const incomingRows = inPanel.querySelectorAll('[data-stack-row], .u-divider'); 2605 2606 // Set opacity before unhiding, so the incoming panel never flashes. 2607 gsap.set(inPanel, { opacity: 0 }); 2608 if (incomingRows.length) gsap.set(incomingRows, { opacity: 0, y: 8 }); 2609 inPanel.hidden = false;
2610 2611 const tl = gsap.timeline({ 2612 onComplete() { 2613 panelTl = null; 2614 settlePanels(); 2615 gsap.set([panels.patched, panels.outseta], { clearProps: 'opacity,transform' }); 2616 if (allChildren.length) gsap.set(allChildren, { clearProps: 'opacity,transform' }); 2617 } 2618 }); 2619 panelTl = tl; 2620 2621 tl.to(outPanel, { opacity: 0, duration: TIMING.fadeOut, ease: 'power2.out' }, 0) 2622 .set(inPanel, { opacity: 1 }, TIMING.fadeOut); 2623 2624 if (incomingRows.length) { 2625 tl.to(incomingRows, { 2626 opacity: 1, 2627 y: 0, 2628 duration: TIMING.rowIn, 2629 stagger: TIMING.rowStagger, 2630 ease: 'power2.out' 2631 }, TIMING.fadeOut); 2632 } 2633 } 2634 2635 function settlePanels() { 2636 Object.keys(panels).forEach(key => { 2637 panels[key].hidden = key !== state; 2638 }); 2639 } 2640 } 2641 2642 /* Helpers ------------------------------------------------------- */ 2643 2644 function readPanel(panel, multiplier) { 2645 const rows = panel.querySelectorAll('[data-stack-row]'); 2646 let monthly = 0; 2647 2648 rows.forEach(row => { 2649 const override = row.getAttribute('data-price'); 2650 const priceEl = row.querySelector('[data-stack-price]'); 2651 const raw = override != null ? override : (priceEl ? priceEl.textContent : ''); 2652 monthly += parseFloat(String(raw).replace(/[^\d.]/g, '')) || 0; 2653 }); 2654 2655 const yearlyOverride = parseFloat(panel.getAttribute('data-yearly-total')); 2656 const billsOverride = parseInt(panel.getAttribute('data-bills-count'), 10); 2657 2658 return { 2659 monthly, 2660 yearly: isNaN(yearlyOverride) ? monthly * multiplier : yearlyOverride, 2661 count: isNaN(billsOverride) ? rows.length : billsOverride 2662 }; 2663 } 2664 2665 function money(value) { 2666 return '$' + Math.round(value).toLocaleString('en-US'); 2667 } 2668 2669 function whenVisible(el, callback) { 2670 if (!('IntersectionObserver' in window)) { 2671 callback(); 2672 return; 2673 } 2674 const observer = new IntersectionObserver(entries => { 2675 entries.forEach(entry => { 2676 if (!entry.isIntersecting) return; 2677 observer.disconnect(); 2678 callback(); 2679 }); 2680 }, { threshold: 0.3 }); 2681 observer.observe(el); 2682 } 2683 2684 // The odometer measures widths in em. Running before a webfont swaps in 2685 // measures the fallback and locks in the wrong width. 2686 function whenFontsReady(callback) { 2687 if (document.fonts && document.fonts.ready) { 2688 document.fonts.ready.then(callback, callback); 2689 } else { 2690 callback(); 2691 } 2692 } 2693 2694 function warn(message, el) { 2695 console.warn('[stack-comparison] ' + message, el || ''); 2696 } 2697} 2698 2699/* Boot ------------------------------------------------------------ */ 2700 2701(function boot() { 2702 function start() { 2703 // Fallback in case the odometer file's own init block wasn't updated. 2704 if (!window.updateOdometer && typeof initNumberOdometer === 'function') { 2705 try { 2706 window.updateOdometer = initNumberOdometer(); 2707 } catch (err) { 2708 console.warn('[stack-comparison] Odometer failed to init; totals will swap without rolling.', err); 2709 } 2710 } 2711 initStackComparison(window.updateOdometer); 2712 } 2713 2714 // If this file is loaded async, or injected after the page has parsed, 2715 // DOMContentLoaded has already fired and a listener would never run. 2716 if (document.readyState === 'loading') { 2717 document.addEventListener('DOMContentLoaded', start); 2718 } else { 2719 start(); 2720 } 2721})(); 2722</script>
2722</body></html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.