.ecommerce-portfolio{color:#102c57;background-color:#fefaf6;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;position:relative;overflow-x:hidden}.animated-bg{z-index:-1;pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0}.floating-shape{background:linear-gradient(135deg,var(--primary),var(--primary-dark));opacity:.03;-ms-border-radius:50%;-o-border-radius:50%;border-radius:50%;animation:8s ease-in-out infinite float;position:absolute}.shape-1{width:300px;height:300px;animation-delay:0s;top:10%;left:5%}.shape-2{width:200px;height:200px;animation-delay:3s;top:60%;right:10%}.shape-3{width:150px;height:150px;animation-delay:6s;bottom:20%;left:15%}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-15px)}to{transform:translateY(0)}}.hero-section{border-bottom:1px solid var(--border);color:var(--text-primary);background:radial-gradient(circle at 30% 30%,#0e3c83,#102c57 60%,#081b34 100%);position:relative;overflow:hidden}.animated-gradient:before{content:"";z-index:0;opacity:.95;background:linear-gradient(-45deg,#0e3c83,#102c57,#0e3c83,#102c57) 0 0/400% 400%;animation:12s infinite gradientShift;position:absolute;inset:0}@keyframes gradientShift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.hero-section .container{z-index:2;position:relative}.hero-title{color:var(--white);font-weight:800;line-height:1.2}.hero-title .text-primary{background:linear-gradient(90deg,#fff,#bcd3ff);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.hero-subtitle{color:#ffffffd9;font-size:1.2rem;font-weight:400;line-height:1.6}.app-badge{letter-spacing:.6px;background:linear-gradient(135deg,#fff,#bcd3ff);border:none;font-weight:600;color:var(--primary-dark)!important}.download-btn,.download-btn-outline{border:2px solid;border-radius:14px;font-weight:600;transition:all .4s;position:relative;overflow:hidden}.download-btn{color:var(--primary-dark);background:linear-gradient(135deg,#fff,#dfeaff);border-color:#0000;box-shadow:0 6px 20px #fff3}.download-btn-outline{color:#fff;background:0 0;border-color:#fff}.download-btn:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 12px 25px #ffffff4d}.download-btn-outline:hover{color:var(--primary-dark);background:#fff;transform:translateY(-2px)scale(1.02)}.floating-phone{filter:drop-shadow(0 10px 25px #0000004d);animation:5s ease-in-out infinite float}.scroll-indicator{cursor:pointer;animation:2s infinite bounce;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}.arrow-icon{color:var(--primary);font-size:1.5rem}@keyframes bounce{0%,80%,to{opacity:.5;transform:scale(0)}40%{opacity:1;transform:scale(1)}}.app-showcase{perspective:1000px;position:relative}.phone-mockup{background:var(--white);width:320px;height:650px;box-shadow:0 25px 50px #00000014,0 15px 35px #0000000d,inset 0 0 0 1px var(--border);border:1px solid var(--border);border-radius:40px;margin:0 auto;position:relative;overflow:hidden}.phone-screen{background:var(--white);width:300px;height:630px;color:var(--text-primary);border-radius:30px;margin:10px;padding:20px}.app-interface{flex-direction:column;height:100%;display:flex}.app-header{color:var(--text-primary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:10px 0 20px;font-weight:600;display:flex}.header-icons{gap:15px;display:flex}.icon{width:24px;height:24px;color:var(--text-secondary);justify-content:center;align-items:center;display:flex}.app-banner{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--white);text-align:center;border-radius:12px;margin:20px 0;padding:20px}.banner-content h6{margin-bottom:5px;font-weight:600}.banner-content p{opacity:.9;margin:0}.app-categories{gap:8px;margin:20px 0;padding-bottom:10px;display:flex;overflow-x:auto}.category-tab{background:var(--background);border:1px solid var(--border);white-space:nowrap;cursor:pointer;color:var(--text-secondary);border-radius:20px;padding:8px 16px;font-size:.9rem;transition:all .3s}.category-tab.active{background:var(--primary);color:var(--white);border-color:var(--primary)}.app-products{flex-grow:1;grid-template-columns:1fr 1fr;gap:15px;display:grid}.product-card{background:var(--background);border:1px solid var(--border);border-radius:12px;padding:15px;transition:all .3s}.product-card:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00000014}.product-image{background:linear-gradient(135deg,var(--primary),var(--primary-dark));opacity:.8;border-radius:8px;width:100%;height:80px;margin-bottom:10px}.product-info{font-size:.9rem}.product-name{margin-bottom:5px;font-weight:500;display:block}.product-rating{color:var(--text-secondary);align-items:center;gap:5px;margin-bottom:5px;font-size:.8rem;display:flex}.product-price{color:var(--primary);font-size:1rem}[data-animate]{opacity:0;transition:all .6s cubic-bezier(.4,0,.2,1);transform:translateY(30px)}[data-animate].animate-in{opacity:1;transform:translateY(0)}[data-animate=fade-in-up].animate-in{transform:translateY(0)}[data-animate=zoom-in].animate-in{transform:scale(1)}[data-animate=slide-in-left].animate-in{transform:translate(0)}[data-animate=flip-in].animate-in{transform:rotateY(0)}.features-section,.categories-section,.stats-section,.contact-section{background:var(--white);position:relative}.app-exclusive-section{background:var(--background);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.cta-section{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--white)}.section-title{color:var(--text-primary);font-weight:700}.section-subtitle{color:var(--text-secondary);font-weight:400}.feature-card{background:var(--white);border:1px solid var(--border);border-radius:16px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 10px #0000000a}.feature-card:hover{border-color:var(--primary);transform:translateY(-5px);box-shadow:0 15px 35px #00000014}.feature-icon-wrapper{background:linear-gradient(135deg,var(--primary),var(--primary-dark));border:2px solid #0e3c831a}.feature-icon{color:var(--white)}.feature-title{color:var(--text-primary);font-weight:600}.feature-description{color:var(--text-secondary);line-height:1.6}.app-preview{justify-content:center;align-items:center;height:500px;display:flex;position:relative}.main-phone{background:var(--white);z-index:2;width:280px;height:580px;box-shadow:0 20px 40px #00000014,inset 0 0 0 1px var(--border);border:1px solid var(--border);border-radius:35px;position:relative}.floating-card{background:var(--white);border:1px solid var(--border);z-index:1;text-align:center;border-radius:12px;min-width:120px;padding:20px;position:absolute;box-shadow:0 10px 25px #00000014}.card-1{animation:4s ease-in-out infinite float;top:60px;left:30px}.card-2{animation:4s ease-in-out 2s infinite float;bottom:60px;right:30px}.benefits-list{font-size:.95rem}.benefit-item{transition:all .3s}.benefit-item:hover{transform:translate(5px)}.benefit-check{background:var(--primary);width:24px;height:24px;color:var(--white);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-right:12px;display:flex}.category-card{background:var(--white);border:1px solid var(--border);border-radius:16px;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 10px #0000000a}.category-card:hover{border-color:var(--primary);transform:translateY(-5px);box-shadow:0 15px 35px #00000014}.category-icon-wrapper{background:var(--background);border:2px solid var(--border)}.category-icon{color:var(--primary)}.category-btn{border-color:var(--primary);color:var(--primary);border-radius:20px;font-weight:500}.category-btn:hover{background:var(--primary);color:var(--white)}.stats-section{background:var(--background);border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.stat-card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:40px 20px;transition:all .3s;box-shadow:0 2px 10px #0000000a}.stat-card:hover{border-color:var(--primary);transform:translateY(-5px);box-shadow:0 15px 35px #00000014}.stat-icon{color:var(--primary)}.stat-number{color:var(--primary);font-weight:700}.stat-label{color:var(--text-secondary);font-weight:500}.contact-card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:40px 20px;transition:all .3s;box-shadow:0 2px 10px #0000000a}.contact-card:hover{border-color:var(--primary);transform:translateY(-5px);box-shadow:0 15px 35px #00000014}.contact-icon{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--white);border:2px solid #0e3c831a}.contact-info{color:var(--text-primary);font-size:1.1rem;font-weight:500}@media (max-width:768px){.hero-title{font-size:2.5rem}.phone-mockup{width:280px;height:580px}.phone-screen{width:260px;height:560px}.display-5{font-size:2rem}.display-6{font-size:1.75rem}.app-preview{height:400px}.main-phone{width:240px;height:500px}.floating-card{transform:scale(.8)}}:root{--primary:#0e3c83;--primary-dark:#102c57;--background:#fefaf6;--white:#fff;--text-primary:#102c57;--text-secondary:#6b7280;--border:#e5e7eb}.auth-container{background:linear-gradient(135deg,#fefaf6 0%,#fff 100%);min-height:100vh;position:relative}.auth-card{border:1px solid var(--border)!important;border-radius:16px!important}.auth-input{border-left:none!important;border-right:none!important}.auth-input:focus{box-shadow:none!important;border-color:#dee2e6!important}.input-group-text{background-color:var(--white)!important;border-right:none!important}.password-toggle{border-left:none!important}.auth-submit-btn{background:linear-gradient(135deg,var(--primary),var(--primary-dark))!important;border:none!important;border-radius:8px!important;padding:12px 24px!important}.social-auth-btn{border-radius:8px!important;padding:8px 16px!important}.success-icon{color:#198754}.dashboard-container{background-color:var(--background);min-height:100vh}.dashboard-sidebar{background:var(--white);border-right:1px solid var(--border);z-index:1000;height:100vh;transition:all .3s;position:fixed;top:0;left:0}.dashboard-sidebar.open{width:280px}.dashboard-sidebar.closed{width:80px}.dashboard-main{transition:all .3s}.dashboard-main.sidebar-open{margin-left:280px}.dashboard-main.sidebar-closed{margin-left:80px}.dashboard-navbar{height:70px}.dashboard-content{min-height:calc(100vh - 70px);padding:2rem}.nav-item{color:var(--text-secondary);border-radius:8px;padding:.75rem 1rem;text-decoration:none;transition:all .3s}.nav-item:hover,.nav-item.active{color:var(--primary);background-color:#0e3c831a}.nav-icon{width:24px;font-size:1.2rem}.search-box .form-control{border-radius:8px 0 0 8px!important}.search-box .input-group-text{border-radius:0 8px 8px 0!important}.user-avatar{width:32px;height:32px;font-size:.9rem;font-weight:600}.dashboard-stat-card{transition:all .3s;border-radius:12px!important}.dashboard-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a!important}.stat-icon{font-size:2rem}.table th{color:var(--text-primary);background-color:var(--background);border-top:none;padding:1rem .75rem;font-weight:600}.table td{vertical-align:middle;padding:1rem .75rem}@media (max-width:768px){.dashboard-sidebar{transform:translate(-100%)}.dashboard-sidebar.open{width:280px;transform:translate(0)}.dashboard-main{margin-left:0!important}.user-name{display:none}.search-box{width:200px}}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark))!important;border:none!important}.btn-primary:hover{background:linear-gradient(135deg,var(--primary-dark),#0a2a4d)!important}.text-primary{color:var(--primary)!important}.bg-primary{background-color:var(--primary)!important}.border-primary{border-color:var(--primary)!important}.full-page-loader{z-index:9999;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loader-dot{animation:1.4s ease-in-out infinite both bounce}.minimal-loader{border:3px solid #f3f3f3;border-top-color:#3498db;border-radius:50%;animation:1s linear infinite spin}@media (prefers-color-scheme:dark){.full-page-loader{background-color:#000000e6}}.skeleton{background:linear-gradient(90deg,#eee,#f5f5f5,#eee) 0 0/200% 100%;border-radius:4px;animation:1.2s infinite shimmer}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-text{width:80%;height:12px;margin-bottom:6px}.skeleton-sm{width:60%;height:10px}.skeleton-avatar{border-radius:50%;width:38px;height:38px}