/** * High Performance Online - Main Stylesheet * ========================================== * A modern, dark-themed design system */ /* ============================================ CSS Variables / Design Tokens ============================================ */:root{--bg-primary:#0a0a0b;--bg-secondary:#111113;--bg-card:#16161a;--bg-card-hover:#1c1c21;--accent:#00ff88;--accent-dim:#00cc6a;--accent-bright:#33ff9f;--accent-glow:rgba(0, 255, 136, 0.15);--accent-glow-strong:rgba(0, 255, 136, 0.25);--text-primary:#f4f4f5;--text-secondary:#a1a1aa;--text-dim:#71717a;--text-muted:#52525b;--border:#27272a;--border-light:#3f3f46;--success:#22c55e;--warning:#f59e0b;--error:#ef4444;--info:#3b82f6;--gradient-primary:linear-gradient(135deg, #00ff88 0%, #00d4ff 100%);--gradient-dark:linear-gradient(135deg, #0a0a0b 0%, #1a1a2e 100%);--gradient-card:linear-gradient(180deg, var(--bg-card) 0%, var(--bg-secondary) 100%);--font-display:'Syne', sans-serif;--font-body:'DM Sans', sans-serif;--font-mono:'IBM Plex Mono', monospace;--space-xs:0.25rem;--space-sm:0.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--space-4xl:6rem;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-full:100px;--shadow-sm:0 2px 8px rgba(0, 0, 0, 0.3);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.4);--shadow-lg:0 16px 48px rgba(0, 0, 0, 0.5);--shadow-glow:0 0 60px var(--accent-glow);--transition-fast:0.15s ease;--transition-base:0.3s ease;--transition-slow:0.5s ease;--container-max:1400px;--nav-height:80px}/* ============================================ Reset & Base ============================================ */ *, *::before, *::after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-body);font-size:16px;line-height:1.6;background:var(--bg-primary);color:var(--text-primary);overflow-x:hidden}body.menu-open{overflow:hidden}/* ============================================ Background Effects ============================================ */ .bg-grid{position:fixed;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(0, 255, 136, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 255, 136, 0.03) 1px, transparent 1px);background-size:60px 60px;pointer-events:none;z-index:0}.bg-glow{position:fixed;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle, var(--accent-glow) 0%, transparent 70%);pointer-events:none;z-index:0;animation:float 20s ease-in-out infinite}.bg-glow-1{top:-200px;right:-200px}.bg-glow-2{bottom:-300px;left:-200px;animation-delay:-10s}@keyframes float{0%, 100%{transform:translate(0, 0) scale(1)}50%{transform:translate(-50px, 50px) scale(1.1)}}/* ============================================ Typography ============================================ */ h1, h2, h3, h4, h5, h6{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--text-primary)}h1{font-size:clamp(2.5rem, 6vw, 4rem)}h2{font-size:clamp(2rem, 4vw, 3rem)}h3{font-size:clamp(1.5rem, 3vw, 2rem)}h4{font-size:1.25rem}h5{font-size:1.1rem}h6{font-size:1rem}p{color:var(--text-secondary);margin-bottom:var(--space-md)}a{color:var(--accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--accent-bright)}strong{font-weight:600}.text-accent{color:var(--accent)}.text-muted{color:var(--text-dim)}.highlight{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}/* ============================================ Layout ============================================ */ .container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--space-xl)}.section-container{max-width:var(--container-max);margin:0 auto}section{position:relative;z-index:1;padding:var(--space-4xl) var(--space-xl)}main{position:relative;z-index:1}/* ============================================ Navigation ============================================ */ .main-nav{position:fixed;top:0;left:0;right:0;z-index:9999;padding:var(--space-lg) var(--space-xl);background:rgba(10, 10, 11, 0.95);backdrop-filter:blur(20px);border-bottom:1px solid var(--border);height:var(--nav-height)}.nav-container{max-width:var(--container-max);margin:0 auto;display:flex;justify-content:space-between;align-items:center}.logo{display:flex;align-items:center;gap:var(--space-sm);font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--text-primary);text-decoration:none}.logo img{height:50px;width:auto}.logo:hover{color:var(--text-primary)}.logo-icon{width:36px;height:36px;background:var(--gradient-primary);border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:1.1rem}.nav-links{display:flex;gap:var(--space-2xl);list-style:none}.nav-item{position:relative}.nav-item > a{display:flex;align-items:center;gap:6px;color:var(--text-secondary);font-size:0.95rem;font-weight:500;padding:var(--space-sm) 0;transition:color var(--transition-fast)}.nav-item > a:hover, .nav-item > a.active{color:var(--accent)}.dropdown-arrow{transition:transform var(--transition-fast)}.nav-item:hover .dropdown-arrow{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:320px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-lg);opacity:0;visibility:hidden;transition:all var(--transition-fast);box-shadow:var(--shadow-lg)}.dropdown-menu.active, .nav-item:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}.dropdown-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-sm)}.dropdown-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-fast)}.dropdown-item:hover{background:var(--bg-secondary);color:var(--text-primary)}.dropdown-icon{font-size:1.25rem}.dropdown-footer{margin-top:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--border)}.dropdown-all-link{display:block;text-align:center;color:var(--accent);font-weight:500;font-size:0.9rem}.nav-actions{display:flex;align-items:center;gap:var(--space-md)}.nav-cta{background:var(--accent);color:var(--bg-primary);padding:0.75rem 1.5rem;border-radius:var(--radius-md);font-weight:600;font-size:0.9rem;transition:all var(--transition-base)}.nav-cta:hover{background:var(--accent-dim);color:var(--bg-primary);transform:translateY(-2px);box-shadow:var(--shadow-glow)}.nav-phone{display:flex;align-items:center;gap:var(--space-xs);color:var(--text-secondary);font-size:0.9rem;font-weight:500;padding:0.5rem 0.75rem;border-radius:var(--radius-md);transition:all var(--transition-fast)}.nav-phone:hover{color:var(--accent);background:var(--accent-glow)}.nav-phone .phone-icon{font-size:1rem}.nav-phone .phone-number{font-family:var(--font-mono);letter-spacing:0.5px}@media (max-width:1024px){.nav-phone{display:none}}.mobile-menu-btn{display:none;background:none;border:none;cursor:pointer;padding:var(--space-sm)}.hamburger{display:flex;flex-direction:column;gap:5px;width:24px}.hamburger span{display:block;height:2px;background:var(--text-primary);border-radius:2px;transition:all var(--transition-fast)}.mobile-menu-btn.active .hamburger span:nth-child(1){transform:rotate(45deg) translate(5px, 5px)}.mobile-menu-btn.active .hamburger span:nth-child(2){opacity:0}.mobile-menu-btn.active .hamburger span:nth-child(3){transform:rotate(-45deg) translate(5px, -5px)}.mobile-menu{display:none;position:fixed;top:80px;left:0;right:0;bottom:0;width:100%;background-color:#0a0a0b;padding:24px;overflow-y:auto;z-index:99999;box-sizing:border-box}.mobile-menu.active{display:block}.mobile-menu-content{display:flex;flex-direction:column;gap:0}.mobile-menu-link{display:block;padding:20px 16px;font-size:1.25rem;font-weight:500;color:#f4f4f5;border-bottom:1px solid #3f3f46;text-decoration:none;transition:color 0.2s ease, background 0.2s ease}.mobile-menu-link:hover, .mobile-menu-link.active{color:#00ff88;background:rgba(0, 255, 136, 0.1)}.mobile-menu-divider{height:1px;background:#3f3f46;margin:16px 0}.mobile-menu-cta{display:block;background:#00ff88;color:#0a0a0b;padding:18px 24px;border-radius:10px;text-align:center;font-weight:600;font-size:1.1rem;text-decoration:none;margin-top:24px}.mobile-menu-cta:hover{background:#00cc6a}.mobile-menu-phone{display:block;padding:20px 16px;font-size:1.1rem;color:#a1a1aa;text-align:center;text-decoration:none;margin-top:16px}.mobile-menu-phone:hover{color:#00ff88}.skip-link{position:absolute;top:-100%;left:var(--space-md);background:var(--accent);color:var(--bg-primary);padding:var(--space-md);border-radius:var(--radius-md);z-index:10000}.skip-link:focus{top:var(--space-md)}/* ============================================ Buttons ============================================ */ .btn-primary{display:inline-flex;align-items:center;gap:var(--space-sm);background:var(--accent);color:var(--bg-primary);padding:1rem 2rem;border-radius:var(--radius-md);font-weight:600;font-size:1rem;border:none;cursor:pointer;transition:all var(--transition-base)}.btn-primary:hover{background:var(--accent-dim);color:var(--bg-primary);transform:translateY(-3px);box-shadow:0 20px 60px var(--accent-glow)}.btn-secondary{display:inline-flex;align-items:center;gap:var(--space-sm);background:transparent;color:var(--text-primary);padding:1rem 2rem;border-radius:var(--radius-md);font-weight:600;font-size:1rem;border:1px solid var(--border);cursor:pointer;transition:all var(--transition-base)}.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}.btn-sm{padding:0.5rem 1rem;font-size:0.9rem}.btn-lg{padding:1.25rem 2.5rem;font-size:1.1rem}/* ============================================ Hero Section ============================================ */ .hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:calc(var(--nav-height) + var(--space-2xl)) var(--space-xl) var(--space-2xl);overflow:hidden}.hero-container{max-width:var(--container-max);margin:0 auto;width:100%}.hero-grid{display:grid;grid-template-columns:42% 58%;gap:var(--space-xl);align-items:center}.hero-content{max-width:520px}.hero-image{display:flex;justify-content:flex-end;align-items:center;animation:fadeInRight 1s ease 0.3s forwards;opacity:0;position:relative;margin-right:-60px}.hero-image img{width:100%;max-width:850px;height:auto;border-radius:var(--radius-lg);filter:drop-shadow(0 30px 80px rgba(0, 255, 136, 0.25))}@keyframes fadeInRight{from{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}.hero-badge{display:inline-flex;align-items:center;gap:var(--space-sm);background:var(--bg-card);border:1px solid var(--border);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-full);font-family:var(--font-mono);font-size:0.85rem;color:var(--accent);margin-bottom:var(--space-xl);animation:fadeInUp 0.8s ease forwards}.hero-badge::before{content:'';width:8px;height:8px;background:var(--accent);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)}}.hero h1{font-size:clamp(3rem, 8vw, 5.5rem);font-weight:800;line-height:1.05;margin-bottom:var(--space-lg);animation:fadeInUp 0.8s ease 0.1s forwards;opacity:0}.hero-description{font-size:1.25rem;color:var(--text-secondary);max-width:600px;margin-bottom:var(--space-2xl);animation:fadeInUp 0.8s ease 0.2s forwards;opacity:0}.hero-cta{display:flex;gap:var(--space-md);flex-wrap:wrap;animation:fadeInUp 0.8s ease 0.3s forwards;opacity:0}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.stats-bar{margin-top:var(--space-4xl);display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:var(--space-xl);padding-top:var(--space-2xl);border-top:1px solid var(--border);animation:fadeInUp 0.8s ease 0.4s forwards;opacity:0}.stat-item{text-align:left}.stat-number{font-family:var(--font-display);font-size:2.5rem;font-weight:700;color:var(--accent)}.stat-label{color:var(--text-secondary);font-size:0.95rem;margin-top:var(--space-xs)}/* ============================================ Section Headers ============================================ */ .section-header{text-align:center;margin-bottom:var(--space-3xl)}.section-tag{font-family:var(--font-mono);font-size:0.85rem;color:var(--accent);text-transform:uppercase;letter-spacing:2px;margin-bottom:var(--space-md)}.section-title{font-size:clamp(2rem, 5vw, 3.5rem);margin-bottom:var(--space-md)}.section-subtitle{font-size:1.15rem;color:var(--text-secondary);max-width:600px;margin:0 auto}/* ============================================ Cards ============================================ */ .card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl);transition:all var(--transition-base)}.card:hover{border-color:var(--accent);transform:translateY(-4px)}.service-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl);transition:all var(--transition-base);position:relative;overflow:hidden}.service-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);transform:scaleX(0);transition:transform var(--transition-base)}.service-card:hover{transform:translateY(-8px);border-color:var(--accent);box-shadow:0 20px 60px rgba(0, 255, 136, 0.1)}.service-card:hover::before{transform:scaleX(1)}.service-icon{width:60px;height:60px;background:var(--accent-glow);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.75rem;margin-bottom:var(--space-lg)}.service-card h3{font-size:1.5rem;margin-bottom:var(--space-md)}.service-card p{margin-bottom:var(--space-lg)}.service-features{list-style:none}.service-features li{display:flex;align-items:center;gap:0.75rem;color:var(--text-dim);font-size:0.95rem;margin-bottom:var(--space-sm)}.service-features li::before{content:'→';color:var(--accent);font-weight:600}.process-step{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);position:relative}.step-number{font-family:var(--font-display);font-size:4rem;font-weight:800;color:var(--border);position:absolute;top:var(--space-md);right:var(--space-lg);line-height:1}.process-step h3{font-size:1.25rem;color:var(--accent);margin-bottom:0.75rem}.process-step p{font-size:0.95rem}.benefit-card{display:flex;gap:var(--space-lg);padding:var(--space-lg);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-base)}.benefit-card:hover{border-color:var(--accent)}.benefit-icon{width:48px;height:48px;background:var(--accent-glow);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.25rem;flex-shrink:0}.benefit-content h3{font-size:1.1rem;margin-bottom:var(--space-sm)}.benefit-content p{font-size:0.9rem;margin:0}/* ============================================ Grids ============================================ */ .services-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:var(--space-xl)}.process-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:var(--space-lg)}.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:var(--space-xl)}/* ============================================ CTA Section ============================================ */ .cta-section, .prefooter-cta{background:var(--gradient-dark);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.cta-box{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-4xl);text-align:center;position:relative;overflow:hidden}.cta-box::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:400px;height:400px;background:radial-gradient(circle, var(--accent-glow) 0%, transparent 70%);pointer-events:none}.cta-box h2{font-size:clamp(2rem, 4vw, 3rem);margin-bottom:var(--space-md);position:relative}.cta-box p{font-size:1.15rem;max-width:500px;margin:0 auto var(--space-xl);position:relative}/* ============================================ Forms ============================================ */ .form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;font-size:0.9rem;font-weight:500;margin-bottom:var(--space-sm);color:var(--text-secondary)}.form-group input, .form-group textarea, .form-group select{width:100%;padding:var(--space-md);background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:inherit;font-size:1rem;transition:border-color var(--transition-fast)}.form-group input:focus, .form-group textarea:focus, .form-group select:focus{outline:none;border-color:var(--accent)}.form-group input::placeholder, .form-group textarea::placeholder{color:var(--text-dim)}.form-group textarea{min-height:120px;resize:vertical}.form-group select{cursor:pointer}.form-submit{width:100%;background:var(--accent);color:var(--bg-primary);padding:var(--space-md) var(--space-xl);border:none;border-radius:var(--radius-md);font-weight:600;font-size:1rem;cursor:pointer;transition:all var(--transition-base)}.form-submit:hover{background:var(--accent-dim);transform:translateY(-2px)}.contact-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3xl);align-items:start}.contact-info h3{font-size:2rem;margin-bottom:var(--space-lg)}.contact-info > p{font-size:1.1rem;margin-bottom:var(--space-xl)}.contact-methods{display:flex;flex-direction:column;gap:var(--space-lg)}.contact-method{display:flex;align-items:center;gap:var(--space-md)}.contact-method-icon{width:48px;height:48px;background:var(--accent-glow);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.25rem}.contact-method a, .contact-method span{color:var(--text-primary);font-size:1.1rem}.contact-method a:hover{color:var(--accent)}/* ============================================ Footer ============================================ */ .main-footer{position:relative;z-index:1;background:var(--bg-secondary);border-top:1px solid var(--border);padding:var(--space-4xl) var(--space-xl) var(--space-xl)}.footer-container{max-width:var(--container-max);margin:0 auto}.footer-top{display:flex;justify-content:space-between;gap:var(--space-3xl);margin-bottom:var(--space-3xl)}.footer-brand{max-width:350px}.footer-brand .logo{margin-bottom:var(--space-md)}.footer-tagline{font-family:var(--font-mono);font-size:0.85rem;color:var(--accent);margin-bottom:var(--space-md)}.footer-description{font-size:0.95rem;color:var(--text-secondary);margin-bottom:var(--space-lg)}.footer-social{display:flex;gap:var(--space-md)}.footer-social a{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-fast)}.footer-social a:hover{border-color:var(--accent);color:var(--accent)}.footer-links{display:flex;gap:var(--space-4xl)}.footer-col h4{font-family:var(--font-display);font-size:1rem;font-weight:600;margin-bottom:var(--space-lg);color:var(--text-primary)}.footer-col ul{list-style:none}.footer-col li{margin-bottom:var(--space-sm)}.footer-col a{color:var(--text-secondary);font-size:0.9rem;transition:color var(--transition-fast)}.footer-col a:hover{color:var(--accent)}.footer-contact li{display:flex;align-items:center;gap:var(--space-sm);margin-bottom:var(--space-md)}.footer-contact .contact-icon{font-size:1rem}.footer-contact a, .footer-contact span{color:var(--text-secondary);font-size:0.9rem}.footer-bottom{padding-top:var(--space-xl);border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-md)}.footer-copyright p, .footer-tagline-bottom p{color:var(--text-dim);font-size:0.9rem;margin:0}.footer-legal{display:flex;gap:var(--space-xl)}.footer-legal a{color:var(--text-dim);font-size:0.85rem}.footer-legal a:hover{color:var(--accent)}/* ============================================ Scroll Animations ============================================ */ .reveal{opacity:0;transform:translateY(40px);transition:all 0.8s ease}.reveal.active{opacity:1;transform:translateY(0)}/* ============================================ Utility Classes ============================================ */ .text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.mt-0{margin-top:0}.mb-0{margin-bottom:0}.my-0{margin-top:0;margin-bottom:0}.pt-0{padding-top:0}.pb-0{padding-bottom:0}.hidden{display:none}.visible{visibility:visible}.bg-secondary{background:var(--bg-secondary)}.bg-card{background:var(--bg-card)}/* ============================================ Page Hero (Interior Pages) ============================================ */ .page-hero{padding-top:calc(var(--nav-height) + var(--space-3xl));padding-bottom:var(--space-3xl);background:var(--bg-primary)}.page-hero-content{max-width:800px}.page-hero-content h1{font-size:clamp(2.5rem, 6vw, 4rem);margin-bottom:var(--space-lg)}.page-hero-description{font-size:1.2rem;color:var(--text-secondary);line-height:1.7}.breadcrumbs{margin-bottom:var(--space-xl)}.breadcrumbs ol{display:flex;flex-wrap:wrap;list-style:none;gap:var(--space-sm);font-size:0.9rem}.breadcrumbs li{display:flex;align-items:center;gap:var(--space-sm);color:var(--text-dim)}.breadcrumbs li:not(:last-child)::after{content:'/';color:var(--text-muted)}.breadcrumbs a{color:var(--text-secondary);transition:color var(--transition-fast)}.breadcrumbs a:hover{color:var(--accent)}/* ============================================ Services Page Styles ============================================ */ .services-overview{padding-top:var(--space-3xl)}.service-card .service-cta{display:inline-flex;align-items:center;gap:var(--space-sm);color:var(--accent);font-weight:600;margin-top:var(--space-md);transition:gap var(--transition-fast)}.service-card:hover .service-cta{gap:var(--space-md)}.approach-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4xl);align-items:center}.approach-content h2{margin-bottom:var(--space-lg)}.approach-content > p{margin-bottom:var(--space-lg);font-size:1.1rem}.approach-features{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);margin-top:var(--space-xl)}.approach-feature{display:flex;gap:var(--space-md)}.approach-icon{font-size:1.5rem;flex-shrink:0}.approach-feature h4{font-size:1rem;margin-bottom:var(--space-xs)}.approach-feature p{font-size:0.9rem;margin:0}.approach-visual{display:flex;justify-content:center}.visual-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-2xl);display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl)}.visual-stat{text-align:center;padding:var(--space-lg)}.visual-stat .stat-number{font-family:var(--font-display);font-size:2.5rem;font-weight:800;color:var(--accent);display:block}.visual-stat .stat-label{font-size:0.9rem;color:var(--text-secondary)}.tech-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:var(--space-xl)}.tech-category h4{font-family:var(--font-display);font-size:0.9rem;text-transform:uppercase;letter-spacing:1px;color:var(--accent);margin-bottom:var(--space-md)}.tech-items{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.tech-item{background:var(--bg-card);border:1px solid var(--border);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);font-size:0.85rem;color:var(--text-secondary);transition:all var(--transition-fast)}.tech-item:hover{border-color:var(--accent);color:var(--accent)}.process-timeline{position:relative;max-width:800px;margin:0 auto}.timeline-step{display:flex;gap:var(--space-xl);padding-bottom:var(--space-2xl);position:relative}.timeline-step:not(:last-child)::before{content:'';position:absolute;left:24px;top:48px;bottom:0;width:2px;background:var(--border)}.timeline-marker{width:48px;height:48px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:0.9rem;color:var(--bg-primary);flex-shrink:0;z-index:1}.timeline-content h3{font-size:1.25rem;margin-bottom:var(--space-sm)}.timeline-content p{font-size:1rem;margin:0}.faq-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(350px, 1fr));gap:var(--space-xl)}.faq-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl)}.faq-item h4{font-size:1.1rem;margin-bottom:var(--space-md);color:var(--text-primary)}.faq-item p{font-size:0.95rem;margin:0}/* ============================================ Individual Service Page Styles ============================================ */ .service-hero{padding-top:calc(var(--nav-height) + var(--space-2xl));padding-bottom:var(--space-3xl);background:var(--bg-primary);overflow:hidden}.service-hero-grid{display:grid;grid-template-columns:45% 55%;gap:var(--space-xl);align-items:center}.service-hero-text{max-width:520px}.service-hero-icon{font-size:3.5rem;margin-bottom:var(--space-lg)}.service-hero-text h1{font-size:clamp(2rem, 5vw, 3rem);margin-bottom:var(--space-lg)}.service-hero-subtitle{font-size:1.15rem;color:var(--text-secondary);margin-bottom:var(--space-xl);line-height:1.6}.service-hero-cta{display:flex;gap:var(--space-md);flex-wrap:wrap}.service-hero-image{display:flex;justify-content:flex-end;align-items:center;margin-right:-40px}.service-hero-image img{width:100%;max-width:700px;height:auto;border-radius:var(--radius-lg);filter:drop-shadow(0 30px 80px rgba(0, 255, 136, 0.25))}@media (max-width:1024px){.service-hero-grid{grid-template-columns:1fr;gap:var(--space-2xl)}.service-hero-text{max-width:100%;text-align:center}.service-hero-cta{justify-content:center}.service-hero-icon{font-size:3rem}.service-hero-image{order:-1}.service-hero-image img{max-width:400px}}@media (max-width:768px){.service-hero{padding-top:calc(var(--nav-height) + var(--space-xl));padding-bottom:var(--space-2xl)}.service-hero-text h1{font-size:1.75rem}.service-hero-subtitle{font-size:1rem}.service-hero-image img{max-width:100%}}.benefits-showcase{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-lg)}.benefit-showcase-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);text-align:center;transition:all var(--transition-base)}.benefit-showcase-card:hover{border-color:var(--accent);transform:translateY(-4px)}.benefit-showcase-icon{font-size:2.5rem;display:block;margin-bottom:var(--space-md)}.benefit-showcase-card h3{font-size:1.1rem;margin-bottom:var(--space-sm)}.benefit-showcase-card p{font-size:0.9rem;margin:0}.features-layout{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4xl);align-items:start}.features-content h2{font-size:2.5rem;margin-bottom:var(--space-md)}.features-intro{font-size:1.1rem;margin-bottom:var(--space-xl)}.features-list{list-style:none}.features-list li{display:flex;align-items:flex-start;gap:var(--space-md);padding:var(--space-md) 0;border-bottom:1px solid var(--border);font-size:1.05rem;color:var(--text-secondary)}.feature-check{color:var(--accent);font-weight:700;flex-shrink:0}.use-cases-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl);position:sticky;top:calc(var(--nav-height) + var(--space-xl))}.use-cases-card h4{font-family:var(--font-display);font-size:1.25rem;margin-bottom:var(--space-lg);color:var(--accent)}.use-cases-card ul{list-style:none}.use-cases-card li{padding:var(--space-sm) 0;padding-left:var(--space-lg);position:relative;color:var(--text-secondary);font-size:0.95rem}.use-cases-card li::before{content:'→';position:absolute;left:0;color:var(--accent)}.other-services-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-lg)}.other-service-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);text-decoration:none;transition:all var(--transition-base)}.other-service-card:hover{border-color:var(--accent);transform:translateY(-4px)}.other-service-icon{font-size:2rem;display:block;margin-bottom:var(--space-md)}.other-service-card h4{font-size:1.1rem;margin-bottom:var(--space-sm);color:var(--text-primary)}.other-service-card p{font-size:0.9rem;margin-bottom:var(--space-md)}.other-service-link{color:var(--accent);font-weight:600;font-size:0.9rem}/* ============================================ Contact Page Styles ============================================ */ .contact-hero{padding-top:calc(var(--nav-height) + var(--space-3xl));padding-bottom:var(--space-2xl)}.contact-main{padding-top:0}.contact-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:var(--space-4xl);align-items:start}.contact-info-section{display:flex;flex-direction:column;gap:var(--space-xl)}.contact-info-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl)}.contact-info-card h3{font-size:1.5rem;margin-bottom:var(--space-md)}.contact-info-card > p{font-size:1rem;margin-bottom:var(--space-xl)}.contact-details{display:flex;flex-direction:column;gap:var(--space-lg)}.contact-detail{display:flex;gap:var(--space-md);align-items:flex-start}.contact-detail-icon{width:44px;height:44px;background:var(--accent-glow);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0}.contact-detail-content{display:flex;flex-direction:column;gap:2px}.contact-detail-label{font-size:0.85rem;color:var(--text-dim)}.contact-detail-content a, .contact-detail-content span{color:var(--text-primary);font-size:1rem}.contact-detail-content a:hover{color:var(--accent)}.response-promise{background:var(--accent-glow);border:1px solid var(--accent);border-radius:var(--radius-lg);padding:var(--space-xl);display:flex;gap:var(--space-md)}.promise-icon{font-size:1.5rem;flex-shrink:0}.promise-content h4{font-size:1rem;margin-bottom:var(--space-xs);color:var(--accent)}.promise-content p{font-size:0.9rem;margin:0}.what-to-expect{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl)}.what-to-expect h4{font-size:1.1rem;margin-bottom:var(--space-lg)}.what-to-expect ol{list-style:none;counter-reset:steps}.what-to-expect li{counter-increment:steps;display:flex;flex-direction:column;padding:var(--space-md) 0;padding-left:var(--space-2xl);position:relative;border-bottom:1px solid var(--border)}.what-to-expect li:last-child{border-bottom:none}.what-to-expect li::before{content:counter(steps);position:absolute;left:0;top:var(--space-md);width:24px;height:24px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:700;color:var(--bg-primary)}.what-to-expect strong{color:var(--text-primary);font-size:0.95rem}.what-to-expect span{color:var(--text-secondary);font-size:0.85rem}.contact-form-section{position:sticky;top:calc(var(--nav-height) + var(--space-xl))}.contact-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:var(--space-2xl)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg)}.form-hint{font-size:0.8rem;color:var(--text-dim);margin-top:var(--space-xs)}.required{color:var(--accent)}.form-disclaimer{font-size:0.85rem;color:var(--text-dim);text-align:center;margin-top:var(--space-lg);margin-bottom:0}.form-disclaimer a{color:var(--text-secondary)}.submit-arrow{transition:transform var(--transition-fast)}.form-submit:hover .submit-arrow{transform:translateX(4px)}.flash-message{padding:var(--space-md) 0}.flash-content{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md)}.flash-success .flash-content{background:rgba(34, 197, 94, 0.1);border:1px solid var(--success)}.flash-error .flash-content{background:rgba(239, 68, 68, 0.1);border:1px solid var(--error)}.flash-icon{font-size:1.25rem}.flash-success .flash-icon{color:var(--success)}.flash-error .flash-icon{color:var(--error)}.flash-content p{flex:1;margin:0;color:var(--text-primary)}.flash-close{background:none;border:none;color:var(--text-secondary);font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.alt-contact-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:var(--space-xl)}.alt-contact-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl);text-align:center;transition:all var(--transition-base)}.alt-contact-card:hover{border-color:var(--accent)}.alt-contact-icon{font-size:2.5rem;margin-bottom:var(--space-md)}.alt-contact-card h4{font-size:1.1rem;margin-bottom:var(--space-sm)}.alt-contact-card p{font-size:0.9rem;margin-bottom:var(--space-md)}.alt-contact-link{color:var(--accent);font-weight:600}/* ============================================ Services Page - Enhanced Layout ============================================ */ .services-hero{padding-bottom:var(--space-4xl);overflow:hidden}.services-hero-grid{display:grid;grid-template-columns:42% 58%;gap:var(--space-xl);align-items:center}.services-hero-grid .page-hero-content{max-width:520px}.services-hero-grid .page-hero-image{display:flex;justify-content:flex-end;align-items:center;margin-right:-60px}.services-hero-grid .page-hero-image img{width:100%;max-width:850px;height:auto;border-radius:var(--radius-lg);filter:drop-shadow(0 30px 80px rgba(0, 255, 136, 0.25))}.hero-stats{display:flex;gap:var(--space-xl);margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--border)}.hero-stat{display:flex;flex-direction:column}.hero-stat .stat-value{font-family:var(--font-display);font-size:2rem;font-weight:800;color:var(--accent)}.hero-stat .stat-label{font-size:0.85rem;color:var(--text-secondary);margin-top:var(--space-xs)}.services-detailed{padding:var(--space-4xl) 0}.service-detail-card{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4xl);align-items:center;padding:var(--space-4xl) 0;border-bottom:1px solid var(--border)}.service-detail-card:last-child{border-bottom:none}.service-detail-card.reversed{direction:rtl}.service-detail-card.reversed > *{direction:ltr}.service-detail-header{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-lg)}.service-detail-icon{font-size:3rem}.service-detail-header h2{font-size:clamp(1.75rem, 4vw, 2.25rem);margin:0}.service-tagline{font-size:1.3rem;color:var(--accent);font-weight:600;margin-bottom:var(--space-md)}.service-intro{font-size:1.1rem;line-height:1.7;color:var(--text-secondary);margin-bottom:var(--space-xl)}.service-benefits{margin-bottom:var(--space-xl)}.service-benefits h3, .service-use-cases h3{font-size:1.1rem;color:var(--text-primary);margin-bottom:var(--space-md);text-transform:uppercase;letter-spacing:1px}.benefits-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-lg)}.benefit-item{background:var(--bg-secondary);padding:var(--space-lg);border-radius:var(--radius-md);border-left:3px solid var(--accent)}.benefit-item h4{font-size:1rem;color:var(--text-primary);margin-bottom:var(--space-sm)}.benefit-item p{font-size:0.9rem;margin:0;line-height:1.6}.service-use-cases ul{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-sm) var(--space-lg);list-style:none;padding:0;margin-bottom:var(--space-xl)}.service-use-cases li{position:relative;padding-left:var(--space-lg);font-size:0.95rem;color:var(--text-secondary)}.service-use-cases li::before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:bold}.service-detail-image{display:flex;justify-content:center;align-items:center}.service-detail-image img{width:100%;max-width:none;height:auto;border-radius:var(--radius-lg);filter:drop-shadow(0 20px 50px rgba(0, 255, 136, 0.12));transform:perspective(1000px) rotateY(-3deg);transition:transform 0.5s ease}.service-detail-card.reversed .service-detail-image img{transform:perspective(1000px) rotateY(3deg)}.service-detail-image:hover img{transform:perspective(1000px) rotateY(0deg)}.differentiators-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-xl);margin-top:var(--space-3xl)}.differentiator-card{background:var(--bg-card);border:1px solid var(--border);padding:var(--space-xl);border-radius:var(--radius-lg);transition:all var(--transition-base)}.differentiator-card:hover{border-color:var(--accent);transform:translateY(-5px)}.diff-number{font-family:var(--font-display);font-size:2.5rem;font-weight:800;color:var(--accent);opacity:0.3;display:block;margin-bottom:var(--space-md)}.differentiator-card h3{font-size:1.2rem;margin-bottom:var(--space-sm)}.differentiator-card p{font-size:0.95rem;margin:0}.process-timeline{position:relative;margin-top:var(--space-3xl)}.process-step{display:flex;gap:var(--space-xl);padding:var(--space-xl) 0;position:relative}.process-step:not(:last-child)::after{content:'';position:absolute;left:24px;top:80px;height:calc(100% - 30px);width:2px;background:var(--border)}.step-number{width:50px;height:50px;background:var(--accent);color:var(--bg-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:1.25rem;flex-shrink:0;position:relative;z-index:1}.step-content h3{font-size:1.3rem;margin-bottom:var(--space-sm)}.step-content p{font-size:1rem;margin:0;max-width:600px}.quick-links-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-lg);margin-top:var(--space-2xl)}.quick-link-card{display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);padding:var(--space-xl);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;transition:all var(--transition-base)}.quick-link-card:hover{border-color:var(--accent);transform:translateY(-3px);background:var(--bg-secondary)}.quick-link-icon{font-size:2.5rem}.quick-link-title{font-size:0.95rem;font-weight:600;color:var(--text-primary)}@media (max-width:1200px){.differentiators-grid{grid-template-columns:repeat(2, 1fr)}.quick-links-grid{grid-template-columns:repeat(4, 1fr)}}@media (max-width:1024px){.services-hero-grid{grid-template-columns:1fr;gap:var(--space-2xl)}.services-hero-grid .page-hero-content{max-width:100%;text-align:center}.services-hero-grid .page-hero-image{justify-content:center;order:-1}.services-hero-grid .page-hero-image img{max-width:500px}.hero-stats{justify-content:center;flex-wrap:wrap}.service-detail-card{grid-template-columns:1fr;gap:var(--space-2xl)}.service-detail-card.reversed{direction:ltr}.service-detail-image{order:-1}.service-detail-image img{max-width:450px}.benefits-grid{grid-template-columns:1fr}.service-use-cases ul{grid-template-columns:1fr}.quick-links-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:768px){.services-hero-grid .page-hero-image img{max-width:100%}.hero-stats{flex-direction:column;align-items:center;gap:var(--space-md)}.hero-stat{text-align:center}.service-detail-card{padding:var(--space-2xl) 0}.service-detail-header{flex-direction:column;text-align:center}.service-tagline{text-align:center}.service-detail-image img{max-width:100%}.differentiators-grid{grid-template-columns:1fr}.process-step{flex-direction:column;text-align:center;align-items:center}.process-step:not(:last-child)::after{display:none}.quick-links-grid{grid-template-columns:repeat(2, 1fr);gap:var(--space-md)}.quick-link-card{padding:var(--space-lg)}.quick-link-icon{font-size:2rem}}/* ============================================ About Page Hero Grid ============================================ */ .about-hero{padding-top:calc(var(--nav-height) + var(--space-2xl));padding-bottom:var(--space-3xl);overflow:hidden}.about-hero-grid{display:grid;grid-template-columns:45% 55%;gap:var(--space-xl);align-items:center}.about-hero-image{display:flex;justify-content:flex-end;align-items:center;margin-right:-40px}.about-hero-image img{width:100%;max-width:700px;height:auto;border-radius:var(--radius-lg);filter:drop-shadow(0 30px 80px rgba(0, 255, 136, 0.25))}@media (max-width:1024px){.about-hero-grid{grid-template-columns:1fr;gap:var(--space-2xl);text-align:center}.about-hero-image{order:-1;justify-content:center}.about-hero-image img{max-width:550px;transform:none}.about-hero-image:hover img{transform:none}}@media (max-width:768px){.about-hero{padding-top:calc(var(--nav-height) + var(--space-xl));padding-bottom:var(--space-2xl)}.about-hero-image img{max-width:100%}}/* ============================================ Responsive ============================================ */ @media (max-width:1024px){.contact-grid, .contact-layout{grid-template-columns:1fr}.approach-grid, .features-layout{grid-template-columns:1fr}.benefits-showcase{grid-template-columns:repeat(2, 1fr)}.other-services-grid{grid-template-columns:repeat(2, 1fr)}.footer-top{flex-direction:column}.footer-brand{max-width:100%}.contact-form-section{position:static}.use-cases-card{position:static}}@media (max-width:768px){.nav-links{display:none}.nav-cta{display:none}.mobile-menu-btn{display:block}.logo img{height:40px;width:auto}.hero{padding-top:calc(var(--nav-height) + var(--space-xl));padding-bottom:var(--space-2xl);min-height:auto}.hero-grid{grid-template-columns:1fr;gap:var(--space-2xl);text-align:center}.hero-content{max-width:100%;order:1}.hero-image{order:2}.hero-image img{max-width:100%}.hero h1{font-size:2.25rem}.hero-description{font-size:1rem;max-width:100%}.hero-cta{justify-content:center}.hero-badge{margin:0 auto var(--space-lg)}.services-grid{grid-template-columns:1fr}.stats-bar{grid-template-columns:1fr 1fr;gap:var(--space-md)}.stat-number{font-size:2rem}.footer-links{flex-wrap:wrap;gap:var(--space-2xl)}.cta-box{padding:var(--space-2xl) var(--space-lg)}section{padding:var(--space-2xl) var(--space-md)}.section-header{text-align:center}.section-title{font-size:1.75rem}.section-subtitle{font-size:1rem}.benefits-showcase{grid-template-columns:1fr}.other-services-grid{grid-template-columns:1fr}.visual-card{grid-template-columns:1fr 1fr}.approach-features{grid-template-columns:1fr}.faq-grid{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.timeline-step{flex-direction:column;gap:var(--space-md)}.timeline-step:not(:last-child)::before{display:none}.page-hero-content h1, .service-hero-content h1{font-size:1.75rem}.service-hero-subtitle{font-size:1rem}.service-card{padding:var(--space-lg)}.process-steps{gap:var(--space-lg)}.step-card{padding:var(--space-lg)}.contact-layout{grid-template-columns:1fr}.case-card-image{height:180px}}@media (max-width:480px){:root{--space-xl:1.25rem;--space-2xl:1.5rem;--space-3xl:2rem}.hero h1{font-size:1.85rem}.hero-cta{flex-direction:column}.btn-primary, .btn-secondary{width:100%;justify-content:center;padding:1rem 1.5rem}.stats-bar{grid-template-columns:1fr;text-align:center}.stat-item{padding:var(--space-md) 0;border-bottom:1px solid var(--border)}.stat-item:last-child{border-bottom:none}.footer-grid{grid-template-columns:1fr;gap:var(--space-xl)}.footer-bottom{flex-direction:column;text-align:center;gap:var(--space-md)}.footer-legal{justify-content:center}.service-card{padding:var(--space-md)}.service-icon{font-size:2rem}.visual-card{grid-template-columns:1fr}.breadcrumbs{font-size:0.8rem}.nav-container{padding:0 var(--space-md)}.mobile-menu-content{padding:var(--space-lg)}.form-group input, .form-group select, .form-group textarea{padding:0.875rem 1rem;font-size:16px}.cta-box h2{font-size:1.5rem}.cta-box p{font-size:1rem}}/* ============================================ ROI Calculator Styles ============================================ */ .calculator-section{padding:var(--space-4xl) 0}.calculator-wrapper{max-width:800px;margin:0 auto}.calculator-form{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl)}.calculator-step{display:none}.calculator-step.active{display:block;animation:fadeIn 0.4s ease}.calculator-step h3{font-size:1.5rem;margin-bottom:var(--space-sm)}.step-description{color:var(--text-secondary);margin-bottom:var(--space-xl)}.form-group{margin-bottom:var(--space-xl)}.form-group label{display:block;font-weight:600;margin-bottom:var(--space-sm)}.calc-input{width:100%;padding:var(--space-md);background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:1.1rem}.calc-input:focus{outline:none;border-color:var(--accent)}.input-with-prefix{display:flex;align-items:center}.input-with-prefix .prefix{background:var(--bg-secondary);border:1px solid var(--border);border-right:none;padding:var(--space-md);border-radius:var(--radius-md) 0 0 var(--radius-md);color:var(--accent);font-weight:600}.input-with-prefix .calc-input{border-radius:0 var(--radius-md) var(--radius-md) 0}.input-hint{display:block;font-size:0.85rem;color:var(--text-muted);margin-top:var(--space-xs)}.calc-slider{width:100%;height:8px;background:var(--bg-secondary);border-radius:4px;appearance:none;cursor:pointer}.calc-slider::-webkit-slider-thumb{appearance:none;width:24px;height:24px;background:var(--accent);border-radius:50%;cursor:pointer}.slider-value{text-align:center;font-size:1.25rem;font-weight:600;color:var(--accent);margin-top:var(--space-sm)}.checkbox-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-sm)}.checkbox-item{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);background:var(--bg-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast)}.checkbox-item:hover{background:var(--bg-primary)}.checkbox-item input[type="checkbox"]{accent-color:var(--accent)}.step-buttons{display:flex;gap:var(--space-md);margin-top:var(--space-xl)}.calculator-results{display:none;background:var(--bg-card);border:2px solid var(--accent);border-radius:var(--radius-lg);padding:var(--space-2xl);margin-top:var(--space-2xl)}.calculator-results.active{display:block;animation:fadeIn 0.5s ease}.results-header{text-align:center;margin-bottom:var(--space-xl)}.results-header h3{font-size:1.5rem;color:var(--accent)}.results-highlight{text-align:center;padding:var(--space-2xl);background:linear-gradient(135deg, rgba(0,255,136,0.1), rgba(0,212,255,0.1));border-radius:var(--radius-lg);margin-bottom:var(--space-2xl)}.big-number{font-family:var(--font-display);font-size:4rem;font-weight:800;color:var(--accent)}.big-number .currency{font-size:2.5rem;vertical-align:top}.results-breakdown{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--space-lg);margin-bottom:var(--space-2xl)}.result-item{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-lg);background:var(--bg-secondary);border-radius:var(--radius-md)}.result-icon{font-size:2rem}.result-value{display:block;font-size:1.5rem;font-weight:700;color:var(--accent)}.result-label{font-size:0.9rem;color:var(--text-secondary)}.results-timeline{margin-bottom:var(--space-2xl)}.results-timeline h4{margin-bottom:var(--space-lg)}.timeline-bar{position:relative;height:8px;background:var(--bg-secondary);border-radius:4px}.timeline-bar::after{content:'';position:absolute;left:0;top:0;height:100%;width:85%;background:linear-gradient(90deg, var(--accent), var(--accent-secondary));border-radius:4px}.timeline-marker{position:absolute;top:20px;transform:translateX(-50%);text-align:center}.marker-label{display:block;font-size:0.8rem;color:var(--text-muted)}.marker-text{display:block;font-size:0.9rem;font-weight:600;color:var(--accent)}.results-cta{text-align:center;padding:var(--space-xl);background:var(--bg-secondary);border-radius:var(--radius-lg)}.results-cta p{margin-bottom:var(--space-lg)}.results-cta .btn-secondary{margin-left:var(--space-md)}.results-disclaimer{margin-top:var(--space-xl);padding-top:var(--space-lg);border-top:1px solid var(--border)}.results-disclaimer p{font-size:0.8rem;color:var(--text-muted);text-align:center}.roi-explainer-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-lg);margin-top:var(--space-3xl)}.roi-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);text-align:center;transition:all var(--transition-base)}.roi-card:hover{border-color:var(--accent);transform:translateY(-5px)}.roi-icon{font-size:3rem;display:block;margin-bottom:var(--space-md)}.roi-card h3{font-size:1.2rem;margin-bottom:var(--space-sm)}.roi-stat{margin-top:var(--space-md);padding:var(--space-sm) var(--space-md);background:rgba(0,255,136,0.1);border-radius:var(--radius-sm);color:var(--accent);font-weight:600;font-size:0.9rem}.testimonial-stats{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-lg);margin-top:var(--space-2xl)}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);text-align:center}.stat-number{display:block;font-family:var(--font-display);font-size:3rem;font-weight:800;color:var(--accent)}.stat-text{font-size:0.95rem;color:var(--text-secondary)}@media (max-width:768px){.checkbox-grid{grid-template-columns:1fr}.results-breakdown{grid-template-columns:1fr}.roi-explainer-grid, .testimonial-stats{grid-template-columns:repeat(2, 1fr)}.big-number{font-size:3rem}}/* ============================================ Assessment Quiz Styles ============================================ */ .quiz-section{padding:var(--space-4xl) 0}.quiz-wrapper{max-width:700px;margin:0 auto;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2xl)}.quiz-progress{margin-bottom:var(--space-2xl)}.progress-bar{height:8px;background:var(--bg-secondary);border-radius:4px;overflow:hidden;margin-bottom:var(--space-sm)}.progress-fill{height:100%;background:linear-gradient(90deg, var(--accent), var(--accent-secondary));border-radius:4px;transition:width 0.3s ease}.progress-text{font-size:0.9rem;color:var(--text-secondary)}.quiz-question{display:none}.quiz-question.active{display:block;animation:fadeIn 0.4s ease}.quiz-question h3{font-size:1.4rem;margin-bottom:var(--space-xl);line-height:1.4}.quiz-options{display:flex;flex-direction:column;gap:var(--space-md)}.quiz-option{cursor:pointer}.quiz-option input{display:none}.option-box{display:block;padding:var(--space-lg);background:var(--bg-secondary);border:2px solid var(--border);border-radius:var(--radius-md);transition:all var(--transition-fast)}.quiz-option:hover .option-box{border-color:var(--accent);background:var(--bg-primary)}.quiz-option input:checked + .option-box{border-color:var(--accent);background:rgba(0,255,136,0.1)}.option-text{font-size:1.05rem}.quiz-nav{display:flex;justify-content:space-between;margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--border)}.quiz-nav button:disabled{opacity:0.5;cursor:not-allowed}.quiz-results{display:none;max-width:700px;margin:0 auto}.quiz-results.active{display:block}.results-card{background:var(--bg-card);border:2px solid var(--accent);border-radius:var(--radius-lg);padding:var(--space-2xl);text-align:center}.score-circle{position:relative;width:160px;height:160px;margin:0 auto var(--space-xl)}.score-circle svg{transform:rotate(-90deg)}.score-bg{fill:none;stroke:var(--bg-secondary);stroke-width:8}.score-fill{fill:none;stroke:url(#score-gradient);stroke:var(--accent);stroke-width:8;stroke-linecap:round;stroke-dasharray:283;stroke-dashoffset:283;transition:stroke-dashoffset 0.1s ease}.score-text{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);text-align:center}.score-number{display:block;font-family:var(--font-display);font-size:3rem;font-weight:800;color:var(--accent)}.score-label{font-size:0.9rem;color:var(--text-secondary)}.results-card h2{font-size:1.5rem;margin-bottom:var(--space-md)}.result-summary{font-size:1.1rem;color:var(--text-secondary);max-width:500px;margin:0 auto var(--space-2xl)}.result-breakdown{margin-bottom:var(--space-2xl)}.breakdown-item{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md)}.breakdown-label{width:150px;text-align:right;font-size:0.9rem;color:var(--text-secondary)}.breakdown-bar{flex:1;height:12px;background:var(--bg-secondary);border-radius:6px;overflow:hidden}.breakdown-fill{height:100%;background:linear-gradient(90deg, var(--accent), var(--accent-secondary));border-radius:6px}.result-recommendations{text-align:left;background:var(--bg-secondary);padding:var(--space-xl);border-radius:var(--radius-md);margin-bottom:var(--space-2xl)}.result-recommendations h3{font-size:1.1rem;margin-bottom:var(--space-md)}.result-recommendations ul{list-style:none;padding:0}.result-recommendations li{padding:var(--space-sm) 0;padding-left:var(--space-lg);position:relative}.result-recommendations li::before{content:'→';position:absolute;left:0;color:var(--accent)}.result-recommendations a{color:var(--accent)}.result-cta{padding:var(--space-xl);background:var(--bg-secondary);border-radius:var(--radius-md)}.result-cta h3{margin-bottom:var(--space-sm)}.result-cta p{margin-bottom:var(--space-lg);color:var(--text-secondary)}.result-cta .btn-secondary{margin-left:var(--space-md)}/* ============================================ FAQ Section Styles ============================================ */ .faq-section{padding:var(--space-4xl) 0}.faq-grid{max-width:800px;margin:var(--space-2xl) auto 0}.faq-item{border-bottom:1px solid var(--border)}.faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;padding:var(--space-lg) 0;background:none;border:none;cursor:pointer;text-align:left}.faq-question h3{font-size:1.1rem;color:var(--text-primary);margin:0;padding-right:var(--space-md)}.faq-icon{font-size:1.5rem;color:var(--accent);transition:transform var(--transition-fast)}.faq-item.active .faq-icon{transform:rotate(45deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height 0.3s ease}.faq-item.active .faq-answer{max-height:500px}.faq-answer-content{padding-bottom:var(--space-lg);color:var(--text-secondary);line-height:1.7}/* ============================================ Comparison Page Styles ============================================ */ .comparison-table-wrapper{overflow-x:auto;margin:var(--space-2xl) 0}.comparison-table{width:100%;border-collapse:collapse;background:var(--bg-card);border-radius:var(--radius-lg);overflow:hidden}.comparison-table th, .comparison-table td{padding:var(--space-lg);text-align:left;border-bottom:1px solid var(--border)}.comparison-table th{background:var(--bg-secondary);font-weight:600}.comparison-table th:first-child{width:30%}.comparison-table tr:last-child td{border-bottom:none}.comparison-table .highlight-col{background:rgba(0,255,136,0.05)}.comparison-table .highlight-col th{background:rgba(0,255,136,0.15);color:var(--accent)}.check-yes{color:var(--accent);font-weight:bold}.check-no{color:#ff6b6b}.check-partial{color:#ffbd2e}.comparison-cta{text-align:center;padding:var(--space-2xl);background:var(--bg-secondary);border-radius:var(--radius-lg);margin-top:var(--space-2xl)}/* ============================================ Comparison Page Additional Styles ============================================ */ .comparison-cards{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--space-lg);margin-top:var(--space-2xl)}.compare-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl);text-align:center}.compare-card.highlight{border-color:var(--accent);position:relative}.compare-card.highlight::before{content:'RECOMMENDED';position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent);color:var(--bg-primary);font-size:0.75rem;font-weight:700;padding:4px 12px;border-radius:var(--radius-full)}.compare-card h3{font-size:1.5rem;margin-bottom:var(--space-xs)}.compare-tagline{color:var(--text-secondary);margin-bottom:var(--space-md)}.compare-best{font-size:0.9rem;padding:var(--space-sm) var(--space-md);background:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:var(--space-md)}.compare-price{font-size:1.2rem;font-weight:700;color:var(--accent);margin-bottom:var(--space-lg)}.compare-pros{list-style:none;padding:0;text-align:left}.compare-pros li{padding:var(--space-sm) 0;border-top:1px solid var(--border)}.choice-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:var(--space-lg);margin-top:var(--space-2xl)}.choice-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-xl)}.choice-card.highlight{border-color:var(--accent);background:rgba(0,255,136,0.03)}.choice-card h3{font-size:1.2rem;margin-bottom:var(--space-md);color:var(--accent)}.choice-card ul{list-style:none;padding:0}.choice-card li{padding:var(--space-sm) 0;padding-left:var(--space-lg);position:relative}.choice-card li::before{content:'→';position:absolute;left:0;color:var(--accent)}.cost-comparison{max-width:800px;margin:var(--space-2xl) auto}.cost-scenario{margin-bottom:var(--space-2xl)}.cost-scenario h3{margin-bottom:var(--space-lg)}.cost-bars{display:flex;flex-direction:column;gap:var(--space-md)}.cost-bar{display:flex;align-items:center;gap:var(--space-md)}.cost-bar .cost-label{width:200px;flex-shrink:0;text-align:right;font-size:0.9rem}.cost-bar .cost-amount{background:var(--bg-secondary);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);font-weight:600}.cost-bar.highlight .cost-amount{background:linear-gradient(90deg, rgba(0,255,136,0.2), rgba(0,212,255,0.2));color:var(--accent)}.cost-note{font-size:0.85rem;color:var(--text-muted);text-align:center;max-width:600px;margin:var(--space-xl) auto 0}.comparison-cta-section{padding:var(--space-4xl) 0}.comparison-cta-section .comparison-cta{max-width:700px;margin:0 auto}@media (max-width:1024px){.comparison-cards, .choice-grid{grid-template-columns:1fr}.cost-bar{flex-direction:column;align-items:flex-start}.cost-bar .cost-label{width:auto;text-align:left}}/* ============================================ Newsletter Section Styles ============================================ */ .footer-newsletter{display:flex;justify-content:space-between;align-items:center;gap:var(--space-2xl);padding:var(--space-2xl) 0;margin-top:var(--space-2xl);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.newsletter-content h4{font-size:1.2rem;margin-bottom:var(--space-xs)}.newsletter-content p{color:var(--text-secondary);font-size:0.95rem;max-width:400px}.newsletter-form{display:flex;flex-direction:column;gap:var(--space-sm)}.newsletter-input-group{display:flex;gap:var(--space-sm)}.newsletter-input-group input{padding:var(--space-md) var(--space-lg);background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:1rem;min-width:280px}.newsletter-input-group input:focus{outline:none;border-color:var(--accent)}.newsletter-input-group input::placeholder{color:var(--text-muted)}.newsletter-privacy{font-size:0.8rem;color:var(--text-muted)}.newsletter-message{font-size:0.9rem;min-height:20px}.newsletter-message.success{color:var(--accent)}.newsletter-message.error{color:#ff6b6b}@media (max-width:768px){.footer-newsletter{flex-direction:column;text-align:center}.newsletter-content p{max-width:100%}.newsletter-input-group{flex-direction:column;width:100%}.newsletter-input-group input{min-width:100%}}/* ============================================ Cal.com Booking Section Styles ============================================ */ .book-call-section{background:linear-gradient(135deg, var(--accent) 0%, #00cc6a 100%);border-radius:var(--radius-lg);padding:var(--space-xl);display:flex;gap:var(--space-lg);align-items:flex-start;margin-bottom:var(--space-xl)}.book-call-icon{font-size:2.5rem;flex-shrink:0}.book-call-content h4{color:var(--bg-primary);font-size:1.3rem;margin-bottom:var(--space-sm)}.book-call-content p{color:rgba(10, 10, 11, 0.8);margin-bottom:var(--space-md);font-size:0.95rem}.btn-cal{display:inline-flex;align-items:center;gap:var(--space-sm);background:var(--bg-primary) !important;color:var(--accent) !important;border:none;padding:var(--space-md) var(--space-lg);border-radius:var(--radius-md);font-weight:600;transition:all 0.3s ease}.btn-cal:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(0, 0, 0, 0.3)}.btn-cal svg{stroke:var(--accent)}@media (max-width:768px){.book-call-section{flex-direction:column;text-align:center;align-items:center}}/* ============================================ Client Logos Section ============================================ */ #clients{padding:var(--space-3xl) 0}.clients-heading{text-align:center;color:var(--text-secondary);font-size:0.9rem;text-transform:uppercase;letter-spacing:2px;margin-bottom:var(--space-xl)}.clients-grid{display:grid;grid-template-columns:repeat(6, 1fr);gap:var(--space-lg);align-items:center;justify-items:center}.client-logo{opacity:0.5;transition:opacity 0.3s ease;width:100%;max-width:140px}.client-logo:hover{opacity:0.9}.client-logo svg{width:100%;height:auto;color:var(--text-secondary)}@media (max-width:1024px){.clients-grid{grid-template-columns:repeat(3, 1fr);gap:var(--space-xl)}.client-logo{max-width:120px}}@media (max-width:600px){.clients-grid{grid-template-columns:repeat(2, 1fr);gap:var(--space-lg)}.client-logo{max-width:100px}}/* ============================================ Live Stats Counter Section ============================================ */ #live-stats{padding:var(--space-3xl) 0;background:linear-gradient(135deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.live-stats-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:var(--space-xl);text-align:center}.live-stat{padding:var(--space-xl);background:var(--bg-secondary);border-radius:var(--radius-lg);border:1px solid var(--border);transition:all 0.3s ease}.live-stat:hover{transform:translateY(-5px);border-color:var(--accent);box-shadow:0 10px 30px rgba(0, 255, 136, 0.1)}.live-stat-number{font-size:3rem;font-weight:800;color:var(--accent);line-height:1;margin-bottom:var(--space-sm);font-variant-numeric:tabular-nums}.live-stat-label{font-size:0.95rem;color:var(--text-secondary);font-weight:500}@media (max-width:1024px){.live-stats-grid{grid-template-columns:repeat(2, 1fr)}}@media (max-width:600px){.live-stats-grid{grid-template-columns:1fr;gap:var(--space-md)}.live-stat{padding:var(--space-lg)}.live-stat-number{font-size:2.5rem}}/* ============================================ Trust Badges Section ============================================ */ #trust-badges{padding:var(--space-2xl) 0}.trust-badges-grid{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--space-xl)}.trust-badge{display:flex;align-items:center;gap:var(--space-md);padding:var(--space-md) var(--space-lg);background:var(--bg-tertiary);border-radius:var(--radius-md);border:1px solid var(--border);transition:all 0.3s ease}.trust-badge:hover{border-color:var(--accent);transform:translateY(-2px)}.trust-badge-icon{display:flex;align-items:center;justify-content:center;width:50px;height:50px;background:rgba(0, 255, 136, 0.1);border-radius:var(--radius-md)}.trust-badge-icon svg{stroke:var(--accent)}.trust-badge-content{display:flex;flex-direction:column}.trust-badge-content strong{color:var(--text-primary);font-size:0.95rem;font-weight:600}.trust-badge-content span{color:var(--text-muted);font-size:0.8rem}@media (max-width:768px){.trust-badges-grid{gap:var(--space-md)}.trust-badge{flex:1 1 calc(50% - var(--space-md));min-width:200px}}@media (max-width:480px){.trust-badge{flex:1 1 100%}}/* ============================================ COMPREHENSIVE MOBILE FIX ============================================ */ html, body{overflow-x:hidden;max-width:100vw}@media (max-width:768px){.hero-image{margin-right:0;justify-content:center}.hero-image img{max-width:100%;width:100%}.hero{padding-left:var(--space-md);padding-right:var(--space-md)}.hero-container{padding:0}.section-container{padding-left:var(--space-md);padding-right:var(--space-md)}.testimonials-grid{grid-template-columns:1fr;gap:var(--space-lg)}.testimonial-card{padding:var(--space-lg)}.process-grid{grid-template-columns:1fr;gap:var(--space-lg)}.benefits-grid{grid-template-columns:1fr;gap:var(--space-md)}.benefit-card{padding:var(--space-lg)}.newsletter-form{flex-direction:column}.newsletter-form input{width:100%;min-width:0}.newsletter-form button{width:100%}.footer-content{grid-template-columns:1fr;gap:var(--space-xl);text-align:center}.footer-links{flex-direction:column;gap:var(--space-xl)}.footer-links-group{text-align:center}.footer-newsletter{text-align:center}.contact-layout{grid-template-columns:1fr;gap:var(--space-xl)}.contact-info-section, .contact-form-section{width:100%}.book-call-section{flex-direction:column;text-align:center;padding:var(--space-lg)}.book-call-content{text-align:center}.btn-cal{width:100%;justify-content:center}.case-studies-grid{grid-template-columns:1fr}.comparison-table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}.blog-grid{grid-template-columns:1fr}.industries-grid{grid-template-columns:1fr}.team-grid{grid-template-columns:1fr}.values-grid{grid-template-columns:1fr}.page-hero-content{text-align:center;padding:0 var(--space-md)}.page-hero-description{font-size:1rem}}@media (max-width:480px){.live-stats-grid{grid-template-columns:1fr;gap:var(--space-md)}.live-stat{padding:var(--space-lg)}.live-stat-number{font-size:2.25rem}.trust-badges-grid{flex-direction:column;align-items:stretch}.trust-badge{width:100%;justify-content:flex-start}.clients-grid{grid-template-columns:repeat(2, 1fr);gap:var(--space-md)}.client-logo{max-width:100px}.hero-cta{flex-direction:column;width:100%;gap:var(--space-md)}.hero-cta .btn-primary, .hero-cta .btn-secondary{width:100%;text-align:center;justify-content:center}.service-features{font-size:0.85rem}.testimonial-result{flex-direction:column;text-align:center}.prefooter-cta{padding:var(--space-xl) var(--space-md)}.prefooter-cta h2{font-size:1.5rem}.quiz-options{grid-template-columns:1fr}.calculator-grid{grid-template-columns:1fr}.calculator-results{padding:var(--space-lg)}.modal-content{margin:var(--space-md);max-height:calc(100vh - 40px);overflow-y:auto}}@media (min-width:481px) and (max-width:768px){.live-stats-grid{grid-template-columns:repeat(2, 1fr)}.trust-badges-grid{justify-content:center}.trust-badge{flex:0 1 auto}.services-grid{grid-template-columns:repeat(2, 1fr)}.testimonials-grid{grid-template-columns:1fr}.clients-grid{grid-template-columns:repeat(3, 1fr)}}@media (max-width:768px){.nav-link, .footer-link a, button, .btn-primary, .btn-secondary{min-height:44px;display:inline-flex;align-items:center}.quick-action{padding:var(--space-md) var(--space-lg)}}@media (max-width:768px){input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], select, textarea{font-size:16px !important}}@supports (-webkit-touch-callout:none){.navbar{position:fixed;-webkit-backdrop-filter:blur(12px)}}body.menu-open{overflow:hidden}