1<!DOCTYPE html> 2<html lang="en"> 3 4<head> 5 <meta charset="UTF-8" /> 6
6<script type="text/javascript" src="https://cdn.us.heap-api.com/v5/heapjs-static/5.3.12/core/heap.js" 7 async="true"></script>
7 8
8<script 9 src="https://connect.facebook.net/signals/config/788390470626882?v=2.9.319&r=stable&domain=psyke.co&hme=7441a59ee5070e08bd0157a62d39bd95bf3afdcc83dafbad800e78b5416300a9&ex_m=104%2C207%2C155%2C22%2C72%2C73%2C146%2C68%2C67%2C11%2C164%2C90%2C16%2C138%2C48%2C147%2C77%2C112%2C47%2C127%2C39%2C75%2C78%2C134%2C160%2C166%2C8%2C4%2C5%2C7%2C6%2C3%2C91%2C101%2C167%2C172%2C221%2C62%2C188%2C189%2C55%2C278%2C30%2C74%2C233%2C232%2C231%2C23%2C33%2C103%2C61%2C10%2C63%2C97%2C98%2C99%2C105%2C130%2C31%2C29%2C132%2C133%2C129%2C128%2C156%2C76%2C159%2C157%2C158%2C50%2C60%2C123%2C15%2C163%2C45%2C265%2C266%2C264%2C26%2C27%2C28%2C18%2C20%2C44%2C40%2C42%2C41%2C83%2C92%2C96%2C110%2C145%2C148%2C46%2C111%2C24%2C21%2C119%2C69%2C36%2C150%2C149%2C151%2C142%2C140%2C25%2C35%2C59%2C109%2C162%2C70%2C17%2C153%2C114%2C81%2C66%2C19%2C85%2C86%2C116%2C84%2C136%2C135%2C139%2C161%2C34%2C280%2C296%2C214%2C203%2C204%2C202%2C299%2C290%2C52%2C215%2C107%2C131%2C80%2C121%2C54%2C49%2C113%2C120%2C126%2C58%2C64%2C152%2C115%2C37%2C32%2C53%2C56%2C100%2C165%2C1%2C124%2C14%2C122%2C12%2C2%2C57%2C93%2C65%2C118%2C89%2C88%2C168%2C169%2C94%2C95%2C9%2C125%2C102%2C51%2C143%2C87%2C79%2C71%2C117%2C106%2C43%2C144%2C0%2C82%2C137%2C141%2C154%2C38%2C108%2C13%2C170" 10 async=""></script>
10 11
11<script async="" src="https://connect.facebook.net/en_US/fbevents.js"></script>
11 12
12<script type="text/javascript" async="" src="https://cdn.us.heap-api.com/config/3637266428/heap_config.js"></script>
12 13
13<script type="text/javascript" async="" src="https://snap.licdn.com/li.lms-analytics/insight.min.js"></script>
13 14
14<script type="text/javascript" async="" 15 src="https://www.googletagmanager.com/gtag/js?id=G-YZYLTTB523&cx=c>m=4e6581"></script>
15 16 17 <link rel="icon" href="https://psyke.co/favicon.png"> 18 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 19 <title>Psyke Pricing â Plans for every team</title> 20 <meta name="description" 21 content="Compare Psyke plans for Starter, Standard, Pro, and Psyke For You. Contact sales for pricing tailored to your goals." /> 22 <meta name="theme-color" content="#130608" /> 23 <link rel="preconnect" href="https://fonts.googleapis.com" /> 24 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> 25 <link 26 href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=DM+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,500&display=swap" 27 rel="stylesheet" /> 28 <style> 29 :root { 30 --violet: #7B3EFF; 31 --purple: #9500FF; 32 --magenta: #DF00FF; 33 --pink: #FF0065; 34 --orange: #FF6400; 35 --yellow: #FFD000; 36 --ink: #1A1A1A; 37 --lavender: #B8A0FF; 38 --lilac: #CA80FF; 39 --rose: #F281FF; 40 --pink-soft: #FF94CA; 41 --peach: #FFB779; 42 --butter: #FFE78A; 43 --white: #FFFFFF; 44 --bg: #130608; 45 --bg-elev: #1F0E15; 46 --bg-subtle: #2A1320; 47 --bg-card: #25101A; 48 --bg-tint: rgba(255, 100, 0, 0.08); 49 --bg-tint-strong: rgba(255, 100, 0, 0.18); 50 --border: rgba(255, 200, 180, 0.08); 51 --border-mid: rgba(255, 200, 180, 0.14); 52 --border-strong: rgba(255, 200, 180, 0.22); 53 --border-glow: rgba(255, 100, 0, 0.30); 54 --text: #FFF4EE; 55 --text-mid: #DEC0BC; 56 --text-dim: #A88E8A; 57 --text-soft: #DEC0BC; 58 --link: #FFB779; 59 --link-2: #FFCB9C; 60 --gradient-brand: linear-gradient(135deg, #FFD000 0%, #FF6400 35%, #FF0065 70%, #DF00FF 100%); 61 --gradient-warm: linear-gradient(135deg, #FFD000 0%, #FF6400 50%, #FF0065 100%); 62 --gradient-spectrum: linear-gradient(135deg, #FFD000 0%, #FF6400 28%, #FF0065 58%, #DF00FF 88%, #9500FF 100%); 63 --gradient-twilight: linear-gradient(160deg, #1A0A05 0%, #7A2200 50%, #FF6400 100%); 64 --gradient-aurora: linear-gradient(135deg, #FFE78A 0%, #FFB779 35%, #FF94CA 70%, #F281FF 100%); 65 --gradient-cosmic: linear-gradient(135deg, #2A1005 0%, #5A2400 35%, #B83A00 70%, #FF6400 100%); 66 --gradient-nebula: linear-gradient(135deg, #130608 0%, #1F0E15 40%, #4A1A0A 70%, #B83A00 100%); 67 --gradient-soft: linear-gradient(135deg, rgba(255, 208, 0, 0.10) 0%, rgba(255, 100, 0, 0.10) 50%, rgba(255, 0, 101, 0.10) 100%); 68 --gradient-darken: linear-gradient(180deg, rgba(19, 6, 8, 0) 0%, rgba(19, 6, 8, 0.40) 100%); 69 --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); 70 --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4); 71 --shadow-lg: 0 20px 50px -12px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 200, 180, 0.04); 72 --shadow-xl: 0 40px 100px -24px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(255, 200, 180, 0.04); 73 --shadow-glow: 0 12px 40px -8px rgba(255, 100, 0, 0.55), 0 0 30px -8px rgba(255, 0, 101, 0.4); 74 --shadow-glow-pink: 0 12px 40px -8px rgba(255, 0, 101, 0.55); 75 --ease: cubic-bezier(0.22, 1, 0.36, 1); 76 --r-pill: 999px; 77 --r-card: 20px; 78 --r-card-lg: 24px; 79 } 80 81 *, 82 *::before, 83 *::after { 84 box-sizing: border-box; 85 margin: 0; 86 padding: 0; 87 } 88 89 html { 90 scroll-behavior: smooth; 91 } 92 93 html, 94 body { 95 background: var(--bg); 96 color: var(--text); 97 font-family: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif; 98 font-size: 16px; 99 line-height: 1.55; 100 -webkit-font-smoothing: antialiased; 101 color-scheme: dark; 102 } 103 104 body::before { 105 content: ''; 106 position: fixed; 107 inset: 0; 108 background: 109 radial-gradient(ellipse 50% 40% at 12% 10%, rgba(255, 100, 0, 0.18), transparent 65%), 110 radial-gradient(ellipse 45% 35% at 88% 90%, rgba(255, 0, 101, 0.16), transparent 65%), 111 radial-gradient(ellipse 60% 35% at 50% 50%, rgba(255, 208, 0, 0.05), transparent 70%); 112 pointer-events: none; 113 z-index: 0; 114 } 115 116 body>* { 117 position: relative; 118 z-index: 1; 119 } 120 121 a { 122 color: var(--link); 123 text-decoration: none; 124 } 125 126 a:hover { 127 text-decoration: underline; 128 text-underline-offset: 3px; 129 } 130 131 button { 132 font-family: inherit; 133 cursor: pointer; 134 border: none; 135 background: none; 136 } 137 138 img { 139 display: block; 140 max-width: 100%; 141 } 142 143 svg { 144 display: block; 145 flex-shrink: 0; 146 } 147 148 :focus-visible { 149 outline: 3px solid var(--purple); 150 outline-offset: 3px; 151 border-radius: 6px; 152 } 153 154 .skip-link { 155 position: absolute; 156 top: 8px; 157 left: 8px; 158 padding: 12px 20px; 159 background: var(--ink); 160 color: #fff; 161 border-radius: var(--r-pill); 162 font-weight: 600; 163 z-index: 200; 164 transform: translateY(-200%); 165 transition: transform 0.2s var(--ease); 166 } 167 168 .skip-link:focus { 169 transform: translateY(0); 170 text-decoration: none; 171 } 172 173 .sr-only { 174 position: absolute; 175 width: 1px; 176 height: 1px; 177 padding: 0; 178 margin: -1px; 179 overflow: hidden; 180 clip: rect(0, 0, 0, 0); 181 white-space: nowrap; 182 border: 0; 183 } 184 185 .container { 186 max-width: 1320px; 187 margin: 0 auto; 188 padding: 0 32px; 189 position: relative; 190 } 191 192 h1, 193 h2, 194 h3, 195 h4 { 196 font-family: 'Outfit', 'DM Sans', sans-serif; 197 font-weight: 600; 198 letter-spacing: -0.025em; 199 line-height: 1.05; 200 color: var(--text); 201 } 202 203 h1 { 204 letter-spacing: -0.035em; 205 line-height: 1; 206 } 207 208 .accent { 209 background: var(--gradient-brand); 210 -webkit-background-clip: text; 211 background-clip: text; 212 color: transparent; 213 font-style: normal; 214 filter: drop-shadow(0 0 24px rgba(255, 0, 101, 0.35)); 215 } 216 217 .eyebrow { 218 display: inline-flex; 219 align-items: center; 220 gap: 10px; 221 font-family: 'DM Sans', sans-serif; 222 font-size: 11px; 223 font-weight: 600; 224 letter-spacing: 0.2em; 225 text-transform: uppercase; 226 padding: 6px 14px; 227 border-radius: var(--r-pill); 228 background: var(--bg-tint); 229 border: 1px solid var(--bg-tint-strong); 230 color: var(--link); 231 backdrop-filter: blur(10px); 232 } 233 234 .eyebrow .dot { 235 width: 6px; 236 height: 6px; 237 background: var(--gradient-brand); 238 border-radius: 50%; 239 flex-shrink: 0; 240 box-shadow: 0 0 10px rgba(255, 0, 101, 0.6); 241 } 242 243 .eyebrow.on-dark { 244 background: rgba(255, 255, 255, 0.10); 245 border-color: rgba(255, 255, 255, 0.20); 246 color: #fff; 247 } 248 249 .eyebrow.on-dark .dot { 250 background: #fff; 251 animation: pulse 2.4s ease-in-out infinite; 252 box-shadow: 0 0 10px rgba(255, 255, 255, 0.8); 253 } 254
255 @keyframes pulse { 256 257 0%, 258 100% { 259 opacity: 1; 260 transform: scale(1); 261 } 262 263 50% { 264 opacity: 0.5; 265 transform: scale(0.8); 266 } 267 } 268 269 /* âââ Nav âââ */ 270 .nav-wrap { 271 position: relative; 272 padding: 14px 0; 273 pointer-events: none; 274 } 275 276 .nav-wrap>* { 277 pointer-events: auto; 278 } 279 280 .nav { 281 max-width: 1320px; 282 margin: 0 auto; 283 padding: 0 32px; 284 display: flex; 285 align-items: center; 286 justify-content: space-between; 287 gap: 24px; 288 } 289 290 .nav-pill { 291 background: rgba(40, 28, 60, 0.85); 292 backdrop-filter: saturate(160%) blur(20px); 293 border: 1px solid var(--border); 294 border-radius: var(--r-pill); 295 padding: 6px 8px; 296 box-shadow: var(--shadow-md), 0 0 0 1px rgba(255, 100, 0, 0.08); 297 display: flex; 298 align-items: center; 299 gap: 2px; 300 overflow: visible; 301 } 302 303 .logo { 304 display: flex; 305 align-items: center; 306 gap: 12px; 307 font-family: 'Outfit', sans-serif; 308 font-weight: 700; 309 font-size: 22px; 310 letter-spacing: -0.02em; 311 color: var(--text); 312 padding: 8px 14px; 313 } 314 315 .logo:hover { 316 text-decoration: none; 317 } 318 319 .logo-mark { 320 width: 30px; 321 height: 30px; 322 background: var(--gradient-brand); 323 border-radius: 8px; 324 position: relative; 325 flex-shrink: 0; 326 box-shadow: 0 0 16px rgba(255, 0, 101, 0.4); 327 } 328 329 .logo-mark::after { 330 content: ''; 331 position: absolute; 332 inset: 6px; 333 background: var(--bg-elev); 334 border-radius: 3px; 335 } 336 337 .nav-links { 338 display: flex; 339 align-items: center; 340 gap: 2px; 341 } 342 343 .nav-link { 344 padding: 8px 14px; 345 font-family: 'DM Sans', sans-serif; 346 font-size: 13.5px; 347 font-weight: 500; 348 color: var(--text-mid); 349 border-radius: var(--r-pill); 350 transition: all 0.2s var(--ease); 351 min-height: 36px; 352 display: inline-flex; 353 align-items: center; 354 } 355 356 357 /* ===== Resources dropdown ===== */ 358 .nav-has-dropdown { position: relative; } 359 .nav-has-dropdown .nav-link { cursor: pointer; user-select: none; } 360 .nav-has-dropdown .nav-link::after { content: ' â¾'; font-size: 10px; opacity: 0.6; margin-left: 2px; } 361 .nav-dropdown { 362 display: none; 363 position: absolute; 364 top: calc(100% + 10px); 365 left: 50%; 366 transform: translateX(-50%); 367 min-width: 210px; 368 background: rgba(25,8,15,0.97); 369 border: 1px solid var(--border-mid); 370 border-radius: 16px; 371 padding: 8px; 372 box-shadow: 0 20px 50px -12px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,200,180,0.04); 373 backdrop-filter: blur(20px); 374 z-index: 100; 375 } 376 /* invisible bridge fills the gap so cursor doesn't leave the hover zone */ 377 .nav-has-dropdown::after { 378 content: ''; 379 position: absolute; 380 top: 100%; 381 left: 0; 382 right: 0; 383 height: 12px; 384 display: none; 385 } 386 .nav-has-dropdown.open::after { display: block; } 387 .nav-has-dropdown.open .nav-dropdown { display: block; } 388 .nav-dropdown a { 389 display: block; 390 padding: 9px 14px; 391 font-family: 'DM Sans', sans-serif; 392 font-size: 13.5px; 393 font-weight: 500; 394 color: var(--text-mid); 395 border-radius: 10px; 396 text-decoration: none; 397 transition: all 0.15s var(--ease); 398 white-space: nowrap; 399 } 400 .nav-dropdown a:hover { background: rgba(255,255,255,0.06); color: var(--text); } 401 .nav-dropdown .dropdown-divider { height: 1px; background: var(--border); margin: 4px 0; } 402 403 .nav-link:hover { 404 color: var(--text); 405 background: rgba(255, 255, 255, 0.06); 406 text-decoration: none; 407 } 408 409 .nav-link.active { 410 color: var(--link); 411 background: var(--bg-tint); 412 } 413 414 .nav-right { 415 display: flex; 416 align-items: center; 417 gap: 8px; 418 } 419 420 .btn { 421 display: inline-flex; 422 align-items: center; 423 gap: 8px; 424 padding: 14px 24px; 425 border-radius: var(--r-pill); 426 font-family: 'DM Sans', sans-serif; 427 font-weight: 600; 428 font-size: 14px; 429 transition: all 0.25s var(--ease); 430 white-space: nowrap; 431 cursor: pointer; 432 min-height: 44px; 433 line-height: 1.2; 434 border: none; 435 } 436 437 .btn:hover { 438 text-decoration: none; 439 } 440 441 .btn-arrow { 442 display: inline-block; 443 transition: transform 0.25s var(--ease); 444 } 445 446 .btn:hover .btn-arrow { 447 transform: translateX(3px); 448 } 449 450 .btn-primary { 451 background: var(--gradient-brand); 452 color: #fff; 453 box-shadow: 0 8px 24px rgba(255, 0, 101, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.08) inset; 454 } 455 456 .btn-primary:hover { 457 transform: translateY(-2px); 458 box-shadow: 0 14px 36px rgba(255, 0, 101, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.12) inset; 459 } 460 461 .btn-ink { 462 background: var(--bg-subtle); 463 color: var(--text); 464 border: 1px solid var(--border-mid); 465 } 466 467 .btn-ink:hover { 468 transform: translateY(-2px); 469 border-color: var(--link); 470 box-shadow: var(--shadow-md); 471 } 472 473 .btn-outline { 474 background: transparent; 475 color: var(--text); 476 border: 1px solid var(--border-mid); 477 } 478 479 .btn-outline:hover { 480 border-color: var(--link); 481 color: var(--link); 482 background: var(--bg-tint); 483 } 484 485 .btn-ghost { 486 color: var(--text); 487 padding: 10px 18px; 488 } 489 490 .btn-ghost:hover { 491 background: rgba(255, 255, 255, 0.06); 492 } 493 494 .btn-on-dark { 495 background: #fff; 496 color: var(--ink); 497 box-shadow: 0 8px 28px rgba(255, 255, 255, 0.18); 498 } 499 500 .btn-on-dark:hover { 501 transform: translateY(-2px); 502 box-shadow: 0 14px 40px rgba(255, 255, 255, 0.30); 503 } 504 505 .btn-ghost-dark { 506 color: #fff; 507 border: 1px solid rgba(255, 255, 255, 0.4); 508 background: transparent; 509 } 510 511 .btn-ghost-dark:hover { 512 background: rgba(255, 255, 255, 0.1); 513 border-color: rgba(255, 255, 255, 0.7); 514 } 515 516 .btn-sm { 517 padding: 10px 18px; 518 font-size: 13px; 519 min-height: 40px; 520 } 521 522 .btn-lg { 523 padding: 16px 28px; 524 font-size: 15px; 525 } 526 527 .btn-block { 528 width: 100%; 529 justify-content: center; 530 } 531 532 /* âââ Hero âââ */ 533 .hero { 534 position: relative; 535 margin-top: 0; 536 padding: 160px 0 120px; 537 background: var(--gradient-spectrum); 538 color: #fff; 539 overflow: hidden; 540 isolation: isolate; 541 } 542 543 .hero::before { 544 content: ''; 545 position: absolute; 546 inset: -10%; 547 background: radial-gradient(ellipse 50% 40% at 15% 70%, rgba(255, 0, 101, 0.55), transparent 60%), radial-gradient(ellipse 40% 35% at 85% 25%, rgba(255, 208, 0, 0.45), transparent 60%), radial-gradient(ellipse 35% 30% at 50% 50%, rgba(255, 100, 0, 0.30), transparent 70%); 548 pointer-events: none; 549 animation: nebula 18s ease-in-out infinite alternate; 550 } 551
552 @keyframes nebula { 553 from { 554 transform: translate(0, 0) scale(1); 555 } 556 557 to { 558 transform: translate(2%, -1%) scale(1.05); 559 } 560 } 561 562 .hero::after { 563 content: ''; 564 position: absolute; 565 inset: 0; 566 background: radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.4) 1px, transparent 1.5px), radial-gradient(circle at 65% 60%, rgba(255, 255, 255, 0.3) 1px, transparent 1.5px), radial-gradient(circle at 80% 15%, rgba(255, 255, 255, 0.5) 1px, transparent 1.5px), radial-gradient(circle at 35% 80%, rgba(255, 255, 255, 0.3) 1px, transparent 1.5px), linear-gradient(180deg, rgba(19, 6, 8, 0) 0%, rgba(19, 6, 8, 0.45) 100%); 567 background-size: 280px 280px, 320px 320px, 360px 360px, 240px 240px, 100% 100%; 568 pointer-events: none; 569 opacity: 0.7; 570 } 571 572 .hero-inner { 573 position: relative; 574 z-index: 1; 575 text-align: center; 576 max-width: 1000px; 577 margin: 0 auto; 578 padding: 0 32px; 579 } 580 581 .hero-eyebrow { 582 margin-bottom: 32px; 583 animation: fadeUp 0.8s var(--ease) both; 584 } 585 586 .hero h1 { 587 font-family: 'Outfit', sans-serif; 588 font-weight: 700; 589 font-size: clamp(48px, 7vw, 96px); 590 line-height: 0.96; 591 letter-spacing: -0.035em; 592 margin-bottom: 28px; 593 text-shadow: 0 2px 24px rgba(26, 26, 26, 0.18); 594 animation: fadeUp 0.8s var(--ease) 0.1s both; 595 } 596 597 .hero-sub { 598 font-family: 'DM Sans', sans-serif; 599 font-size: clamp(18px, 1.5vw, 22px); 600 line-height: 1.5; 601 max-width: 600px; 602 margin: 0 auto 40px; 603 color: rgba(255, 255, 255, 0.96); 604 text-shadow: 0 1px 10px rgba(26, 26, 26, 0.15); 605 font-weight: 400; 606 animation: fadeUp 0.8s var(--ease) 0.2s both; 607 } 608 609 @keyframes fadeUp { 610 from { 611 opacity: 0; 612 transform: translateY(20px); 613 } 614 615 to { 616 opacity: 1; 617 transform: translateY(0); 618 } 619 } 620 621 /* âââ Stats strip âââ */ 622 .stats-strip { 623 padding: 56px 0; 624 border-bottom: 1px solid var(--border); 625 } 626 627 .stats-inner { 628 display: flex; 629 justify-content: center; 630 align-items: center; 631 gap: 0; 632 flex-wrap: wrap; 633 } 634 635 .stat-item { 636 display: flex; 637 flex-direction: column; 638 align-items: center; 639 gap: 6px; 640 padding: 0 56px; 641 border-right: 1px solid var(--border); 642 } 643 644 .stat-item:last-child { 645 border-right: none; 646 } 647 648 .stat-value { 649 font-family: 'Outfit', sans-serif; 650 font-size: clamp(22px, 3vw, 32px); 651 font-weight: 700; 652 letter-spacing: -0.03em; 653 background: var(--gradient-brand); 654 -webkit-background-clip: text; 655 background-clip: text; 656 color: transparent; 657 filter: drop-shadow(0 0 16px rgba(255, 100, 0, 0.35)); 658 } 659 660 .stat-label { 661 font-family: 'DM Sans', sans-serif; 662 font-size: 13px; 663 color: var(--text-mid); 664 font-weight: 500; 665 text-align: center; 666 } 667 668 .plan-price-contact { 669 font-size: clamp(28px, 3.5vw, 40px); 670 line-height: 1.1; 671 padding-top: 4px; 672 } 673 674 .billing-toggle { 675 display: none; 676 } 677 678 /* âââ Toggle âââ */ 679 .billing-toggle-inner { 680 padding: 40px 0 0; 681 display: flex; 682 justify-content: center; 683 } 684 685 .toggle-wrap { 686 display: inline-flex; 687 align-items: center; 688 gap: 14px; 689 background: var(--bg-elev); 690 border: 1px solid var(--border); 691 border-radius: var(--r-pill); 692 padding: 6px 20px; 693 font-family: 'DM Sans', sans-serif; 694 font-size: 14px; 695 font-weight: 500; 696 color: var(--text-mid); 697 } 698 699 .toggle-label.active { 700 color: var(--text); 701 font-weight: 600; 702 } 703 704 .toggle-switch { 705 position: relative; 706 width: 48px; 707 height: 26px; 708 } 709 710 .toggle-switch input { 711 opacity: 0; 712 width: 0; 713 height: 0; 714 } 715 716 .toggle-slider { 717 position: absolute; 718 cursor: pointer; 719 inset: 0; 720 background: var(--bg-subtle); 721 border: 1px solid var(--border-mid); 722 border-radius: var(--r-pill); 723 transition: 0.25s var(--ease); 724 } 725 726 .toggle-slider::before { 727 content: ''; 728 position: absolute; 729 height: 18px; 730 width: 18px; 731 left: 3px; 732 bottom: 3px; 733 background: var(--text-dim); 734 border-radius: 50%; 735 transition: 0.25s var(--ease); 736 } 737 738 input:checked+.toggle-slider { 739 background: var(--gradient-brand); 740 border-color: transparent; 741 } 742 743 input:checked+.toggle-slider::before { 744 transform: translateX(22px); 745 background: #fff; 746 } 747 748 .save-badge { 749 padding: 3px 10px; 750 font-size: 11px; 751 font-weight: 700; 752 letter-spacing: 0.08em; 753 text-transform: uppercase; 754 background: var(--gradient-warm); 755 color: #fff; 756 border-radius: var(--r-pill); 757 } 758 759 .plans { 760 padding: 24px 0 100px; 761 } 762 763 .sales-panel { 764 text-align: center; 765 max-width: 640px; 766 margin: 0 auto 56px; 767 padding: 48px 40px; 768 background: var(--bg-elev); 769 border: 1px solid var(--border-mid); 770 border-radius: var(--r-card-lg); 771 box-shadow: var(--shadow-lg), 0 0 80px -24px rgba(255, 100, 0, 0.35); 772 position: relative; 773 overflow: hidden; 774 } 775 776 .sales-panel::before { 777 content: ''; 778 position: absolute; 779 top: 0; 780 left: 0; 781 right: 0; 782 height: 3px; 783 background: var(--gradient-brand); 784 } 785 786 .sales-panel .eyebrow { 787 margin-bottom: 20px; 788 } 789 790 .sales-panel h2 { 791 font-family: 'Outfit', sans-serif; 792 font-size: clamp(40px, 6vw, 56px); 793 font-weight: 700; 794 letter-spacing: -0.04em; 795 line-height: 1.02; 796 margin-bottom: 16px; 797 } 798 799 .sales-panel-lead { 800 font-family: 'DM Sans', sans-serif; 801 font-size: 18px; 802 color: var(--text-mid); 803 line-height: 1.55; 804 margin-bottom: 28px; 805 } 806 807 .plan-tier-pills { 808 display: flex; 809 flex-wrap: wrap; 810 justify-content: center; 811 gap: 8px; 812 margin-top: 28px; 813 } 814 815 .plan-tier-pill { 816 padding: 6px 14px; 817 font-family: 'DM Sans', sans-serif; 818 font-size: 13px; 819 font-weight: 600; 820 color: var(--text-mid); 821 background: var(--bg-subtle); 822 border: 1px solid var(--border); 823 border-radius: var(--r-pill); 824 } 825 826 .compare-wrap { 827 overflow-x: auto; 828 -webkit-overflow-scrolling: touch; 829 border: 1px solid var(--border); 830 border-radius: var(--r-card-lg); 831 background: var(--bg-elev); 832 } 833 834 .compare-table { 835 width: 100%; 836 min-width: 720px; 837 border-collapse: collapse; 838 font-family: 'DM Sans', sans-serif; 839 } 840 841 .compare-table th, 842 .compare-table td { 843 padding: 16px 20px; 844 text-align: center; 845 border-bottom: 1px solid var(--border); 846 vertical-align: middle; 847 } 848 849 .compare-table th { 850 background: var(--bg-subtle); 851 font-weight: 600; 852 } 853 854 .compare-table tbody tr:last-child td { 855 border-bottom: none; 856 } 857 858 .compare-feature-col, 859 .compare-table td:first-child, 860 .compare-table th:first-child { 861 text-align: left; 862 font-weight: 500; 863 color: var(--text-mid); 864 min-width: 180px; 865 position: sticky; 866 left: 0; 867 z-index: 1; 868 background: var(--bg-elev); 869 } 870 871 .compare-table th:first-child { 872 background: var(--bg-subtle); 873 } 874 875 .compare-table tbody tr:hover td { 876 background: rgba(255, 100, 0, 0.04); 877 } 878 879 .compare-table tbody tr:hover td:first-child { 880 background: var(--bg-card); 881 } 882 883 .compare-plan-name { 884 display: block; 885 font-family: 'Outfit', sans-serif; 886 font-size: 18px; 887 font-weight: 700; 888 color: var(--text); 889 letter-spacing: -0.02em; 890 } 891 892 .compare-plan-tag { 893 display: block; 894 margin-top: 4px; 895 font-size: 12px; 896 font-weight: 500; 897 color: var(--text-dim); 898 } 899 900 .compare-plan-cta { 901 display: inline-flex; 902 margin-top: 14px; 903 justify-content: center; 904 width: 100%; 905 max-width: 168px; 906 text-decoration: none; 907 } 908 909 .compare-table th.col-starter { 910 background: rgba(255, 208, 0, 0.06); 911 vertical-align: top; 912 } 913 914 .sales-panel-ctas { 915 display: flex; 916 flex-wrap: wrap; 917 gap: 12px; 918 justify-content: center; 919 } 920 921 .compare-table th.col-enterprise { 922 background: linear-gradient(180deg, rgba(149, 0, 255, 0.12) 0%, var(--bg-subtle) 100%); 923 } 924 925 .compare-val { 926 font-size: 14.5px; 927 font-weight: 600; 928 color: var(--text); 929 } 930 931 .compare-val.dim { 932 color: var(--text-dim); 933 font-weight: 500; 934 } 935 936 .compare-check { 937 display: inline-grid; 938 place-items: center; 939 width: 22px; 940 height: 22px; 941 border-radius: 50%; 942 background: var(--gradient-brand); 943 color: #fff; 944 margin: 0 auto; 945 font-size: 12px; 946 font-weight: 700; 947 line-height: 1; 948 } 949 950 .compare-section td { 951 padding: 12px 20px; 952 font-size: 11px; 953 font-weight: 700; 954 letter-spacing: 0.1em; 955 text-transform: uppercase; 956 color: var(--text-dim); 957 background: var(--bg-subtle); 958 text-align: left; 959 } 960 961 /* âââ FAQ âââ */ 962 .faq { 963 padding: 100px 0 80px; 964 } 965 966 .section-head { 967 text-align: center; 968 max-width: 820px; 969 margin: 0 auto 64px; 970 } 971 972 .section-head .eyebrow { 973 margin-bottom: 24px; 974 } 975 976 .section-head h2 { 977 font-family: 'Outfit', sans-serif; 978 font-size: clamp(36px, 5.5vw, 64px); 979 font-weight: 600; 980 line-height: 1.02; 981 letter-spacing: -0.03em; 982 margin-bottom: 20px; 983 } 984 985 .section-head p { 986 font-family: 'DM Sans', sans-serif; 987 font-size: 18px; 988 color: var(--text-mid); 989 line-height: 1.55; 990 } 991 992 .faq-list { 993 max-width: 820px; 994 margin: 48px auto 0; 995 } 996 997 .faq-item { 998 border-bottom: 1px solid var(--border); 999 } 1000 1001 .faq-q { 1002 width: 100%; 1003 padding: 28px 0; 1004 display: flex; 1005 align-items: center; 1006 justify-content: space-between; 1007 gap: 24px; 1008 text-align: left; 1009 font-family: 'Outfit', sans-serif; 1010 font-size: 19px; 1011 font-weight: 500; 1012 color: var(--text); 1013 letter-spacing: -0.015em; 1014 transition: color 0.2s var(--ease); 1015 min-height: 44px; 1016 } 1017 1018 .faq-q:hover { 1019 color: var(--link); 1020 } 1021 1022 .faq-icon { 1023 flex-shrink: 0; 1024 width: 36px; 1025 height: 36px; 1026 border-radius: 50%; 1027 border: 1px solid var(--border); 1028 display: grid; 1029 place-items: center; 1030 transition: all 0.3s var(--ease); 1031 color: var(--text); 1032 } 1033 1034 .faq-q[aria-expanded="true"] .faq-icon { 1035 background: var(--gradient-brand); 1036 border-color: transparent; 1037 color: #fff; 1038 transform: rotate(180deg); 1039 } 1040 1041 .faq-icon svg { 1042 width: 14px; 1043 height: 14px; 1044 } 1045 1046 .faq-a { 1047 max-height: 0; 1048 overflow: hidden; 1049 transition: max-height 0.4s var(--ease); 1050 } 1051 1052 .faq-q[aria-expanded="true"]+.faq-a { 1053 max-height: 500px; 1054 } 1055 1056 .faq-a-inner { 1057 padding: 0 0 28px; 1058 font-family: 'DM Sans', sans-serif; 1059 font-size: 16px; 1060 color: var(--text-mid); 1061 line-height: 1.65; 1062 max-width: 700px; 1063 } 1064 1065 /* âââ Final CTA âââ */ 1066 .final { 1067 padding: 80px 0 140px; 1068 } 1069 1070 .final-card { 1071 position: relative; 1072 background: var(--gradient-spectrum); 1073 border-radius: 32px; 1074 padding: 100px 56px; 1075 text-align: center; 1076 overflow: hidden;
1077 box-shadow: var(--shadow-xl), 0 0 100px -20px rgba(255, 100, 0, 0.55); 1078 isolation: isolate; 1079 } 1080 1081 .final-card::before { 1082 content: ''; 1083 position: absolute; 1084 inset: -10%; 1085 background: radial-gradient(ellipse 50% 40% at 15% 75%, rgba(255, 0, 101, 0.55), transparent 60%), radial-gradient(ellipse 40% 35% at 85% 25%, rgba(255, 208, 0, 0.45), transparent 60%); 1086 animation: nebula 18s ease-in-out infinite alternate; 1087 } 1088 1089 .final-card>* { 1090 position: relative; 1091 z-index: 1; 1092 } 1093 1094 .final-card h2 { 1095 font-family: 'Outfit', sans-serif; 1096 font-size: clamp(42px, 6.5vw, 84px); 1097 font-weight: 600; 1098 color: #fff; 1099 margin-bottom: 24px; 1100 max-width: 920px; 1101 margin-left: auto; 1102 margin-right: auto; 1103 line-height: 0.98; 1104 letter-spacing: -0.035em; 1105 } 1106 1107 .final-card p { 1108 font-family: 'DM Sans', sans-serif; 1109 color: rgba(255, 255, 255, 0.95); 1110 font-size: 18px; 1111 line-height: 1.55; 1112 max-width: 600px; 1113 margin: 0 auto 40px; 1114 } 1115 1116 .final-ctas { 1117 display: flex; 1118 gap: 14px; 1119 justify-content: center; 1120 flex-wrap: wrap; 1121 } 1122 1123 /* âââ Footer âââ */ 1124 footer { 1125 padding: 80px 0 48px; 1126 border-top: 1px solid var(--border); 1127 background: var(--bg-subtle); 1128 } 1129 1130 .footer-grid { 1131 display: grid; 1132 grid-template-columns: 1.2fr 0.8fr 0.8fr 0.9fr 0.8fr 0.8fr; 1133 gap: 24px; 1134 padding-bottom: 56px; 1135 border-bottom: 1px solid var(--border); 1136 margin-bottom: 32px; 1137 } 1138 1139 .footer-brand p { 1140 font-family: 'DM Sans', sans-serif; 1141 font-size: 14.5px; 1142 color: var(--text-mid); 1143 line-height: 1.6; 1144 margin-top: 20px; 1145 max-width: 320px; 1146 } 1147 1148 .footer-col h4 { 1149 font-family: 'DM Sans', sans-serif; 1150 font-size: 11px; 1151 font-weight: 700; 1152 letter-spacing: 0.18em; 1153 text-transform: uppercase; 1154 color: var(--text-dim); 1155 margin-bottom: 20px; 1156 } 1157 1158 .footer-col ul { 1159 list-style: none; 1160 } 1161 1162 .footer-col li { 1163 margin-bottom: 12px; 1164 font-family: 'DM Sans', sans-serif; 1165 font-size: 14.5px; 1166 } 1167 1168 .footer-col a { 1169 color: var(--text-mid); 1170 transition: color 0.2s var(--ease); 1171 font-weight: 500; 1172 } 1173 1174 .footer-col a:hover { 1175 color: var(--link); 1176 } 1177 1178 .footer-bottom { 1179 display: flex; 1180 justify-content: space-between; 1181 align-items: center; 1182 font-family: 'DM Sans', sans-serif; 1183 font-size: 13.5px; 1184 color: var(--text-dim); 1185 flex-wrap: wrap; 1186 gap: 16px; 1187 } 1188 1189 .footer-socials { 1190 display: flex; 1191 gap: 8px; 1192 } 1193 1194 .footer-socials a { 1195 width: 40px; 1196 height: 40px; 1197 border-radius: 50%; 1198 border: 1px solid var(--border); 1199 display: grid; 1200 place-items: center; 1201 color: var(--text-mid); 1202 transition: all 0.2s var(--ease); 1203 background: var(--bg-elev); 1204 } 1205 1206 .footer-socials a:hover { 1207 border-color: rgba(255, 100, 0, 0.4); 1208 color: var(--link); 1209 text-decoration: none; 1210 } 1211 1212 .footer-socials svg { 1213 width: 15px; 1214 height: 15px; 1215 } 1216 1217 /* âââ Responsive âââ */ 1218 @media (max-width: 1100px) { 1219 .stat-item { 1220 padding: 0 32px; 1221 } 1222 } 1223 1224 @media (max-width: 1024px) { 1225 .nav-links { 1226 display: none; 1227 } 1228 1229 .footer-grid { 1230 grid-template-columns: 1fr 1fr; 1231 gap: 32px; 1232 } 1233 } 1234 1235 @media (max-width: 720px) { 1236 .container { 1237 padding: 0 22px; 1238 } 1239 1240 .hero { 1241 padding: 100px 0 80px; 1242 } 1243 1244 .sales-panel { 1245 padding: 36px 24px; 1246 } 1247 1248 .stats-inner { 1249 flex-direction: column; 1250 gap: 28px; 1251 } 1252 1253 .stat-item { 1254 border-right: none; 1255 padding: 0; 1256 } 1257 1258 .final-card { 1259 padding: 64px 24px; 1260 border-radius: 24px; 1261 } 1262 1263 .footer-grid { 1264 grid-template-columns: 1fr; 1265 } 1266 } 1267 1268 header { 1269 position: sticky !important; 1270 top: 0 !important; 1271 z-index: 999 !important; 1272 background: rgba(25, 8, 15, 0.82) !important; 1273 border-bottom: 1px solid rgba(255, 200, 180, 0.12); 1274 backdrop-filter: blur(16px) !important; 1275 -webkit-backdrop-filter: blur(16px) !important; 1276 } 1277
1278 /* ===== Mobile responsive layer (added) ===== */ 1279 .nav-toggle { 1280 display: none; 1281 width: 44px; 1282 height: 44px; 1283 border-radius: var(--r-pill); 1284 background: rgba(40, 28, 60, 0.85); 1285 backdrop-filter: saturate(160%) blur(20px); 1286 -webkit-backdrop-filter: saturate(160%) blur(20px); 1287 border: 1px solid var(--border); 1288 box-shadow: var(--shadow-md), 0 0 0 1px rgba(255, 100, 0, 0.08); 1289 flex-direction: column; 1290 align-items: center; 1291 justify-content: center; 1292 gap: 5px; 1293 cursor: pointer; 1294 padding: 0; 1295 transition: all 0.2s var(--ease); 1296 } 1297 1298 .nav-toggle:hover { 1299 border-color: var(--border-strong); 1300 } 1301 1302 .nav-toggle-bar { 1303 display: block; 1304 width: 20px; 1305 height: 2px; 1306 background: var(--text); 1307 border-radius: 2px; 1308 transition: transform 0.25s var(--ease), opacity 0.2s var(--ease); 1309 } 1310 1311 .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1) { 1312 transform: translateY(7px) rotate(45deg); 1313 } 1314 1315 .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2) { 1316 opacity: 0; 1317 } 1318 1319 .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3) { 1320 transform: translateY(-7px) rotate(-45deg); 1321 } 1322 1323 .mobile-menu { 1324 display: none; 1325 margin: 12px 16px 0; 1326 padding: 16px; 1327 background: rgba(25, 8, 15, 0.96); 1328 border: 1px solid var(--border); 1329 border-radius: 24px; 1330 backdrop-filter: blur(16px); 1331 -webkit-backdrop-filter: blur(16px); 1332 box-shadow: var(--shadow-lg); 1333 } 1334 1335 .mobile-menu:not([hidden]) { 1336 display: block; 1337 } 1338 1339 .mobile-menu-inner { 1340 display: flex; 1341 flex-direction: column; 1342 gap: 4px; 1343 } 1344 1345 .mobile-link { 1346 display: block; 1347 padding: 14px 16px; 1348 font-family: 'DM Sans', sans-serif; 1349 font-size: 16px; 1350 font-weight: 500; 1351 color: var(--text); 1352 border-radius: 12px; 1353 text-decoration: none; 1354 transition: background 0.2s var(--ease); 1355 } 1356 1357 .mobile-link:hover, 1358 .mobile-link:focus-visible { 1359 background: rgba(255, 255, 255, 0.06); 1360 text-decoration: none; 1361 } 1362 1363 .mobile-menu-actions { 1364 display: flex; 1365 flex-direction: column; 1366 gap: 10px; 1367 margin-top: 12px; 1368 padding-top: 16px; 1369 border-top: 1px solid var(--border); 1370 } 1371 1372 .mobile-menu-actions .btn { 1373 justify-content: center; 1374 width: 100%; 1375 } 1376 1377 body.menu-open { 1378 overflow: hidden; 1379 } 1380 1381 @media (max-width: 1024px) { 1382 1383 .nav-pill-links, 1384 .nav-pill-right { 1385 display: none; 1386 } 1387 1388 .nav-toggle { 1389 display: inline-flex; 1390 } 1391 1392 .feature-block, 1393 .contact-grid, 1394 .cs-inner { 1395 grid-template-columns: 1fr; 1396 gap: 40px; 1397 } 1398 1399 .feature-block.reverse>.feature-text { 1400 order: 1; 1401 } 1402 1403 .feature-block.reverse>.feature-visual { 1404 order: 2; 1405 } 1406 1407 .stats-grid, 1408 .values-grid, 1409 .wwd-grid, 1410 .value-grid, 1411 .process-steps, 1412 .results-grid { 1413 grid-template-columns: repeat(2, 1fr); 1414 } 1415 1416 .loop-grid, 1417 .bp-grid, 1418 .articles-grid { 1419 grid-template-columns: repeat(2, 1fr); 1420 } 1421 1422 .footer-grid { 1423 grid-template-columns: 1fr 1fr; 1424 gap: 32px; 1425 } 1426 1427 } 1428 1429 @media (max-width: 720px) { 1430 .container { 1431 padding: 0 20px; 1432 } 1433 1434 .nav { 1435 padding: 0 16px; 1436 gap: 12px; 1437 } 1438 1439 .logo { 1440 font-size: 18px; 1441 padding: 6px 10px; 1442 } 1443 1444 .hero { 1445 padding: 90px 0 64px; 1446 } 1447 1448 .hero-ctas { 1449 flex-direction: column; 1450 align-items: stretch; 1451 gap: 10px; 1452 } 1453 1454 .hero-ctas .btn { 1455 width: 100%; 1456 justify-content: center; 1457 } 1458 1459 .hero-meta { 1460 gap: 24px; 1461 margin-top: 40px; 1462 } 1463 1464 .final-card { 1465 padding: 56px 22px; 1466 border-radius: 22px; 1467 } 1468 1469 .footer-grid, 1470 .feature-block, 1471 .contact-grid, 1472 .cs-inner, 1473 .stats-grid, 1474 .values-grid, 1475 .wwd-grid, 1476 .value-grid, 1477 .process-steps, 1478 .results-grid, 1479 .loop-grid, 1480 .bp-grid, 1481 .articles-grid { 1482 grid-template-columns: 1fr; 1483 } 1484 1485 .page-thumbs { 1486 grid-template-columns: repeat(2, 1fr); 1487 } 1488 1489 .footer-grid { 1490 gap: 28px; 1491 } 1492 1493 .results-grid { 1494 gap: 16px; 1495 } 1496 } 1497 1498 @media (max-width: 420px) { 1499 .container { 1500 padding: 0 16px; 1501 } 1502 1503 .nav { 1504 padding: 0 12px; 1505 } 1506 1507 .hero-meta { 1508 flex-direction: column; 1509 gap: 18px; 1510 } 1511 1512 .final-card { 1513 padding: 44px 18px; 1514 } 1515 } 1516 </style> 1517</head> 1518 1519<body> 1520 <a href="#main" class="skip-link">Skip to main content</a> 1521 <header> 1522 <div class='nav-wrap'> 1523 <nav class='nav' aria-label='Primary'> 1524 <div class='nav-pill'> 1525 <a href="https://psyke.co" class="logo" aria-label="Psyke home" 1526 style="background:#fff;border-radius:999px;padding:6px 14px;"><img 1527 src="https://8b6p8gjb.upflowyexperience.com/8b6p8gjb/assets/Psyke_Footer_Logo.webp" alt="Psyke" 1528 style="height:28px;width:auto;display:block;" /></a> 1529 </div> 1530 <div class='nav-pill nav-pill-links'> 1531 <div class='nav-links'> 1532 <a href='/agencies' class='nav-link'>
1532Agencies</a> 1533 <a href='/brands' class='nav-link'>Brands</a> 1534 <div class='nav-has-dropdown'> 1535 <span class='nav-link' tabindex='0'>Resources</span> 1536 <div class='nav-dropdown'> 1537 <a href='https://psyke.co/articles'>Articles</a> 1538 <div class='dropdown-divider'></div> 1539 <a href='https://psyke.co/events'>Events & Webinars</a> 1540 </div> 1541 </div> 1542 <div class='nav-has-dropdown'> 1543<span class='nav-link' tabindex='0'>Free Tools</span> 1544<div class='nav-dropdown'> 1545 <a href='https://psyke.co/llm-search-prompt-finder'>🔍 LLM Prompt Finder</a> 1546</div> 1547</div> 1548 <a href='/psyke-case-studies' class='nav-link'>Case Studies</a> 1549 <a href='/pricing' class='nav-link'>Pricing</a> 1550 </div> 1551 </div> 1552 <div class='nav-pill nav-pill-right'> 1553 <div class='nav-right'> 1554 <a href='https://ai.psyke.co/login' class='btn btn-ghost btn-sm'>Log in</a> 1555 <a href='/contact-us' class='btn btn-primary btn-sm'>Contact Sales <span class='btn-arrow' 1556 aria-hidden='true'>â</span></a> 1557 </div> 1558 </div> 1559 <button class="nav-toggle" type="button" aria-label="Open menu" aria-expanded="false" 1560 aria-controls="mobile-menu"> 1561 <span class="nav-toggle-bar" aria-hidden="true"></span> 1562 <span class="nav-toggle-bar" aria-hidden="true"></span> 1563 <span class="nav-toggle-bar" aria-hidden="true"></span> 1564 </button> 1565 </nav> 1566 <div id="mobile-menu" class="mobile-menu" hidden> 1567 <div class="mobile-menu-inner"> 1568 <a href='/agencies' class='mobile-link'>Agencies</a> 1569 <a href='/brands' class='mobile-link'>Brands</a> 1570 <a href='/articles' class='mobile-link'>Articles</a> 1571 <a href='https://psyke.co/events' class='mobile-link'>Events & Webinars</a> 1572 <a href='https://psyke.co/llm-search-prompt-finder' class='mobile-link'>🔍 LLM Prompt Finder</a> 1573 <a href='/psyke-case-studies' class='mobile-link'>Case Studies</a> 1574 <a href='/pricing' class='mobile-link'>Pricing</a> 1575 <div class="mobile-menu-actions"> 1576 <a href='https://ai.psyke.co/login' class='btn btn-ghost'>Log in</a> 1577 <a href='/contact-us' class='btn btn-primary'>Contact Sales <span class='btn-arrow' 1578 aria-hidden='true'>→</span></a> 1579 </div> 1580 </div> 1581 </div> 1582 </div> 1583 </header> 1584 <div style="overflow-x:clip"> 1585 <main id="main"> 1586 1587 <!-- âââ Hero âââ --> 1588 <section class="hero" aria-labelledby="hero-h"> 1589 <div class="hero-inner"> 1590 <div class="eyebrow on-dark hero-eyebrow"> 1591 <span class="dot" aria-hidden="true"></span> 1592 <span>Pricing</span> 1593 </div> 1594 <h1 id="hero-h">Plans for every team.<br>Talk to sales.</h1> 1595 <p class="hero-sub">See what's included in each tier below. Pricing is tailored to your goals â our team will 1596 recommend the right fit.</p> 1597 </div> 1598 </section> 1599 1600 <!-- âââ Stats strip âââ --> 1601 <section class="stats-strip" aria-label="Key facts"> 1602 <div class="container"> 1603 <div class="stats-inner"> 1604 <div class="stat-item"> 1605 <span class="stat-value">10x</span> 1606 <span class="stat-label">cheaper than agencies</span> 1607 </div> 1608 <div class="stat-item"> 1609 <span class="stat-value">30 min</span> 1610 <span class="stat-label">setup time</span> 1611 </div> 1612 <div class="stat-item"> 1613 <span class="stat-value">60-day</span> 1614 <span class="stat-label">money back guarantee</span> 1615 </div> 1616 </div> 1617 </div> 1618 </section> 1619 1620 <!-- âââ Plans âââ --> 1621 <section class="plans" aria-labelledby="plans-h"> 1622 <div class="container"> 1623 <div class="sales-panel"> 1624 <p class="eyebrow"><span class="dot" aria-hidden="true"></span><span>Pricing</span></p> 1625 <h2 id="plans-h">Let's talk</h2> 1626 <p class="sales-panel-lead">We'll match you to Starter, Standard, Pro, or Psyke For You and put together 1627 custom pricing for your goals.</p> 1628 <div class="sales-panel-ctas"> 1629 <a href="https://ai.psyke.co/" class="btn btn-outline btn-lg">Sign Up Free</a> 1630 <a href="/contact-us" class="btn btn-primary btn-lg">Contact Sales <span class="btn-arrow" 1631 aria-hidden="true">â</span></a> 1632 </div> 1633 <div class="plan-tier-pills" aria-hidden="true">
1634 <span class="plan-tier-pill">Starter</span> 1635 <span class="plan-tier-pill">Standard</span> 1636 <span class="plan-tier-pill">Pro</span> 1637 <span class="plan-tier-pill">Psyke For You</span> 1638 </div> 1639 </div> 1640 1641 <div class="compare-wrap" role="region" aria-label="Plan feature comparison"> 1642 <table class="compare-table"> 1643 <thead> 1644 <tr> 1645 <th scope="col" class="compare-feature-col">What's included</th> 1646 <th scope="col" class="col-starter"> 1647 <span class="compare-plan-name">Starter</span> 1648 <span class="compare-plan-tag">Try Psyke for free</span> 1649 <a href="https://ai.psyke.co/" class="btn btn-outline btn-sm compare-plan-cta">Sign Up Free</a> 1650 </th> 1651 <th scope="col"> 1652 <span class="compare-plan-name">Standard</span> 1653 <span class="compare-plan-tag">For growing teams</span> 1654 </th> 1655 <th scope="col"> 1656 <span class="compare-plan-name">Pro</span> 1657 <span class="compare-plan-tag">For serious scale</span> 1658 </th> 1659 <th scope="col" class="col-enterprise"> 1660 <span class="compare-plan-name">Psyke For You</span> 1661 <span class="compare-plan-tag">Done-for-you</span> 1662 </th> 1663 </tr> 1664 </thead> 1665 <tbody> 1666 <tr> 1667 <th scope="row">Pages per campaign</th> 1668 <td><span class="compare-val">25</span></td> 1669 <td><span class="compare-val">100</span></td> 1670 <td><span class="compare-val">200</span></td> 1671 <td><span class="compare-val">1,000s+</span></td> 1672 </tr> 1673 <tr> 1674 <th scope="row">Live campaigns</th> 1675 <td><span class="compare-val">1</span></td> 1676 <td><span class="compare-val">1 / month</span></td> 1677 <td><span class="compare-val">Unlimited</span></td> 1678 <td><span class="compare-val">Managed</span></td> 1679 </tr> 1680 <tr> 1681 <th scope="row">Drafts</th> 1682 <td><span class="compare-val">Unlimited</span></td> 1683 <td><span class="compare-val">Unlimited</span></td> 1684 <td><span class="compare-val">Unlimited</span></td> 1685 <td><span class="compare-val dim">—</span></td> 1686 </tr> 1687 <tr> 1688 <th scope="row">Workspaces</th> 1689 <td><span class="compare-val">1</span></td> 1690 <td><span class="compare-val">1</span></td> 1691 <td><span class="compare-val">Unlimited</span></td> 1692 <td><span class="compare-val dim">—</span></td> 1693 </tr> 1694 <tr> 1695 <th scope="row">Accounts</th> 1696 <td><span class="compare-val">1</span></td> 1697 <td><span class="compare-val">3</span></td> 1698 <td><span class="compare-val">Unlimited</span></td> 1699 <td><span class="compare-val dim">—</span></td> 1700 </tr> 1701 <tr> 1702 <th scope="row">Psyke watermark</th> 1703 <td><span class="compare-val dim">On pages</span></td> 1704 <td><span class="compare-val dim">None</span></td> 1705 <td><span class="compare-val dim">None</span></td> 1706 <td><span class="compare-val dim">None</span></td> 1707 </tr> 1708 <tr class="compare-section"> 1709 <td colspan="5">Psyke For You also includes</td> 1710 </tr> 1711 <tr> 1712 <th scope="row">Done-for-you execution</th> 1713 <td><span class="compare-val dim">—</span></td> 1714 <td><span class="compare-val dim">—</span></td> 1715 <td><span class="compare-val dim">—</span></td> 1716 <td><span class="compare-check" aria-label="Included">✓</span></td> 1717 </tr> 1718 <tr> 1719 <th scope="row">Hand-crafted AI & SEO plan</th> 1720 <td><span class="compare-val dim">—</span></td> 1721 <td><span class="compare-val dim">—</span></td> 1722 <td><span class="compare-val dim">—</span></td> 1723 <td><span class="compare-check" aria-label="Included">✓</span></td> 1724 </tr> 1725 <tr> 1726 <th scope="row">Highly targeted keywords</th> 1727 <td><span class="compare-val dim">—</span></td> 1728 <td><span class="compare-val dim">—</span></td> 1729 <td><span class="compare-val dim">—</span></td> 1730 <td><span class="compare-check" aria-label="Included">✓</span></td> 1731 </tr> 1732 <tr> 1733 <th scope="row">100% on-brand output</th> 1734 <td><span class="compare-val dim">—</span></td> 1735 <td><span class="compare-val dim">—</span></td> 1736 <td><span class="compare-val dim">—</span></td> 1737 <td><span class="compare-check" aria-label="Included">✓</span></td> 1738 </tr> 1739 <tr> 1740 <th scope="row">Expert strategy calls</th> 1741 <td><span class="compare-val dim">—</span></td> 1742 <td><span class="compare-val dim">—</span></td> 1743 <td><span class="compare-val dim">—</span></td> 1744 <td><span class="compare-check" aria-label="Included">✓</span></td> 1745 </tr> 1746 </tbody> 1747 </table> 1748 </div> 1749 </div> 1750 </section> 1751 1752 <!-- âââ FAQ âââ --> 1753 <section class="faq" id="faq" aria-labelledby="faq-h"> 1754 <div class="container"> 1755 <div class="section-head"> 1756 <p class="eyebrow"><span class="dot" aria-hidden="true"></span><span>FAQ</span></p> 1757 <h2 id="faq-h">Questions, <span class="accent">answered.</span></h2> 1758 </div> 1759 <div class="faq-list"> 1760 <div class="faq-item"> 1761 <button type="button" class="faq-q" aria-expanded="true" aria-controls="faq-1">
1762 <span>Can I change plans at any time?</span> 1763 <span class="faq-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" 1764 stroke="currentColor" stroke-width="2.5" stroke-linecap="round"> 1765 <polyline points="6 9 12 15 18 9"></polyline> 1766 </svg></span> 1767 </button> 1768 <div class="faq-a" id="faq-1" role="region"> 1769 <div class="faq-a-inner">Yes. Contact sales and we can help you move between plans as your needs change. 1770 </div> 1771 </div> 1772 </div> 1773 <div class="faq-item"> 1774 <button type="button" class="faq-q" aria-expanded="false" aria-controls="faq-2"> 1775 <span>Is there a free trial?</span> 1776 <span class="faq-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" 1777 stroke="currentColor" stroke-width="2.5" stroke-linecap="round"> 1778 <polyline points="6 9 12 15 18 9"></polyline> 1779 </svg></span> 1780 </button> 1781 <div class="faq-a" id="faq-2" role="region"> 1782 <div class="faq-a-inner">Trial options depend on your plan and use case. Contact sales and we'll walk 1783 you through what's available.</div> 1784 </div> 1785 </div> 1786 <div class="faq-item"> 1787 <button type="button" class="faq-q" aria-expanded="false" aria-controls="faq-3"> 1788 <span>What counts as a page?</span> 1789 <span class="faq-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" 1790 stroke="currentColor" stroke-width="2.5" stroke-linecap="round"> 1791 <polyline points="6 9 12 15 18 9"></polyline> 1792 </svg></span> 1793 </button> 1794 <div class="faq-a" id="faq-3" role="region"> 1795 <div class="faq-a-inner">Each unique URL published to your domain counts as one page. Draft pages â 1796 those not yet published â do not count toward your plan limit, and you can keep as many drafts as you 1797 like regardless of plan.</div> 1798 </div> 1799 </div> 1800 <div class="faq-item"> 1801 <button type="button" class="faq-q" aria-expanded="false" aria-controls="faq-4"> 1802 <span>Do you offer refunds?</span> 1803 <span class="faq-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" 1804 stroke="currentColor" stroke-width="2.5" stroke-linecap="round"> 1805 <polyline points="6 9 12 15 18 9"></polyline> 1806 </svg></span> 1807 </button> 1808 <div class="faq-a" id="faq-4" role="region"> 1809 <div class="faq-a-inner">Yes. Every paid plan comes with a 60-day money back guarantee â no questions 1810 asked. If you're not happy with the results in the first two months, contact our support team and 1811 we'll issue a full refund.</div> 1812 </div> 1813 </div> 1814 <div class="faq-item"> 1815 <button type="button" class="faq-q" aria-expanded="false" aria-controls="faq-5"> 1816 <span>Can I use Psyke on multiple sites?</span> 1817 <span class="faq-icon" aria-hidden="true"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" 1818 stroke="currentColor" stroke-width="2.5" stroke-linecap="round"> 1819 <polyline points="6 9 12 15 18 9"></polyline> 1820 </svg></span> 1821 </button> 1822 <div class="faq-a" id="faq-5" role="region"> 1823 <div class="faq-a-inner">The Pro plan supports unlimited workspaces, so you can manage multiple websites 1824 or clients from a single account. Starter and Standard each include one workspace. For agency or 1825 enterprise use, the Psyke For You plan is custom-scoped to your needs.</div> 1826 </div> 1827 </div> 1828 </div> 1829 </div> 1830 </section> 1831 1832 <!-- âââ Final CTA âââ --> 1833 <section class="final" aria-labelledby="final-h"> 1834 <div class="container"> 1835 <div class="final-card"> 1836 <p class="eyebrow on-dark" style="justify-content:center;margin-bottom:32px;"><span class="dot" 1837 aria-hidden="true"></span><span>Get Started</span></p> 1838 <h2 id="final-h">Find the right plan<br>for <span 1839 style="color:#fff;text-shadow:0 4px 32px rgba(255,255,255,0.35)">your team.</span></h2> 1840 <p>Contact sales for pricing and a walkthrough of Psyke.</p> 1841 <div class="final-ctas"> 1842 <a href="/contact-us" class="btn btn-on-dark btn-lg">Contact Sales <span class="btn-arrow" 1843 aria-hidden="true">â</span></a> 1844 </div> 1845 </div> 1846 </div> 1847 </section> 1848 </main> 1849 </div> 1850 1851 <footer aria-label="Site footer"> 1852 <div class="container"> 1853 <div class="footer-grid"> 1854 <div class="footer-brand"> 1855 <a href="https://psyke.co" class="logo" aria-label="Psyke home" style="padding:0;"><img 1856 src="https://8b6p8gjb.upflowyexperience.com/8b6p8gjb/assets/Psyke_Footer_Logo.webp" alt="Psyke" 1857 style="height:28px;width:auto;display:block;filter:brightness(0) invert(1);" /></a> 1858 <p>The operating system for agentic organic marketing. Own how AI understands your business.</p> 1859 </div> 1860 <nav class="footer-col" aria-label="Solution"> 1861 <h4>Solution</h4> 1862 <ul> 1863 <li><a href="/agencies">
1863Agencies</a></li> 1864 <li><a href="/brands">Brands</a></li> 1865 </ul> 1866 </nav> 1867 <nav class="footer-col" aria-label="Resources"> 1868 <h4>Resources</h4> 1869 <ul> 1870 <li><a href="/articles">Articles</a></li> 1871 <li><a href="/faqs">FAQs</a></li> 1872 </ul> 1873 </nav> 1874 <nav class="footer-col" aria-label="Products"> 1875 <h4>Products</h4> 1876 <ul> 1877 <li><a href="https://ai.psyke.co/login">Psyke AI SEO Tool</a></li> 1878 </ul> 1879 </nav> 1880 <nav class="footer-col" aria-label="Legal"> 1881 <h4>Legal</h4> 1882 <ul> 1883 <li><a href="https://psyke.co/privacy-policy">Privacy Policy</a></li> 1884 <li><a href="https://psyke.co/terms-of-use">Terms of Service</a></li> 1885 <li><a href="https://psyke.co/data-processing">Data Processing</a></li> 1886 </ul> 1887 </nav> 1888 <nav class="footer-col" aria-label="Company"> 1889 <h4>Company</h4> 1890 <ul> 1891 <li><a href="/about">About us</a></li> 1892 <li><a href="/contact-us">Contact us</a></li> 1893 </ul> 1894 </nav> 1895 </div> 1896 <div class="footer-bottom"> 1897 <span>© 2026 Psyke. All rights reserved.</span> 1898 <div class="footer-socials" aria-label="Social media"> 1899 <a href="https://www.facebook.com/psykeapp/" aria-label="Facebook" target="_blank" rel="noopener"><svg 1900 width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1901 <path 1902 d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" /> 1903 </svg></a> 1904 <a href="https://www.instagram.com/psyke_ai/" aria-label="Instagram" target="_blank" rel="noopener"><svg 1905 width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1906 <path 1907 d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z" /> 1908 </svg></a> 1909 <a href="https://www.linkedin.com/company/psyke-upflowy" aria-label="LinkedIn" target="_blank" 1910 rel="noopener"><svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1911 <path 1912 d="M20.5 2h-17A1.5 1.5 0 002 3.5v17A1.5 1.5 0 003.5 22h17a1.5 1.5 0 001.5-1.5v-17A1.5 1.5 0 0020.5 2zM8 19H5v-9h3zM6.5 8.25A1.75 1.75 0 118.3 6.5a1.78 1.78 0 01-1.8 1.75zM19 19h-3v-4.74c0-1.42-.6-1.93-1.38-1.93A1.74 1.74 0 0013 14.19a.66.66 0 000 .14V19h-3v-9h2.9v1.3a3.11 3.11 0 012.7-1.4c1.55 0 3.36.86 3.36 3.66z" /> 1913 </svg></a> 1914 <a href="https://www.youtube.com/@PsykeAI" aria-label="YouTube" target="_blank" rel="noopener"><svg width="15" 1915 height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"> 1916 <path 1917 d="M23.498 6.186a3.016 3.016 0 00-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 00.502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 002.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 002.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z" /> 1918 </svg></a> 1919 </div> 1920 </div> 1921 </div> 1922 </footer> 1923 1924
1924<script> 1925 // FAQ accordion 1926 document.querySelectorAll('.faq-q').forEach(btn => { 1927 btn.addEventListener('click', () => { 1928 const isOpen = btn.getAttribute('aria-expanded') === 'true'; 1929 document.querySelectorAll('.faq-q').forEach(b => b.setAttribute('aria-expanded', 'false')); 1930 if (!isOpen) btn.setAttribute('aria-expanded', 'true'); 1931 }); 1932 }); 1933 1934 // Scroll-reveal for plan cards 1935 const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches; 1936 if (!prefersReducedMotion && 'IntersectionObserver' in window) { 1937 const observer = new IntersectionObserver((entries) => { 1938 entries.forEach(entry => { 1939 if (entry.isIntersecting) { 1940 entry.target.style.opacity = '1'; 1941 entry.target.style.transform = 'translateY(0)'; 1942 } 1943 }); 1944 }, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' }); 1945 document.querySelectorAll('.sales-panel, .compare-wrap, .stat-item').forEach((el, i) => { 1946 el.style.opacity = '0'; 1947 el.style.transform = 'translateY(24px)'; 1948 const delay = Math.min(i, 6) * 0.08; 1949 el.style.transition = `opacity 0.6s cubic-bezier(0.22, 1, 0.36, 1) ${delay}s, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1) ${delay}s`; 1950 observer.observe(el); 1951 }); 1952 } 1953 </script>
1953 1954
1954<script defer="" src="https://js.sentry-cdn.com/4b8560c52994a52ee7a272d8e984e458.min.js" crossorigin="anonymous"> 1955 </script>
1955 1956
1956<script type="text/javascript" id="" 1957 charset="">!function (b, e, f, g, a, c, d) { b.fbq || (a = b.fbq = function () { a.callMethod ? a.callMethod.apply(a, arguments) : a.queue.push(arguments) }, b._fbq || (b._fbq = a), a.push = a, a.loaded = !0, a.version = "2.0", a.queue = [], c = e.createElement(f), c.async = !0, c.src = g, d = e.getElementsByTagName(f)[0], d.parentNode.insertBefore(c, d)) }(window, document, "script", "https://connect.facebook.net/en_US/fbevents.js"); fbq("init", "788390470626882"); fbq("set", "agent", "tmgoogletagmanager", "788390470626882"); fbq("track", "PageView");</script>
1957 1958 <noscript><img height="1" width="1" style="display:none" 1959 src="https://www.facebook.com/tr?id=788390470626882&ev=PageView&noscript=1"></noscript> 1960
1960<script> 1961 (function () { 1962 var toggle = document.querySelector('.nav-toggle'); 1963 var menu = document.getElementById('mobile-menu'); 1964 if (!toggle || !menu) return; 1965 var setOpen = function (open) { 1966 toggle.setAttribute('aria-expanded', open ? 'true' : 'false'); 1967 toggle.setAttribute('aria-label', open ? 'Close menu' : 'Open menu'); 1968 if (open) { 1969 menu.removeAttribute('hidden'); 1970 document.body.classList.add('menu-open'); 1971 } else { 1972 menu.setAttribute('hidden', ''); 1973 document.body.classList.remove('menu-open'); 1974 } 1975 }; 1976 toggle.addEventListener('click', function () { 1977 var open = toggle.getAttribute('aria-expanded') === 'true'; 1978 setOpen(!open); 1979 }); 1980 menu.addEventListener('click', function (e) { 1981 if (e.target && e.target.tagName === 'A') setOpen(false); 1982 }); 1983 document.addEventListener('keydown', function (e) { 1984 if (e.key === 'Escape') setOpen(false); 1985 }); 1986 window.addEventListener('resize', function () { 1987 if (window.innerWidth > 1024) setOpen(false); 1988 }); 1989 })(); 1990 </script>
1990 1991
1991<script> 1992 /* ===== Dropdown hover-intent (prevents flicker + gap close) ===== */ 1993 (function () { 1994 var closeTimers = new WeakMap(); 1995 function openMenu(el) { 1996 var t = closeTimers.get(el); 1997 if (t) { clearTimeout(t); closeTimers.delete(el); } 1998 el.classList.add('open'); 1999 } 2000 function scheduleClose(el) { 2001 var t = setTimeout(function () { 2002 el.classList.remove('open'); 2003 closeTimers.delete(el); 2004 }, 120); 2005 closeTimers.set(el, t); 2006 } 2007 document.querySelectorAll('.nav-has-dropdown').forEach(function (el) { 2008 el.addEventListener('mouseenter', function () { openMenu(el); }); 2009 el.addEventListener('mouseleave', function () { scheduleClose(el); }); 2010 var panel = el.querySelector('.nav-dropdown'); 2011 if (panel) { 2012 panel.addEventListener('mouseenter', function () { openMenu(el); }); 2013 panel.addEventListener('mouseleave', function () { scheduleClose(el); }); 2014 } 2015 document.addEventListener('click', function (e) { 2016 if (!el.contains(e.target)) el.classList.remove('open'); 2017 }); 2018 var trigger = el.querySelector('.nav-link'); 2019 if (trigger) { 2020 trigger.addEventListener('keydown', function (e) { 2021 if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); el.classList.toggle('open'); } 2022 else if (e.key === 'Escape') { el.classList.remove('open'); } 2023 }); 2024 } 2025 }); 2026 })(); 2027 </script>
2027 2028</body> 2029 2030</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.