* {
      box-sizing: border-box;
      margin: 0;
      padding: 0
    }

    :root {
      --bg1: #041320;
      --bg2: #052033;
      --bg3: #08324d;
      --bg4: #0a1e2e;
      --accent: #34f2d2;
      --accent2: #0aa88a;
      --accent-soft: rgba(52, 242, 210, .13);
      --glow: 0 0 30px rgba(52, 242, 210, .3);
      --glow2: 0 0 50px rgba(52, 242, 210, .18);
      --txt: #e9fbf7;
      --txt-dim: #bde0ee;
      --txt-faint: #7da8bc;
      --card: rgba(12, 31, 49, .92);
      --border: rgba(52, 242, 210, .18);
      --border2: rgba(52, 242, 210, .08);
      --r: 14px;
      --shadow: 0 20px 60px rgba(0, 0, 0, .5);
    }

    html {
      scroll-behavior: smooth
    }

    body {
      background: var(--bg1);
      color: var(--txt);
      font-family: 'Outfit', sans-serif;
      overflow-x: hidden;
      line-height: 1.6
    }

    ::selection {
      background: rgba(52, 242, 210, .3);
      color: #fff
    }

    /* ── SCROLLBAR ── */
    ::-webkit-scrollbar {
      width: 6px
    }

    ::-webkit-scrollbar-track {
      background: var(--bg2)
    }

    ::-webkit-scrollbar-thumb {
      background: var(--accent2);
      border-radius: 3px
    }

    /* ── NAV ── */
    nav {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      z-index: 1000;
      height: 66px;
      display: flex;
      align-items: center;
      padding: 0 24px;
      background: rgba(4, 19, 32, .9);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--border2)
    }

    .nav-inner {
      max-width: 1240px;
      margin: 0 auto;
      width: 100%;
      display: flex;
      align-items: center;
      gap: 32px
    }

    .nav-logo {
      display: flex;
      align-items: center;
      gap: 12px;
      text-decoration: none;
      flex-shrink: 0
    }

    .nav-logo-mark {
      width: 38px;
      height: 38px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0
    }

    .nav-logo-mark img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      display: block;
      filter: drop-shadow(0 0 14px rgba(52, 242, 210, .25))
    }

    .nav-logo span {
      font-weight: 800;
      font-size: 1.15rem;
      color: #fff;
      letter-spacing: -.3px
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 4px;
      flex: 1
    }

    .nav-link {
      color: var(--txt-faint);
      text-decoration: none;
      font-size: .9rem;
      font-weight: 500;
      padding: 6px 12px;
      border-radius: 8px;
      transition: .2s;
      white-space: nowrap;
      cursor: pointer;
      border: none;
      background: none
    }

    .nav-link:hover,
    .nav-link.active {
      color: var(--txt);
      background: rgba(52, 242, 210, .08)
    }

    .nav-link.active {
      color: var(--accent)
    }

    .nav-actions {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-left: auto
    }

    .nav-login {
      color: var(--txt-dim);
      text-decoration: none;
      font-size: .875rem;
      font-weight: 500;
      padding: 7px 16px;
      border-radius: 8px;
      border: 1px solid var(--border);
      transition: .2s
    }

    .nav-login:hover {
      border-color: var(--accent);
      color: var(--accent)
    }

    .nav-cta {
      padding: 7px 18px;
      background: var(--accent);
      color: #032420;
      border-radius: 8px;
      font-weight: 700;
      font-size: .875rem;
      text-decoration: none;
      transition: .2s;
      white-space: nowrap
    }

    .nav-cta:hover {
      box-shadow: var(--glow);
      transform: translateY(-1px)
    }

    .hamburger {
      display: none;
      background: none;
      border: none;
      color: var(--txt);
      font-size: 22px;
      cursor: pointer;
      padding: 4px
    }

    @media(max-width:900px) {
      .nav-links {
        display: none
      }

      .hamburger {
        display: block
      }
    }

    /* ── MOBILE MENU ── */
    .mobile-menu {
      position: fixed;
      top: 66px;
      left: 0;
      right: 0;
      background: rgba(4, 19, 32, .97);
      backdrop-filter: blur(20px);
      border-bottom: 1px solid var(--border);
      padding: 20px 24px;
      z-index: 999;
      display: none;
      flex-direction: column;
      gap: 4px
    }

    .mobile-menu.open {
      display: flex
    }

    .mobile-link {
      color: var(--txt-dim);
      text-decoration: none;
      font-size: 1rem;
      font-weight: 500;
      padding: 12px 16px;
      border-radius: 8px;
      border: none;
      background: none;
      cursor: pointer;
      text-align: left;
      width: 100%;
      transition: .2s
    }

    .mobile-link:hover {
      background: var(--accent-soft);
      color: var(--accent)
    }

    /* ── PAGE SYSTEM ── */
    .page {
      display: none;
      padding-top: 66px
    }

    .page.active {
      display: block
    }

    /* ── SHARED ── */
    section {
      padding: 80px 24px
    }

    .inner {
      max-width: 1200px;
      margin: 0 auto
    }

    .tag {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: .38rem .8rem;
      border-radius: 999px;
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .35);
      color: var(--accent);
      font-size: .75rem;
      font-weight: 600;
      letter-spacing: .04em;
      margin-bottom: 1rem
    }

    .sec-title {
      font-size: clamp(1.9rem, 3vw, 2.8rem);
      font-weight: 800;
      color: #fff;
      line-height: 1.15;
      margin-bottom: .8rem;
      letter-spacing: -.5px
    }

    .sec-sub {
      font-size: 1rem;
      color: var(--txt-dim);
      max-width: 600px;
      line-height: 1.7
    }

    .reveal {
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .6s ease, transform .6s ease
    }

    .reveal.on {
      opacity: 1;
      transform: none
    }

    .card {
      background: var(--card);
      border: 1px solid var(--border);
      border-radius: var(--r);
      box-shadow: var(--shadow)
    }

    .card:hover {
      border-color: rgba(52, 242, 210, .35);
      box-shadow: var(--glow2), var(--shadow)
    }

    .btn-main {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: .85rem 1.8rem;
      background: linear-gradient(90deg, #52f5e0, #34f2d2);
      color: #032420;
      border-radius: 10px;
      font-weight: 700;
      font-size: .95rem;
      text-decoration: none;
      transition: .2s;
      box-shadow: 0 6px 20px rgba(52, 242, 210, .28)
    }

    .btn-main:hover {
      transform: translateY(-2px);
      box-shadow: 0 0 28px rgba(52, 242, 210, .55)
    }

    .btn-outline {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: .85rem 1.8rem;
      border: 1px solid var(--border);
      color: var(--txt-dim);
      border-radius: 10px;
      font-weight: 600;
      font-size: .95rem;
      text-decoration: none;
      transition: .2s
    }

    .btn-outline:hover {
      border-color: var(--accent);
      color: var(--accent)
    }

    .grid-2 {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 24px
    }

    .grid-3 {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px
    }

    .grid-4 {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px
    }

    @media(max-width:900px) {

      .grid-2,
      .grid-3,
      .grid-4 {
        grid-template-columns: 1fr 1fr
      }
    }

    @media(max-width:560px) {

      .grid-2,
      .grid-3,
      .grid-4 {
        grid-template-columns: 1fr
      }
    }

    /* ── HERO ── */
    .hero {
      min-height: calc(100vh - 66px);
      display: flex;
      align-items: center;
      padding: 60px 24px;
      position: relative;
      overflow: hidden;
      background: radial-gradient(1400px 700px at 50% -5%, rgba(52, 242, 210, .11), transparent 65%), linear-gradient(180deg, var(--bg1), var(--bg2) 60%, var(--bg3))
    }

    .hero::before {
      content: '';
      position: absolute;
      inset: 0;
      background-image: radial-gradient(circle, rgba(52, 242, 210, .06) 1px, transparent 1px);
      background-size: 40px 40px;
      pointer-events: none
    }

    .hero-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1.1fr .9fr;
      gap: 60px;
      align-items: center;
      position: relative;
      z-index: 1
    }

    @media(max-width:900px) {
      .hero-inner {
        grid-template-columns: 1fr;
        gap: 40px
      }
    }

    .hero-eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: .4rem 1rem;
      border-radius: 999px;
      background: rgba(52, 242, 210, .1);
      border: 1px solid rgba(52, 242, 210, .3);
      color: var(--accent);
      font-size: .78rem;
      font-weight: 600;
      margin-bottom: 1.2rem
    }

    .hero-eyebrow::before {
      content: '';
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--accent);
      animation: blink 1.8s infinite
    }

    @keyframes blink {

      0%,
      100% {
        opacity: 1
      }

      50% {
        opacity: .3
      }
    }

    .hero-h1 {
      font-size: clamp(2.4rem, 4.5vw, 4rem);
      font-weight: 800;
      line-height: 1.1;
      letter-spacing: -.8px;
      margin-bottom: 1.3rem;
      color: #fff
    }

    .hero-h1 em {
      font-style: normal;
      color: var(--accent);
      text-shadow: 0 0 40px rgba(52, 242, 210, .4)
    }

    .hero-p {
      font-size: 1.08rem;
      color: var(--txt-dim);
      line-height: 1.75;
      margin-bottom: 2rem;
      max-width: 520px
    }

    .hero-btns {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      margin-bottom: 2.5rem
    }

    .hero-stats {
      display: flex;
      gap: 28px;
      flex-wrap: wrap
    }

    .stat .n {
      font-size: 1.7rem;
      font-weight: 800;
      color: var(--accent);
      line-height: 1
    }

    .stat .l {
      font-size: .78rem;
      color: var(--txt-faint);
      margin-top: 3px
    }

    /* CHAT DEMO */
    .demo-wrap {
      position: relative
    }

    .demo-label {
      font-size: .73rem;
      font-weight: 600;
      color: var(--accent);
      opacity: .85;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 6px
    }

    .demo-label::before {
      content: '';
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #22c55e;
      animation: blink 1.5s infinite
    }

    .demo-box {
      max-width: 430px;
      border: 1px solid var(--border);
      border-radius: 22px;
      overflow: hidden;
      background: linear-gradient(180deg, rgba(8, 30, 46, .94), rgba(5, 23, 36, .96));
      box-shadow: var(--shadow), var(--glow2)
    }

    .demo-hdr {
      padding: 16px 18px;
      display: flex;
      align-items: center;
      gap: 12px;
      border-bottom: 1px solid var(--border2);
      background:
        radial-gradient(circle at top right, rgba(52, 242, 210, .16), transparent 35%),
        linear-gradient(135deg, rgba(7, 34, 47, .96), rgba(10, 45, 62, .94))
    }

    .demo-av {
      width: 40px;
      height: 40px;
      border-radius: 14px;
      background: linear-gradient(135deg, #34f2d2, #0aa88a);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #04211d;
      font-size: 17px;
      font-weight: 800;
      flex-shrink: 0
    }

    .demo-preview {
      padding: 18px
    }

    .demo-proof {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 11px;
      border-radius: 999px;
      color: #032420;
      background: linear-gradient(135deg, rgba(52, 242, 210, .95), rgba(122, 255, 234, .92));
      font-size: .73rem;
      font-weight: 700
    }

    .demo-flow {
      margin-top: 14px;
      padding: 12px 14px;
      border-radius: 16px;
      border: 1px solid rgba(52, 242, 210, .14);
      background: rgba(255, 255, 255, .04);
      color: var(--txt-dim);
      font-size: .82rem;
      line-height: 1.6
    }

    .demo-flow strong {
      color: #fff
    }

    .demo-flow code {
      color: var(--accent);
      font-family: 'DM Mono', monospace;
      font-size: .79rem
    }

    .demo-msgs {
      margin-top: 14px;
      display: flex;
      flex-direction: column;
      gap: 10px
    }

    .dm {
      max-width: 88%;
      padding: 12px 14px;
      border-radius: 16px;
      font-size: .87rem;
      line-height: 1.55
    }

    .dm-b {
      background: rgba(255, 255, 255, .06);
      color: var(--txt);
      border: 1px solid rgba(255, 255, 255, .05);
      border-radius: 16px 16px 16px 5px;
      align-self: flex-start
    }

    .dm-u {
      background: linear-gradient(135deg, #34f2d2, #7affea);
      color: #042a2e;
      font-weight: 600;
      border-radius: 16px 16px 5px 16px;
      align-self: flex-end
    }

    .demo-quick-grid {
      margin-top: 16px;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px
    }

    .demo-quick {
      padding: 12px 12px;
      border-radius: 14px;
      border: 1px solid rgba(52, 242, 210, .14);
      background: rgba(255, 255, 255, .03);
      color: var(--txt);
      text-align: left;
      font-family: inherit;
      font-size: .82rem;
      font-weight: 600;
      cursor: pointer;
      transition: .2s
    }

    .demo-quick:hover {
      transform: translateY(-2px);
      border-color: rgba(52, 242, 210, .32);
      background: rgba(52, 242, 210, .08)
    }

    .demo-actions {
      margin-top: 16px;
      display: flex;
      gap: 10px;
      flex-wrap: wrap
    }

    .demo-action-btn {
      appearance: none;
      border: 0;
      cursor: pointer
    }

    .demo-note {
      margin-top: 14px;
      color: var(--txt-faint);
      font-size: .76rem;
      line-height: 1.6
    }

    /* ── HOW IT WORKS ── */
    .hiw-bg {
      background: radial-gradient(900px 500px at 80% 50%, rgba(52, 242, 210, .07), transparent), linear-gradient(180deg, var(--bg2), var(--bg3))
    }

    .steps-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 0;
      margin-top: 52px;
      position: relative
    }

    .steps-grid::before {
      content: '';
      position: absolute;
      top: 36px;
      left: 12.5%;
      right: 12.5%;
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--border), var(--border), var(--border), transparent)
    }

    @media(max-width:900px) {
      .steps-grid {
        grid-template-columns: 1fr 1fr;
        gap: 20px
      }

      .steps-grid::before {
        display: none
      }
    }

    @media(max-width:560px) {
      .steps-grid {
        grid-template-columns: 1fr
      }
    }

    .step {
      text-align: center;
      padding: 0 16px;
      position: relative
    }

    .step-num {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .35);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.6rem;
      margin: 0 auto 18px;
      position: relative;
      z-index: 1
    }

    .step-title {
      font-weight: 700;
      font-size: 1rem;
      color: #fff;
      margin-bottom: 8px
    }

    .step-desc {
      font-size: .875rem;
      color: var(--txt-dim);
      line-height: 1.6
    }

    /* VIDEO SECTION */
    .vid-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 24px;
      margin-top: 40px
    }

    @media(max-width:700px) {
      .vid-grid {
        grid-template-columns: 1fr
      }
    }

    .vid-card {
      background: var(--card);
      border: 1px solid var(--border);
      border-radius: var(--r);
      overflow: hidden;
      transition: .3s
    }

    .vid-card:hover {
      transform: translateY(-4px);
      box-shadow: var(--glow2), var(--shadow)
    }

    .vid-thumb {
      aspect-ratio: 16/9;
      background: #041f33;
      position: relative;
      overflow: hidden
    }

    .vid-thumb iframe {
      width: 100%;
      height: 100%;
      border: none
    }

    .vid-thumb .silent {
      position: absolute;
      top: 10px;
      left: 10px;
      background: rgba(0, 0, 0, .75);
      color: #fff;
      font-size: .7rem;
      font-weight: 600;
      padding: 3px 9px;
      border-radius: 999px;
      backdrop-filter: blur(4px)
    }

    .vid-thumb .placeholder {
      position: absolute;
      inset: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      color: var(--txt-dim);
      gap: 8px;
      font-size: .85rem
    }

    .vid-info {
      padding: 16px 18px
    }

    .vid-title {
      font-weight: 700;
      font-size: .95rem;
      color: #fff;
      margin-bottom: 3px
    }

    .vid-desc {
      font-size: .8rem;
      color: var(--txt-faint)
    }

    /* ── FEATURES ── */
    .feat-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      margin-top: 44px
    }

    @media(max-width:900px) {
      .feat-grid {
        grid-template-columns: 1fr 1fr
      }
    }

    @media(max-width:560px) {
      .feat-grid {
        grid-template-columns: 1fr
      }
    }

    .feat {
      padding: 24px;
      transition: .3s
    }

    .feat:hover {
      transform: translateY(-3px)
    }

    .feat-icon {
      width: 46px;
      height: 46px;
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .3);
      border-radius: 11px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.4rem;
      margin-bottom: 14px
    }

    .feat-title {
      font-weight: 700;
      font-size: 1rem;
      color: #fff;
      margin-bottom: 6px
    }

    .feat-desc {
      font-size: .875rem;
      color: var(--txt-dim);
      line-height: 1.65
    }

    /* ── PRICING ── */
    .pricing-bg {
      background: radial-gradient(1200px 600px at 50% 0%, rgba(52, 242, 210, .09), transparent 60%), linear-gradient(180deg, var(--bg2), var(--bg3))
    }

    .billing-toggle {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 14px;
      margin: 24px 0 36px;
      font-size: .9rem;
      color: var(--txt-dim)
    }

    .toggle-track {
      width: 44px;
      height: 24px;
      border-radius: 999px;
      background: rgba(255, 255, 255, .12);
      border: 1px solid var(--border);
      cursor: pointer;
      position: relative;
      transition: .2s
    }

    .toggle-track.on {
      background: var(--accent)
    }

    .toggle-track::after {
      content: '';
      position: absolute;
      top: 3px;
      left: 3px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #fff;
      transition: .2s
    }

    .toggle-track.on::after {
      left: 23px
    }

    .save-pill {
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .35);
      color: var(--accent);
      font-size: .72rem;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 5px
    }

    .plans-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
      margin-top: 0
    }

    @media(max-width:900px) {
      .plans-grid {
        grid-template-columns: 1fr
      }
    }

    .plan {
      padding: 28px 24px;
      border-radius: 18px;
      transition: .3s;
      position: relative;
      background:
        radial-gradient(circle at top right, rgba(52, 242, 210, .12), transparent 34%),
        linear-gradient(180deg, rgba(10, 35, 52, .98), rgba(5, 22, 35, .98));
      box-shadow: 0 24px 60px rgba(0, 0, 0, .42)
    }

    .plan.pop {
      border: 1.5px solid var(--accent) !important;
      box-shadow: 0 0 0 1px rgba(52, 242, 210, .18), var(--glow2), 0 24px 60px rgba(0, 0, 0, .46)
    }

    .plan:hover {
      transform: translateY(-5px)
    }

    .plan-name {
      font-weight: 800;
      font-size: 1rem;
      color: #fff;
      margin-bottom: 3px
    }

    .plan-target {
      font-size: .8rem;
      color: var(--txt-faint);
      margin-bottom: 14px
    }

    .plan-price {
      font-size: 2.6rem;
      font-weight: 800;
      color: #ffffff;
      text-shadow: 0 0 28px rgba(52, 242, 210, .16);
      letter-spacing: -1px;
      line-height: 1
    }

    .plan-per {
      font-size: .9rem;
      font-weight: 500;
      color: #d8f4ed
    }

    .plan-setup {
      font-size: .78rem;
      color: #c8e4ef;
      margin: 4px 0 14px
    }

    .plan-cta {
      width: 100%;
      padding: .9rem;
      border: none;
      border-radius: 10px;
      background: linear-gradient(90deg, #52f5e0, #34f2d2);
      color: #032420;
      font-weight: 800;
      font-size: .95rem;
      cursor: pointer;
      transition: .2s;
      font-family: 'Outfit', sans-serif
    }

    .plan-cta:hover {
      box-shadow: 0 0 24px rgba(52, 242, 210, .5);
      transform: translateY(-1px)
    }

    .plan-cta.outline {
      background: transparent;
      border: 1px solid var(--border);
      color: var(--txt-dim)
    }

    .plan-cta.outline:hover {
      border-color: var(--accent);
      color: var(--accent);
      box-shadow: none
    }

    .plan-divider {
      border: none;
      border-top: 1px solid var(--border2);
      margin: 18px 0
    }

    .plan-feat {
      display: flex;
      gap: 9px;
      align-items: flex-start;
      font-size: .875rem;
      color: #e3f4fb;
      margin-bottom: 9px
    }

    .plan-feat::before {
      content: '✓';
      color: var(--accent);
      font-weight: 700;
      flex-shrink: 0;
      margin-top: 1px
    }

    .plan-feat.no {
      color: #8fb2c4
    }

    .plan-feat.no::before {
      content: '–';
      color: var(--txt-faint)
    }

    /* compare table */
    .compare-table {
      width: 100%;
      border-collapse: collapse;
      margin-top: 44px;
      font-size: .875rem
    }

    .compare-table th {
      padding: 12px 16px;
      text-align: center;
      font-weight: 600;
      color: #e7f7f3;
      border-bottom: 1px solid var(--border2)
    }

    .compare-table th:first-child {
      text-align: left
    }

    .compare-table td {
      padding: 11px 16px;
      text-align: center;
      border-bottom: 1px solid var(--border2);
      color: #d8edf5
    }

    .compare-table td:first-child {
      text-align: left;
      color: var(--txt)
    }

    .compare-table tr:hover td {
      background: rgba(52, 242, 210, .03)
    }

    .compare-table .yes {
      color: var(--accent);
      font-size: 1.1rem
    }

    .compare-table .no {
      color: var(--txt-faint)
    }

    .compare-table .highlight th,
    .compare-table .highlight td {
      background: rgba(52, 242, 210, .05);
      color: var(--accent)
    }

    /* ── INTEGRATIONS ── */
    .int-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 16px;
      margin-top: 40px
    }

    @media(max-width:900px) {
      .int-grid {
        grid-template-columns: repeat(3, 1fr)
      }
    }

    @media(max-width:560px) {
      .int-grid {
        grid-template-columns: 1fr 1fr
      }
    }

    .int-card {
      padding: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 10px;
      transition: .3s;
      cursor: default
    }

    .int-card:hover {
      transform: translateY(-3px)
    }

    .int-icon {
      width: 52px;
      height: 52px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.8rem;
      margin-bottom: 2px
    }

    .int-name {
      font-weight: 600;
      font-size: .9rem;
      color: #fff
    }

    .int-desc {
      font-size: .78rem;
      color: var(--txt-faint);
      line-height: 1.4
    }

    .int-badge {
      font-size: .68rem;
      padding: 2px 7px;
      border-radius: 4px;
      font-weight: 600
    }

    /* ── RESOURCES ── */
    .res-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-top: 40px
    }

    @media(max-width:700px) {
      .res-grid {
        grid-template-columns: 1fr
      }
    }

    .res-card {
      padding: 24px;
      transition: .3s
    }

    .res-card:hover {
      transform: translateY(-3px)
    }

    .res-tag-pill {
      font-size: .7rem;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 4px;
      margin-bottom: 10px;
      display: inline-block
    }

    .res-title {
      font-weight: 700;
      font-size: 1rem;
      color: #fff;
      margin-bottom: 6px
    }

    .res-desc {
      font-size: .85rem;
      color: var(--txt-dim);
      line-height: 1.6;
      margin-bottom: 12px
    }

    .res-link {
      font-size: .82rem;
      color: var(--accent);
      text-decoration: none;
      font-weight: 500
    }

    .res-link:hover {
      text-decoration: underline
    }

    /* ── CONTACT ── */
    .contact-grid {
      display: grid;
      grid-template-columns: 1.2fr .8fr;
      gap: 32px;
      margin-top: 44px
    }

    @media(max-width:800px) {
      .contact-grid {
        grid-template-columns: 1fr
      }
    }

    .form-group {
      margin-bottom: 18px
    }

    .form-label {
      display: block;
      font-size: .875rem;
      font-weight: 600;
      color: var(--txt);
      margin-bottom: 7px
    }

    .form-input,
    .form-textarea,
    .form-select {
      width: 100%;
      padding: 12px 16px;
      background: rgba(4, 19, 32, .6);
      border: 1px solid var(--border);
      border-radius: 10px;
      color: var(--txt);
      font-size: .9rem;
      font-family: 'Outfit', sans-serif;
      transition: .2s;
      outline: none
    }

    .form-input:focus,
    .form-textarea:focus,
    .form-select:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(52, 242, 210, .1)
    }

    .form-input::placeholder,
    .form-textarea::placeholder {
      color: var(--txt-faint)
    }

    .form-select {
      appearance: none;
      cursor: pointer
    }

    .form-select option {
      background: #041320
    }

    .form-textarea {
      min-height: 120px;
      resize: vertical
    }

    .form-submit {
      width: 100%;
      padding: 13px;
      background: linear-gradient(90deg, #52f5e0, #34f2d2);
      color: #032420;
      border: none;
      border-radius: 10px;
      font-weight: 800;
      font-size: 1rem;
      cursor: pointer;
      font-family: 'Outfit', sans-serif;
      transition: .2s
    }

    .form-submit:hover {
      transform: translateY(-1px);
      box-shadow: 0 0 22px rgba(52, 242, 210, .45)
    }

    .contact-info-item {
      display: flex;
      gap: 14px;
      align-items: flex-start;
      margin-bottom: 22px
    }

    .contact-icon {
      width: 44px;
      height: 44px;
      border-radius: 10px;
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .3);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.2rem;
      flex-shrink: 0
    }

    .contact-info-item h3 {
      font-size: .95rem;
      font-weight: 700;
      color: #fff;
      margin-bottom: 3px
    }

    .contact-info-item p,
    .contact-info-item a {
      font-size: .875rem;
      color: var(--txt-dim);
      text-decoration: none
    }

    .contact-info-item a:hover {
      color: var(--accent)
    }

    .social-row {
      display: flex;
      gap: 10px;
      margin-top: 22px
    }

    .soc {
      width: 42px;
      height: 42px;
      background: var(--accent-soft);
      border: 1px solid rgba(52, 242, 210, .3);
      border-radius: 9px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--accent);
      text-decoration: none;
      font-size: 1rem;
      transition: .2s;
      font-weight: 700
    }

    .soc:hover {
      background: var(--accent);
      color: #032420
    }

    /* ── CTA BAND ── */
    .cta-band {
      background: radial-gradient(800px 400px at 50% 50%, rgba(52, 242, 210, .16), transparent), linear-gradient(135deg, #071f33, #0a2d42);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      text-align: center;
      padding: 80px 24px
    }

    /* ── FOOTER ── */
    footer {
      background: #030f1a;
      border-top: 1px solid rgba(255, 255, 255, .05);
      padding: 52px 24px 32px
    }

    .footer-inner {
      max-width: 1200px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: 1.35fr repeat(3, minmax(140px, .9fr));
      gap: 30px
    }

    @media(max-width:800px) {
      .footer-inner {
        grid-template-columns: 1fr 1fr
      }
    }

    @media(max-width:500px) {
      .footer-inner {
        grid-template-columns: 1fr
      }
    }

    .footer-brand {
      display: flex;
      align-items: center;
      gap: 10px;
      font-weight: 800;
      font-size: 1.1rem;
      color: #fff;
      margin-bottom: .75rem
    }

    .footer-brand img {
      width: 28px;
      height: 28px;
      object-fit: contain;
      display: block;
      flex-shrink: 0;
      filter: drop-shadow(0 0 12px rgba(52, 242, 210, .22))
    }

    .footer-desc {
      font-size: .83rem;
      color: var(--txt-faint);
      line-height: 1.6;
      max-width: 320px
    }

    .footer-col h4 {
      font-size: .75rem;
      font-weight: 700;
      color: var(--txt-faint);
      letter-spacing: .1em;
      text-transform: uppercase;
      margin-bottom: 12px
    }

    .footer-col a {
      display: block;
      font-size: .85rem;
      color: var(--txt-faint);
      text-decoration: none;
      margin-bottom: 8px;
      transition: .2s;
      cursor: pointer
    }

    .footer-col a:hover {
      color: var(--accent)
    }

    .footer-bottom {
      max-width: 1200px;
      margin: 36px auto 0;
      padding-top: 24px;
      border-top: 1px solid rgba(255, 255, 255, .05);
      display: flex;
      justify-content: space-between;
      align-items: center;
      flex-wrap: gap;
      gap: 12px;
      font-size: .78rem;
      color: var(--txt-faint)
    }

    /* ── FLOATING WIDGET ── */
    #ww-widget {
      position: fixed;
      bottom: 20px;
      right: 20px;
      z-index: 999999
    }

    #ww-widget * {
      box-sizing: border-box;
      font-family: inherit
    }

    .ww-btn {
      position: relative;
      width: 64px;
      height: 64px;
      border: 0;
      border-radius: 50%;
      cursor: pointer;
      color: #04211d;
      background:
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, .6), transparent 32%),
        linear-gradient(135deg, var(--accent), #1ab5a0);
      box-shadow: 0 16px 40px rgba(0, 0, 0, .28);
      font-size: 26px;
      font-weight: 700
    }

    .ww-btn::after {
      content: attr(data-status);
      position: absolute;
      top: -8px;
      right: -8px;
      padding: 4px 8px;
      border-radius: 999px;
      font-family: 'DM Mono', monospace;
      font-size: 10px;
      letter-spacing: .04em;
      color: #031712;
      background: var(--accent);
      box-shadow: 0 8px 20px rgba(0, 0, 0, .2)
    }

    .ww-btn[data-status="Agent"]::after {
      background: #ffd166;
      color: #3f2e00
    }

    .ww-btn[data-status="Closed"]::after {
      background: rgba(125, 168, 188, .95);
      color: #052033
    }

    .ww-box {
      position: absolute;
      right: 0;
      bottom: 84px;
      width: min(390px, calc(100vw - 24px));
      height: min(640px, calc(100vh - 120px));
      display: flex;
      flex-direction: column;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: 24px;
      background: rgba(12, 31, 49, .96);
      box-shadow: var(--shadow);
      transform: translateY(16px) scale(.96);
      opacity: 0;
      pointer-events: none;
      transition: transform .25s ease, opacity .25s ease;
      backdrop-filter: blur(18px)
    }

    .ww-box.open {
      transform: translateY(0) scale(1);
      opacity: 1;
      pointer-events: auto
    }

    .ww-header {
      padding: 18px 18px 16px;
      border-bottom: 1px solid rgba(52, 242, 210, .08);
      background:
        radial-gradient(circle at top right, rgba(52, 242, 210, .18), transparent 30%),
        linear-gradient(135deg, rgba(7, 34, 47, .96), rgba(10, 45, 62, .92))
    }

    .ww-top {
      display: flex;
      align-items: center;
      gap: 12px
    }

    .ww-mark {
      width: 42px;
      height: 42px;
      border-radius: 14px;
      display: grid;
      place-items: center;
      overflow: hidden;
      background: rgba(52, 242, 210, .12);
      border: 1px solid rgba(52, 242, 210, .2);
      flex-shrink: 0
    }

    .ww-mark img {
      width: 28px;
      height: 28px;
      object-fit: contain
    }

    .ww-title {
      font-size: 1rem;
      font-weight: 700;
      line-height: 1.1
    }

    .ww-subtitle {
      margin-top: 3px;
      color: var(--txt-dim);
      font-size: .82rem
    }

    .ww-actions {
      margin-left: auto;
      display: flex;
      gap: 8px
    }

    .ww-icon-btn {
      width: 34px;
      height: 34px;
      border: 0;
      border-radius: 10px;
      cursor: pointer;
      color: var(--txt);
      background: rgba(255, 255, 255, .05);
      font-size: 18px
    }

    .ww-state {
      margin-top: 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      color: var(--txt-faint);
      font-size: .78rem
    }

    .ww-pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 10px;
      border-radius: 999px;
      color: #031712;
      background: var(--accent);
      font-family: 'DM Mono', monospace;
      font-size: .72rem;
      font-weight: 500
    }

    .ww-pill.agent {
      background: #ffd166;
      color: #4c3400
    }

    .ww-messages {
      flex: 1;
      overflow-y: auto;
      padding: 18px;
      background:
        linear-gradient(180deg, rgba(255, 255, 255, .02), transparent),
        rgba(4, 20, 33, .35)
    }

    .ww-msg {
      max-width: 82%;
      margin-bottom: 14px;
      padding: 12px 14px;
      border-radius: 18px;
      line-height: 1.5;
      font-size: .95rem;
      word-break: break-word;
      white-space: pre-wrap
    }

    .ww-msg.user {
      margin-left: auto;
      color: #032420;
      background: linear-gradient(135deg, var(--accent), #7affea);
      border-bottom-right-radius: 6px
    }

    .ww-msg.bot {
      color: var(--txt);
      background: rgba(255, 255, 255, .06);
      border: 1px solid rgba(255, 255, 255, .04);
      border-bottom-left-radius: 6px
    }

    .ww-msg.agent {
      color: #3e2c00;
      background: rgba(255, 209, 102, .94);
      border-bottom-left-radius: 6px
    }

    .ww-msg-time {
      margin-top: 7px;
      color: inherit;
      opacity: .65;
      font-size: .72rem;
      font-family: 'DM Mono', monospace
    }

    .ww-system {
      margin: 10px auto 14px;
      max-width: 92%;
      padding: 8px 12px;
      border-radius: 999px;
      color: var(--txt-dim);
      background: rgba(255, 255, 255, .06);
      text-align: center;
      font-size: .75rem
    }

    .ww-typing {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      border-radius: 16px;
      background: rgba(255, 255, 255, .06);
      margin-bottom: 14px
    }

    .ww-typing-dots {
      display: inline-flex;
      align-items: center;
      gap: 6px
    }

    .ww-typing-dots span {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--txt-faint);
      animation: bounce 1.1s infinite ease-in-out
    }

    .ww-typing-dots span:nth-child(2) {
      animation-delay: .15s
    }

    .ww-typing-dots span:nth-child(3) {
      animation-delay: .3s
    }

    .ww-typing-label {
      color: var(--txt-dim);
      font-size: .74rem;
      letter-spacing: .01em
    }

    .ww-input {
      display: flex;
      align-items: end;
      gap: 10px;
      padding: 16px;
      border-top: 1px solid rgba(52, 242, 210, .08);
      background: rgba(3, 18, 29, .92)
    }

    .ww-input textarea {
      flex: 1;
      min-height: 48px;
      max-height: 120px;
      resize: none;
      padding: 13px 16px;
      border: 1px solid rgba(52, 242, 210, .16);
      border-radius: 18px;
      color: var(--txt);
      background: rgba(255, 255, 255, .04);
      outline: 0;
      font-size: .95rem
    }

    .ww-input textarea::placeholder {
      color: var(--txt-faint)
    }

    .ww-send {
      width: 46px;
      height: 46px;
      border: 0;
      border-radius: 16px;
      cursor: pointer;
      color: #032420;
      background: linear-gradient(135deg, var(--accent), #7affea);
      font-size: 18px;
      font-weight: 700;
      flex-shrink: 0
    }

    .ww-send:disabled {
      opacity: .5;
      cursor: not-allowed
    }

    .ww-modal-overlay {
      position: absolute;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      background: rgba(0, 0, 0, .55);
      backdrop-filter: blur(2px);
      z-index: 3
    }

    .ww-capture-overlay {
      position: absolute;
      inset: 0;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 18px;
      background: rgba(0, 0, 0, .62);
      backdrop-filter: blur(2px);
      z-index: 4
    }

    .ww-capture-card {
      width: min(100%, 340px);
      padding: 22px;
      border-radius: 22px;
      background: #092131;
      border: 1px solid rgba(52, 242, 210, .18);
      box-shadow: var(--shadow)
    }

    .ww-capture-title {
      margin: 0 0 8px;
      color: var(--txt);
      font-size: 1rem;
      font-weight: 700
    }

    .ww-capture-subtitle {
      margin: 0 0 14px;
      color: var(--txt-dim);
      font-size: .84rem;
      line-height: 1.5
    }

    .ww-capture-fields {
      display: grid;
      gap: 10px
    }

    .ww-capture-input {
      width: 100%;
      padding: 12px 14px;
      border: 1px solid rgba(52, 242, 210, .16);
      border-radius: 14px;
      color: var(--txt);
      background: rgba(255, 255, 255, .05);
      outline: 0;
      font-size: .92rem
    }

    .ww-capture-input::placeholder {
      color: var(--txt-faint)
    }

    .ww-capture-error {
      min-height: 18px;
      margin-top: 10px;
      color: #ff9d9d;
      font-size: .78rem
    }

    .ww-capture-actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
      margin-top: 12px
    }

    .ww-capture-btn {
      padding: 10px 14px;
      border: 0;
      border-radius: 12px;
      cursor: pointer;
      font-weight: 700
    }

    .ww-capture-btn.cancel {
      color: var(--txt);
      background: rgba(255, 255, 255, .08)
    }

    .ww-capture-btn.submit {
      color: #032420;
      background: linear-gradient(135deg, var(--accent), #7affea)
    }

    .ww-csat-card {
      margin: 2px 0 16px;
      padding: 14px;
      border: 1px solid rgba(52, 242, 210, .16);
      border-radius: 18px;
      background: rgba(8, 35, 51, .96)
    }

    .ww-csat-title {
      margin: 0 0 12px;
      color: var(--txt);
      font-size: .88rem;
      line-height: 1.5
    }

    .ww-csat-actions {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px
    }

    .ww-csat-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-height: 44px;
      padding: 10px 8px;
      border: 1px solid rgba(255, 255, 255, .08);
      border-radius: 14px;
      color: var(--txt);
      background: rgba(255, 255, 255, .05);
      cursor: pointer;
      font-size: .86rem;
      font-weight: 600
    }

    .ww-csat-btn:hover:not(:disabled) {
      border-color: rgba(52, 242, 210, .28);
      background: rgba(52, 242, 210, .10)
    }

    .ww-csat-btn:disabled {
      opacity: .6;
      cursor: wait
    }

    .ww-csat-meta {
      min-height: 18px;
      margin-top: 10px;
      color: var(--txt-dim);
      font-size: .76rem
    }

    .ww-csat-meta.error {
      color: #ff9d9d
    }

    .ww-modal {
      width: min(300px, calc(100% - 32px));
      padding: 22px;
      border-radius: 20px;
      background: #092131;
      border: 1px solid rgba(52, 242, 210, .18);
      box-shadow: var(--shadow)
    }

    .ww-modal p {
      margin: 0 0 16px;
      color: var(--txt);
      line-height: 1.45
    }

    .ww-modal-btns {
      display: flex;
      gap: 10px;
      justify-content: flex-end
    }

    .ww-modal-btn {
      padding: 10px 14px;
      border: 0;
      border-radius: 12px;
      cursor: pointer;
      font-weight: 700
    }

    .ww-modal-btn.cancel {
      color: var(--txt);
      background: rgba(255, 255, 255, .08)
    }

    .ww-modal-btn.confirm {
      color: #2a1500;
      background: #ff7676
    }

    @keyframes bounce {
      0%, 80%, 100% {
        transform: translateY(0);
        opacity: .6
      }

      40% {
        transform: translateY(-6px);
        opacity: 1
      }
    }

    @media(max-width:640px) {
      .demo-quick-grid {
        grid-template-columns: 1fr
      }

      #ww-widget {
        right: 12px;
        bottom: 12px
      }

      .ww-box {
        right: -4px;
        width: min(100vw - 24px, 390px);
        height: min(74vh, 620px)
      }
    }

    /* ── ANIMATIONS ── */
    @keyframes fadeUp {
      from {
        opacity: 0;
        transform: translateY(24px)
      }

      to {
        opacity: 1;
        transform: none
      }
    }

    .fade-up {
      animation: fadeUp .7s ease both
    }

    .delay-1 {
      animation-delay: .1s
    }

    .delay-2 {
      animation-delay: .2s
    }

    .delay-3 {
      animation-delay: .3s
    }

    .delay-4 {
      animation-delay: .4s
    }

    @media(max-width:560px) {
      section {
        padding: 60px 16px
      }

      .hero {
        padding: 40px 16px
      }
    }

    /* ── TURNSTILE WIDGET CONTAINER ── */
    .turnstile-wrap {
      margin: 14px 0;
      display: flex;
      justify-content: flex-start;
      min-height: 65px;
    }

/* Public style-attr cleanup */
.ww-badge-blue{background:#E6F1FB;color:#185FA5}
.ww-badge-green{background:#EAF3DE;color:#3B6D11}
.ww-badge-purple{background:#EEEDFE;color:#3C3489}
.ww-badge-amber{background:#FAEEDA;color:#633806}
.ww-section-bg-resources{background:radial-gradient(1000px 500px at 70% -10%,rgba(52,242,210,.1),transparent),linear-gradient(180deg,var(--bg1),var(--bg2))}
.ww-section-bg-integrations{background:radial-gradient(1200px 600px at 30% -10%,rgba(52,242,210,.1),transparent),linear-gradient(180deg,var(--bg1),var(--bg2))}
.ww-section-bg-contact{background:radial-gradient(1200px 600px at 50% -10%,rgba(52,242,210,.1),transparent),linear-gradient(180deg,var(--bg1),var(--bg2))}
.ww-section-bg-features{background:radial-gradient(1400px 700px at 50% -10%,rgba(52,242,210,.1),transparent),linear-gradient(180deg,var(--bg1),var(--bg2))}
.ww-icon-bg-shopify{background:rgba(149,191,71,.1)}
.ww-icon-bg-instagram{background:rgba(225,48,108,.1)}
.ww-icon-bg-gemini{background:rgba(234,179,8,.1)}
.ww-icon-bg-email{background:rgba(239,71,67,.1)}
.ww-icon-bg-supabase{background:rgba(250,113,0,.1)}
.ww-icon-bg-wordpress{background:rgba(33,150,243,.1)}
.ww-icon-bg-whatsapp{background:rgba(37,99,235,.1)}
.ww-table-highlight-row{background:rgba(52,242,210,.04)}
.ww-icon-bg-teal{background:rgba(52,242,210,.1)}
.ww-icon-bg-stripe{background:rgba(99,102,241,.1)}
.ww-bg-primary{background:var(--bg1)}
.ww-bg-secondary{background:var(--bg2)}
.ww-text-accent{color:var(--accent)}
.ww-text-accent-semibold{color:var(--accent);font-weight:600}
.ww-text-accent-strong{color:var(--accent);font-weight:700}
.ww-link-accent-strong{color:var(--accent);text-decoration:none;font-weight:600}
.ww-cta-copy{color:var(--txt-dim);margin:.75rem auto 2rem;max-width:480px}
.ww-price-row{display:flex;align-items:flex-end;gap:4px;margin:12px 0 2px}
.ww-filter-row{display:flex;gap:10px;flex-wrap:wrap;margin:28px 0}
.ww-trust-metrics{display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:wrap}
.ww-stat-label{font-size:.75rem;color:var(--txt-faint)}
.ww-demo-live-status{font-size:.76rem;color:#22c55e}
.ww-usage-rate-label{font-size:.78rem;color:var(--accent);font-weight:600;margin-bottom:10px}
.ww-usage-rate-copy{font-size:.82rem;color:var(--txt-dim);margin-bottom:12px;line-height:1.8}
.ww-contact-support-copy{font-size:.82rem;color:var(--txt-faint);margin:0 0 18px}
.ww-note-copy{font-size:.85rem;color:var(--txt-dim)}
.ww-heading-small{font-size:.875rem;color:#fff;margin-bottom:10px}
.ww-body-copy-tight{font-size:.875rem;color:var(--txt-dim);line-height:1.6}
.ww-body-copy-loose{font-size:.875rem;color:var(--txt-dim);line-height:1.8}
.ww-micro-copy{font-size:.8rem;color:var(--txt-faint);margin-top:3px}
.ww-panel-kicker{font-size:.8rem;font-weight:600;color:var(--accent);margin-bottom:6px}
.ww-card-kicker{font-size:.8rem;font-weight:600;color:var(--accent);margin-bottom:8px}
.ww-body-copy{font-size:.9rem;color:var(--txt-dim)}
.ww-panel-title{font-size:1.1rem;font-weight:700;color:#fff;margin-bottom:20px}
.ww-form-title{font-size:1.3rem;font-weight:700;color:#fff;margin-bottom:22px}
.ww-stat-value{font-size:1.4rem;font-weight:800;color:var(--accent)}
.ww-title-small{font-size:1.8rem}
.ww-placeholder-emoji{font-size:2rem}
.ww-demo-title{font-weight:700;font-size:.95rem;color:#fff}
.ww-mb-8{margin-bottom:8px}
.ww-mb-8-glow{margin-bottom:8px;box-shadow:var(--glow)}
.ww-enterprise-note{margin-top:24px;padding:20px;background:rgba(52,242,210,.05);border:1px solid rgba(52,242,210,.2);border-radius:14px;text-align:center}
.ww-grid-gap-16{margin-top:36px;gap:16px}
.ww-integration-note{margin-top:36px;padding:20px;background:rgba(52,242,210,.05);border:1px solid var(--border);border-radius:14px;text-align:center}
.ww-mt-44{margin-top:44px}
.ww-mt-60{margin-top:60px}
.ww-mt-60-center{margin-top:60px;text-align:center}
.ww-mx-auto{margin:0 auto}
.ww-pricing-assistant-note{margin:18px auto 0;max-width:640px;padding:14px 16px;border:1px solid rgba(52,242,210,.2);background:rgba(52,242,210,.06);border-radius:14px;color:var(--txt-dim);font-size:.92rem;line-height:1.6}
.ww-overflow-table{overflow-x:auto;margin-top:28px}
.ww-p-20{padding:20px}
.ww-card-response{padding:22px;background:rgba(52,242,210,.05);border-color:rgba(52,242,210,.2)}
.ww-card-contact-info{padding:28px;margin-bottom:16px}
.ww-p-32{padding:32px}
.ww-trust-strip{padding:40px 24px;background:var(--bg2);border-top:1px solid var(--border2);border-bottom:1px solid var(--border2)}
.ww-honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.ww-relative{position:relative}
.ww-text-center{text-align:center}
.ww-trust-eyebrow{text-align:center;font-size:.8rem;color:var(--txt-faint);letter-spacing:.12em;text-transform:uppercase;margin-bottom:20px}
.ww-title-small-center{text-align:center;font-size:1.8rem}
.ww-section-head{text-align:center;margin-bottom:48px}
.ww-section-cta{text-align:center;margin-top:36px}
.ww-trust-divider{width:1px;height:40px;background:var(--border2)}