@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap";#putthebrand-design-lab{--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-display:"Outfit", system-ui, -apple-system, sans-serif;--bg-base:#090d16;--bg-surface:#111827b3;--bg-card:#1e293b73;--color-primary:#10b981;--color-primary-hover:#34d399;--color-secondary:#6366f1;--color-accent:#f43f5e;--text-primary:#f8fafc;--border-light:#ffffff14;--border-focus:#10b98166;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 8px 30px #0006;--shadow-glass:0 8px 32px 0 #0000005e;--radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s ease}#putthebrand-design-lab,#putthebrand-design-lab *{box-sizing:border-box}#putthebrand-design-lab{color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased}#putthebrand-design-lab .container{max-width:1280px;margin:0 auto;padding:0 1.5rem}.text-gradient{background:linear-gradient(135deg,#10b981 0%,#6366f1 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.glass-panel{background:var(--bg-surface);-webkit-backdrop-filter:blur(12px)saturate(180%);border:1px solid var(--border-light);box-shadow:var(--shadow-glass)}#putthebrand-design-lab h1,#putthebrand-design-lab h2,#putthebrand-design-lab h3,#putthebrand-design-lab h4,#putthebrand-design-lab h5,#putthebrand-design-lab h6{font-family:var(--font-display);font-weight:600;line-height:1.25}.btn{font-family:var(--font-display);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.95rem;font-weight:600;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--color-primary) 0%, #059669 100%);color:#04100b;box-shadow:0 4px 14px #10b9814d}.btn-primary:hover{background:linear-gradient(135deg, var(--color-primary-hover) 0%, #10b981 100%);transform:translateY(-2px);box-shadow:0 6px 20px #10b98173}.btn-secondary{color:var(--text-primary);border:1px solid var(--border-light);background:#ffffff0d}.btn-secondary:hover{background:#ffffff1a;border-color:#fff3}.btn-outline{color:var(--color-primary);border:1.5px solid var(--color-primary);background:0 0}.btn-outline:hover{background:#10b98114;transform:translateY(-2px)}.btn:active{transform:translateY(0)}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-normal) forwards}.grid-2{grid-template-columns:repeat(2,1fr);gap:2.5rem;display:grid}.grid-3{grid-template-columns:repeat(3,1fr);gap:2rem;display:grid}.grid-4{grid-template-columns:repeat(4,1fr);gap:1.5rem;display:grid}@media (width<=1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}@media (width<=640px){.grid-4,.grid-3{grid-template-columns:1fr}.nav-links{display:none}.hero{padding-top:110px}}#putthebrand-design-lab .customizer-layout{grid-template-columns:1.1fr .9fr;gap:3rem;padding:40px 0;display:grid}@media (width<=1024px){#putthebrand-design-lab .customizer-layout{grid-template-columns:1fr;gap:2rem}}#putthebrand-design-lab .preview-container{border-radius:var(--radius-lg);border:1px solid var(--border-light);background:radial-gradient(circle,#1e293b99 0%,#0f172acc 100%);flex-direction:column;justify-content:center;align-items:center;height:500px;display:flex;overflow:hidden}#putthebrand-design-lab .canvas-wrapper{width:400px;height:400px;position:relative}#putthebrand-design-lab .product-mockup-svg{z-index:1;width:100%;height:100%;position:absolute;top:0;left:0}#putthebrand-design-lab .uploaded-logo-overlay{z-index:2;cursor:move;-webkit-user-select:none;user-select:none;border:1px dashed #0000;justify-content:center;align-items:center;display:flex;position:absolute}#putthebrand-design-lab .uploaded-logo-overlay.active{border-color:var(--color-primary)}#putthebrand-design-lab .resize-handle{background-color:var(--color-primary);cursor:se-resize;z-index:3;border-radius:50%;width:10px;height:10px;position:absolute;bottom:-5px;right:-5px}#putthebrand-design-lab .color-swatch-group{gap:.75rem;margin-top:.5rem;display:flex}#putthebrand-design-lab .color-swatch{cursor:pointer;width:32px;height:32px;transition:transform var(--transition-fast);border:2px solid #0000;border-radius:50%;box-shadow:inset 0 2px 4px #0003}#putthebrand-design-lab .color-swatch:hover{transform:scale(1.1)}#putthebrand-design-lab .color-swatch.active{border-color:var(--text-primary);transform:scale(1.15)}#putthebrand-design-lab .slider-container{margin-top:1.5rem}#putthebrand-design-lab .slider-labels{justify-content:space-between;margin-bottom:.5rem;font-size:.9rem;display:flex}#putthebrand-design-lab .range-slider{border-radius:var(--radius-full);-webkit-appearance:none;background:#ffffff1a;outline:none;width:100%;height:6px}#putthebrand-design-lab .range-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--color-primary);cursor:pointer;width:20px;height:20px;transition:transform var(--transition-fast);border-radius:50%;box-shadow:0 0 10px #10b98180}#putthebrand-design-lab .range-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}#putthebrand-design-lab .modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;opacity:0;pointer-events:none;transition:opacity var(--transition-normal);background:#04080fd9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#putthebrand-design-lab .modal-overlay.open{opacity:1;pointer-events:auto}#putthebrand-design-lab .modal-content{border-radius:var(--radius-lg);border:1px solid var(--border-light);width:100%;max-width:580px;transition:transform var(--transition-normal);overflow:hidden;transform:translateY(30px)}#putthebrand-design-lab .modal-overlay.open .modal-content{transform:translateY(0)}#putthebrand-design-lab .modal-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:1.5rem 2rem;display:flex}#putthebrand-design-lab .modal-title{color:var(--text-primary);font-size:1.5rem}#putthebrand-design-lab .modal-close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;display:flex}#putthebrand-design-lab .modal-close-btn:hover{color:var(--color-accent)}#putthebrand-design-lab .modal-body{padding:2rem}#putthebrand-design-lab .form-group{margin-bottom:1.25rem}#putthebrand-design-lab .form-label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.9rem;font-weight:500;display:block}#putthebrand-design-lab .form-control{border:1px solid var(--border-light);border-radius:var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:all var(--transition-fast);background:#0f172a99;padding:.25rem 1rem;font-size:.95rem}#putthebrand-design-lab .form-control:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--border-focus);color:var(--text-primary);outline:none}#putthebrand-design-lab .form-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}@media (width<=640px){#putthebrand-design-lab .form-row{grid-template-columns:1fr}}