@import url('https://fonts.googleapis.com/css2?family=Onest:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700;800;900&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
.lp{font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;background:#f4f8f4;color:#0F2C38;overflow-x:clip}
.lp *{font-family:inherit}
.lp h1,.lp h2,.lp h3,.hero-h1,.pricing-price{font-family:'Onest',sans-serif}
html{scroll-behavior:smooth}

/* ── Keyframes ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes blink{50%{opacity:0}}
@keyframes wave{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.2)}}
@keyframes marqueeScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes heroStepIn{to{opacity:1;transform:translateX(0)}}
@keyframes msgSlideLeft{from{opacity:0;transform:translateX(-16px)}to{opacity:1;transform:translateX(0)}}
@keyframes msgSlideRight{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@keyframes msgFadeIn{from{opacity:0}to{opacity:1}}
@keyframes trustItemIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ── Scroll animation ── */
.anim{opacity:0;transition:opacity .5s ease,transform .5s ease;transform:translateY(16px)}
.anim.visible{opacity:1;transform:translateY(0)}

/* ── Shared typography ── */
.section-eyebrow{font-size:14px;font-weight:700;line-height:1.2;letter-spacing:2px;text-transform:uppercase;color:#23CC67;margin-bottom:16px}
.sub{font-size:18px;color:#555;margin-bottom:48px;text-align:center;line-height:1.65}

/* Section h2 shared style */
.steps-section h2,.features-section h2,.social-section h2,.testimonials-section h2,.pricing-section h2,.faq-section h2,.fit-section h2{font-size:36px;font-weight:700;line-height:1.2;letter-spacing:-1px;color:#0F2C38;margin-bottom:8px;text-align:center}

/* ── Shared card ── */
.card{background:#fff;border-radius:12px;border:1px solid #e8e8e3;transition:border-color .2s,transform .2s,box-shadow .2s;box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.05)}
.card:hover{border-color:#23CC67;transform:translateY(-4px);box-shadow:0 4px 8px rgba(0,0,0,0.06),0 12px 24px rgba(0,0,0,0.08)}

/* ── Shared circle icons ── */
.check-icon,.pricing-check{width:20px;height:20px;background:#23CC67;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.check-icon svg,.pricing-check svg{width:12px;height:12px}
.x-icon{width:20px;height:20px;background:#fee2e2;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.x-icon svg{width:10px;height:10px}
.check-item--danger{color:#ef4444}

/* ── Buttons ── */
.btn-green{background:#23CC67;color:#fff;padding:12px 28px;border-radius:8px;font-size:16px;font-weight:700;border:none;cursor:pointer;transition:background .2s,transform .15s,box-shadow .15s;text-decoration:none;display:inline-flex;align-items:center}
.btn-green:hover{background:#144B42;box-shadow:0 4px 12px rgba(35,204,103,.3)}
.btn-green-lg{background:#23CC67;color:#fff;padding:16px 32px;border-radius:8px;font-size:16px;font-weight:700;border:none;cursor:pointer;transition:background .2s,transform .15s,box-shadow .15s;text-decoration:none;display:inline-flex;align-items:center}
.btn-green-lg:hover{background:#144B42;box-shadow:0 8px 20px rgba(35,204,103,.35)}
.btn-outline{background:transparent;color:#0F2C38;padding:12px 28px;border-radius:8px;font-size:16px;font-weight:600;border:2px solid #d1d5db;cursor:pointer;transition:border-color .2s,background .2s;text-decoration:none;display:inline-flex;align-items:center}
.btn-outline:hover{border-color:#0F2C38;background:#f9fafb}

/* ── Nav ── */
.lp-nav{background:#fff;border-bottom:1px solid #e8e8e3;height:70px;position:sticky;top:0;z-index:100;box-shadow:0 1px 8px rgba(0,0,0,0.06)}
.lp-nav-inner{max-width:1140px;margin:0 auto;padding:0 40px;height:100%;display:flex;align-items:center;justify-content:space-between}
.lp-nav-logo{display:block;width:auto}
.lp-nav-links{display:flex;gap:28px}
.lp-nav-links a{font-size:16px;color:#555;text-decoration:none;transition:color .2s}
.lp-nav-links a:hover{color:#0F2C38}
.lp-nav-cta{background:#23CC67;color:#fff;padding:12px 20px;border-radius:8px;font-size:16px;font-weight:700;border:none;cursor:pointer;transition:background .2s,transform .15s;text-decoration:none;display:inline-flex;align-items:center}
.lp-nav-cta:hover{background:#144B42}
.lp-nav-right{display:flex;align-items:center;gap:8px}
.lp-nav-menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px;color:#0F2C38;border-radius:8px;transition:background .2s;align-items:center;justify-content:center;position:relative;width:36px;height:36px}
.lp-nav-menu-btn:hover{background:#f4f8f4}
.lp-nav-menu-btn svg{width:24px;height:24px;position:absolute;top:50%;left:50%;transition:opacity .2s,transform .2s}
.lp-menu-open{opacity:1;transform:translate(-50%,-50%) rotate(0deg)}
.lp-menu-close{opacity:0;transform:translate(-50%,-50%) rotate(-90deg)}
.lp-nav-menu-btn.open .lp-menu-open{opacity:0;transform:translate(-50%,-50%) rotate(90deg)}
.lp-nav-menu-btn.open .lp-menu-close{opacity:1;transform:translate(-50%,-50%) rotate(0deg)}
.lp-nav-dropdown{display:none;flex-direction:column;position:absolute;top:60px;left:0;right:0;background:#fff;border-bottom:1px solid #e8e8e3;box-shadow:0 4px 16px rgba(0,0,0,.08);z-index:99}
.lp-nav-dropdown.open{display:flex}
.lp-nav-dropdown a{padding:16px 24px;font-size:16px;font-weight:600;color:#0F2C38;text-decoration:none;border-bottom:1px solid #f3f4f6;transition:background .15s,color .15s}
.lp-nav-dropdown a:last-child{border-bottom:none}
.lp-nav-dropdown a:hover{background:#f4f8f4;color:#23CC67}

/* ── Hero ── */
.hero-section{background:#fff;padding:72px 40px 72px;display:flex;flex-direction:column;align-items:center;text-align:center;max-width:1200px;margin:0 auto}
.hero-center{display:flex;flex-direction:column;align-items:center;width:100%}
.hero-h1{font-size:64px;font-weight:700;line-height:1.05;letter-spacing:-2px;color:#0F2C38;margin-bottom:20px}
.hero-h1 em{font-style:normal;color:#23CC67}
.hero-sub{font-size:18px;color:#555;line-height:1.6;margin-bottom:32px;max-width:800px;text-align:center}
.hero-btns{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:center}
.hero-social-proof{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;margin-top:20px}
.hero-stars{color:#f59e0b;font-size:16px;letter-spacing:2px}
.hero-social-text{font-size:14px;color:#6b7280}
.hero-h1 .typed-wrap{display:block;color:#23CC67;min-height:1.05em}
.typed-cursor{display:inline-block;width:3px;height:0.85em;background:#23CC67;margin-left:4px;vertical-align:-8%;animation:blink 1s steps(1) infinite;border-radius:1px}
.hero-bottom{position:relative;width:100%;max-width:1200px;margin-top:48px}
.hero-photo-col{position:relative;border-radius:16px;overflow:hidden;min-height:500px;width:100%;isolation:isolate}
.hero-photo{position:absolute;inset:0;border-radius:0;overflow:hidden;isolation:isolate}
.hero-photo::after{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(15,44,54,0) 30%,rgba(15,44,54,0.5) 100%);z-index:2}
.hero-photo::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(35,204,103,0.10),transparent 50%);z-index:3}
.hero-img-static{position:absolute;inset:0;background-size:110%;background-position:100% center;z-index:1;background-repeat: no-repeat;}
.hero-badge{position:absolute;top:22px;left:22px;z-index:4;background:rgba(255,255,255,0.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:10px 14px;border-radius:999px;display:flex;align-items:center;gap:8px;font-weight:600;font-size:13px;color:#0F2C38;box-shadow:0 8px 24px rgba(15,44,54,0.18)}
.hero-badge .live-dot{width:8px;height:8px;border-radius:50%;background:#23CC67;animation:pulse 2s ease-in-out infinite}
.hero-flow-card{position:absolute;right:32px;bottom:32px;width:308px;background:rgba(255,255,255,0.94);backdrop-filter:blur(32px) saturate(180%);-webkit-backdrop-filter:blur(32px) saturate(180%);border-radius:20px;box-shadow:0 1px 1px rgba(0,0,0,0.03),0 4px 12px rgba(0,0,0,0.07),0 16px 40px rgba(0,0,0,0.12),0 0 0 0.5px rgba(0,0,0,0.06);overflow:hidden;border:1px solid rgba(0,0,0,0.06);z-index:5}
.hero-flow-header{display:flex;align-items:center;justify-content:space-between;padding:11px 14px 10px;border-bottom:1px solid rgba(0,0,0,0.06);background:rgba(248,248,248,0.9)}
.hero-flow-brand{display:flex;align-items:center;gap:7px}
.hero-flow-brand-mark{width:20px;height:20px;border-radius:6px;background:#23CC67;display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}
.hero-flow-title{font-size:12px;color:#6b7280;font-weight:600;letter-spacing:-0.1px}
.hero-flow-live{display:flex;align-items:center;gap:4px;font-size:10px;font-weight:700;letter-spacing:0.3px;color:#16a34a;text-transform:uppercase;background:rgba(22,163,74,0.08);padding:3px 8px;border-radius:100px;border:1px solid rgba(22,163,74,0.15)}
.hero-flow-live-dot{width:5px;height:5px;border-radius:50%;background:#23CC67;animation:pulse 2s ease-in-out infinite;flex-shrink:0}
.hero-flow-body{padding:6px 8px 8px;display:flex;flex-direction:column;gap:1px;position:relative}
.hero-flow-body::before{content:'';position:absolute;left:28px;top:20px;bottom:52px;width:1px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.06) 15%,rgba(0,0,0,0.06) 85%,rgba(0,0,0,0))}
.hero-flow-ai-bridge{display:flex;align-items:center;gap:5px;padding:2px 10px 2px 48px;font-size:9.5px;font-weight:600;color:#16a34a;letter-spacing:0.02em;opacity:0;animation:heroStepIn .4s ease forwards;animation-delay:.65s}
.hero-flow-step{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:12px;background:transparent;opacity:0;transform:translateX(-8px);animation:heroStepIn .55s cubic-bezier(.22,.68,0,1.2) forwards;transition:background .15s}
.hero-flow-step:hover{background:rgba(0,0,0,0.03)}
.hero-flow-step:nth-child(1){animation-delay:.3s}
.hero-flow-step:nth-child(3){animation-delay:1.0s}
.hero-flow-step:nth-child(4){animation-delay:1.7s}
.hero-flow-step:nth-child(5){animation-delay:2.4s}
.hero-flow-step:nth-child(6){animation-delay:3.1s}
.hero-flow-ico{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;z-index:1}
.hero-flow-ico.red{background:rgba(254,242,242,0.9);color:#dc2626;box-shadow:inset 0 0 0 0.5px rgba(220,38,38,0.12)}
.hero-flow-ico.green{background:rgba(240,253,244,0.9);color:#16a34a;box-shadow:inset 0 0 0 0.5px rgba(22,163,74,0.12)}
.hero-flow-ico.amber{background:rgba(255,251,235,0.9);color:#d97706;box-shadow:inset 0 0 0 0.5px rgba(217,119,6,0.12)}
.hero-flow-ico.deep{background:rgba(232,240,238,0.9);color:#0f6151;box-shadow:inset 0 0 0 0.5px rgba(15,97,81,0.12)}
.hero-flow-ico.purple{background:rgba(241,238,255,0.9);color:#7c3aed;box-shadow:inset 0 0 0 0.5px rgba(124,58,237,0.12)}
.hero-flow-text{flex:1;min-width:0;text-align:left}
.hero-flow-text .desc{font-size:12.5px;font-weight:600;color:#0F2C38;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-0.15px;line-height:1.2}
.hero-flow-text .label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;color:#b0b7c3;margin-top:2px}
.hero-flow-time{font-size:10px;color:#c0c7d4;font-variant-numeric:tabular-nums;letter-spacing:0;flex-shrink:0}
.hero-flow-footer{border-top:1px solid #e8f5ee;background:linear-gradient(135deg,#f0fdf4,#f8faff);padding:10px 12px}
.hff-row{display:flex;align-items:center;gap:9px}
.hff-icon{width:28px;height:28px;border-radius:8px;background:rgba(35,204,103,0.12);color:#16a34a;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid rgba(35,204,103,0.18)}
.hff-text{flex:1;min-width:0;text-align:left}
.hff-label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:0.07em;color:#9ca3af}
.hff-amount{font-size:17px;font-weight:800;color:#16a34a;font-family:'Onest',sans-serif;line-height:1.15;letter-spacing:-0.5px}
.hff-badge{font-size:10px;font-weight:700;color:#16a34a;background:rgba(22,163,74,0.08);border:1px solid rgba(22,163,74,0.18);padding:3px 9px;border-radius:100px;white-space:nowrap;flex-shrink:0}

/* ── Marquee ── */
.marquee-section{background:transparent;padding:20px 0;overflow:hidden;position:relative;width:100%}
.marquee-label{text-align:center;font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#9ca3af;margin-bottom:32px}
.marquee-viewport{overflow:hidden;position:relative}
.marquee-track{display:flex;width:max-content;animation:marqueeScroll 36s linear infinite}
.marquee-track:hover{animation-play-state:paused}
.marquee-item{display:flex;align-items:center;gap:10px;padding:0 36px;white-space:nowrap}
.marquee-divider{width:1px;height:32px;background:#e8e8e3;flex-shrink:0}
.marquee-name{font-size:15px;font-weight:600;color:#9ca3af;letter-spacing:-0.2px}
.marquee-fade{position:absolute;top:0;bottom:0;width:180px;z-index:2;pointer-events:none}
.marquee-fade.left{left:0;background:linear-gradient(to right,#f4f8f4 40%,transparent)}
.marquee-fade.right{right:0;background:linear-gradient(to left,#f4f8f4 40%,transparent)}

/* ── Trust band ── */
.trust-band{background:#f4f8f4;padding:20px 0;border-top:1px solid #efefeb}
.trust-track{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap;max-width:1100px;margin:0 auto}
.trust-item{display:flex;align-items:center;gap:8px;padding:8px 28px;white-space:nowrap;color:#555;font-size:14px;font-weight:600;border-right:1px solid #e8e8e3;opacity:0;animation:trustItemIn .4s ease forwards;transition:color .2s}
.trust-item:nth-child(1){animation-delay:.1s}
.trust-item:nth-child(2){animation-delay:.2s}
.trust-item:nth-child(3){animation-delay:.3s}
.trust-item:nth-child(4){animation-delay:.4s}
.trust-item:nth-child(5){animation-delay:.5s}
.trust-item:last-child{border-right:none}
.trust-item:hover{color:#0F2C38}
.trust-item:hover .trust-item-icon{transform:scale(1.15)}
.trust-item-icon{width:20px;height:20px;flex-shrink:0;color:#23CC67;transition:transform .2s ease}

/* ── Two-column layout ── */
.two-col{padding:80px 40px;max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.two-col.flip{direction:rtl}
.two-col.flip>*{direction:ltr}
.two-col h2{font-size:36px;font-weight:700;line-height:1.2;letter-spacing:-1px;color:#0F2C38;margin-bottom:16px}
.two-col h2 em{font-style:normal;color:#23CC67}
.two-col p{font-size:18px;color:#555;line-height:1.65;margin-bottom:24px}
.check-list{display:flex;flex-direction:column;gap:8px;margin-bottom:28px}
.check-item{display:flex;align-items:flex-start;gap:8px;font-size:18px;color:#333;line-height:1.5}
.panel-dark{background:#0F2C38;border-radius:16px;padding:20px;border:1px solid #374151}
.panel-light{background:#fff;border-radius:16px;padding:20px;border:1px solid #e8e8e3;box-shadow:0 1px 3px rgba(0,0,0,0.04),0 6px 20px rgba(0,0,0,0.07)}

/* ── Steps ── */
.steps-section{background:#f4f8f4;padding:72px 40px;text-align:center;border-top:1px solid #efefeb}
.steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1100px;margin:0 auto}
.step-card{padding:28px 20px;text-align:left}
.step-num{width:36px;height:36px;background:#23CC67;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;color:#fff;margin-bottom:16px}
.step-card h3,.feat-card h3{font-size:16px;font-weight:800;line-height:1.2;color:#0F2C38;margin-bottom:8px}
.step-card p,.feat-card p{font-size:18px;color:#666;line-height:1.6}

/* ── Features ── */
.features-section{background:#fff;padding:72px 40px}
.features-section h2{margin-bottom:32px}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1100px;margin:0 auto}
.feat-card{padding:24px}
.feat-icon{width:40px;height:40px;background:#f0fdf4;border-radius:8px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border:1px solid #bbf7d0}
.feat-icon svg{width:20px;height:20px}

/* ── Before / after ── */
.social-section{background:#f4f8f4;padding:72px 40px;text-align:center;border-top:1px solid #efefeb}
.before-after{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ba-card{border-radius:12px;padding:28px;border:1px solid #e8e8e3;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(0,0,0,0.06)}
.ba-card.after{border-color:#23CC67;background:#f0fdf4;box-shadow:0 1px 3px rgba(35,204,103,0.06),0 4px 16px rgba(35,204,103,0.10)}
.ba-label{font-size:14px;font-weight:700;line-height:1.2;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px}
.ba-label.before{color:#ef4444}
.ba-label.after{color:#23CC67}
.ba-list{display:flex;flex-direction:column;gap:8px}
.ba-row{display:flex;align-items:center;gap:8px;font-size:16px;color:#333}
.ba-x{width:16px;height:16px;background:#fee2e2;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ba-x svg,.ba-check svg{width:8px;height:8px}
.ba-check{width:16px;height:16px;background:#23CC67;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}

/* ── Testimonials ── */
.testimonials-section{background:#f4f8f4;padding:72px 40px;border-top:1px solid #efefeb;text-align:center}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1100px;margin:0 auto}
.testi-card{background:#0F2C38;border-radius:16px;padding:28px 24px;border:1px solid rgba(255,255,255,0.1);display:flex;flex-direction:column;gap:16px;transition:border-color .2s,transform .2s,box-shadow .2s;box-shadow:0 1px 3px rgba(0,0,0,0.15),0 4px 20px rgba(0,0,0,0.25)}
.testi-card:hover{border-color:#23CC67;transform:translateY(-4px);box-shadow:0 4px 12px rgba(0,0,0,0.25),0 16px 40px rgba(0,0,0,0.35),0 0 0 1px rgba(35,204,103,0.3)}
.testi-stars{color:#f59e0b;font-size:16px;letter-spacing:2px}
.testi-quote{font-size:18px;color:rgba(255,255,255,0.75);line-height:1.65;flex:1}
.testi-quote::before{content:'\201C';font-size:36px;color:#23CC67;line-height:0;vertical-align:-12px;margin-right:4px;font-family:Georgia,serif}
.testi-author{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,0.1)}
.testi-name{font-size:14px;font-weight:700;color:#fff}


/* ── Stat boxes (problem section) ── */
.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.stat-box{background:#fff;border-radius:12px;padding:22px 20px;border:1px solid #dcfce7;box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 12px rgba(35,204,103,0.07);transition:transform .2s,box-shadow .2s}
.stat-box:hover{transform:translateY(-3px);box-shadow:0 4px 8px rgba(0,0,0,0.05),0 12px 24px rgba(35,204,103,0.12)}
.stat-box .num{font-size:38px;font-weight:900;color:#23CC67;line-height:1}
.stat-box .lbl{font-size:14px;color:#555;margin-top:8px;line-height:1.4}

/* ── Invoice mock ── */
.invoice-mock{background:#fff;border-radius:12px;overflow:hidden;border:1px solid #e8e8e3}
.inv-header{background:#23CC67;padding:16px 20px;display:flex;align-items:center;justify-content:space-between}
.inv-header-title{font-size:14px;font-weight:700;color:#fff}
.inv-header-num{font-size:14px;color:rgba(255,255,255,.8)}
.inv-body{padding:16px 20px}
.inv-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #f3f4f6;font-size:14px;color:#555}
.inv-row:last-child{border-bottom:none;font-weight:700;color:#0F2C38}
.inv-send-btn{margin:12px 20px 16px;background:#23CC67;color:#fff;border:none;border-radius:8px;padding:12px;width:calc(100% - 36px);font-size:14px;font-weight:700;cursor:pointer;transition:background .2s}
.inv-send-btn:hover{background:#144B42}

/* ── Pipeline mock ── */
.pipeline-mock{display:flex;flex-direction:column;gap:6px}
.pipe-row{display:flex;align-items:center;gap:8px;background:#fff;border-radius:10px;padding:10px 12px;border:1px solid #e8e8e3;transition:background .2s,border-color .2s}
.pipe-row:hover{background:#f0fdf4;border-color:#bbf7d0}
.pipe-label{font-size:14px;color:#374151;flex:1;font-weight:500}
.pipe-bar-wrap{width:80px;background:#e5e7eb;border-radius:100px;height:4px;overflow:hidden}
.pipe-bar{height:100%;background:#23CC67;border-radius:100px;transition:width .8s ease}
.pipe-count{font-size:14px;color:#6b7280;min-width:24px;text-align:right;font-weight:600}

/* ── Msg thread ── */
.msg-bubble{border-radius:12px;padding:8px 12px;font-size:14px;line-height:1.4;max-width:80%;margin-bottom:8px}
.msg-bubble.in{background:#fff;color:#334155;align-self:flex-start}
.msg-bubble.out{background:#23CC67;color:#fff;align-self:flex-end;margin-left:auto}
.msg-thread{display:flex;flex-direction:column;gap:4px}
.msg-thread > *{opacity:0}
.msg-thread.animate > *:nth-child(1){--msg-d:.1s}
.msg-thread.animate > *:nth-child(2){--msg-d:.55s}
.msg-thread.animate > *:nth-child(3){--msg-d:1.05s}
.msg-thread.animate > *:nth-child(4){--msg-d:1.55s}
.msg-thread.animate > *:nth-child(5){--msg-d:2.05s}
.msg-thread.animate > *:nth-child(6){--msg-d:2.55s}
.msg-thread.animate > .msg-bubble.in{animation:msgSlideLeft .45s ease-out var(--msg-d,0s) forwards}
.msg-thread.animate > .msg-bubble.out{animation:msgSlideRight .45s ease-out var(--msg-d,0s) forwards}
.msg-thread.animate > div:not(.msg-bubble){animation:msgFadeIn .35s ease var(--msg-d,0s) forwards}

/* ── Pricing ── */
.pricing-section{background:#f4f8f4;padding:72px 40px;text-align:center;border-top:1px solid #efefeb}
.pricing-card{background:#fff;border-radius:16px;padding:44px 40px;max-width:900px;margin:0 auto;border:2px solid #23CC67;position:relative;box-shadow:0 2px 6px rgba(35,204,103,0.06),0 8px 24px rgba(35,204,103,0.12),0 20px 48px rgba(0,0,0,0.08);display:flex;align-items:stretch;gap:0}
.pricing-badge{position:absolute;top:-16px;left:50%;transform:translateX(-50%);background:#23CC67;color:#fff;font-size:14px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:4px 20px;border-radius:100px;white-space:nowrap}
.pricing-left{display:flex;flex-direction:column;flex-shrink:0;width:240px;text-align:center;justify-content:center}
.pricing-price{font-size:72px;font-weight:900;color:#0F2C38;line-height:1;margin-bottom:4px}
.pricing-price span{font-size:20px;font-weight:600;color:#6b7280}
.pricing-per{font-size:16px;color:#6b7280;margin-bottom:8px}
.pricing-trial{font-size:14px;font-weight:700;color:#23CC67;margin-bottom:24px}
.pricing-divider{width:1px;background:#e8e8e3;margin:0 36px;flex-shrink:0;align-self:stretch}
.pricing-right{flex:1;min-width:0}
.pricing-feat-list{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px;text-align:left}
.pricing-feat-item{display:flex;align-items:center;gap:8px;font-size:15px;color:#333}

/* ── Fit section ── */
.fit-section{background:#fff;padding:72px 40px;border-top:1px solid #efefeb}
.fit-section-inner{max-width:1100px;margin:0 auto}
.fit-check-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:760px;margin:0 auto}
.fit-check-card{border-radius:16px;padding:32px 28px;border:2px solid #e8e8e3;background:#fff}
.fit-check-card.yes{border-color:#23CC67;background:#f0fdf4}
.fit-check-card h3{font-size:16px;font-weight:800;margin-bottom:16px;color:#0F2C38}
.fit-check-card.yes h3{color:#144B42}
.fit-check-card.no h3{color:#9ca3af}
.fit-check-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.fit-check-list li{padding:12px 0;border-top:1px solid #f3f4f6;font-size:16px;font-weight:700;color:#333}
.fit-check-card.yes .fit-check-list li{border-color:rgba(35,204,103,.2)}
.fit-check-card.no .fit-check-list li{color:#6b7280}

/* ── FAQ ── */
.faq-section{background:#f4f8f4;padding:72px 40px;border-top:1px solid #efefeb;text-align:center}
.faq-list{max-width:720px;margin:0 auto;text-align:left}
.faq-item{border-bottom:1px solid #e8e8e3}
.faq-item:first-child{border-top:1px solid #e8e8e3}
.faq-q{display:flex;align-items:center;justify-content:space-between;padding:20px 0;cursor:pointer;font-size:16px;font-weight:700;color:#0F2C38;gap:16px;user-select:none}
.faq-q:hover{color:#23CC67}
.faq-chevron{width:20px;height:20px;flex-shrink:0;transition:transform .25s;color:#6b7280}
.faq-item.open .faq-chevron{transform:rotate(180deg)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}
.faq-item.open .faq-a{max-height:200px}
.faq-a-inner{padding-bottom:20px;font-size:18px;color:#555;line-height:1.7}

/* ── CTA footer ── */
.cta-footer{background:#0F2C38;padding:112px 40px;text-align:center}
.cta-footer h2{font-size:52px;font-weight:700;line-height:1.1;letter-spacing:-1.5px;color:#fff;margin-bottom:16px;max-width:760px;margin-left:auto;margin-right:auto}
.cta-footer h2 em{font-style:normal;color:#23CC67}
.cta-footer p{font-size:18px;color:rgba(255,255,255,.6);margin-bottom:36px;max-width:480px;margin-left:auto;margin-right:auto}
.cta-footer-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta-footer .btn-green-lg:hover{background:#fff;color:#23CC67;box-shadow:0 8px 20px rgba(35,204,103,.35)}

/* ── Footer ── */
.lp-footer-bar{background:#0F2C38}
.lp-footer-inner{max-width:1140px;margin:0 auto;padding:20px 40px;display:flex;align-items:center;justify-content:space-between}
.lp-footer-logo{display:block;width:auto}
.lp-footer-copy{font-size:14px;color:#ffffff50}

/* ── Phone mockup ── */
.phone-wrap{display:flex;align-items:center;justify-content:center;overflow:visible}
.phone-frame{width:210px;background:#fff;border-radius:36px;border:5px solid #e2e2e2;box-shadow:0 2px 0 #fff inset,0 16px 48px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.06);overflow:hidden;flex-shrink:0}
.phone-notch{width:60px;height:18px;background:#f8f8f8;border-radius:0 0 12px 12px;margin:0 auto}
.phone-screen{background:#fff;display:flex;flex-direction:column}
.phone-status{display:flex;justify-content:space-between;align-items:center;padding:3px 14px 0;font-size:9px;font-weight:700;color:#0F2C38;letter-spacing:.1px}
.phone-call-bar{background:#f0fdf4;padding:10px 14px 8px;display:flex;align-items:center;gap:8px;border-bottom:1px solid #dcfce7}
.phone-avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,#23CC67,#144B42);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.phone-caller-info{flex:1;min-width:0}
.phone-caller-name{font-size:11px;font-weight:700;color:#14532d;letter-spacing:-.2px}
.phone-call-label{font-size:9px;color:#144B42;display:flex;align-items:center;gap:3px;margin-top:1px}
.phone-live-dot{width:5px;height:5px;border-radius:50%;background:#23CC67;animation:pulse 1.8s ease-in-out infinite;flex-shrink:0}
.phone-call-timer{font-size:10px;font-weight:700;color:#144B42;font-variant-numeric:tabular-nums}
.audio-wave{display:flex;align-items:center;justify-content:center;gap:2px;padding:8px 14px;background:#f0fdf4;border-bottom:1px solid #dcfce7}
.audio-wave span{display:block;width:3px;border-radius:2px;background:#23CC67;animation:wave 1.2s ease-in-out infinite}
.audio-wave span:nth-child(1){height:5px;animation-delay:0s}
.audio-wave span:nth-child(2){height:10px;animation-delay:.1s}
.audio-wave span:nth-child(3){height:18px;animation-delay:.2s}
.audio-wave span:nth-child(4){height:22px;animation-delay:.15s}
.audio-wave span:nth-child(5){height:14px;animation-delay:.25s}
.audio-wave span:nth-child(6){height:20px;animation-delay:.05s}
.audio-wave span:nth-child(7){height:10px;animation-delay:.3s}
.audio-wave span:nth-child(8){height:16px;animation-delay:.1s}
.audio-wave span:nth-child(9){height:8px;animation-delay:.2s}
.phone-chat{display:flex;flex-direction:column;gap:5px;padding:8px 10px 10px;background:#fff}
.phone-bubble{font-size:10.5px;line-height:1.45;padding:6px 9px;border-radius:14px;max-width:80%}
.phone-bubble.caller{background:#f1f5f9;color:#334155;align-self:flex-start;border-bottom-left-radius:3px}
.phone-bubble.ai{background:#23CC67;color:#fff;align-self:flex-end;margin-left:auto;border-bottom-right-radius:3px}
.phone-typing-dots{display:flex;gap:3px;align-items:center;padding:6px 9px;background:#f1f5f9;border-radius:14px;border-bottom-left-radius:3px;width:fit-content}
.phone-typing-dots span{width:4px;height:4px;background:#94a3b8;border-radius:50%;animation:pulse 1.2s infinite}
.phone-typing-dots span:nth-child(2){animation-delay:.2s}
.phone-typing-dots span:nth-child(3){animation-delay:.4s}
.phone-controls{display:flex;justify-content:space-around;align-items:center;padding:8px 14px 12px;background:#fff;border-top:1px solid #f1f5f9}
.phone-ctrl-btn{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;background:#f1f5f9;cursor:default}
.phone-ctrl-btn.hangup{background:#fee2e2;font-size:16px}
.phone-scene{position:relative;display:inline-flex;padding:28px 96px 52px}
.phone-chat > *{opacity:0}
.phone-chat.animate > *:nth-child(1){animation:msgSlideLeft .4s ease-out .2s forwards}
.phone-chat.animate > *:nth-child(2){animation:msgSlideRight .4s ease-out .8s forwards}
.phone-chat.animate > *:nth-child(3){animation:msgSlideLeft .4s ease-out 1.4s forwards}
.phone-chat.animate > *:nth-child(4){animation:msgSlideRight .4s ease-out 2.0s forwards}
.phone-chat.animate > *:nth-child(5){animation:msgFadeIn .35s ease 2.6s forwards}

/* ── Tablet: 768–1024px ── */
@media(max-width:1024px)and(min-width:768px){
  .lp-nav-links{display:none}
  .lp-nav-menu-btn{display:flex}
  .lp-nav-inner{padding:0 32px}

  .hero-section{padding:48px 32px 40px}
  .hero-h1{font-size:52px}
  .hero-photo-col{min-height:420px}
  .hero-flow-card{width:280px}

  .trust-band{padding:20px 0}

  .two-col{grid-template-columns:1fr;gap:32px;padding:56px 32px}
  .two-col.flip{direction:ltr}
  .two-col h2{font-size:32px}

  .steps-section,.features-section,.social-section,.pricing-section,.faq-section,.fit-section{padding:56px 32px}
  .testimonials-section{padding:56px 32px}
  .steps-section h2,.features-section h2,.social-section h2,.testimonials-section h2,.pricing-section h2,.faq-section h2,.fit-section h2{font-size:32px}
  .cta-footer h2{font-size:44px}

  .steps-grid{grid-template-columns:repeat(2,1fr)}
  .features-grid{grid-template-columns:repeat(2,1fr)}
  .before-after{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:repeat(2,1fr)}

.pricing-card{max-width:100%}
  .pricing-left{width:210px}
  .pricing-divider{margin:0 28px}

  .cta-footer{padding:80px 32px}
  .lp-footer-inner{padding:16px 32px}
  .phone-scene{padding:22px 72px 44px}
}

/* ── Mobile: ≤767px ── */
@media(max-width:767px){
  .lp-nav-links{display:none}
  .lp-nav-menu-btn{display:flex}
  .lp-nav-inner{padding:0 20px}
  .lp-nav-cta{font-size:12px}

  .hero-section{padding:40px 20px 32px}
  .hero-h1{font-size:40px;letter-spacing:-1.5px}
  .hero-h1 .typed-wrap{height:2.1em;min-height:unset}
  .hero-social-proof{flex-direction:column;gap:4px}
  .hero-bottom{margin-top:32px;display:flex;flex-direction:column}
  .hero-photo-col{min-height:240px;border-radius:16px 16px 0 0}
  .hero-img-static{background-size: 150%; background-position: 50%;}
  .hero-flow-card{position:static;width:100%;right:auto;bottom:auto;border-radius:0 0 16px 16px;backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}
  .hero-badge{font-size:10px;padding:7px 10px;gap:6px;top: 10px;left: 10px;}

  .trust-band{padding:16px 0}
  .trust-track{flex-direction:column;align-items:stretch;gap:8px}
  .trust-item{padding:8px 16px;font-size:12px;border-right:none;border-bottom:none;justify-content:center}

  .two-col{grid-template-columns:1fr;gap:24px;padding:48px 20px;text-align:center}
  .two-col.flip{direction:ltr}
  .two-col h2{font-size:28px}
  .check-list,.check-item{text-align:left}

  .steps-section,.features-section,.social-section,.pricing-section,.faq-section,.fit-section{padding:48px 20px}
  .testimonials-section{padding:48px 20px}
  .steps-section h2,.features-section h2,.social-section h2,.testimonials-section h2,.pricing-section h2,.faq-section h2,.fit-section h2{font-size:28px}
  .cta-footer h2{font-size:36px}

  .steps-grid{grid-template-columns:1fr;gap:16px}
  .step-card{text-align:center}
  .step-num{margin-left:auto;margin-right:auto}

  .features-grid{grid-template-columns:1fr}
  .feat-card{text-align:center}
  .feat-icon{margin-left:auto;margin-right:auto}

  .before-after{grid-template-columns:1fr}
  .ba-card{text-align:center}
  .ba-list,.ba-row{text-align:left}

  .testimonials-grid{grid-template-columns:1fr}
  .testi-card{text-align:center}
  .testi-author{justify-content:center}

.pricing-card{padding:32px 24px;flex-direction:column}
  .pricing-left{width:100%;text-align:center}
  .pricing-divider{width:100%;height:1px;margin:24px 0;align-self:auto}
  .pricing-price{font-size:56px}
  .pricing-feat-list{grid-template-columns:1fr}
  .pricing-feat-list,.pricing-feat-item{text-align:left}

  .fit-check-grid{grid-template-columns:1fr !important}
  .fit-check-card{text-align:center}
  .fit-check-list,.fit-check-list li{text-align:left}

  .cta-footer{padding:72px 20px}
  .cta-footer-btns{flex-direction:column;align-items:center}
  .lp-footer-inner{padding:16px 20px;flex-direction:column;gap:8px;text-align:center}

  .msg-bubble{text-align:left}
  .phone-bubble{text-align:left}
  .phone-scene{padding:52px 12px 48px}
  .marquee-fade{width:100px}

  .sub,.hero-sub,.two-col p,.check-item,.step-card p,.feat-card p,.testi-quote,.faq-a-inner,.cta-footer p{font-size:16px}
}
