:root{--primary:#8c52ff;--primary-light:#a366ff;--primary-dark:#7a3de8;--white:#ffffff;--black:#000000;--light-bg:#ffffff;--light-surface:#f8f9fa;--light-card:#ffffff;--gray-light:#f8f9fa;--gray-medium:#6c757d;--gray-dark:#495057;--dark-surface:#1a1a1a;--dark-card:#2a2a2a;--gradient-primary:linear-gradient(135deg,#8c52ff,#a366ff);--gradient-primary-hover:linear-gradient(135deg,#7a3de8,#8c52ff);--gradient-light:linear-gradient(135deg,#ffffff,#f8f9fa);--gradient-card:linear-gradient(135deg,#ffffff,#f8f9fa);--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--spacing-xs:0.25rem;--spacing-sm:0.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--spacing-3xl:4rem;--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--radius-2xl:1.5rem;--shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);--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 20px rgba(140,82,255,0.3);--transition-fast:0.15s ease-in-out;--transition-normal:0.3s ease-in-out;--transition-slow:0.5s ease-in-out}*{box-sizing:border-box}html{scroll-behavior:smooth}body,html{overflow-x:hidden;width:100%}body{font-family:var(--font-family);background-color:var(--light-bg);color:var(--black);line-height:1.6;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;margin:0 0 var(--spacing-md) 0}h1{font-size:var(--font-size-5xl)}h2{font-size:var(--font-size-4xl)}h3{font-size:var(--font-size-3xl)}h4{font-size:var(--font-size-2xl)}h5{font-size:var(--font-size-xl)}h6{font-size:var(--font-size-lg)}p{margin:0 0 var(--spacing-md) 0}.btn,p{font-size:var(--font-size-base)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-md) var(--spacing-xl);border:none;border-radius:var(--radius-lg);font-weight:600;text-decoration:none;cursor:pointer;transition:all var(--transition-normal);gap:var(--spacing-sm);min-height:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.btn-icon{color:currentColor}.btn-primary{background:var(--gradient-primary);color:var(--white);box-shadow:var(--shadow-md)}.btn-primary:hover{background:var(--gradient-primary-hover);transform:translateY(-2px);box-shadow:var(--shadow-lg),var(--shadow-glow)}.btn-outline{background:transparent;color:var(--primary);border:2px solid var(--primary)}.btn-outline:hover{background:var(--primary);color:var(--white);transform:translateY(-2px)}.btn-lg{padding:var(--spacing-lg) var(--spacing-2xl);font-size:var(--font-size-lg)}.card{background:var(--gradient-card);border-radius:var(--radius-xl);padding:var(--spacing-xl);box-shadow:var(--shadow-lg);transition:all var(--transition-normal);touch-action:manipulation;-webkit-tap-highlight-color:transparent}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-xl);width:100%}.nav{background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:fixed;top:0;left:0;right:0;z-index:1000;border-bottom:1px solid rgba(0,0,0,.1)}.nav-container{justify-content:space-between;width:100%;padding:var(--spacing-lg) var(--spacing-xl)}.nav-container,.nav-logo{display:flex;align-items:center}.nav-logo{gap:var(--spacing-sm);font-size:var(--font-size-xl);font-weight:700;color:var(--black);text-decoration:none}.nav-logo-icon{width:32px;height:32px;background:var(--gradient-primary);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:var(--font-size-lg)}.nav-links{display:flex;gap:var(--spacing-xl);list-style:none;margin:0;padding:0}.nav-actions{display:flex;align-items:center;gap:var(--spacing-md)}.desktop-only{display:block}.nav-link{color:var(--black);text-decoration:none;font-weight:500;transition:color var(--transition-fast)}.nav-link:hover{color:var(--primary)}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--spacing-3xl) var(--spacing-lg);background:var(--gradient-light);position:relative;overflow:hidden;width:100%}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 50% 50%,rgba(140,82,255,.1) 0,transparent 70%);pointer-events:none}.hero-content{max-width:800px;z-index:1;position:relative;width:100%;padding:0 var(--spacing-sm)}.hero-badge{display:inline-flex;align-items:center;gap:var(--spacing-sm);background:linear-gradient(135deg,#ff6b35,#f7931e);color:var(--white);padding:var(--spacing-sm) var(--spacing-lg);border-radius:50px;font-size:var(--font-size-sm);font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--spacing-lg);box-shadow:0 4px 15px rgba(255,107,53,.3);animation:pulse 2s infinite;position:relative;overflow:hidden}.hero-badge:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.hero-badge:hover:before{left:100%}.badge-icon{animation:bounce 2s infinite;color:var(--white)}.badge-text{font-size:var(--font-size-xs);font-weight:800}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 4px 15px rgba(255,107,53,.3)}50%{transform:scale(1.05);box-shadow:0 6px 20px rgba(255,107,53,.4)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-3px)}60%{transform:translateY(-2px)}}.hero-title{font-size:var(--font-size-6xl);font-weight:800;margin-bottom:var(--spacing-lg);background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-subtitle{font-size:var(--font-size-xl);color:var(--gray-dark);margin-bottom:var(--spacing-2xl);max-width:600px;margin-left:auto;margin-right:auto}.hero-buttons{display:flex;gap:var(--spacing-lg);justify-content:center;flex-wrap:wrap}.features{padding:var(--spacing-3xl) var(--spacing-lg);background:var(--light-surface);width:100%}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:var(--spacing-2xl);gap:var(--spacing-2xl);max-width:1200px;margin:0 auto;width:100%}.feature-card{text-align:center;padding:var(--spacing-2xl)}.feature-icon{width:60px;height:60px;background:var(--gradient-primary);border-radius:var(--radius-2xl);display:flex;align-items:center;justify-content:center;margin:0 auto var(--spacing-lg) auto;color:var(--white)}.feature-title{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-md)}.feature-description{color:var(--gray-medium);font-size:var(--font-size-base)}.how-it-works{padding:var(--spacing-3xl) var(--spacing-xl);background:var(--light-bg);width:100%}.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:var(--spacing-2xl);gap:var(--spacing-2xl);max-width:1200px;margin:0 auto}.step-card{text-align:center;padding:var(--spacing-2xl);background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);position:relative;min-height:300px;display:flex;flex-direction:column;justify-content:center;transition:all var(--transition-normal)}.step-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.step-number{position:absolute;top:-20px;left:50%;transform:translateX(-50%);width:40px;height:40px;background:var(--gradient-primary);color:var(--white);border-radius:50%;font-weight:700;font-size:var(--font-size-lg);z-index:2}.step-icon-container,.step-number{display:flex;align-items:center;justify-content:center}.step-icon-container{margin:var(--spacing-lg) 0}.step-icon{color:var(--primary);width:40px;height:40px}.step-card h3{margin-bottom:var(--spacing-md);color:var(--black);font-size:var(--font-size-xl)}.step-card p{color:var(--gray-dark);line-height:1.6;margin:0}.app-preview{padding:var(--spacing-3xl) var(--spacing-lg);background:var(--light-bg);position:relative;width:100%}.app-preview-content{display:grid;grid-template-columns:1fr 1fr;grid-gap:var(--spacing-3xl);gap:var(--spacing-3xl);align-items:center;max-width:1200px;margin:0 auto;width:100%}.app-preview-text h2{font-size:var(--font-size-4xl);margin-bottom:var(--spacing-lg)}.app-preview-text p{font-size:var(--font-size-lg);color:var(--gray-dark);margin-bottom:var(--spacing-xl)}.app-mockup{position:relative;display:flex;justify-content:center}.phone-frame{width:280px;height:560px;background:var(--gradient-card);border-radius:30px;padding:20px;box-shadow:var(--shadow-xl),var(--shadow-glow);position:relative}.phone-screen{width:100%;height:100%;background:var(--white);border-radius:20px;overflow:hidden;position:relative}.benefits{padding:var(--spacing-3xl) var(--spacing-xl);background:var(--light-surface);width:100%}.benefits-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:var(--spacing-xl);gap:var(--spacing-xl);max-width:1200px;margin:0 auto}.benefit-card{text-align:center;padding:var(--spacing-xl);background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);transition:all var(--transition-normal)}.benefit-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.benefit-icon-container{display:flex;justify-content:center;align-items:center;margin-bottom:var(--spacing-lg)}.benefit-icon{color:var(--primary);width:24px;height:24px}.benefit-card h3{margin-bottom:var(--spacing-md);color:var(--black);font-size:var(--font-size-lg)}.benefit-card p{color:var(--gray-dark);line-height:1.6;margin:0}.app-features-list{margin:var(--spacing-xl) 0}.app-feature{display:flex;align-items:center;gap:var(--spacing-md);margin-bottom:var(--spacing-md)}.app-feature-icon{color:var(--primary);width:16px;height:16px}.phone-header{background:var(--primary);color:var(--white);padding:10px}.phone-status-bar{font-size:12px;margin-bottom:10px}.phone-nav,.phone-status-bar{display:flex;justify-content:space-between}.phone-nav{align-items:center;font-size:14px;font-weight:600}.phone-content{padding:15px;background:var(--gray-light);height:calc(100% - 120px);overflow-y:auto}.phone-search input{width:100%;padding:10px;border:1px solid #ddd;border-radius:var(--radius-md);margin-bottom:15px}.phone-categories{display:flex;gap:10px;margin-bottom:15px;overflow-x:auto}.category{padding:5px 12px;background:var(--white);border-radius:15px;font-size:12px;white-space:nowrap;cursor:pointer}.category.active{background:var(--primary);color:var(--white)}.phone-products{display:flex;flex-direction:column;gap:10px}.phone-product{gap:10px;padding:10px;background:var(--white);border-radius:var(--radius-md)}.phone-product,.product-image{display:flex;align-items:center}.product-image{width:40px;height:40px;background:#f0f0f0;border-radius:var(--radius-sm);justify-content:center;font-size:20px}.product-info{flex:1 1}.product-info h4{margin:0;font-size:14px;color:var(--black)}.product-info p{margin:0;font-size:12px;color:var(--primary);font-weight:600}.add-btn{width:24px;height:24px;border:none;background:var(--primary);color:var(--white);border-radius:50%;font-size:16px;cursor:pointer}.phone-cart{position:absolute;bottom:0;left:0;right:0;background:var(--white);padding:15px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eee}.cart-icon{position:relative;font-size:20px}.cart-count{position:absolute;top:-5px;right:-5px;background:var(--primary);color:var(--white);border-radius:50%;width:16px;height:16px;font-size:10px;display:flex;align-items:center;justify-content:center}.cart-total{font-weight:600;color:var(--black)}.checkout-btn{background:var(--primary);color:var(--white);border:none;padding:8px 16px;border-radius:var(--radius-md);font-weight:600;cursor:pointer}.cta-section{padding:var(--spacing-3xl) var(--spacing-xl);background:var(--gradient-primary);text-align:center}.cta-content h2{font-size:var(--font-size-4xl);margin-bottom:var(--spacing-lg);color:var(--white)}.cta-content p{font-size:var(--font-size-lg);margin-bottom:var(--spacing-2xl);color:rgba(255,255,255,.9);max-width:600px;margin-left:auto;margin-right:auto}.cta-buttons{display:flex;gap:var(--spacing-lg);justify-content:center;flex-wrap:wrap}.footer{background:var(--dark-surface);padding:var(--spacing-3xl) var(--spacing-xl) var(--spacing-xl)}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-gap:var(--spacing-2xl);gap:var(--spacing-2xl);max-width:1200px;margin:0 auto}.footer-section h4{color:var(--white);margin-bottom:var(--spacing-lg)}.footer-section ul{list-style:none;padding:0;margin:0}.footer-section ul li{margin-bottom:var(--spacing-sm)}.footer-section ul li a{color:var(--gray-medium);text-decoration:none;transition:color var(--transition-fast)}.footer-section ul li a:hover{color:var(--primary)}.footer-logo{display:flex;align-items:center;gap:var(--spacing-sm);font-size:var(--font-size-xl);font-weight:700;color:var(--white);margin-bottom:var(--spacing-md)}.footer-bottom{border-top:1px solid var(--dark-card);padding-top:var(--spacing-xl);margin-top:var(--spacing-2xl);text-align:center;color:var(--gray-medium)}.mobile-menu-toggle{display:none;background:transparent;border:none;cursor:pointer;padding:0;z-index:10;color:var(--black);transition:color var(--transition-fast)}.mobile-menu-toggle:hover{color:var(--primary)}.floating-action-button{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:100;display:none}.fab-button{display:flex;align-items:center;gap:var(--spacing-sm);background:var(--gradient-primary);color:var(--white);padding:var(--spacing-md) var(--spacing-lg);border-radius:50px;text-decoration:none;font-weight:600;box-shadow:var(--shadow-lg),var(--shadow-glow);transition:all var(--transition-normal);font-size:var(--font-size-sm)}.fab-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl),var(--shadow-glow)}.fab-text{display:none}@media (max-width:768px){.nav-container{padding:var(--spacing-md) var(--spacing-lg)}.nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:var(--white);border-top:1px solid rgba(0,0,0,.1);box-shadow:0 4px 12px rgba(0,0,0,.1);flex-direction:column;padding:var(--spacing-lg);gap:var(--spacing-md);z-index:1000}.nav-links.mobile-open{display:flex}.nav-links li{width:100%}.nav-links .nav-link{display:block;padding:var(--spacing-md);border-radius:var(--radius-md);transition:background-color var(--transition-fast)}.nav-links .nav-link:hover{background-color:rgba(140,82,255,.1)}.nav-links .btn{width:100%;justify-content:center}.mobile-menu-toggle{display:block}.desktop-only{display:none}.nav-logo{font-size:var(--font-size-lg)}.nav-logo img{width:62px;height:62px}.logo-text{display:inline}@media (max-width:768px){.logo-text{display:none}}.hero{height:40vh;padding:var(--spacing-xl) var(--spacing-md);padding-top:calc(80px + var(--spacing-lg));display:flex;align-items:center;justify-content:center;width:100%}.hero-badge{padding:var(--spacing-xs) var(--spacing-md);font-size:var(--font-size-xs);margin-bottom:var(--spacing-md)}.badge-icon{width:12px;height:12px}.badge-text{font-size:10px}.hero-title{font-size:var(--font-size-4xl);line-height:1.1;margin-bottom:var(--spacing-md);font-weight:800}.hero-subtitle{font-size:var(--font-size-lg);margin-bottom:var(--spacing-xl);padding:0 var(--spacing-md);line-height:1.5}.hero-buttons{flex-direction:column;align-items:center;gap:var(--spacing-md);width:100%;max-width:300px;margin:0 auto}.btn-lg{width:100%;padding:var(--spacing-lg) var(--spacing-xl);font-size:var(--font-size-base)}.features{padding:var(--spacing-xl) var(--spacing-md);width:100%}.section-header{margin-bottom:var(--spacing-2xl);text-align:center}.section-header h2{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-sm)}.section-header p{font-size:var(--font-size-base);padding:0}.features-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.feature-card{padding:var(--spacing-lg);margin:0;text-align:center}.feature-icon{width:35px;height:35px;margin-bottom:var(--spacing-md)}.feature-title{font-size:var(--font-size-xl);margin-bottom:var(--spacing-sm);text-align:center}.feature-description{font-size:var(--font-size-sm);line-height:1.6;text-align:center}.how-it-works{padding:var(--spacing-xl) var(--spacing-md);width:100%}.how-it-works .section-header{text-align:center;margin-bottom:var(--spacing-xl)}.how-it-works .section-header h2{text-align:center}.how-it-works .section-header p{text-align:center;padding:0}.steps-grid{grid-template-columns:1fr;gap:var(--spacing-lg);width:100%}.step-card{padding:var(--spacing-lg);margin:0;text-align:center;min-height:auto}.step-number{width:36px;height:36px;font-size:var(--font-size-base);top:-18px}.step-icon{margin:var(--spacing-md) 0;color:var(--primary);width:25px;height:25px}.step-card h3{font-size:var(--font-size-lg);margin-bottom:var(--spacing-sm);text-align:center}.step-card p{font-size:var(--font-size-sm);text-align:center}.app-preview{padding:var(--spacing-2xl) var(--spacing-md);width:100%}.app-preview-content{grid-template-columns:1fr;gap:var(--spacing-xl);text-align:center;width:100%}.app-preview-text h2{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-md)}.app-preview-text p{font-size:var(--font-size-base);margin-bottom:var(--spacing-lg);padding:0 var(--spacing-md)}.app-features-list{margin:var(--spacing-lg) 0}.app-feature{margin-bottom:var(--spacing-sm);font-size:var(--font-size-sm)}.app-feature-icon{color:var(--primary);width:12px;height:12px}.phone-frame{width:200px;height:400px;margin:0 auto;border-radius:20px;box-shadow:0 15px 30px rgba(0,0,0,.2)}.benefits{padding:var(--spacing-2xl) var(--spacing-md);width:100%}.benefits-grid{grid-template-columns:1fr;gap:var(--spacing-lg)}.benefit-card{padding:var(--spacing-md)}.benefit-icon{margin-bottom:var(--spacing-md);color:var(--primary);width:18px;height:18px}.benefit-card h3{font-size:var(--font-size-lg);margin-bottom:var(--spacing-sm)}.benefit-card p{font-size:var(--font-size-sm)}.cta-section{padding:var(--spacing-2xl) var(--spacing-md);width:100%}.cta-content h2{font-size:var(--font-size-2xl);margin-bottom:var(--spacing-md)}.cta-content p{font-size:var(--font-size-base);margin-bottom:var(--spacing-xl);padding:0 var(--spacing-md)}.cta-buttons{flex-direction:column;align-items:center;gap:var(--spacing-md);width:100%;max-width:300px;margin:0 auto}.footer{padding:var(--spacing-lg) var(--spacing-md) var(--spacing-sm);width:100%}.footer-content{grid-template-columns:1fr;gap:var(--spacing-xl);text-align:center}.footer-section h4{font-size:var(--font-size-lg);margin-bottom:var(--spacing-md)}.footer-section ul li{margin-bottom:var(--spacing-xs)}.footer-section ul li a{font-size:var(--font-size-sm)}.footer-logo{font-size:var(--font-size-lg);margin-bottom:var(--spacing-sm)}.footer-bottom{padding-top:var(--spacing-lg);margin-top:var(--spacing-xl);font-size:var(--font-size-sm)}.floating-action-button{display:block}.fab-text{display:inline}}@media (max-width:480px){.hero{padding:var(--spacing-xl) var(--spacing-sm);padding-top:calc(10px + var(--spacing-xl));display:flex;align-items:center;justify-content:center;width:100%}.hero-badge{padding:4px var(--spacing-sm);font-size:9px;margin-bottom:var(--spacing-sm)}.badge-icon{font-size:var(--font-size-xs)}.badge-text{font-size:8px}.hero-title{font-size:var(--font-size-3xl);line-height:1.1}.hero-subtitle{font-size:var(--font-size-base);padding:0;line-height:1.5}.btn-lg{padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm)}.feature-card,.step-card{margin:0;padding:var(--spacing-lg)}.how-it-works .section-header{text-align:center;margin-bottom:var(--spacing-lg)}.how-it-works .section-header h2{text-align:center}.how-it-works .section-header p{text-align:center;padding:0}.phone-frame{width:180px;height:360px}.section-header h2{font-size:var(--font-size-xl);text-align:center}.section-header p{font-size:var(--font-size-sm);padding:0;text-align:center}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.animate-fade-in-up{animation:fadeInUp .6s ease-out}.animate-float{animation:float 3s ease-in-out infinite}.landing-page{width:100%;overflow-x:hidden}