@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap";:root{--primary: #0891B2;--primary-light: #06B6D4;--primary-dark: #0E7490;--accent: #EC4899;--accent-light: #F472B6;--white: #FFFFFF;--off-white: #F8FAFC;--light-gray: #F1F5F9;--gray-100: #E2E8F0;--gray-200: #CBD5E1;--gray-400: #94A3B8;--gray-600: #475569;--gray-800: #1E293B;--gray-900: #0F172A;--success: #10B981;--warning: #F59E0B;--gradient: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);--gradient-soft: linear-gradient(135deg, rgba(8, 145, 178, .1) 0%, rgba(236, 72, 153, .1) 100%)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,sans-serif;background-color:var(--white);color:var(--gray-800);line-height:1.6;overflow-x:hidden}a{text-decoration:none;color:inherit}.container{max-width:1200px;margin:0 auto;padding:0 24px}h1,h2,h3,h4{font-weight:800;line-height:1.2;color:var(--gray-900)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;font-size:15px;font-weight:600;border-radius:12px;cursor:pointer;transition:all .3s ease;border:none;font-family:inherit}.btn-primary{background:var(--gradient);color:#fff;box-shadow:0 4px 20px #0891b259}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #0891b273}.btn-secondary{background:var(--white);color:var(--gray-800);border:2px solid var(--gray-200)}.btn-secondary:hover{border-color:var(--primary);color:var(--primary)}.btn-white{background:var(--white);color:var(--gray-900)}.btn-white:hover{transform:translateY(-2px);box-shadow:0 10px 30px #00000026}.btn-large{padding:18px 36px;font-size:16px}.gradient-text{background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:16px 0;background:#fffc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid transparent;transition:all .3s ease}nav.scrolled{border-bottom-color:var(--gray-100);box-shadow:0 4px 30px #0000000d}.nav-container{display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:800;color:var(--gray-900)}.logo-icon{width:40px;height:40px;background:var(--gradient);border-radius:12px;display:flex;align-items:center;justify-content:center}.logo-icon svg{width:22px;height:22px;stroke:#fff;fill:none}.nav-links{display:flex;align-items:center;gap:36px}.nav-links a{font-size:15px;font-weight:500;color:var(--gray-600);transition:color .3s ease}.nav-links a:hover{color:var(--primary)}.nav-cta{display:flex;align-items:center;gap:12px}.nav-cta .btn{padding:10px 20px}.mobile-toggle{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:5px}.mobile-toggle span{width:24px;height:2px;background:var(--gray-800);border-radius:2px;transition:all .3s ease}.hero{padding:140px 0 100px;position:relative;overflow:hidden}.hero-bg{position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(8,145,178,.08) 0%,transparent 60%),radial-gradient(ellipse 50% 50% at 100% 50%,rgba(236,72,153,.06) 0%,transparent 60%);pointer-events:none}.hero-pattern{position:absolute;top:0;left:0;right:0;bottom:0;background-image:radial-gradient(var(--gray-200) 1px,transparent 1px);background-size:32px 32px;opacity:.5;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.4) 0%,transparent 40%);mask-image:linear-gradient(180deg,rgba(0,0,0,.4) 0%,transparent 40%);pointer-events:none}.hero-content{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}.hero-text{max-width:540px}.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px 8px 10px;background:var(--gradient-soft);border:1px solid rgba(8,145,178,.2);border-radius:50px;font-size:14px;font-weight:600;color:var(--primary-dark);margin-bottom:24px}.hero-badge-dot{width:20px;height:20px;background:var(--gradient);border-radius:50%;display:flex;align-items:center;justify-content:center}.hero-badge-dot svg{width:12px;height:12px;stroke:#fff}.hero h1{font-size:clamp(40px,5vw,56px);margin-bottom:24px;letter-spacing:-1px}.hero p{font-size:18px;color:var(--gray-600);margin-bottom:32px;line-height:1.7}.hero-cta{display:flex;align-items:center;gap:16px;margin-bottom:48px}.hero-social-proof{display:flex;align-items:center;gap:16px}.avatar-stack{display:flex}.avatar-stack .avatar{width:40px;height:40px;border-radius:50%;border:3px solid var(--white);margin-left:-12px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff}.avatar-stack .avatar:first-child{margin-left:0}.avatar-stack .avatar:nth-child(1){background:#6366f1}.avatar-stack .avatar:nth-child(2){background:#ec4899}.avatar-stack .avatar:nth-child(3){background:#0891b2}.avatar-stack .avatar:nth-child(4){background:#f59e0b}.avatar-stack .avatar:nth-child(5){background:var(--gray-100);color:var(--gray-600)}.social-proof-text{font-size:14px;color:var(--gray-600)}.social-proof-text strong{color:var(--gray-900)}.hero-visual{position:relative}.hero-mockup{background:var(--white);border-radius:24px;box-shadow:0 4px 6px #00000005,0 12px 24px #0000000a,0 24px 48px #0000000f;border:1px solid var(--gray-100);overflow:hidden}.mockup-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:var(--off-white);border-bottom:1px solid var(--gray-100)}.mockup-dots{display:flex;gap:8px}.mockup-dot{width:12px;height:12px;border-radius:50%}.mockup-dot.red{background:#ef4444}.mockup-dot.yellow{background:#f59e0b}.mockup-dot.green{background:#10b981}.mockup-url{flex:1;max-width:300px;margin:0 20px;padding:8px 16px;background:var(--white);border-radius:8px;font-size:12px;color:var(--gray-400);border:1px solid var(--gray-100);text-align:center}.mockup-actions{display:flex;gap:8px}.mockup-action{width:28px;height:28px;background:var(--white);border-radius:6px;display:flex;align-items:center;justify-content:center;border:1px solid var(--gray-100)}.mockup-action svg{width:14px;height:14px;stroke:var(--gray-400)}.mockup-body{padding:24px;background:var(--light-gray)}.preview-container{display:grid;grid-template-columns:1fr 280px;gap:20px}.preview-main{background:var(--white);border-radius:16px;padding:20px;border:1px solid var(--gray-100)}.preview-website{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;height:200px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.preview-website:before{content:"";position:absolute;top:20px;left:20px;right:20px;height:8px;background:#ffffff4d;border-radius:4px}.preview-website:after{content:"";position:absolute;top:40px;left:20px;width:60%;height:6px;background:#fff3;border-radius:3px}.comment-marker{position:absolute;width:32px;height:32px;background:var(--accent);border-radius:50% 50% 50% 0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700;box-shadow:0 4px 12px #ec489966;transform:rotate(-45deg)}.comment-marker span{transform:rotate(45deg)}.comment-marker.m1{top:30%;left:20%}.comment-marker.m2{top:60%;left:70%}.comment-marker.m3{top:45%;left:45%}.preview-status{display:flex;align-items:center;justify-content:space-between;margin-top:16px}.status-badge{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#10b9811a;border-radius:20px;font-size:12px;font-weight:600;color:var(--success)}.status-badge:before{content:"";width:6px;height:6px;background:var(--success);border-radius:50%}.preview-version{font-size:12px;color:var(--gray-400)}.preview-sidebar{display:flex;flex-direction:column;gap:16px}.feedback-card{background:var(--white);border-radius:16px;padding:16px;border:1px solid var(--gray-100)}.feedback-header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.feedback-avatar{width:32px;height:32px;border-radius:8px;background:var(--gradient);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff}.feedback-meta{flex:1}.feedback-name{font-size:13px;font-weight:600;color:var(--gray-800)}.feedback-time{font-size:11px;color:var(--gray-400)}.feedback-marker{width:20px;height:20px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff}.feedback-text{font-size:13px;color:var(--gray-600);line-height:1.5}.feedback-actions{display:flex;gap:8px;margin-top:12px}.feedback-action{padding:6px 12px;font-size:11px;font-weight:600;border-radius:6px;cursor:pointer;transition:all .2s ease}.feedback-action.resolve{background:#10b9811a;color:var(--success)}.feedback-action.resolve:hover{background:var(--success);color:#fff}.feedback-action.reply{background:var(--gray-100);color:var(--gray-600)}.feedback-action.reply:hover{background:var(--gray-200)}.floating-notification{position:absolute;bottom:-20px;left:-30px;background:var(--white);border-radius:12px;padding:12px 16px;box-shadow:0 10px 40px #0000001a;border:1px solid var(--gray-100);display:flex;align-items:center;gap:10px;animation:float 3s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.notification-icon{width:36px;height:36px;background:#10b9811a;border-radius:10px;display:flex;align-items:center;justify-content:center}.notification-icon svg{width:18px;height:18px;stroke:var(--success)}.notification-text{font-size:13px;font-weight:600;color:var(--gray-800)}.notification-sub{font-size:11px;color:var(--gray-400)}.trusted{padding:60px 0;background:var(--off-white);border-top:1px solid var(--gray-100);border-bottom:1px solid var(--gray-100)}.trusted-content{text-align:center}.trusted p{font-size:13px;font-weight:600;color:var(--gray-400);text-transform:uppercase;letter-spacing:2px;margin-bottom:32px}.trusted-logos{display:flex;align-items:center;justify-content:center;gap:60px;flex-wrap:wrap}.trusted-logo{display:flex;align-items:center;gap:8px;opacity:.4;transition:opacity .3s ease}.trusted-logo:hover{opacity:.7}.trusted-logo svg{width:24px;height:24px;stroke:var(--gray-600)}.trusted-logo span{font-size:16px;font-weight:700;color:var(--gray-600)}.features{padding:120px 0}.section-header{text-align:center;max-width:600px;margin:0 auto 80px}.section-label{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--primary);text-transform:uppercase;letter-spacing:2px;margin-bottom:16px}.section-title{font-size:clamp(32px,4vw,44px);margin-bottom:20px;letter-spacing:-.5px}.section-subtitle{font-size:18px;color:var(--gray-600);line-height:1.7}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.feature-card{background:var(--white);border-radius:24px;padding:36px;border:1px solid var(--gray-100);transition:all .4s ease}.feature-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #00000014;border-color:var(--primary-light)}.feature-icon{width:60px;height:60px;background:var(--gradient-soft);border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}.feature-icon svg{width:28px;height:28px;stroke:var(--primary)}.feature-card h3{font-size:20px;font-weight:700;margin-bottom:12px}.feature-card p{font-size:15px;color:var(--gray-600);line-height:1.7}.how-it-works{padding:120px 0;background:var(--off-white)}.steps-container{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;position:relative}.steps-container:before{content:"";position:absolute;top:44px;left:12.5%;right:12.5%;height:3px;background:var(--gradient);opacity:.2;border-radius:2px}.step-card{text-align:center;position:relative}.step-number{width:88px;height:88px;background:var(--white);border:3px solid var(--gray-100);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:800;color:var(--gray-400);margin:0 auto 24px;position:relative;z-index:1;transition:all .3s ease}.step-card:hover .step-number{border-color:var(--primary);color:var(--primary);background:var(--gradient-soft);transform:scale(1.1)}.step-card h3{font-size:18px;font-weight:700;margin-bottom:12px}.step-card p{font-size:14px;color:var(--gray-600);line-height:1.6}.pricing{padding:120px 0}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;max-width:1000px;margin:0 auto}.pricing-card{background:var(--white);border-radius:24px;padding:40px;border:1px solid var(--gray-100);position:relative;transition:all .4s ease}.pricing-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px #00000014}.pricing-card.featured{border:2px solid var(--primary);box-shadow:0 20px 40px #0891b226}.pricing-card.featured:before{content:"Most Popular";position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--gradient);color:#fff;padding:6px 20px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.plan-name{font-size:18px;font-weight:600;color:var(--gray-600);margin-bottom:8px}.plan-price{margin-bottom:8px}.price{font-size:48px;font-weight:800;color:var(--gray-900)}.price-currency{font-size:24px;font-weight:700;vertical-align:top;position:relative;top:8px}.price-period{font-size:16px;color:var(--gray-400);font-weight:500}.plan-description{font-size:14px;color:var(--gray-600);margin-bottom:32px;padding-bottom:32px;border-bottom:1px solid var(--gray-100)}.plan-features{list-style:none;margin-bottom:32px}.plan-features li{display:flex;align-items:flex-start;gap:12px;font-size:15px;color:var(--gray-600);margin-bottom:16px}.plan-features li svg{width:20px;height:20px;stroke:var(--success);flex-shrink:0;margin-top:2px}.pricing-card .btn{width:100%}.testimonials{padding:120px 0;background:var(--off-white)}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.testimonial-card{background:var(--white);border-radius:24px;padding:36px;border:1px solid var(--gray-100)}.testimonial-rating{display:flex;gap:4px;margin-bottom:20px}.testimonial-rating svg{width:20px;height:20px;fill:#f59e0b;stroke:#f59e0b}.testimonial-text{font-size:16px;color:var(--gray-600);line-height:1.8;margin-bottom:24px}.testimonial-author{display:flex;align-items:center;gap:14px}.author-avatar{width:48px;height:48px;background:var(--gradient);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff}.author-info h4{font-size:15px;font-weight:700;color:var(--gray-900);margin-bottom:2px}.author-info p{font-size:13px;color:var(--gray-400)}.cta{padding:120px 0}.cta-box{background:var(--gradient);border-radius:32px;padding:80px 60px;text-align:center;position:relative;overflow:hidden}.cta-box:before{content:"";position:absolute;top:-100px;right:-100px;width:300px;height:300px;background:#ffffff1a;border-radius:50%}.cta-box:after{content:"";position:absolute;bottom:-80px;left:-80px;width:250px;height:250px;background:#0000001a;border-radius:50%}.cta-content{position:relative;z-index:1}.cta h2{font-size:clamp(32px,4vw,48px);color:#fff;margin-bottom:20px}.cta p{font-size:18px;color:#ffffffe6;max-width:500px;margin:0 auto 40px}.cta-buttons{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}.btn-outline-white{background:transparent;border:2px solid rgba(255,255,255,.5);color:#fff}.btn-outline-white:hover{background:#ffffff1a;border-color:#fff}footer{padding:80px 0 40px;background:var(--gray-900);color:#fff}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:60px;margin-bottom:60px}.footer-brand .logo{color:#fff;margin-bottom:16px}.footer-brand p{font-size:14px;color:var(--gray-400);max-width:280px;line-height:1.7}.footer-column h4{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:24px;color:#fff}.footer-links{list-style:none}.footer-links li{margin-bottom:14px}.footer-links a{font-size:14px;color:var(--gray-400);transition:color .3s ease}.footer-links a:hover{color:var(--primary-light)}.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:40px;border-top:1px solid rgba(255,255,255,.1)}.footer-bottom p{font-size:14px;color:var(--gray-400)}.social-links{display:flex;gap:12px}.social-link{width:40px;height:40px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:10px;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.social-link:hover{background:var(--primary);border-color:var(--primary)}.social-link svg{width:18px;height:18px;stroke:var(--gray-400)}.social-link:hover svg{stroke:#fff}@media(max-width:1024px){.hero-content{grid-template-columns:1fr;text-align:center}.hero-text{max-width:100%}.hero-cta,.hero-social-proof{justify-content:center}.hero-visual{max-width:600px;margin:40px auto 0}.preview-container{grid-template-columns:1fr}.preview-sidebar{display:none}.features-grid,.pricing-grid,.testimonials-grid{grid-template-columns:1fr;max-width:500px;margin:0 auto}.steps-container{grid-template-columns:repeat(2,1fr);gap:40px}.steps-container:before{display:none}.footer-grid{grid-template-columns:1fr 1fr}}@media(max-width:768px){.nav-links,.nav-cta{display:none}.mobile-toggle{display:flex}.hero{padding:120px 0 60px}.hero h1{font-size:36px}.hero-cta{flex-direction:column}.hero-social-proof{flex-direction:column;text-align:center}.floating-notification{display:none}.steps-container{grid-template-columns:1fr}.cta-box{padding:60px 30px}.footer-grid{grid-template-columns:1fr;gap:40px}.footer-bottom{flex-direction:column;gap:20px;text-align:center}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-in{opacity:1!important;transform:translateY(0)!important}
