:root{--color-primary:#6366F1;--color-primary-dark:#4F46E5;--color-primary-light:#EEF2FF;--color-secondary:#EC4899;--color-accent:#F59E0B;--color-text:#1E1B4B;--color-text-secondary:#4B5563;--color-text-muted:#9CA3AF;--color-bg:#FFFFFF;--color-bg-subtle:#FAFBFF;--color-bg-muted:#F3F4F6;--color-border:#E5E7EB;--color-border-light:#F3F4F6;--color-success:#10B981;--color-warning:#F59E0B;--color-error:#EF4444;--gradient-primary:linear-gradient(135deg,#6366F1 0%,#8B5CF6 50%,#EC4899 100%);--gradient-hero:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(99,102,241,0.15),transparent);--gradient-text:linear-gradient(135deg,#6366F1 0%,#EC4899 100%);--gradient-glow:radial-gradient(circle,rgba(99,102,241,0.15) 0%,transparent 70%);--shadow-xs:0 1px 2px rgba(0,0,0,0.04);--shadow-sm:0 1px 3px rgba(0,0,0,0.06),0 1px 2px rgba(0,0,0,0.04);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.08),0 2px 4px -1px rgba(0,0,0,0.04);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.08),0 4px 6px -2px rgba(0,0,0,0.04);--shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04);--shadow-glow:0 0 60px rgba(99,102,241,0.2);--shadow-card:0 1px 3px rgba(0,0,0,0.04),0 6px 16px rgba(0,0,0,0.06);--shadow-primary:0 4px 14px rgba(99,102,241,0.35);--font-sans:'Inter',system-ui,-apple-system,sans-serif;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:9999px;--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-base:250ms cubic-bezier(0.4,0,0.2,1);--transition-slow:400ms cubic-bezier(0.4,0,0.2,1);--transition-bounce:500ms cubic-bezier(0.34,1.56,0.64,1)}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}
body{font-family:var(--font-sans);color:var(--color-text);background:var(--color-bg);line-height:1.6;overflow-x:hidden}
body.menu-open{overflow:hidden}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}

/* Header */
.header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,0.8);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid transparent;transition:all var(--transition-base)}
.header.scrolled{background:rgba(255,255,255,0.95);border-bottom-color:var(--color-border)}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{display:flex;align-items:center;gap:12px;font-weight:700;font-size:1.35rem;color:var(--color-text);text-decoration:none}
.logo-icon{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0}
.logo-icon svg{width:40px;height:40px}
.logo-image{height:50px;width:auto;object-fit:contain;flex-shrink:0;transition:filter 0.3s ease,transform 0.3s ease}
.logo-image:hover{transform:scale(1.05)}
.dark-mode .logo-image{filter:brightness(0) invert(1)}
.logo-text{font-weight:800;letter-spacing:-0.02em}
.logo-text-accent{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.nav-links{display:flex;align-items:center;gap:8px}
.nav-link{padding:8px 16px;font-weight:500;font-size:0.9rem;color:var(--color-text-secondary);border-radius:var(--radius-md);transition:all var(--transition-fast)}
.nav-link:hover{color:var(--color-text);background:var(--color-bg-muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-sans);font-weight:600;font-size:0.9rem;padding:10px 20px;border-radius:var(--radius-md);border:none;cursor:pointer;transition:all var(--transition-base)}
.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-primary)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(99,102,241,0.4)}
.btn-ghost{background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border)}
.btn-ghost:hover{background:var(--color-bg-muted);color:var(--color-text);border-color:var(--color-border)}
.btn-nav{padding:8px 16px;font-size:0.875rem}
.btn-hero{padding:14px 28px;font-size:0.95rem;border-radius:var(--radius-lg)}
.btn-lg{padding:16px 32px;font-size:1rem}
.btn-full{width:100%}
.btn-arrow{width:18px;height:18px;transition:transform var(--transition-fast)}
.btn:hover .btn-arrow{transform:translateX(4px)}
.btn:hover .btn-arrow{transform:translateX(3px)}
.btn-play{width:14px;height:14px;margin-right:4px}
.mobile-menu-btn{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;background:none;border:none;cursor:pointer;padding:8px}
.mobile-menu-btn span{display:block;width:22px;height:2px;background:var(--color-text);border-radius:2px;transition:all var(--transition-base)}
.mobile-menu-btn.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.mobile-menu-btn.active span:nth-child(2){opacity:0}
.mobile-menu-btn.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.mobile-menu{display:none;position:fixed;top:72px;left:0;right:0;bottom:0;background:var(--color-bg);padding:24px;flex-direction:column;gap:8px;z-index:999}
.mobile-menu.active{display:flex}
.mobile-link{padding:16px;font-weight:600;font-size:1.1rem;color:var(--color-text);border-radius:var(--radius-md)}
.mobile-link:hover{background:var(--color-bg-muted)}
.mobile-cta{margin-top:16px}

/* Hero Section */
.hero{position:relative;padding:160px 0 80px;overflow:hidden;background:linear-gradient(180deg,#FAFBFF 0%,#FFFFFF 100%)}
.hero-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-gradient-mesh{position:absolute;inset:0;background:var(--gradient-hero)}
.hero-grid-pattern{position:absolute;inset:0;background-image:linear-gradient(var(--color-border-light) 1px,transparent 1px),linear-gradient(90deg,var(--color-border-light) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(ellipse 60% 60% at 50% 0%,black 30%,transparent 70%)}
.hero-glow{position:absolute;border-radius:50%;filter:blur(100px);opacity:0.5}
.hero-glow-1{width:700px;height:700px;background:rgba(99,102,241,0.15);top:-250px;left:50%;transform:translateX(-50%)}
.hero-glow-2{width:500px;height:500px;background:rgba(139,92,246,0.12);bottom:-100px;right:-150px}
.hero-glow-3{width:400px;height:400px;background:rgba(236,72,153,0.1);top:20%;left:-100px}
.hero-orb{position:absolute;border-radius:50%;background:var(--gradient-primary);opacity:0.08;animation:float 8s ease-in-out infinite}
.hero-orb-1{width:300px;height:300px;top:10%;right:5%;animation-delay:-2s}
.hero-orb-2{width:200px;height:200px;bottom:20%;left:10%;animation-delay:-4s}
.hero .container{position:relative;z-index:1}
.hero-content{text-align:center;max-width:800px;margin:0 auto 64px}
.hero-badge{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:0.875rem;color:var(--color-text-secondary);margin-bottom:32px;box-shadow:var(--shadow-md);position:relative}
.badge-pulse{position:absolute;left:16px;width:8px;height:8px;background:var(--color-success);border-radius:50%;animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(1.2)}}
.badge-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--gradient-primary);border-radius:50%;margin-left:16px}
.badge-icon svg{width:14px;height:14px;color:#fff}
.badge-text{font-weight:600;color:var(--color-text)}
.badge-arrow{width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:var(--color-primary-light);border-radius:50%;color:var(--color-primary);transition:all var(--transition-fast)}
.badge-arrow svg{width:14px;height:14px}
.hero-badge:hover .badge-arrow{background:var(--color-primary);color:#fff}
.hero-title{font-size:clamp(2.5rem,5.5vw,4.25rem);font-weight:800;line-height:1.1;letter-spacing:-0.03em;color:var(--color-text);margin-bottom:24px}
.title-highlight{position:relative;display:inline-block}
.highlight-text{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.highlight-underline{position:absolute;bottom:-8px;left:0;width:100%;height:12px}
.hero-subtitle{font-size:1.25rem;line-height:1.7;color:var(--color-text-secondary);max-width:600px;margin:0 auto 40px}
.hero-cta-group{display:flex;justify-content:center;gap:16px;margin-bottom:40px;flex-wrap:wrap}
.hero-stats{display:flex;align-items:center;justify-content:center;gap:24px;margin-bottom:40px;padding:20px 32px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-md)}
.hero-stat{text-align:center}
.hero-stat-value{display:block;font-size:1.5rem;font-weight:800;background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-stat-label{font-size:0.75rem;color:var(--color-text-muted);font-weight:500;text-transform:uppercase;letter-spacing:0.05em}
.hero-stat-divider{width:1px;height:32px;background:var(--color-border)}
.hero-trust{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.trust-avatars{display:flex}
.avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:0.8rem;color:#fff;border:3px solid var(--color-bg);margin-left:-10px;box-shadow:var(--shadow-sm)}
.avatar:first-child{margin-left:0}
.avatar-more{background:var(--gradient-primary);color:#fff;font-size:0.65rem;font-weight:700}
.trust-text{display:flex;align-items:center;gap:8px;font-size:0.9rem;color:var(--color-text-secondary)}
.trust-rating{display:flex;gap:2px}
.trust-rating svg{width:16px;height:16px;color:#F59E0B}

/* Hero Visual / Dashboard */
.hero-visual{position:relative;max-width:1100px;margin:0 auto}
.dashboard-wrapper{position:relative}
.dashboard-glow{position:absolute;inset:-20px;background:var(--shadow-glow);border-radius:var(--radius-xl);filter:blur(40px);opacity:0.5}
.dashboard-frame{position:relative;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-xl),0 0 0 1px rgba(0,0,0,0.02)}
.browser-bar{display:flex;align-items:center;gap:16px;padding:12px 16px;background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border)}
.browser-dots{display:flex;gap:6px}
.browser-dots span{width:10px;height:10px;border-radius:50%;background:var(--color-border)}
.browser-dots span:nth-child(1){background:#FF5F57}
.browser-dots span:nth-child(2){background:#FFBD2E}
.browser-dots span:nth-child(3){background:#28CA41}
.browser-url{display:flex;align-items:center;gap:8px;flex:1;padding:6px 12px;background:var(--color-bg);border-radius:var(--radius-md);font-size:0.8rem;color:var(--color-text-muted)}
.browser-url svg{width:14px;height:14px;color:var(--color-success)}
.dashboard-content{display:flex;min-height:320px}
.dash-sidebar{width:56px;background:var(--color-bg-subtle);border-right:1px solid var(--color-border);padding:16px 8px;display:flex;flex-direction:column;align-items:center;gap:8px}
.dash-logo{margin-bottom:16px}
.d-logo{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--gradient-primary);color:#fff;border-radius:var(--radius-sm);font-weight:800;font-size:0.9rem}
.dash-nav{display:flex;flex-direction:column;gap:4px}
.dash-nav-item{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast)}
.dash-nav-item svg{width:18px;height:18px}
.dash-nav-item:hover{background:var(--color-bg);color:var(--color-text-secondary)}
.dash-nav-item.active{background:var(--color-primary-light);color:var(--color-primary)}
.dash-main{flex:1;padding:20px;background:var(--color-bg-subtle)}
.dash-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}
.stat-card{display:flex;align-items:center;gap:12px;padding:14px;background:var(--color-bg);border-radius:var(--radius-lg);border:1px solid var(--color-border)}
.stat-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md)}
.stat-icon svg{width:20px;height:20px}
.stat-icon.blue{background:rgba(0,102,204,0.1);color:var(--color-primary)}
.stat-icon.green{background:rgba(16,185,129,0.1);color:var(--color-success)}
.stat-icon.purple{background:rgba(139,92,246,0.1);color:#8B5CF6}
.stat-info{display:flex;flex-direction:column}
.stat-value{font-weight:700;font-size:1.1rem;color:var(--color-text)}
.stat-label{font-size:0.75rem;color:var(--color-text-muted)}
.stat-trend{font-size:0.75rem;font-weight:600;padding:2px 6px;border-radius:var(--radius-sm);margin-left:auto}
.stat-trend.up{background:rgba(16,185,129,0.1);color:var(--color-success)}
.stat-badge{font-size:0.65rem;font-weight:600;padding:3px 8px;background:rgba(16,185,129,0.1);color:var(--color-success);border-radius:var(--radius-full);margin-left:auto}
.dash-table{background:var(--color-bg);border-radius:var(--radius-lg);border:1px solid var(--color-border);overflow:hidden}
.table-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--color-border);font-weight:600;font-size:0.85rem;color:var(--color-text)}
.table-badge{font-size:0.7rem;font-weight:600;padding:3px 10px;background:var(--color-primary-light);color:var(--color-primary);border-radius:var(--radius-full)}
.table-row{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--color-border-light)}
.table-row:last-child{border-bottom:none}
.row-avatar{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-weight:600;font-size:0.75rem;border-radius:var(--radius-md)}
.row-info{flex:1;display:flex;flex-direction:column}
.row-name{font-weight:600;font-size:0.85rem;color:var(--color-text)}
.row-meta{font-size:0.75rem;color:var(--color-text-muted)}
.row-status{font-size:0.7rem;font-weight:600;padding:4px 10px;border-radius:var(--radius-full)}
.row-status.verified{background:rgba(16,185,129,0.1);color:var(--color-success)}
.row-status.new{background:rgba(0,102,204,0.1);color:var(--color-primary)}

/* Floating Cards */
.floating-card{position:absolute;display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:10}
.floating-card.card-1{top:20%;left:-40px}
.floating-card.card-2{bottom:25%;right:-40px}
.fc-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,0.1);border-radius:var(--radius-md)}
.fc-icon svg{width:20px;height:20px;color:var(--color-success)}
.fc-icon.orange{background:rgba(245,158,11,0.1)}
.fc-icon.orange svg{color:var(--color-warning)}
.fc-text{display:flex;flex-direction:column}
.fc-title{font-weight:600;font-size:0.85rem;color:var(--color-text)}
.fc-desc{font-size:0.75rem;color:var(--color-text-muted)}

/* Social Proof */
.social-proof{padding:48px 0;background:var(--color-bg-subtle);border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}
.proof-label{text-align:center;font-size:0.85rem;color:var(--color-text-muted);margin-bottom:24px}
.proof-logos{display:flex;justify-content:center;align-items:center;gap:48px;flex-wrap:wrap;opacity:0.5}
.proof-logo{height:24px;color:var(--color-text-secondary)}

/* Solutions Section */
.solutions{padding:100px 0;background:var(--color-bg)}
.section-header{text-align:center;max-width:640px;margin:0 auto 56px}
.section-label{display:inline-block;font-weight:600;font-size:0.8rem;text-transform:uppercase;letter-spacing:0.1em;color:var(--color-primary);margin-bottom:12px}
.section-title{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;line-height:1.2;letter-spacing:-0.02em;color:var(--color-text);margin-bottom:16px}
.section-desc{font-size:1.1rem;color:var(--color-text-secondary);line-height:1.6}
.solutions-tabs{max-width:1000px;margin:0 auto}
.tabs-nav{display:flex;justify-content:center;gap:8px;margin-bottom:40px;flex-wrap:wrap}
.tab-btn{display:flex;align-items:center;gap:8px;padding:12px 20px;background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-full);font-family:var(--font-sans);font-weight:500;font-size:0.9rem;color:var(--color-text-secondary);cursor:pointer;transition:all var(--transition-fast)}
.tab-btn svg{width:18px;height:18px}
.tab-btn:hover{background:var(--color-bg-muted);color:var(--color-text)}
.tab-btn.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.tabs-content{position:relative}
.tab-panel{display:none;grid-template-columns:1fr 1fr;gap:48px;align-items:center;padding:40px;background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-xl)}
.tab-panel.active{display:grid}
.panel-content h3{font-size:1.5rem;font-weight:700;color:var(--color-text);margin-bottom:12px}
.panel-content>p{font-size:1rem;color:var(--color-text-secondary);line-height:1.7;margin-bottom:24px}
.panel-features{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:32px}
.panel-features li{display:flex;align-items:center;gap:10px;font-size:0.95rem;color:var(--color-text-secondary)}
.panel-features svg{width:20px;height:20px;color:var(--color-success);flex-shrink:0}
.panel-visual{display:flex;justify-content:center;align-items:center}

/* Code Window */
.code-window{width:100%;background:#1E293B;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.code-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#0F172A}
.code-dot{width:10px;height:10px;border-radius:50%;background:#334155}
.code-dot:nth-child(1){background:#FF5F57}
.code-dot:nth-child(2){background:#FFBD2E}
.code-dot:nth-child(3){background:#28CA41}
.code-title{margin-left:auto;font-size:0.75rem;color:#64748B}
.code-content{padding:20px;font-family:'SF Mono',Monaco,monospace;font-size:0.85rem;line-height:1.8;overflow-x:auto}
.code-content code{color:#E2E8F0}
.code-key{color:#7DD3FC}
.code-string{color:#86EFAC}

/* Data Preview */
.data-preview{width:100%;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}
.data-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);font-size:0.85rem;font-weight:600;color:var(--color-text)}
.data-count{font-weight:500;color:var(--color-text-muted)}
.data-table-preview{font-size:0.8rem}
.data-row{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;padding:10px 16px;border-bottom:1px solid var(--color-border-light)}
.data-row:last-child{border-bottom:none}
.data-row.header{background:var(--color-bg-muted);font-weight:600;color:var(--color-text)}
.data-row span{color:var(--color-text-secondary)}

/* Timeline Visual */
.timeline-visual{display:flex;flex-direction:column;gap:0;padding:32px}
.timeline-item{display:flex;align-items:flex-start;gap:16px;position:relative;padding-bottom:24px}
.timeline-item:last-child{padding-bottom:0}
.timeline-item:not(:last-child)::before{content:'';position:absolute;left:7px;top:20px;bottom:0;width:2px;background:var(--color-border)}
.timeline-dot{width:16px;height:16px;border-radius:50%;background:var(--color-border);flex-shrink:0;position:relative;z-index:1}
.timeline-dot.pulse{background:var(--color-success);animation:pulse-dot 2s infinite}
@keyframes pulse-dot{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,0.4)}50%{box-shadow:0 0 0 8px rgba(16,185,129,0)}}
.timeline-content{display:flex;flex-direction:column}
.timeline-date{font-weight:600;font-size:0.85rem;color:var(--color-text)}
.timeline-text{font-size:0.9rem;color:var(--color-text-secondary)}

/* Pipeline Visual */
.pipeline-visual{display:flex;align-items:center;justify-content:center;gap:12px;padding:40px 20px}
.pipeline-step{display:flex;flex-direction:column;align-items:center;gap:8px}
.pipeline-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-bg);border:2px solid var(--color-border);border-radius:var(--radius-lg)}
.pipeline-icon svg{width:22px;height:22px;color:var(--color-text-muted)}
.pipeline-step span{font-size:0.8rem;font-weight:500;color:var(--color-text-secondary)}
.pipeline-step.active .pipeline-icon{background:rgba(16,185,129,0.1);border-color:var(--color-success)}
.pipeline-step.active .pipeline-icon svg{color:var(--color-success)}
.pipeline-step.active span{color:var(--color-success);font-weight:600}
.pipeline-arrow{font-size:1.2rem;color:var(--color-border)}

/* Why Us Section */
.why-us{padding:100px 0;background:var(--color-bg-subtle)}
.features-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:56px}
.feature-card{padding:32px 24px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);transition:all var(--transition-base)}
.feature-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-card);transform:translateY(-4px)}
.feature-icon-wrap{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-primary-light);border-radius:var(--radius-lg);margin-bottom:20px}
.feature-icon-wrap svg{width:24px;height:24px;color:var(--color-primary)}
.feature-card h3{font-size:1.1rem;font-weight:700;color:var(--color-text);margin-bottom:8px}
.feature-card p{font-size:0.9rem;color:var(--color-text-secondary);line-height:1.6}
.stats-bar{display:flex;justify-content:center;align-items:center;gap:48px;padding:40px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl)}
.stat-item{text-align:center}
.stat-num{display:block;font-size:2.5rem;font-weight:800;background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}
.stat-text{font-size:0.9rem;color:var(--color-text-secondary);margin-top:4px}
.stat-divider{width:1px;height:48px;background:var(--color-border)}

/* Process Section */
.process{padding:100px 0;background:var(--color-bg)}
.process-steps{display:flex;flex-direction:column;gap:0;max-width:900px;margin:0 auto}
.process-step{display:grid;grid-template-columns:auto 1fr 1fr;gap:32px;align-items:center;padding:40px 0}
.step-number{font-size:4rem;font-weight:900;background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;opacity:0.3;line-height:1}
.step-content{display:flex;flex-direction:column;gap:12px}
.step-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-primary-light);border-radius:var(--radius-lg);margin-bottom:8px}
.step-icon svg{width:24px;height:24px;color:var(--color-primary)}
.step-content h3{font-size:1.25rem;font-weight:700;color:var(--color-text)}
.step-content p{font-size:0.95rem;color:var(--color-text-secondary);line-height:1.6}
.step-visual{display:flex;justify-content:center}
.step-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;width:100%;max-width:280px;box-shadow:var(--shadow-md)}
.step-card-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--color-bg-subtle);border-bottom:1px solid var(--color-border);font-size:0.85rem;font-weight:600;color:var(--color-text)}
.step-card-dot{width:8px;height:8px;background:var(--color-success);border-radius:50%}
.step-card-body{padding:16px}
.step-card-field{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--color-border-light);font-size:0.8rem}
.step-card-field:last-child{border-bottom:none}
.step-card-field span:first-child{color:var(--color-text-muted);font-weight:500}
.step-card-field span:last-child{color:var(--color-text);font-weight:600}
.step-progress{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;width:100%;max-width:280px;box-shadow:var(--shadow-md)}
.progress-bar{height:8px;background:var(--color-bg-muted);border-radius:var(--radius-full);overflow:hidden;margin-bottom:12px}
.progress-fill{height:100%;width:96%;background:var(--gradient-primary);border-radius:var(--radius-full);animation:progressPulse 2s ease-in-out infinite}
@keyframes progressPulse{0%,100%{opacity:1}50%{opacity:0.8}}
.progress-stats{display:flex;justify-content:space-between;font-size:0.85rem;margin-bottom:12px}
.progress-stats span:first-child{color:var(--color-text-secondary)}
.progress-percent{font-weight:700;color:var(--color-primary)}
.progress-status{display:flex;align-items:center;gap:8px;font-size:0.8rem;color:var(--color-text-muted)}
.status-dot{width:8px;height:8px;background:var(--color-success);border-radius:50%;animation:pulse 1.5s ease-in-out infinite}
.step-delivery{display:flex;align-items:center;gap:16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;width:100%;max-width:280px;box-shadow:var(--shadow-md)}
.delivery-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:rgba(16,185,129,0.1);border-radius:var(--radius-md)}
.delivery-icon svg{width:24px;height:24px;color:var(--color-success)}
.delivery-info{flex:1;display:flex;flex-direction:column}
.delivery-file{font-weight:600;font-size:0.9rem;color:var(--color-text)}
.delivery-size{font-size:0.75rem;color:var(--color-text-muted)}
.delivery-badge{padding:4px 12px;background:rgba(16,185,129,0.1);color:var(--color-success);border-radius:var(--radius-full);font-size:0.75rem;font-weight:600}
.process-connector{display:flex;justify-content:center;padding:8px 0}
.process-connector svg{width:24px;height:24px;color:var(--color-border);transform:rotate(90deg)}

/* Testimonials Section */
.testimonials{padding:100px 0;background:var(--color-bg-subtle)}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.testimonial-card{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:32px;position:relative;transition:all var(--transition-base)}
.testimonial-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-card);border-color:var(--color-primary-light)}
.testimonial-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-lg);transform:translateY(-4px)}
.testimonial-card.featured{border-color:var(--color-primary);background:linear-gradient(135deg,rgba(99,102,241,0.03) 0%,rgba(236,72,153,0.03) 100%)}
.testimonial-badge{position:absolute;top:16px;right:16px;padding:4px 12px;background:var(--gradient-primary);color:#fff;border-radius:var(--radius-full);font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.05em}
.testimonial-stars{display:flex;gap:2px;margin-bottom:16px}
.testimonial-stars svg{width:18px;height:18px;color:#F59E0B}
.testimonial-quote{font-size:1rem;line-height:1.7;color:var(--color-text-secondary);margin-bottom:24px;font-style:italic}
.testimonial-author{display:flex;align-items:center;gap:12px}
.author-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.9rem;color:#fff}
.author-info{display:flex;flex-direction:column}
.author-name{font-weight:600;font-size:0.95rem;color:var(--color-text)}
.author-role{font-size:0.8rem;color:var(--color-text-muted)}

/* FAQ Section */
.faq{padding:100px 0;background:var(--color-bg)}
.faq-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;max-width:900px;margin:0 auto}
.faq-item{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-fast)}
.faq-item:hover{border-color:var(--color-primary-light);box-shadow:0 2px 8px rgba(99,102,241,0.1)}
.faq-item:hover{border-color:var(--color-primary)}
.faq-item.active{border-color:var(--color-primary);box-shadow:var(--shadow-md)}
.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:none;border:none;font-family:var(--font-sans);font-size:0.95rem;font-weight:600;color:var(--color-text);text-align:left;cursor:pointer;transition:all var(--transition-fast)}
.faq-question:hover{color:var(--color-primary)}
.faq-icon{width:20px;height:20px;color:var(--color-text-muted);transition:transform var(--transition-fast);flex-shrink:0}
.faq-item.active .faq-icon{transform:rotate(180deg);color:var(--color-primary)}
.faq-answer{max-height:0;overflow:hidden;transition:max-height var(--transition-base)}
.faq-item.active .faq-answer{max-height:300px}
.faq-answer p{padding:0 24px 20px;font-size:0.9rem;line-height:1.7;color:var(--color-text-secondary)}

/* Live Activity Popup */
.activity-popup{position:fixed;bottom:24px;left:24px;z-index:1001;transform:translateX(-120%);transition:transform 0.5s cubic-bezier(0.34,1.56,0.64,1);pointer-events:none}
.activity-popup.show{transform:translateX(0);pointer-events:auto}
.activity-content{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);max-width:320px}
.activity-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);color:#fff;font-weight:700;font-size:0.8rem;flex-shrink:0}
.activity-info{display:flex;flex-direction:column;flex:1;min-width:0}
.activity-text{font-size:0.85rem;font-weight:500;color:var(--color-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.activity-time{font-size:0.75rem;color:var(--color-text-muted)}
.activity-close{background:none;border:none;padding:4px;cursor:pointer;color:var(--color-text-muted);transition:color var(--transition-fast)}
.activity-close:hover{color:var(--color-text)}
.activity-close svg{width:16px;height:16px}

/* Live Visitors Badge */
.live-visitors{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:1000;display:flex;align-items:center;gap:8px;padding:10px 16px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-full);box-shadow:var(--shadow-lg);font-size:0.8rem;color:var(--color-text-secondary);animation:slideUp 0.5s ease 1s both}
@keyframes slideUp{from{opacity:0;transform:translateX(-50%) translateY(20px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
.live-visitors svg{width:16px;height:16px;color:var(--color-primary)}
.live-dot{width:8px;height:8px;background:#10B981;border-radius:50%;animation:pulse 2s ease-in-out infinite}
.visitors-count strong{color:var(--color-text);font-weight:700}

/* Trending Badge */
.trending-badge{position:fixed;top:90px;right:24px;z-index:999;display:flex;align-items:center;gap:6px;padding:8px 14px;background:linear-gradient(135deg,#F59E0B 0%,#EF4444 100%);color:#fff;border-radius:var(--radius-full);font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;box-shadow:0 4px 14px rgba(245,158,11,0.4);animation:bounceIn 0.6s ease 2s both}
@keyframes bounceIn{0%{opacity:0;transform:scale(0.3)}50%{transform:scale(1.05)}70%{transform:scale(0.9)}100%{opacity:1;transform:scale(1)}}
.trending-badge svg{width:14px;height:14px}

/* Dark Mode Toggle */
.dark-mode-toggle{position:fixed;bottom:24px;right:24px;z-index:1000;width:52px;height:52px;border-radius:50%;background:var(--color-bg);border:1px solid var(--color-border);box-shadow:var(--shadow-lg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all var(--transition-base)}
.dark-mode-toggle:hover{transform:scale(1.1);box-shadow:var(--shadow-xl)}
.dark-mode-toggle svg{width:22px;height:22px;transition:all var(--transition-base)}
.dark-mode-toggle .sun-icon{color:#F59E0B;display:block}
.dark-mode-toggle .moon-icon{color:var(--color-primary);display:none}
body.dark-mode .dark-mode-toggle .sun-icon{display:none}
body.dark-mode .dark-mode-toggle .moon-icon{display:block}

/* Dark Mode Styles */
body.dark-mode{--color-text:#F9FAFB;--color-text-secondary:#D1D5DB;--color-text-muted:#9CA3AF;--color-bg:#0F0F1A;--color-bg-subtle:#1A1A2E;--color-bg-muted:#252542;--color-border:#374151;--color-border-light:#1F2937;--gradient-hero:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(99,102,241,0.2),transparent)}
body.dark-mode .header{background:rgba(15,15,26,0.9)}
body.dark-mode .header.scrolled{background:rgba(15,15,26,0.95);border-bottom-color:var(--color-border)}
body.dark-mode .hero{background:linear-gradient(180deg,#0F0F1A 0%,#1A1A2E 100%)}
body.dark-mode .hero-orb{opacity:0.15}
body.dark-mode .code-window{background:#0F0F1A}
body.dark-mode .code-header{background:#050510}
body.dark-mode .browser-bar{background:#1A1A2E}
body.dark-mode .dashboard-frame{background:#1A1A2E}
body.dark-mode .dash-sidebar{background:#0F0F1A}
body.dark-mode .dash-main{background:#1A1A2E}
body.dark-mode .stat-card,.dark-mode .dash-table,.dark-mode .step-card,.dark-mode .step-progress,.dark-mode .step-delivery{background:#252542}
body.dark-mode .social-proof{background:#1A1A2E;border-color:var(--color-border)}
body.dark-mode .solutions{background:#0F0F1A}
body.dark-mode .tab-panel{background:#1A1A2E}
body.dark-mode .why-us{background:#1A1A2E}
body.dark-mode .feature-card{background:#252542}
body.dark-mode .stats-bar{background:#252542}
body.dark-mode .process{background:#0F0F1A}
body.dark-mode .testimonials{background:#1A1A2E}
body.dark-mode .testimonial-card{background:#252542}
body.dark-mode .testimonial-card.featured{background:linear-gradient(135deg,rgba(99,102,241,0.1) 0%,rgba(236,72,153,0.1) 100%)}
body.dark-mode .faq{background:#0F0F1A}
body.dark-mode .faq-item{background:#252542}
body.dark-mode .cta{background:#1A1A2E}
body.dark-mode .cta-form-wrapper{background:#252542}
body.dark-mode .form-group input,body.dark-mode .form-group textarea{background:#1A1A2E}
body.dark-mode .footer{background:#0F0F1A}
body.dark-mode .activity-content,body.dark-mode .live-visitors,body.dark-mode .dark-mode-toggle{background:#252542}
body.dark-mode .logo-text-accent{background:var(--gradient-text);-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* Urgency Banner */
.urgency-banner{position:fixed;top:0;left:0;right:0;z-index:1002;background:linear-gradient(90deg,#6366F1 0%,#8B5CF6 50%,#EC4899 100%);padding:10px 16px;transform:translateY(-100%);transition:transform 0.4s ease;display:flex;align-items:center;justify-content:center}
.urgency-banner.show{transform:translateY(0)}
.urgency-content{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center}
.urgency-fire{font-size:1.2rem;animation:shake 0.5s ease infinite}
@keyframes shake{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
.urgency-text{color:#fff;font-size:0.9rem}
.urgency-countdown{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,0.9);font-size:0.85rem}
.countdown-timer{display:flex;align-items:center;gap:4px}
.countdown-block{display:flex;flex-direction:column;align-items:center;background:rgba(0,0,0,0.2);padding:4px 8px;border-radius:4px;min-width:40px}
.countdown-block span{font-weight:700;font-size:1rem;color:#fff;line-height:1}
.countdown-block small{font-size:0.6rem;color:rgba(255,255,255,0.8);text-transform:uppercase}
.countdown-sep{font-weight:700;color:#fff}
.urgency-cta{padding:6px 16px;background:#fff;color:#6366F1;font-weight:600;font-size:0.8rem;border-radius:var(--radius-full);text-decoration:none;transition:all var(--transition-fast)}
.urgency-cta:hover{transform:scale(1.05);box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.urgency-close{background:none;border:none;color:rgba(255,255,255,0.8);cursor:pointer;padding:4px;position:absolute;right:16px;transition:color var(--transition-fast)}
.urgency-close:hover{color:#fff}
.urgency-close svg{width:18px;height:18px}
body.has-urgency-banner .header{top:44px}
body.has-urgency-banner .mobile-menu{top:116px}
body.has-urgency-banner .trending-badge{top:134px}

/* Exit Intent Popup */
.exit-popup-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.7);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;visibility:hidden;transition:all 0.3s ease}
.exit-popup-overlay.show{opacity:1;visibility:visible}
.exit-popup{background:var(--color-bg);border-radius:var(--radius-xl);max-width:600px;width:100%;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;box-shadow:0 25px 50px rgba(0,0,0,0.25);transform:scale(0.9) translateY(20px);transition:transform 0.3s ease}
.exit-popup-overlay.show .exit-popup{transform:scale(1) translateY(0)}
.exit-popup-close{position:absolute;top:16px;right:16px;background:var(--color-bg-muted);border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--color-text-muted);transition:all var(--transition-fast);z-index:1}
.exit-popup-close:hover{background:var(--color-border);color:var(--color-text)}
.exit-popup-close svg{width:16px;height:16px}
.exit-popup-content{padding:40px;display:flex;flex-direction:column;justify-content:center}
.exit-popup-badge{display:inline-block;padding:6px 12px;background:linear-gradient(135deg,#FEF3C7,#FDE68A);color:#92400E;font-size:0.7rem;font-weight:700;border-radius:var(--radius-full);margin-bottom:16px;letter-spacing:0.05em}
.exit-popup-title{font-size:1.75rem;font-weight:800;color:var(--color-text);margin-bottom:12px;line-height:1.2}
.exit-popup-text{font-size:0.95rem;color:var(--color-text-secondary);line-height:1.6;margin-bottom:24px}
.exit-popup-form{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}
.exit-popup-form input{padding:14px 16px;border:2px solid var(--color-border);border-radius:var(--radius-lg);font-size:1rem;transition:border-color var(--transition-fast)}
.exit-popup-form input:focus{outline:none;border-color:var(--color-primary)}
.exit-popup-trust{display:flex;align-items:center;gap:8px;font-size:0.8rem;color:var(--color-text-muted)}
.exit-popup-trust svg{width:16px;height:16px}
.exit-popup-image{background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;padding:40px}
.popup-stats{display:flex;flex-direction:column;gap:24px}
.popup-stat{text-align:center}
.popup-stat-value{display:block;font-size:3rem;font-weight:800;color:#fff;line-height:1}
.popup-stat-label{font-size:0.9rem;color:rgba(255,255,255,0.8)}

/* Sticky CTA Bar */
.sticky-cta{position:fixed;bottom:-80px;left:0;right:0;z-index:998;background:var(--color-bg);border-top:1px solid var(--color-border);padding:12px 24px;box-shadow:0 -4px 20px rgba(0,0,0,0.1);transition:bottom 0.4s ease}
.sticky-cta.show{bottom:0}
.sticky-cta-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}
.sticky-cta-text{display:flex;flex-direction:column}
.sticky-cta-label{font-size:0.9rem;font-weight:600;color:var(--color-text)}
.sticky-cta-spots{font-size:0.8rem;color:var(--color-text-muted)}
.sticky-cta-spots strong{color:var(--color-error);font-weight:700}
.sticky-cta-btn{white-space:nowrap}

/* Trust Badges */
.trust-badges{display:flex;justify-content:center;gap:24px;margin-top:24px;flex-wrap:wrap}
.trust-badge-item{display:flex;align-items:center;gap:6px;font-size:0.8rem;color:var(--color-text-muted)}
.trust-badge-item svg{width:18px;height:18px;color:var(--color-success)}

/* Chat Widget */
.chat-widget{position:fixed;bottom:24px;right:90px;z-index:1000}
.chat-window{position:absolute;bottom:70px;right:0;width:360px;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);overflow:hidden;transform:scale(0) translateY(20px);transform-origin:bottom right;transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1);opacity:0;visibility:hidden}
.chat-widget.open .chat-window{transform:scale(1) translateY(0);opacity:1;visibility:visible}
.chat-header{display:flex;align-items:center;justify-content:space-between;padding:16px;background:var(--gradient-primary);color:#fff}
.chat-header-info{display:flex;align-items:center;gap:12px}
.chat-avatar{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid rgba(255,255,255,0.3);position:relative}
.chat-avatar img{width:100%;height:100%;object-fit:cover}
.chat-avatar.online::after{content:'';position:absolute;bottom:2px;right:2px;width:10px;height:10px;background:#10B981;border:2px solid #fff;border-radius:50%}
.chat-header-text{display:flex;flex-direction:column}
.chat-name{font-weight:600;font-size:0.95rem}
.chat-status{display:flex;align-items:center;gap:6px;font-size:0.75rem;opacity:0.9}
.status-dot-green{width:6px;height:6px;background:#10B981;border-radius:50%;animation:pulse 2s ease infinite}
.chat-minimize{background:none;border:none;color:rgba(255,255,255,0.8);cursor:pointer;padding:4px}
.chat-minimize:hover{color:#fff}
.chat-minimize svg{width:20px;height:20px}
.chat-messages{height:250px;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--color-bg-subtle)}
.chat-message{display:flex;gap:8px;max-width:85%}
.chat-message.bot{align-self:flex-start}
.chat-message.user{align-self:flex-end;flex-direction:row-reverse}
.message-avatar{width:32px;height:32px;border-radius:50%;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:0.75rem;flex-shrink:0}
.chat-message.user .message-avatar{background:var(--color-text)}
.message-content{background:var(--color-bg);border:1px solid var(--color-border);padding:10px 14px;border-radius:var(--radius-lg);border-top-left-radius:4px}
.chat-message.user .message-content{background:var(--color-primary);border-color:var(--color-primary);color:#fff;border-top-left-radius:var(--radius-lg);border-top-right-radius:4px}
.message-content p{font-size:0.9rem;line-height:1.5;margin:0}
.message-time{font-size:0.7rem;color:var(--color-text-muted);margin-top:4px;display:block}
.chat-message.user .message-time{color:rgba(255,255,255,0.7)}
.chat-typing{display:flex;gap:8px;align-self:flex-start}
.typing-indicator{background:var(--color-bg);border:1px solid var(--color-border);padding:12px 16px;border-radius:var(--radius-lg);display:flex;gap:4px}
.typing-indicator span{width:8px;height:8px;background:var(--color-text-muted);border-radius:50%;animation:typing 1.4s infinite}
.typing-indicator span:nth-child(2){animation-delay:0.2s}
.typing-indicator span:nth-child(3){animation-delay:0.4s}
@keyframes typing{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}
.chat-quick-replies{padding:12px 16px;border-top:1px solid var(--color-border);display:flex;gap:8px;flex-wrap:wrap;background:var(--color-bg)}
.quick-reply{padding:8px 12px;background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:0.8rem;cursor:pointer;transition:all var(--transition-fast)}
.quick-reply:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}
.chat-input-form{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--color-border);background:var(--color-bg)}
.chat-input-form input{flex:1;padding:10px 14px;border:1px solid var(--color-border);border-radius:var(--radius-full);font-size:0.9rem;background:var(--color-bg-subtle)}
.chat-input-form input:focus{outline:none;border-color:var(--color-primary)}
.chat-send{width:40px;height:40px;border-radius:50%;background:var(--gradient-primary);border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform var(--transition-fast)}
.chat-send:hover{transform:scale(1.1)}
.chat-send svg{width:18px;height:18px}
.chat-toggle{width:60px;height:60px;border-radius:50%;background:var(--gradient-primary);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);transition:all var(--transition-base);position:relative}
.chat-toggle:hover{transform:scale(1.1);box-shadow:var(--shadow-xl)}
.chat-toggle svg{width:28px;height:28px;color:#fff}
.chat-toggle-icon,.chat-toggle-close{position:absolute;transition:all 0.3s ease}
.chat-toggle-close{opacity:0;transform:rotate(-90deg)}
.chat-widget.open .chat-toggle-icon{opacity:0;transform:rotate(90deg)}
.chat-widget.open .chat-toggle-close{opacity:1;transform:rotate(0)}
.chat-unread{position:absolute;top:-4px;right:-4px;width:22px;height:22px;background:#EF4444;color:#fff;font-size:0.7rem;font-weight:700;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid var(--color-bg);animation:bounce 0.5s ease infinite alternate}
@keyframes bounce{to{transform:translateY(-3px)}}
.chat-widget.open .chat-unread{display:none}

/* Dark mode for new elements */
body.dark-mode .exit-popup{background:#1A1A2E}
body.dark-mode .exit-popup-form input{background:#252542}
body.dark-mode .sticky-cta{background:#1A1A2E}
body.dark-mode .chat-window{background:#1A1A2E}
body.dark-mode .chat-messages{background:#0F0F1A}
body.dark-mode .message-content{background:#252542}
body.dark-mode .chat-quick-replies,.dark-mode .chat-input-form{background:#1A1A2E}
body.dark-mode .quick-reply{background:#252542}
body.dark-mode .chat-input-form input{background:#252542}

/* CTA Section */
.cta{padding:100px 0;background:var(--color-bg)}
.cta-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.cta-content .section-label{margin-bottom:16px}
.cta-title{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;color:var(--color-text);margin-bottom:16px}
.cta-desc{font-size:1.1rem;color:var(--color-text-secondary);line-height:1.7;margin-bottom:32px}
.cta-features{display:flex;flex-direction:column;gap:12px}
.cta-feature{display:flex;align-items:center;gap:10px;font-size:0.95rem;color:var(--color-text-secondary)}
.cta-feature svg{width:20px;height:20px;color:var(--color-success)}
.cta-form-wrapper{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-lg)}
.cta-form{display:flex;flex-direction:column;gap:20px}
.form-group{display:flex;flex-direction:column;gap:6px}
.form-group label{font-weight:500;font-size:0.9rem;color:var(--color-text)}
.form-group input,.form-group textarea{padding:12px 16px;font-family:var(--font-sans);font-size:0.95rem;color:var(--color-text);background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--transition-fast)}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(0,102,204,0.1)}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--color-text-muted)}
.form-group textarea{min-height:100px;resize:vertical}

/* Footer */
.footer{padding:48px 0 24px;background:var(--color-bg-subtle);border-top:1px solid var(--color-border)}
.footer-content{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}
.footer-brand .logo{margin-bottom:4px}
.footer-tagline{font-size:0.85rem;color:var(--color-text-muted)}
.footer-links{display:flex;gap:32px}
.footer-links a{font-size:0.9rem;color:var(--color-text-secondary);transition:color var(--transition-fast)}
.footer-links a:hover{color:var(--color-primary)}
.footer-bottom{text-align:center;padding-top:24px;border-top:1px solid var(--color-border)}
.footer-bottom p{font-size:0.85rem;color:var(--color-text-muted)}

/* Enhanced Form Styles */
.cta-form-wrapper{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:40px;box-shadow:var(--shadow-xl),0 0 60px rgba(0,102,204,0.08);position:relative;overflow:hidden}
.cta-form-wrapper::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:var(--gradient-primary)}
.form-header{text-align:center;margin-bottom:28px}
.form-title{font-size:1.5rem;font-weight:700;color:var(--color-text);margin-bottom:8px}
.form-subtitle{font-size:0.9rem;color:var(--color-text-muted)}
.cta-form{display:flex;flex-direction:column;gap:20px}
.form-group{display:flex;flex-direction:column;gap:8px}
.form-group label{display:flex;align-items:center;gap:8px;font-weight:600;font-size:0.9rem;color:var(--color-text)}
.form-group label svg{width:16px;height:16px;color:var(--color-primary);flex-shrink:0}
.form-group input,.form-group textarea{padding:14px 16px;font-family:var(--font-sans);font-size:1rem;color:var(--color-text);background:var(--color-bg-subtle);border:2px solid var(--color-border);border-radius:var(--radius-lg);transition:all var(--transition-fast)}
.form-group input:hover,.form-group textarea:hover{border-color:var(--color-text-muted)}
.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--color-primary);background:var(--color-bg);box-shadow:0 0 0 4px rgba(0,102,204,0.1)}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--color-text-muted)}
.form-group textarea{min-height:120px;resize:vertical}
#submitBtn{position:relative;padding:16px 32px;font-size:1rem;margin-top:8px}
#submitBtn .btn-loading{display:inline-flex;align-items:center;gap:8px}
#submitBtn .spinner{width:20px;height:20px;animation:spin 1s linear infinite}
@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Thank You Message */
.thank-you-message{display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 24px;animation:fadeInScale 0.4s ease}
@keyframes fadeInScale{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}
.thank-you-icon{width:80px;height:80px;background:linear-gradient(135deg,rgba(16,185,129,0.15),rgba(16,185,129,0.05));border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:24px;animation:pulseSuccess 2s ease-in-out infinite}
@keyframes pulseSuccess{0%,100%{box-shadow:0 0 0 0 rgba(16,185,129,0.3)}50%{box-shadow:0 0 0 16px rgba(16,185,129,0)}}
.thank-you-icon svg{width:40px;height:40px;color:var(--color-success)}
.thank-you-title{font-size:1.75rem;font-weight:700;color:var(--color-text);margin-bottom:12px}
.thank-you-text{font-size:1rem;color:var(--color-text-secondary);line-height:1.6;max-width:320px;margin-bottom:24px}

/* Cookie Banner */
.cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--color-bg);border-top:1px solid var(--color-border);padding:16px 24px;z-index:9999;transform:translateY(100%);transition:transform var(--transition-base);box-shadow:0 -4px 24px rgba(0,0,0,0.1)}
.cookie-banner.show{transform:translateY(0)}
.cookie-content{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.cookie-text{display:flex;align-items:center;gap:12px;flex:1}
.cookie-icon{width:28px;height:28px;color:var(--color-primary);flex-shrink:0}
.cookie-text p{font-size:0.875rem;color:var(--color-text-secondary);margin:0}
.cookie-text a{color:var(--color-primary);text-decoration:underline}
.cookie-buttons{display:flex;gap:10px}
.btn-cookie-accept{padding:10px 20px;background:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-family:var(--font-sans);font-weight:600;font-size:0.875rem;cursor:pointer;transition:all var(--transition-fast)}
.btn-cookie-accept:hover{background:var(--color-primary-dark)}
.btn-cookie-decline{padding:10px 20px;background:transparent;color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-sans);font-weight:500;font-size:0.875rem;cursor:pointer;transition:all var(--transition-fast)}
.btn-cookie-decline:hover{background:var(--color-bg-muted)}

/* Animations */
.animate-pop{animation:pop 0.5s var(--transition-bounce) forwards}
.animate-title{animation:fadeInUp 0.6s ease forwards}
.animate-fade-up{animation:fadeInUp 0.6s ease forwards}
.animate-float-up{animation:floatUp 0.8s ease forwards;animation-delay:0.3s;opacity:0}
.animate-float{animation:float 4s ease-in-out infinite}
.animate-float-delay{animation:float 4s ease-in-out infinite;animation-delay:-2s}
.delay-1{animation-delay:0.15s;opacity:0}
.delay-2{animation-delay:0.3s;opacity:0}
@keyframes pop{0%{transform:scale(0.8);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes fadeInUp{0%{transform:translateY(20px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes floatUp{0%{transform:translateY(40px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
[data-animate]{opacity:0;transform:translateY(20px);transition:all 0.6s ease}
[data-animate].animate-in{opacity:1;transform:translateY(0)}

/* Responsive */
@media(max-width:1024px){
.features-grid{grid-template-columns:repeat(2,1fr)}
.stats-bar{flex-wrap:wrap;gap:32px}
.stat-divider{display:none}
.cta-wrapper{grid-template-columns:1fr;gap:48px}
.floating-card{display:none}
.testimonials-grid{grid-template-columns:1fr 1fr}
.testimonials-grid .testimonial-card:last-child{grid-column:span 2;max-width:50%;justify-self:center}
.process-step{grid-template-columns:auto 1fr 1fr}
}
@media(max-width:768px){
.nav-links{display:none}
.mobile-menu-btn{display:flex}
.hero{padding:120px 0 60px}
.hero-content{margin-bottom:48px}
.hero-title{font-size:2rem}
.hero-subtitle{font-size:1.1rem}
.hero-cta-group{flex-direction:column;align-items:center}
.hero-cta-group .btn{width:100%;max-width:300px}
.hero-trust{flex-direction:column;gap:12px}
.dashboard-content{flex-direction:column}
.dash-sidebar{width:100%;flex-direction:row;justify-content:flex-start;border-right:none;border-bottom:1px solid var(--color-border)}
.dash-nav{flex-direction:row}
.dash-stats{grid-template-columns:1fr}
.social-proof .container{overflow-x:auto}
.proof-logos{justify-content:flex-start;gap:32px;min-width:600px;padding:0 24px}
.tabs-nav{gap:6px}
.tab-btn{padding:10px 14px;font-size:0.8rem}
.tab-btn svg{display:none}
.tab-panel{grid-template-columns:1fr;gap:32px;padding:24px}
.panel-visual{order:-1}
.features-grid{grid-template-columns:1fr}
.stats-bar{padding:24px;gap:24px}
.stat-num{font-size:2rem}
.footer-content{flex-direction:column;text-align:center;gap:24px}
.footer-links{flex-wrap:wrap;justify-content:center;gap:16px}
.cookie-content{flex-direction:column;text-align:center}
.cookie-text{flex-direction:column}
.cookie-buttons{width:100%}
.cookie-buttons button{flex:1}
.cta-form-wrapper{padding:24px}
.form-title{font-size:1.25rem}
.form-group input,.form-group textarea{padding:12px 14px;font-size:0.95rem}
.thank-you-icon{width:64px;height:64px}
.thank-you-icon svg{width:32px;height:32px}
.thank-you-title{font-size:1.5rem}
.hero-stats{flex-wrap:wrap;gap:16px;padding:16px 20px}
.hero-stat-value{font-size:1.25rem}
.hero-stat-divider{display:none}
.process-step{grid-template-columns:1fr;gap:24px;text-align:center}
.step-number{font-size:3rem}
.step-content{align-items:center}
.step-visual{justify-content:center}
.process-connector{display:none}
.testimonials-grid{grid-template-columns:1fr}
.faq-grid{grid-template-columns:1fr}
.activity-popup{left:12px;right:12px;bottom:80px}
.activity-content{max-width:100%}
.live-visitors{bottom:80px;font-size:0.75rem;padding:8px 12px}
.trending-badge{top:80px;right:12px;font-size:0.7rem;padding:6px 10px}
.dark-mode-toggle{width:46px;height:46px;bottom:16px;right:16px}
}

/* Enhanced Animations */
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideInLeft{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}
@keyframes scaleIn{from{opacity:0;transform:scale(0.9)}to{opacity:1;transform:scale(1)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes shimmer{0%{background-position:200% center}100%{background-position:-200% center}}

/* Section Animations */
.section-header{animation:fadeInUp 0.6s ease-out}
.section-label{animation:fadeIn 0.8s ease-out}
.section-title{animation:fadeInUp 0.8s ease-out 0.1s both}
.section-desc{animation:fadeInUp 0.8s ease-out 0.2s both}

/* Card Animations */
.feature-card:nth-child(1){animation:fadeInUp 0.6s ease-out 0.1s both}
.feature-card:nth-child(2){animation:fadeInUp 0.6s ease-out 0.2s both}
.feature-card:nth-child(3){animation:fadeInUp 0.6s ease-out 0.3s both}
.feature-card:nth-child(4){animation:fadeInUp 0.6s ease-out 0.4s both}

/* Process Steps */
.process-step:nth-child(1){animation:fadeInUp 0.8s ease-out 0.1s both}
.process-step:nth-child(3){animation:fadeInUp 0.8s ease-out 0.2s both}
.process-step:nth-child(5){animation:fadeInUp 0.8s ease-out 0.3s both}
.process-connector{animation:fadeIn 0.8s ease-out 0.4s both}

/* Testimonials */
.testimonial-card:nth-child(1){animation:slideInLeft 0.8s ease-out 0.1s both}
.testimonial-card:nth-child(2){animation:fadeInUp 0.8s ease-out 0.2s both}
.testimonial-card:nth-child(3){animation:slideInRight 0.8s ease-out 0.3s both}

/* FAQ Items */
.faq-item{animation:fadeInUp 0.5s ease-out both}
.faq-item:nth-child(1){animation-delay:0.1s}
.faq-item:nth-child(2){animation-delay:0.2s}
.faq-item:nth-child(3){animation-delay:0.3s}
.faq-item:nth-child(4){animation-delay:0.4s}
.faq-item:nth-child(5){animation-delay:0.5s}
.faq-item:nth-child(6){animation-delay:0.6s}

/* Tabs Animation */
.tab-btn{transition:all 0.3s cubic-bezier(0.4,0,0.2,1)}
.tab-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(99,102,241,0.2)}
.tab-btn.active{animation:scaleIn 0.3s ease-out}

/* Stats Bar */
.stat-item{animation:fadeInUp 0.6s ease-out both}
.stat-item:nth-child(1){animation-delay:0.1s}
.stat-item:nth-child(3){animation-delay:0.2s}
.stat-item:nth-child(5){animation-delay:0.3s}
.stat-item:nth-child(7){animation-delay:0.4s}

/* Hero Stats */
.hero-stat{animation:fadeInUp 0.8s ease-out both}
.hero-stat:nth-child(1){animation-delay:0.5s}
.hero-stat:nth-child(3){animation-delay:0.6s}
.hero-stat:nth-child(5){animation-delay:0.7s}
.hero-stat:nth-child(7){animation-delay:0.8s}

/* Trust Badges */
.trust-badge-item{animation:scaleIn 0.5s ease-out both}
.trust-badge-item:nth-child(1){animation-delay:0.6s}
.trust-badge-item:nth-child(2){animation-delay:0.7s}
.trust-badge-item:nth-child(3){animation-delay:0.8s}
.trust-badge-item:nth-child(4){animation-delay:0.9s}

/* Social Proof */
.proof-logo{animation:fadeIn 0.8s ease-out both;transition:all 0.3s ease}
.proof-logo:hover{transform:scale(1.1);opacity:1}
.proof-logo:nth-child(1){animation-delay:0.1s}
.proof-logo:nth-child(2){animation-delay:0.2s}
.proof-logo:nth-child(3){animation-delay:0.3s}
.proof-logo:nth-child(4){animation-delay:0.4s}
.proof-logo:nth-child(5){animation-delay:0.5s}

/* Footer Links Hover */
.footer-links a{transition:all 0.3s ease}
.footer-links a:hover{color:var(--color-primary);transform:translateX(4px)}

/* Input Focus Animations */
input:focus,textarea:focus,select:focus{transform:scale(1.01);transition:all 0.3s ease}

/* Button Hover Effects */
.btn-ghost:hover{background:var(--color-primary-light);transform:translateY(-2px)}
.btn-cookie-accept:hover{transform:scale(1.05)}
.btn-cookie-decline:hover{transform:scale(1.05)}

/* Nav Links */
.nav-link{position:relative}
.nav-link::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:2px;background:var(--color-primary);transition:all 0.3s ease;transform:translateX(-50%)}
.nav-link:hover::after{width:80%}

/* Mobile Menu Animation */
.mobile-menu.active{animation:slideInRight 0.3s ease-out}
.mobile-link{transition:all 0.3s ease}
.mobile-link:hover{transform:translateX(8px);color:var(--color-primary)}

/* Smooth Scroll */
html{scroll-behavior:smooth}

/* Reduce motion for accessibility */
@media(prefers-reduced-motion:reduce){*{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}}
