.options-grid[data-v-5073a71e]{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1rem;margin-bottom:1.5rem;display:grid}.option-item[data-v-5073a71e]{border:2px solid var(--border);text-align:center;cursor:pointer;background:var(--card-bg);border-radius:.5rem;padding:1rem;transition:all .2s}.option-item[data-v-5073a71e]:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.option-item.selected[data-v-5073a71e]{border-color:var(--gold);background:var(--gold-light);font-weight:600}.option-label[data-v-5073a71e]{color:var(--text);margin-bottom:.5rem;font-weight:600}.option-units[data-v-5073a71e]{color:var(--text-secondary);font-size:.85rem}.bean-card[data-v-57acb103]{border:2px solid var(--border);text-align:center;cursor:pointer;background:var(--card-bg);border-radius:.75rem;padding:1.5rem;transition:all .2s}.bean-card[data-v-57acb103]:hover{transform:translateY(-4px);box-shadow:0 8px 16px #00000026}.bean-card.selected[data-v-57acb103]{border-color:var(--gold);background:var(--gold-light)}.bean-card i[data-v-57acb103]{color:var(--gold);margin-bottom:.75rem;font-size:2.5rem}.bean-name[data-v-57acb103]{color:var(--text);margin-bottom:.25rem;font-size:1.1rem;font-weight:600}.bean-origin[data-v-57acb103]{color:var(--text-secondary);margin-bottom:.75rem;font-size:.9rem}.bean-match[data-v-57acb103]{color:var(--gold);margin-bottom:.75rem;font-weight:600}.bean-tags[data-v-57acb103]{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:.75rem;display:flex}.bean-tag[data-v-57acb103]{background:var(--tag-bg);color:var(--tag-text);border-radius:1rem;padding:.25rem .75rem;font-size:.8rem;display:inline-block}.bean-desc[data-v-57acb103]{color:var(--text-secondary);font-size:.9rem;line-height:1.4}.color-grid[data-v-7d7ac913]{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem;margin-bottom:1.5rem;display:grid}.color-option[data-v-7d7ac913]{border:2px solid var(--border);cursor:pointer;border-radius:.5rem;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;transition:all .2s;display:flex}.color-option[data-v-7d7ac913]:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.color-option.selected[data-v-7d7ac913]{border-color:var(--gold);background:var(--gold-light)}.color-swatch[data-v-7d7ac913]{border-radius:.375rem;width:50px;height:50px;box-shadow:0 2px 4px #00000026}.color-name[data-v-7d7ac913]{text-align:center;color:var(--text);word-break:break-word;font-size:.85rem;font-weight:600}.section-header[data-v-efbd58aa]{text-align:center;margin-bottom:3rem}.section-header h2[data-v-efbd58aa]{margin-bottom:1rem;font-size:clamp(2rem,6vw,3rem);font-weight:900}.section-header h2 span[data-v-efbd58aa]{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.section-header p[data-v-efbd58aa]{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:clamp(.95rem,2vw,1.15rem)}.section-title[data-v-efbd58aa]{color:var(--text-primary);align-items:center;gap:1rem;margin-bottom:1.5rem;font-size:clamp(1.3rem,3.5vw,1.7rem);font-weight:900;display:flex}.step-num[data-v-efbd58aa]{background:linear-gradient(135deg, var(--gold), var(--gold-bright));color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:45px;height:45px;font-size:1.1rem;font-weight:900;display:flex;box-shadow:0 8px 24px #f4b5814d}.form-group[data-v-c8449305]{margin-bottom:1.5rem}.form-label[data-v-c8449305]{text-transform:uppercase;letter-spacing:.6px;margin-bottom:.8rem;font-size:.9rem;font-weight:800;display:block;position:relative}.form-label[data-v-c8449305]:after{content:"";background:linear-gradient(90deg, var(--gold), var(--gold-bright));border-radius:2px;width:40px;height:2px;position:absolute;bottom:-6px;left:0}input[data-v-c8449305],textarea[data-v-c8449305]{border:2px solid var(--border);background:var(--surface-alt);width:100%;color:var(--text-primary);border-radius:12px;padding:1rem;font-family:inherit;font-size:.95rem;font-weight:600;transition:all .4s cubic-bezier(.2,0,.8,1)}input[data-v-c8449305]:focus,textarea[data-v-c8449305]:focus{border-color:var(--gold);background:var(--surface);outline:none;box-shadow:0 0 0 4px #f4b5811f}:root{--light-bg-primary:#fafaf8;--light-bg-secondary:#f3ede6;--light-surface:#fff;--light-surface-alt:#f9f7f4;--light-text-primary:#1a1410;--light-text-secondary:#5a5450;--light-border:#e8e0d8;--light-gold:#d4a574;--light-gold-bright:#f4b581;--dark-bg-primary:#121212;--dark-bg-secondary:#1e1e1e;--dark-surface:#252525;--dark-surface-alt:#2d2d2d;--dark-text-primary:#f5f5f5;--dark-text-secondary:#b8b8b8;--dark-border:#3a3a3a;--dark-gold:#e8b878;--dark-gold-bright:#f0c890;--bg-primary:var(--light-bg-primary);--bg-secondary:var(--light-bg-secondary);--surface:var(--light-surface);--surface-alt:var(--light-surface-alt);--text-primary:var(--light-text-primary);--text-secondary:var(--light-text-secondary);--text-tertiary:#8a8480;--border:var(--light-border);--gold:var(--light-gold);--gold-bright:var(--light-gold-bright);--radius:16px;--shadow-sm:0 4px 16px #00000014;--shadow-md:0 12px 32px #0000001f;--shadow-lg:0 24px 56px #00000029;--transition:all .4s cubic-bezier(.2, 0, .8, 1)}[data-theme=dark]{--bg-primary:var(--dark-bg-primary);--bg-secondary:var(--dark-bg-secondary);--surface:var(--dark-surface);--surface-alt:var(--dark-surface-alt);--text-primary:var(--dark-text-primary);--text-secondary:var(--dark-text-secondary);--text-tertiary:#888;--border:var(--dark-border);--gold:var(--dark-gold);--gold-bright:var(--dark-gold-bright)}[data-theme=dark] .hero{background:linear-gradient(135deg, var(--bg-secondary) 0%, #0a0a0a 100%)}[data-theme=dark] .nav-floating{background:#1f1a17e6}[data-theme=dark] .section-card,[data-theme=dark] .config-section,[data-theme=dark] .mock-bag{background:var(--surface)}[data-theme=dark] .preview-specs{background:var(--surface-alt)}[data-theme=dark] .bean-card{background:var(--surface)}[data-theme=dark] input,[data-theme=dark] textarea,[data-theme=dark] select{background:var(--surface-alt);color:var(--text-primary)}[data-theme=dark] .qty-input{background:var(--surface)}[data-theme=dark] .metric-item{background:var(--surface-alt)}[data-theme=dark] .site-footer{background:var(--surface)}[data-theme=dark] .bag-icon{color:#e8b878!important}[data-theme=dark] .hero h1,[data-theme=dark] .section-card h2,[data-theme=dark] .section-title,[data-theme=dark] .question-item h3,[data-theme=dark] .bean-name,[data-theme=dark] .mock-bag h3{color:var(--text-primary)}[data-theme=dark] .spec-label{color:var(--text-secondary)}[data-theme=dark] .spec-value{color:var(--gold)}[data-theme=dark] .form-label{color:var(--text-primary)}[data-theme=dark] .bag-brand{color:#f5f0e8}[data-theme=dark] .bag-tagline{color:#c8bfb5}[data-theme=dark] .slider-group{background:var(--surface-alt)}[data-theme=dark] .slider-label{color:var(--text-primary)}[data-theme=dark] .intro-step{background:var(--surface)}[data-theme=dark] .intro-step:hover,.selected-state{border-color:var(--gold)}.lift-on-hover{transition:var(--transition)}.lift-on-hover:hover{box-shadow:var(--shadow-lg);border-color:var(--gold);transform:translateY(-6px)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:var(--text-primary);background:var(--bg-primary);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;line-height:1.6;transition:background-color .5s,color .5s}.nav-floating{z-index:1000;background:var(--surface);border:1px solid var(--border);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:50px;justify-content:space-between;align-items:center;gap:1rem;max-width:calc(100% - 2rem);padding:.7rem 1.2rem;display:flex;position:fixed;top:1rem;left:1rem;right:1rem}.nav-brand{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;cursor:pointer;transition:var(--transition);-webkit-background-clip:text;background-clip:text;align-items:center;gap:.6rem;font-size:1.3rem;font-weight:900;display:flex}.nav-brand:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.nav-menu{flex-wrap:wrap;flex:1;justify-content:center;gap:.5rem;display:flex}.nav-menu a{border:1px solid var(--border);background:var(--surface);color:var(--text-primary);transition:var(--transition);white-space:nowrap;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50px;padding:.6rem 1rem;font-size:.9rem;text-decoration:none}.nav-menu a:hover{background:var(--gold);color:#fff;box-shadow:var(--shadow-md);transform:translateY(-2px)}.nav-menu a.active{background:var(--gold);color:#fff;font-weight:600}.nav-actions{gap:.6rem;display:flex}.mobile-menu-btn{display:none}.btn-icon{background:var(--gold);cursor:pointer;color:#fff;width:44px;height:44px;transition:var(--transition);box-shadow:var(--shadow-md);border:none;border-radius:50px;justify-content:center;align-items:center;font-size:1.1rem;display:flex}.btn-icon:hover{box-shadow:var(--shadow-lg);transform:scale(1.1)}.hero{background:linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-primary) 100%);justify-content:center;align-items:center;min-height:100vh;padding:2rem 1.5rem;display:flex}.hero-content{text-align:center;max-width:900px}.hero h1{letter-spacing:-1px;margin-bottom:1.5rem;font-size:clamp(2.5rem,8vw,4.5rem);font-weight:900;line-height:1.1}.hero h1 span{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero p{color:var(--text-secondary);margin-bottom:2.5rem;font-size:clamp(1rem,3vw,1.3rem);font-weight:500;line-height:1.8}.btn-primary{background:linear-gradient(135deg, var(--gold), var(--gold-bright));color:#fff;cursor:pointer;transition:var(--transition);text-transform:uppercase;letter-spacing:1px;border:none;border-radius:50px;align-items:center;gap:.8rem;padding:1.1rem 2.5rem;font-size:clamp(.95rem,2vw,1.1rem);font-weight:800;display:inline-flex;box-shadow:0 16px 40px #f4b58159}.btn-primary:hover{transform:translateY(-6px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--surface-alt);border:2px solid var(--border);cursor:pointer;transition:var(--transition);color:var(--text-primary);border-radius:50px;align-items:center;gap:.6rem;padding:.9rem 1.8rem;font-weight:800;display:inline-flex}.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}.section{background:var(--bg-primary);padding:3rem 1.5rem}.section-inner{width:100%;max-width:1400px;margin:0 auto}.section-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);border:1px solid var(--border);width:100%;max-width:1200px;margin:0 auto;padding:clamp(2rem,5vw,4rem)}.section-card h2{text-align:center;margin-bottom:1rem;font-size:clamp(1.8rem,5vw,2.5rem);font-weight:900}.section-card h2 span{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.section-card>p{color:var(--text-secondary);text-align:center;max-width:600px;margin:0 auto 2rem;font-size:clamp(.95rem,2vw,1.1rem)}.section-header{text-align:center;margin-bottom:3rem}.section-header h2{margin-bottom:1rem;font-size:clamp(2rem,6vw,3rem);font-weight:900}.section-header h2 span{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.section-header p{color:var(--text-secondary);max-width:600px;margin:0 auto;font-size:clamp(.95rem,2vw,1.15rem)}.quiz-progress{flex-wrap:wrap;justify-content:center;gap:.8rem;margin-bottom:3rem;display:flex}.progress-dot{background:var(--border);width:10px;height:10px;transition:var(--transition);border-radius:50%}.progress-dot.active{background:linear-gradient(135deg, var(--gold), var(--gold-bright));border-radius:6px;width:40px}.question-item h3{text-align:center;margin-bottom:2rem;font-size:clamp(1.4rem,4vw,1.8rem);font-weight:900}.jp-copy-visible{color:var(--text-secondary);margin-top:.9rem;font-size:1rem;line-height:1.5;display:block}.slider-group{background:var(--surface-alt);border:1px solid var(--border);border-radius:14px;margin-bottom:2.5rem;padding:2rem}.slider-label{justify-content:space-between;align-items:center;margin-bottom:1.5rem;font-weight:800;display:flex}.slider-label .value{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.2rem}input[type=range]{background:linear-gradient(to right, var(--border), var(--gold), var(--border));-webkit-appearance:none;border-radius:5px;outline:none;width:100%;height:8px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:linear-gradient(135deg, var(--gold), var(--gold-bright));cursor:pointer;border-radius:50%;width:28px;height:28px;box-shadow:0 4px 12px #f4b58166}.quiz-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:3rem;display:flex}.bean-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;max-width:1200px;margin-bottom:3rem;margin-left:auto;margin-right:auto;display:grid}.bean-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-md);text-align:center;cursor:pointer;transition:var(--transition);border:2px solid var(--border);padding:2rem}.bean-card:hover{box-shadow:var(--shadow-lg);border-color:var(--gold);transform:translateY(-16px)}.bean-card.selected{border-color:var(--gold);background:linear-gradient(135deg,#f4b58114,#e8b4a814)}.bean-card i{color:var(--gold);margin-bottom:1rem;font-size:3rem;display:block}.bean-name{margin-bottom:.5rem;font-size:1.2rem;font-weight:900}.bean-origin{color:var(--text-secondary);margin-bottom:1rem;font-size:.9rem;font-weight:700}.bean-match{color:var(--gold);margin-bottom:.8rem;font-size:.85rem;font-weight:800}.bean-tags{margin-top:.8rem}.bean-tag{color:var(--gold);background:linear-gradient(135deg,#f4b58126,#e8b4a826);border:1px solid #f4b5814d;border-radius:25px;margin:.3rem;padding:.4rem .8rem;font-size:.75rem;font-weight:800;display:inline-block}.bean-desc{color:var(--text-secondary);margin-top:.8rem;font-size:.8rem;font-style:italic}.customization-grid{grid-template-columns:1fr;gap:2rem;margin-bottom:3rem;display:grid}@media (width>=1024px){.customization-grid{grid-template-columns:1.15fr 1fr;gap:3rem}}.config-section{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-md);border:1px solid var(--border);margin-bottom:0;padding:clamp(2rem,4vw,3rem)}.section-title{align-items:center;gap:1rem;margin-bottom:1.5rem;font-size:clamp(1.3rem,3.5vw,1.7rem);font-weight:900;display:flex}.step-num{background:linear-gradient(135deg, var(--gold), var(--gold-bright));color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:45px;height:45px;font-size:1.1rem;font-weight:900;display:flex;box-shadow:0 8px 24px #f4b5814d}.input-desc,.section-desc{color:var(--text-secondary);margin-bottom:1.5rem;font-size:.9rem;font-weight:700}.intro-container{text-align:center;max-width:1000px;margin:0 auto}.intro-steps{grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-bottom:3rem;display:grid}.intro-step{text-align:center;background:var(--surface);border-radius:var(--radius);border:1px solid var(--border);transition:var(--transition);padding:2rem 1.5rem}.intro-step:hover{box-shadow:var(--shadow-lg);border-color:var(--gold);transform:translateY(-8px)}.intro-step .step-num{margin:0 auto 1rem}.intro-step h3{color:var(--text-primary);margin-bottom:.5rem;font-size:1.1rem;font-weight:700}.intro-step p{color:var(--text-secondary);font-size:.85rem;line-height:1.6}.intro-actions{justify-content:center;gap:1rem;display:flex}.intro-actions .btn-primary i{margin-left:.5rem}.intro-actions .btn-secondary i{margin-right:.5rem}@media (width<=900px){.intro-steps{grid-template-columns:repeat(2,1fr)}}@media (width<=500px){.intro-steps{grid-template-columns:1fr}.intro-actions{flex-direction:column}}.about-grid{text-align:left;grid-template-columns:repeat(3,1fr);gap:2rem;display:grid}.about-grid div strong{color:var(--gold);text-transform:uppercase;letter-spacing:1px;margin-bottom:.5rem;font-size:.85rem;display:block}.about-grid div span{color:var(--text-secondary);font-size:.95rem;line-height:1.5}@media (width<=768px){.about-grid{text-align:center;grid-template-columns:1fr}}.why-grid{grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:2rem;display:grid}.why-grid>div{text-align:center;padding:1.5rem}.why-icon{background:linear-gradient(135deg, var(--gold), var(--gold-bright));border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;margin-bottom:1rem;display:inline-flex}.why-icon i{color:#fff;font-size:1.5rem}.why-grid h3{color:var(--text-primary);margin-bottom:.5rem;font-size:1.1rem;font-weight:700}.why-grid p{color:var(--text-secondary);font-size:.9rem;line-height:1.5}@media (width<=768px){.why-grid{grid-template-columns:1fr}}.fair-content{justify-content:center;align-items:center;gap:1.5rem;margin:2rem 0;display:flex}.fair-content i{color:var(--gold);font-size:2.5rem}.fair-content span{color:var(--text-secondary);max-width:500px;font-size:1rem}.info-box{border:1px solid var(--border);background:linear-gradient(135deg,#d4a5741a,#f4b5810d);border-radius:12px;align-items:center;gap:1rem;margin:1.5rem 0;padding:1.5rem;display:flex}.info-box i{color:var(--gold);flex-shrink:0;font-size:1.5rem}.info-text{color:var(--text-secondary);font-size:.95rem;line-height:1.6}.summary-value{color:var(--text-primary);font-size:1rem}.options-grid{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:1rem;margin-top:1.5rem;display:grid}.option-item{border:2px solid var(--border);text-align:center;cursor:pointer;transition:var(--transition);background:var(--surface-alt);border-radius:12px;padding:1.2rem}.option-item:hover{border-color:var(--gold);transform:translateY(-8px)scale(1.05);box-shadow:0 12px 28px #f4b58133}.option-item.selected{border-color:var(--gold);background:linear-gradient(135deg,#f4b58126,#e8b4a826)}.option-label{font-size:.95rem;font-weight:800}.option-units{color:var(--text-secondary);margin-top:.4rem;font-size:.75rem;font-weight:700}.bag-style-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1.5rem;margin-bottom:2rem;display:grid}.bag-style-option{background:var(--surface);border:2px solid var(--border);text-align:center;cursor:pointer;transition:var(--transition);border-radius:12px;flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.bag-style-option:hover{border-color:var(--gold);box-shadow:var(--shadow-md);transform:translateY(-6px)}.bag-style-option.selected{border-color:var(--gold);background:linear-gradient(135deg,#f4b5811a,#e8b4a81a)}.bag-style-icon{color:var(--gold);font-size:2rem}.bag-style-name{font-size:1rem;font-weight:900}.bag-style-desc{color:var(--text-secondary);font-size:.75rem;font-weight:600}.color-grid{grid-template-columns:repeat(auto-fit,minmax(50px,1fr));gap:.8rem;margin-top:1rem;display:grid}.color-option{aspect-ratio:1;border:3px solid var(--border);cursor:pointer;width:100%;transition:var(--transition);border-radius:10px}.color-option:hover{transform:scale(1.1);box-shadow:0 8px 20px #f4b5814d}.color-option.selected{border-color:var(--gold);box-shadow:0 0 0 3px #f4b5814d}.preview-panel{width:100%}.mock-bag{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-md);text-align:center;border:1px solid var(--border);margin-bottom:2rem;padding:2rem}.bag-container{perspective:1500px;width:100%;max-width:280px;transform-style:preserve-3d;margin:0 auto 2rem;position:relative}.bag-preview{aspect-ratio:3/4;perspective:1500px;width:100%;transform-style:preserve-3d;--bag-rotation-y:-15deg;--bag-rotation-x:5deg;--bag-scale:1.02;justify-content:center;align-items:center;transition:transform .6s cubic-bezier(.2,.8,.2,1);display:flex;position:relative}.bag-preview:hover{transform:rotateY(var(--bag-rotation-y)) rotateX(var(--bag-rotation-x)) scale(var(--bag-scale))}.bag-front{aspect-ratio:3/4;z-index:10;background:linear-gradient(145deg,#f5e6d3 0%,#c9a66b 50%,#a67c52 100%);border:1px solid #fff3;border-radius:12px 12px 50px 50px;flex-direction:column;justify-content:flex-start;align-items:center;width:100%;padding-top:12%;padding-bottom:8%;display:flex;position:relative;overflow:hidden;transform:translateZ(20px);box-shadow:0 30px 60px #0000004d,0 15px 30px #0003,inset 0 2px #ffffff4d,inset 0 -5px 20px #0000001a}.bag-front:before{content:"";pointer-events:none;z-index:16;background:linear-gradient(#ffffff26 0%,#0000 100%);height:30%;position:absolute;top:0;left:0;right:0}.bag-front:after{content:"";pointer-events:none;z-index:8;mix-blend-mode:multiply;background:repeating-linear-gradient(90deg,#0000 0 2px,#00000005 2px 4px);position:absolute;inset:0}.bag-gusset-left{z-index:4;filter:blur(1px);background:linear-gradient(95deg,#00000040 0%,#0000001a 50%,#0000 100%);border-radius:8px 0 25px 25px;width:10%;height:85%;position:absolute;top:5%;left:-10%;transform:translateZ(10px)skewY(-8deg);box-shadow:inset 2px 0 4px #0003}.bag-gusset-right{z-index:4;filter:blur(1px);background:linear-gradient(85deg,#0000 0%,#00000014 50%,#0003 100%);border-radius:0 8px 25px 25px;width:10%;height:85%;position:absolute;top:5%;right:-10%;transform:translateZ(10px)skewY(8deg);box-shadow:inset -2px 0 4px #00000026}.bag-fold-top{z-index:15;background:linear-gradient(#ffffff80 0%,#ffffff1a 100%);border-radius:50%;height:8px;position:absolute;top:-4px;left:3%;right:3%;transform:translateZ(30px);box-shadow:0 2px 4px #0000001a}.bag-zipper{z-index:12;background:linear-gradient(90deg,#888,#ccc,#888);border-radius:2px;width:60%;height:4px;position:absolute;top:5%;left:50%;transform:translate(-50%)translateZ(25px);box-shadow:0 1px 2px #0003}.bag-seal-top{z-index:14;background:repeating-linear-gradient(90deg,#0000,#0000 5px,#0000001a 5px 10px);border-radius:0 0 4px 4px;height:8px;position:absolute;top:0;left:10%;right:10%;transform:translateZ(26px);box-shadow:0 1px 3px #00000026}.bag-logo-container{z-index:13;margin-bottom:2%;position:relative;transform:translateZ(25px)}.bag-icon{color:#6b4423;text-shadow:0 2px 4px #0003;font-size:2.8rem}.bag-text{z-index:11;text-align:center;width:85%;padding:0 1rem;transform:translateZ(20px)}.bag-brand{text-shadow:0 2px 4px #00000026;margin-bottom:.3rem;font-size:clamp(1.1rem,3.5vw,1.6rem);font-weight:900;line-height:1.2}.bag-divider{opacity:.5;background:currentColor;width:40px;height:2px;margin:.4rem auto}.bag-tagline{opacity:.8;font-size:.8rem;font-weight:600}.bag-shine{z-index:12;pointer-events:none;background:linear-gradient(135deg,#ffffff40 0%,#0000 60%);border-radius:50%;width:30%;height:40%;position:absolute;top:10%;right:15%;transform:translateZ(27px)}.bag-preview.style-stand-up-kraft{--bag-rotation-y:-18deg;--bag-rotation-x:8deg;--bag-scale:1.03}.bag-preview.style-stand-up-kraft .bag-front{background:linear-gradient(145deg,#e8d5b7 0%,#c4a574 50%,#a08050 100%);border-radius:10px 10px 45px 45px;box-shadow:0 35px 70px #00000059,0 18px 36px #00000040,inset 0 2px #ffffff59,inset 0 -8px 25px #0000001f,inset 0 0 20px #ffffff14}.bag-preview.style-stand-up-kraft .bag-gusset-left{opacity:1;background:linear-gradient(95deg,#0000004d 0%,#00000026 50%,#0000 100%)}.bag-preview.style-stand-up-kraft .bag-gusset-right{opacity:1;background:linear-gradient(85deg,#0000 0%,#0000001a 50%,#00000040 100%)}.bag-preview.style-stand-up-kraft .bag-icon{color:#8b6914}.bag-preview.style-flat-bottom-white{--bag-rotation-y:-12deg;--bag-rotation-x:3deg;--bag-scale:1.01}.bag-preview.style-flat-bottom-white .bag-front{aspect-ratio:3/5;background:linear-gradient(145deg,#fff 0%,#f0f0f0 50%,#e0e0e0 100%);border-radius:10px 10px 15px 15px;box-shadow:0 28px 56px #00000040,0 12px 24px #00000026,inset 0 2px #ffffff80,inset 0 -6px 18px #00000014}.bag-preview.style-flat-bottom-white .bag-gusset-left,.bag-preview.style-flat-bottom-white .bag-gusset-right{display:none}.bag-preview.style-flat-bottom-white .bag-front:after{content:"";z-index:7;background:linear-gradient(#0000 0%,#0000001f 100%);border-radius:0 0 15px 15px;height:18%;position:absolute;bottom:0;left:0;right:0}.bag-preview.style-flat-bottom-white .bag-icon{color:#888}.bag-preview.style-flat-bottom-white .bag-zipper{display:none}.bag-preview.style-flat-bottom-white .bag-shine{background:linear-gradient(135deg,#fff6 0%,#0000 60%)}.bag-preview.style-matte-black{--bag-rotation-y:-20deg;--bag-rotation-x:10deg;--bag-scale:1.04}.bag-preview.style-matte-black .bag-front{background:linear-gradient(145deg,#3a3a3a 0%,#1f1f1f 50%,#0a0a0a 100%);border-radius:10px 10px 35px 35px;box-shadow:0 40px 80px #000000b3,0 20px 40px #00000080,inset 0 2px #ffffff1a,inset 0 -8px 30px #0000004d}.bag-preview.style-matte-black .bag-gusset-left,.bag-preview.style-matte-black .bag-gusset-right{opacity:.7;background:linear-gradient(95deg,#0006 0%,#0003 50%,#0000000d 100%)}.bag-preview.style-matte-black .bag-icon{color:#666;text-shadow:0 1px 2px #00000080}.bag-preview.style-matte-black .bag-shine{display:none}.bag-preview.style-matte-black .bag-fold-top{background:linear-gradient(#ffffff14 0%,#0000 100%)}.bag-preview.style-matte-black .bag-zipper{background:linear-gradient(90deg,#555,#999,#555)}.bag-preview.style-soft-touch-cream{--bag-rotation-y:-14deg;--bag-rotation-x:4deg;--bag-scale:1.02}.bag-preview.style-soft-touch-cream .bag-front{background:linear-gradient(145deg,#f5f0e8 0%,#e8dfd0 50%,#d8cbb8 100%);border-radius:60px 60px 35px 35px;box-shadow:0 32px 64px #00000038,0 14px 28px #00000026,inset 0 3px #ffffffb3,inset 0 -6px 20px #00000014}.bag-preview.style-soft-touch-cream .bag-gusset-left,.bag-preview.style-soft-touch-cream .bag-gusset-right{display:none}.bag-preview.style-soft-touch-cream .bag-icon{color:#a08060}.bag-preview.style-soft-touch-cream .bag-front:before{background:linear-gradient(#ffffff40 0%,#0000 100%)}.preview-specs{background:var(--surface-alt);border:1px solid var(--border);border-radius:12px;padding:1.5rem}.spec-row{border-bottom:1px solid var(--border);justify-content:space-between;gap:1rem;padding:1rem 0;display:flex}.spec-row:last-child{border-bottom:none}.spec-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.4px;font-size:.75rem;font-weight:800}.spec-value{color:var(--gold);font-size:1rem;font-weight:900}.form-group{margin-bottom:1.5rem}.form-label{text-transform:uppercase;letter-spacing:.6px;margin-bottom:.8rem;font-size:.9rem;font-weight:800;display:block}.form-label:after{content:"";background:linear-gradient(90deg, var(--gold), var(--gold-bright));border-radius:2px;width:40px;height:2px;position:absolute;bottom:-6px;left:0}select,input,textarea{border:2px solid var(--border);width:100%;transition:var(--transition);background:var(--surface-alt);color:var(--text-primary);border-radius:12px;padding:1rem;font-family:inherit;font-size:.95rem;font-weight:600}select:focus,input:focus,textarea:focus{border-color:var(--gold);background:var(--surface);outline:none;box-shadow:0 0 0 4px #f4b5811f}.quiz-header{text-align:center;margin-bottom:2rem}.quiz-header h2{margin-bottom:1rem;font-size:clamp(1.8rem,5vw,2.5rem);font-weight:900}.quiz-header p{color:var(--text-secondary);font-size:clamp(.95rem,2vw,1.1rem)}.summary-grid{border-bottom:1px solid var(--border);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem;margin-bottom:2rem;padding-bottom:2rem;display:grid}.summary-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.5rem;font-size:.8rem;font-weight:800}.summary-value{color:var(--gold);font-size:1.2rem;font-weight:900}.quantity-control{background:var(--surface-alt);border:1px solid var(--border);border-radius:14px;margin:2rem 0;padding:2rem}.qty-group{flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1rem;display:flex}.qty-btn{background:linear-gradient(135deg, var(--gold), var(--gold-bright));color:#fff;cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.3rem;font-weight:900;display:flex;box-shadow:0 8px 24px #f4b5814d}.qty-btn:hover{transform:scale(1.15)}.qty-input{text-align:center;border:2px solid var(--gold);background:var(--surface);border-radius:10px;width:100px;padding:.8rem;font-size:1rem;font-weight:900}.qty-hint{color:var(--text-secondary);margin-top:.8rem;font-size:.8rem;font-weight:700}.order-total{background:linear-gradient(135deg, var(--bg-secondary), var(--bg-primary));border:2px solid var(--gold);color:var(--text-primary);box-shadow:var(--shadow-lg);border-radius:14px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin:2rem 0;padding:2rem;display:flex}.total-label{text-transform:uppercase;letter-spacing:1px;font-size:1rem;font-weight:900}.total-price{background:linear-gradient(135deg, var(--gold), var(--gold-bright));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:2rem;font-weight:900}.action-buttons{flex-wrap:wrap;gap:1rem;display:flex}.btn-reset{cursor:pointer;text-transform:uppercase;letter-spacing:.8px;min-width:120px;transition:var(--transition);border:2px solid var(--border);background:var(--surface-alt);color:var(--text-primary);border-radius:12px;flex:1;justify-content:center;align-items:center;gap:.6rem;padding:1.2rem;font-weight:900;display:flex}.btn-reset:hover{border-color:var(--gold);color:var(--gold)}.btn-submit{cursor:pointer;text-transform:uppercase;letter-spacing:.8px;min-width:120px;transition:var(--transition);background:linear-gradient(135deg, var(--gold), var(--gold-bright));color:#fff;border:none;border-radius:12px;flex:1;justify-content:center;align-items:center;gap:.6rem;padding:1.2rem;font-weight:900;display:flex;box-shadow:0 14px 40px #f4b58159}.btn-submit:hover{transform:translateY(-5px);box-shadow:0 20px 56px #f4b58173}.notification{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);z-index:2000;width:90%;max-width:500px;padding:1.2rem 2rem;font-size:1rem;font-weight:700;animation:.3s fadeIn;position:fixed;top:100px;left:50%;transform:translate(-50%)}.notification.error{color:#d32f2f;background:linear-gradient(135deg,#d32f2f1a,#e539351a);border-color:#d32f2f}.notification.success{border-color:var(--gold);color:var(--gold)}.design-metrics{background:var(--surface-alt);border:1px solid var(--border);border-radius:14px;margin-bottom:2rem;padding:1.5rem}.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1.5rem;display:grid}.metric-item{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:10px;padding:1.2rem}.metric-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:.6rem;font-size:.75rem;font-weight:800}.metric-value{color:var(--gold);font-size:1.3rem;font-weight:900}.section-jp-copy-visible{color:var(--text-secondary);margin-top:.9rem;font-size:1rem;font-weight:500;line-height:1.95;display:block}@media (width<=768px){.mobile-menu-btn{display:flex}.nav-menu{background:var(--surface);box-shadow:var(--shadow-lg);border:1px solid var(--border);border-radius:16px;flex-direction:column;margin-top:.5rem;padding:1rem;display:none;position:absolute;top:100%;left:0;right:0}.nav-menu.open{display:flex}.nav-menu a{justify-content:center}.quiz-buttons,.action-buttons{flex-direction:column}.customization-grid{grid-template-columns:1fr}.options-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=480px){.options-grid{grid-template-columns:1fr}.color-grid{grid-template-columns:repeat(2,1fr)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.8}}.site-footer{text-align:center;background:var(--surface);border-top:1px solid var(--border);padding:2rem}.site-footer p{color:var(--text-secondary);font-size:.9rem}