@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";
@font-face{font-family:Outfit;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Outfit;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Outfit Fallback;src:local(Arial);ascent-override:100.18%;descent-override:26.05%;line-gap-override:0.0%;size-adjust:99.82%}.outfit_ca35ecd4-module__VNkuCW__className{font-family:Outfit,Outfit Fallback;font-style:normal}.outfit_ca35ecd4-module__VNkuCW__variable{--font-outfit:"Outfit", "Outfit Fallback"}
:root{--bg-dark:#090a0f;--bg-panel:#ffffff08;--bg-panel-hover:#ffffff0f;--border-color:#ffffff14;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent-color:#6366f1;--accent-hover:#818cf8;--accent-glow:#6366f159;--danger-color:#f43f5e;--success-color:#10b981;--font-family:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-dark);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(circle at 15%,#6366f11f 0%,#0000 50%),radial-gradient(circle at 85% 30%,#a855f71f 0%,#0000 50%);background-attachment:fixed;min-height:100vh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{letter-spacing:-.02em;font-weight:600}button{cursor:pointer;border:none;outline:none;font-family:inherit;transition:all .3s}input,select{outline:none;font-family:inherit}.glass-panel{background:var(--bg-panel);-webkit-backdrop-filter:blur(20px);border:1px solid var(--border-color);border-radius:24px;transition:all .4s cubic-bezier(.175,.885,.32,1.05);box-shadow:0 8px 32px #0003}.glass-panel:hover{border-color:#ffffff26;box-shadow:0 12px 40px #0000004d}.container{max-width:1400px;margin:0 auto;padding:2rem}.header{text-align:center;margin-bottom:3rem}.header h1{background:linear-gradient(135deg,#818cf8 0%,#c084fc 100%);-webkit-text-fill-color:transparent;letter-spacing:-.03em;text-shadow:0 10px 30px #8b5cf64d;-webkit-background-clip:text;margin-bottom:.75rem;font-size:3.5rem;font-weight:700}.header p{color:var(--text-secondary);font-size:1.1rem}.main-grid{grid-template-columns:1fr 1fr;align-items:start;gap:2rem;display:grid}@media (max-width:1024px){.main-grid{grid-template-columns:1fr}}.section-title{align-items:center;gap:.5rem;margin-bottom:1.5rem;font-size:1.5rem;display:flex}.products-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.5rem;display:grid}.product-card{flex-direction:column;gap:1rem;padding:1.25rem;transition:transform .3s,box-shadow .3s;display:flex}.product-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px -5px #00000080}.product-image-wrapper{aspect-ratio:1;background:linear-gradient(#fff,#f1f5f9);border-radius:16px;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 -2px 10px #0000000d}.product-image-wrapper img{object-fit:contain;filter:drop-shadow(0 8px 12px #0000001a);width:85%;height:85%;transition:transform .6s cubic-bezier(.16,1,.3,1)}.product-card:hover .product-image-wrapper img{transform:scale(1.05)}.product-info{flex-direction:column;flex-grow:1;gap:.5rem;display:flex}.product-name{font-size:1rem;font-weight:500;line-height:1.3}.product-meta{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.product-price{color:var(--success-color);font-size:1.1rem;font-weight:600}.product-size{color:var(--text-secondary);background:#ffffff1a;border-radius:4px;padding:.2rem .5rem;font-size:.85rem}.btn-add{background:linear-gradient(135deg, var(--accent-color), #8b5cf6);color:#fff;width:100%;box-shadow:0 4px 15px var(--accent-glow);border-radius:12px;justify-content:center;align-items:center;gap:.5rem;padding:.85rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex}.btn-add:hover{background:linear-gradient(135deg,#818cf8,#a78bfa);transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf680}.btn-add:active{transform:translateY(1px)scale(.98);box-shadow:0 2px 10px #8b5cf666}.box-management{position:sticky;top:2rem}.box-controls{flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem;display:flex}.box-selector{background:var(--bg-panel);border:1px solid var(--border-color);color:#fff;appearance:none;cursor:pointer;border-radius:8px;flex-grow:1;padding:.75rem 1rem;font-size:1rem}.box-selector option{background:var(--bg-dark);color:#fff}.btn-create-box{border:1px solid var(--accent-color);color:var(--accent-hover);background:0 0;border-radius:12px;padding:.75rem 1.5rem;font-weight:600;transition:all .3s}.btn-create-box:hover{background:var(--accent-glow);box-shadow:0 4px 15px var(--accent-glow);color:#fff}.active-box-view{flex-direction:column;min-height:400px;padding:2rem;display:flex}.box-header{border-bottom:1px solid var(--border-color);margin-bottom:1.5rem;padding-bottom:1rem}.box-header h3{margin-bottom:.5rem;font-size:1.75rem}.box-dims{color:var(--text-secondary);gap:1rem;font-size:.95rem;display:flex}.capacity-meter{background:#0000004d;border-radius:6px;height:12px;margin-top:1.5rem;position:relative;overflow:hidden}.capacity-fill{background:linear-gradient(90deg, var(--success-color), #34d399);height:100%;transition:width .5s}.capacity-fill.warning{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.capacity-fill.danger{background:linear-gradient(90deg, var(--danger-color), #f87171)}.capacity-text{color:var(--text-secondary);justify-content:space-between;margin-top:.5rem;font-size:.85rem;display:flex}.packed-items{flex-direction:column;flex-grow:1;gap:1rem;max-height:500px;padding-right:.5rem;display:flex;overflow-y:auto}.packed-items::-webkit-scrollbar{width:6px}.packed-items::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.packed-items::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.empty-state{text-align:center;color:var(--text-secondary);opacity:.6;flex-direction:column;align-items:center;gap:1rem;margin:auto;display:flex}.empty-state svg{width:64px;height:64px}.packed-item-row{background:#ffffff08;border:1px solid #0000;border-radius:8px;align-items:center;gap:1rem;padding:.75rem;transition:border-color .3s;display:flex}.packed-item-row:hover{border-color:#ffffff1a}.packed-item-img{object-fit:contain;background:#fff;border-radius:6px;width:48px;height:48px;padding:4px}.packed-item-details{flex-grow:1}.packed-item-name{margin-bottom:.25rem;font-size:.95rem}.packed-item-size{color:var(--text-secondary);font-size:.8rem}.btn-remove{color:var(--danger-color);background:0 0;border-radius:4px;padding:.5rem}.btn-remove:hover{background:#ef44441a}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;opacity:0;visibility:hidden;background:#000000b3;justify-content:center;align-items:center;transition:all .3s;display:flex;position:fixed;inset:0}.modal-overlay.open{opacity:1;visibility:visible}.modal-content{background:#0f1117d9;border-radius:28px;width:100%;max-width:500px;padding:2.5rem;transition:all .4s cubic-bezier(.175,.885,.32,1.15);transform:translateY(20px)scale(.95);box-shadow:0 25px 50px -12px #000000b3}.modal-overlay.open .modal-content{transform:translateY(0)scale(1)}.modal-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.modal-title{font-size:1.5rem}.btn-close{color:var(--text-secondary);background:0 0;font-size:1.5rem}.btn-close:hover{color:#fff}.form-group{margin-bottom:1.25rem}.form-group label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.9rem;display:block}.form-control{border:1px solid var(--border-color);color:#fff;background:#0003;border-radius:12px;width:100%;padding:.85rem 1rem;font-size:1rem;transition:all .3s}.form-control:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px var(--accent-glow);background:#0006}.form-row{grid-template-columns:1fr 1fr 1fr;gap:1rem;display:grid}.btn-submit{background:linear-gradient(135deg, var(--accent-color), #8b5cf6);color:#fff;width:100%;box-shadow:0 4px 15px var(--accent-glow);border-radius:12px;margin-top:1.5rem;padding:1rem;font-size:1.1rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1)}.btn-submit:hover:not(:disabled){background:linear-gradient(135deg,#818cf8,#a78bfa);transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf680}.btn-submit:disabled{opacity:.5;cursor:not-allowed}.error-text{color:var(--danger-color);margin-top:.5rem;font-size:.85rem;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.4s forwards fadeIn}@keyframes slideUp{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.animate-slide-up{animation:.3s cubic-bezier(.175,.885,.32,1.275) forwards slideUp}.toast-warning{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;z-index:2000;background:#ef4444e6;border:1px solid #fff3;border-radius:8px;align-items:center;gap:1rem;min-width:300px;max-width:90vw;padding:1rem 1.5rem;display:flex;position:fixed;bottom:2rem;left:50%;transform:translate(-50%);box-shadow:0 10px 25px -5px #ef444480}.toast-warning span{flex-grow:1;font-weight:500}.btn-close-toast{color:#fff;opacity:.8;background:0 0;font-size:1.25rem;transition:opacity .3s}.btn-close-toast:hover{opacity:1}.navbar{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:4rem;padding:1.5rem 0;display:flex}.logo{background:linear-gradient(135deg,#f8fafc,#94a3b8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:.5rem;font-size:1.5rem;font-weight:700;display:flex}.logo span{color:var(--accent-color);-webkit-text-fill-color:var(--accent-color)}.nav-links{align-items:center;gap:2rem;display:flex}.nav-link{color:var(--text-secondary);font-weight:500;text-decoration:none;transition:color .3s}.nav-link:hover{color:var(--text-primary)}.btn-nav-primary{background:var(--accent-color);color:#fff;border-radius:20px;padding:.6rem 1.5rem;font-weight:600;text-decoration:none;transition:background .3s}.btn-nav-primary:hover{background:var(--accent-hover)}.hero{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;margin-bottom:6rem;display:grid}.hero-content h1{background:linear-gradient(135deg,#fff 0%,#a5b4fc 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:1.5rem;font-size:4rem;line-height:1.1}.hero-content p{color:var(--text-secondary);margin-bottom:2rem;font-size:1.2rem;line-height:1.6}.hero-buttons{gap:1rem;display:flex}.btn-primary{background:linear-gradient(135deg, var(--accent-color), #8b5cf6);color:#fff;box-shadow:0 4px 15px var(--accent-glow);border-radius:12px;padding:1rem 2rem;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf680}.btn-secondary{border:1px solid var(--border-color);color:#fff;background:#ffffff0d;border-radius:12px;padding:1rem 2rem;font-size:1.1rem;font-weight:600;text-decoration:none;transition:all .3s}.btn-secondary:hover{background:#ffffff1a}.hero-image{border:1px solid var(--border-color);border-radius:24px;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000080}.hero-image img{width:100%;height:auto;display:block}.marketing-section{margin-bottom:6rem}.section-heading{text-align:center;margin-bottom:3rem}.section-heading h2{margin-bottom:1rem;font-size:2.5rem}.section-heading p{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:1.1rem}.tiers-grid{grid-template-columns:repeat(4,1fr);gap:1.5rem;display:grid}.tier-card{text-align:center;flex-direction:column;gap:1rem;padding:2rem;display:flex;position:relative;overflow:hidden}.tier-card:before{content:"";background:var(--border-color);height:4px;transition:background .3s;position:absolute;top:0;left:0;right:0}.tier-card:hover:before{background:var(--accent-color)}.tier-card h3{color:var(--accent-hover);font-size:1.5rem}.tier-cbm{margin:.5rem 0;font-size:2.5rem;font-weight:700}.tier-target{color:var(--text-secondary);font-size:.9rem}.features-grid{grid-template-columns:repeat(3,1fr);gap:2rem;display:grid}.feature-item{background:var(--bg-panel);border:1px solid var(--border-color);border-radius:16px;flex-direction:column;gap:1rem;padding:2rem;transition:all .3s;display:flex}.feature-item:hover{border-color:#ffffff26;transform:translateY(-5px)}.feature-icon{width:48px;height:48px;color:var(--accent-color);background:#6366f11a;border-radius:12px;justify-content:center;align-items:center;display:flex}.feature-item h3{font-size:1.25rem}.feature-item p{color:var(--text-secondary);line-height:1.5}.how-it-works{text-align:center;justify-content:space-between;gap:2rem;display:flex}.step{flex:1}.step-number{background:var(--accent-color);color:#fff;width:40px;height:40px;box-shadow:0 4px 10px var(--accent-glow);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 1rem;font-weight:700;display:flex}.step h4{margin-bottom:.5rem}.step p{color:var(--text-secondary);font-size:.9rem}.footer{border-top:1px solid var(--border-color);color:var(--text-secondary);justify-content:space-between;margin-top:4rem;padding:3rem 0;display:flex}@media (max-width:1024px){.hero{text-align:center;grid-template-columns:1fr}.hero-buttons{justify-content:center}.tiers-grid,.features-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.nav-links{display:none}.tiers-grid,.features-grid{grid-template-columns:1fr}.how-it-works{flex-direction:column}}
