:root{--yellow: #FFD60A;--green: #A3E635;--pink: #FB7185;--blue: #7DD3FC;--bg: #F0FDF4;--black: #1E1E1E;--white: #FFFFFF;--border: 3px solid var(--black);--shadow: 4px 4px 0px var(--black);--shadow-lg: 6px 6px 0px var(--black);--radius: 16px}*{box-sizing:border-box;margin:0;padding:0;font-family:Space Grotesk,sans-serif;-webkit-tap-highlight-color:transparent}body{background:#1a2e1a;display:flex;justify-content:center;min-height:100vh}.phone-frame{width:100%;max-width:430px;min-height:100vh;background:var(--bg);position:relative;overflow-x:hidden}@media(min-width:431px){.phone-frame{border-left:var(--border);border-right:var(--border)}}.nb-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:var(--green);border-bottom:var(--border);position:sticky;top:0;z-index:50}.logo-box{display:flex;align-items:center;gap:8px}.logo-icon{font-size:1.4rem}.logo-name{font-weight:700;font-size:1.1rem;color:var(--black)}.badge-official{background:var(--black);color:var(--green);padding:4px 12px;border-radius:20px;font-size:.75rem;font-weight:700}.hero-section{padding:0}.hero-image-wrap{width:100%;aspect-ratio:4/3;overflow:hidden;border-bottom:var(--border)}.hero-image-wrap img{width:100%;height:100%;object-fit:cover}.hero-text{padding:20px;background:var(--yellow);border-bottom:var(--border)}.hero-text h1{font-size:1.5rem;font-weight:700;line-height:1.2;color:var(--black);margin-bottom:6px}.hero-text p{font-size:.95rem;color:#333;font-weight:500}.trust-bar{display:flex;border-bottom:var(--border)}.trust-item{flex:1;text-align:center;padding:12px 8px;font-size:.85rem;font-weight:600;color:var(--black);border-right:var(--border)}.trust-item:last-child{border-right:none}.trust-item span{display:block;font-size:1.1rem;margin-bottom:2px}.about-section{padding:24px 20px;border-bottom:var(--border);background:var(--white)}.about-points{display:flex;flex-direction:column;gap:16px}.about-item{display:flex;gap:12px;padding:16px;border:var(--border);border-radius:var(--radius);background:var(--bg);box-shadow:var(--shadow)}.about-icon{font-size:1.5rem;flex-shrink:0}.about-item strong{display:block;font-size:.95rem;margin-bottom:4px}.about-item p{font-size:.85rem;color:#444;line-height:1.4}.section-title{font-size:1.2rem;font-weight:700;margin-bottom:16px;color:var(--black)}.specs-section{padding:24px 20px;border-bottom:var(--border)}.spec-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.spec-card{border:var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}.card-yellow{background:var(--yellow)}.card-green{background:var(--green)}.card-pink{background:var(--pink)}.card-blue{background:var(--blue)}.card-emoji{font-size:1.5rem;margin-bottom:8px}.spec-card strong{display:block;font-size:.9rem;margin-bottom:4px}.spec-card span{font-size:.78rem;color:#333;line-height:1.3}.price-section{padding:24px 20px;background:var(--white);border-bottom:var(--border)}.price-subtitle{font-size:.9rem;color:#555;margin-bottom:20px;margin-top:-8px}.price-group{margin-bottom:20px}.group-label{font-size:.95rem;font-weight:700;margin-bottom:10px;padding:6px 12px;background:var(--black);color:var(--white);border-radius:8px;display:inline-block}.hot-tag{font-size:.8rem}.price-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:8px}.price-pill-info{border:var(--border);border-radius:12px;padding:12px 8px;text-align:center;background:var(--white);box-shadow:var(--shadow);position:relative}.price-pill-info.best-info{border-color:var(--pink)}.pill-size{display:block;font-weight:700;font-size:.95rem;color:var(--black);margin-bottom:2px}.pill-price{display:block;font-size:.8rem;color:#555;font-weight:500}.bs-label{position:absolute;top:-8px;right:-4px;background:var(--pink);color:#fff;font-size:.6rem;font-weight:700;padding:2px 6px;border-radius:6px;border:2px solid var(--black)}.testimonials-section{padding:24px 20px;border-bottom:var(--border);background:var(--yellow)}.testi-list{display:flex;flex-direction:column;gap:12px}.testi-card{background:var(--white);border:var(--border);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}.testi-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.testi-top strong{font-size:.95rem}.testi-top span{font-size:.8rem}.testi-card p{font-size:.88rem;color:#333;line-height:1.4;margin-bottom:6px;font-style:italic}.testi-card small{font-size:.78rem;color:#666}.faq-section{padding:24px 20px;border-bottom:var(--border);background:var(--white)}.faq-list{display:flex;flex-direction:column;gap:10px}.faq-item{border:var(--border);border-radius:12px;background:var(--bg);box-shadow:3px 3px 0 var(--black);overflow:hidden}.faq-item summary{padding:14px 16px;font-weight:700;font-size:.9rem;cursor:pointer;list-style:none}.faq-item summary:before{content:"▶ ";font-size:.8rem}.faq-item[open] summary:before{content:"▼ "}.faq-item p{padding:0 16px 14px;font-size:.85rem;color:#444;line-height:1.5}.site-footer{padding:24px 20px;background:var(--black);color:#ccc;border-bottom:var(--border)}.footer-brand{margin-bottom:16px}.footer-brand strong{color:var(--green);font-size:1.1rem}.footer-brand p{font-size:.85rem;margin-top:4px}.footer-info{margin-bottom:16px}.footer-info p{font-size:.85rem;margin-bottom:6px}.footer-info a{color:var(--green);text-decoration:none}.footer-copy{border-top:1px solid #333;padding-top:16px}.footer-copy p{font-size:.75rem;color:#888;margin-bottom:4px}.footer-copy a{color:#888;text-decoration:none}.spacer{height:90px}.sticky-cta{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:430px;padding:16px 20px;background:var(--green);border-top:var(--border);z-index:100}.cta-btn{width:100%;padding:16px;background:var(--black);color:var(--green);border:none;border-radius:14px;font-size:1.15rem;font-weight:700;cursor:pointer;box-shadow:var(--shadow-lg);transition:all .15s;font-family:inherit}.cta-btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--black)}.modal-overlay{position:fixed;inset:0;background:#1e1e1e99;z-index:200;display:flex;align-items:flex-end;justify-content:center;opacity:0;visibility:hidden;transition:.3s}.modal-overlay.open{opacity:1;visibility:visible}.modal-sheet{background:var(--bg);width:100%;max-width:430px;max-height:90vh;border-radius:24px 24px 0 0;border-top:var(--border);border-left:var(--border);border-right:var(--border);overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateY(100%);transition:.35s cubic-bezier(.16,1,.3,1)}.modal-overlay.open .modal-sheet{transform:translateY(0)}.modal-handle{width:40px;height:4px;background:#ccc;border-radius:4px;margin:12px auto}.modal-top{display:flex;justify-content:space-between;align-items:center;padding:8px 20px 16px;border-bottom:var(--border)}.modal-top h3{font-size:1.15rem;font-weight:700}.modal-close{width:32px;height:32px;border:var(--border);border-radius:50%;background:var(--pink);color:#fff;font-size:1rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center}.order-form{padding:20px}.form-group{margin-bottom:24px}.form-group>label{display:block;font-size:1rem;font-weight:700;margin-bottom:12px}.modal-size-category{margin-bottom:12px;background:var(--white);border:var(--border);border-radius:var(--radius);padding:12px;box-shadow:2px 2px 0 var(--black)}.modal-size-category h4{font-size:.85rem;font-weight:700;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.modal-size-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.size-pill input{display:none}.size-pill span{display:block;text-align:center;padding:10px 6px;border:var(--border);border-radius:10px;font-weight:700;font-size:.9rem;background:var(--white);cursor:pointer;box-shadow:3px 3px 0 var(--black);transition:all .15s}.size-pill span small{font-weight:600;font-size:.75rem;color:#666}.size-pill input:checked+span{background:var(--yellow);transform:translate(3px,3px);box-shadow:0 0 0 var(--black)}.size-pill input:checked+span small{color:var(--black)}.hot-pill span{border-color:var(--pink)}.modal-color-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.color-opt input{display:none}.color-opt span{display:flex;align-items:center;gap:10px;padding:12px 14px;border:var(--border);border-radius:10px;font-weight:600;font-size:.9rem;background:var(--white);cursor:pointer;box-shadow:3px 3px 0 var(--black);transition:all .15s}.color-opt input:checked+span{background:var(--green);transform:translate(3px,3px);box-shadow:0 0 0 var(--black)}.c-dot{width:22px;height:22px;border-radius:50%;display:inline-block;flex-shrink:0}.input-wrap{margin-bottom:10px}.input-wrap input,.input-wrap textarea{width:100%;padding:12px;border:var(--border);border-radius:10px;font-size:.95rem;font-family:inherit;background:var(--white);box-shadow:3px 3px 0 var(--black)}.input-wrap input:focus,.input-wrap textarea:focus{outline:none;background:var(--yellow)}.pay-options-vertical{display:flex;flex-direction:column;gap:10px}.pay-opt-v{cursor:pointer}.pay-opt-v>input{display:none}.pay-opt-inner{border:var(--border);border-radius:12px;padding:14px 16px;background:var(--white);box-shadow:3px 3px 0 var(--black);transition:all .15s}.pay-opt-v>input:checked+.pay-opt-inner{background:var(--green);transform:translate(3px,3px);box-shadow:0 0 0 var(--black)}.pay-opt-title{font-weight:700;font-size:.95rem}.pay-detail{margin-top:12px;padding-top:12px;border-top:2px dashed var(--black)}.bank-detail{display:flex;flex-wrap:wrap;gap:10px}.bank-item{flex:1;min-width:100px;background:var(--white);border:2px solid var(--black);border-radius:8px;padding:10px;font-size:.85rem;text-align:center}.bank-item strong{color:var(--black)}.bank-item small{color:#555}.cod-checkbox{display:flex;gap:10px;align-items:flex-start;cursor:pointer;background:#fff3cd;border:2px solid #FFB300;border-radius:8px;padding:12px}.cod-checkbox input{margin-top:3px;width:18px;height:18px;flex-shrink:0}.cod-checkbox span{font-size:.85rem;line-height:1.4;color:#333}.qris-detail{text-align:center}.qris-img{width:200px;height:auto;border:2px solid var(--black);border-radius:8px;margin-bottom:8px}.qris-note{font-size:.8rem;color:#555;line-height:1.4}.order-total{background:var(--green);border:var(--border);border-radius:var(--radius);padding:16px;font-size:1.1rem;font-weight:700;display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;box-shadow:var(--shadow)}.order-total strong{font-size:1.2rem}.submit-btn{width:100%;padding:16px;border:var(--border);border-radius:14px;background:var(--black);color:var(--green);font-size:1.1rem;font-weight:700;cursor:pointer;box-shadow:var(--shadow-lg);font-family:inherit;transition:all .15s}.submit-btn:active{transform:translate(4px,4px);box-shadow:0 0 0 var(--black)}.btn-salin{display:inline-block;background:var(--yellow);border:2px solid var(--black);border-radius:6px;padding:3px 10px;font-size:.75rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:2px 2px 0 var(--black);transition:all .15s;margin-top:4px}.btn-salin:active,.btn-salin.copied{transform:translate(2px,2px);box-shadow:0 0 0 var(--black);background:var(--green)}.btn-download{display:block;width:100%;margin-top:10px;padding:10px;background:var(--blue);border:var(--border);border-radius:10px;font-size:.9rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:var(--shadow);transition:all .15s}.btn-download:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--black)}.pay-nominal{background:#fef3c7;border:2px solid var(--black);border-radius:8px;padding:10px 12px;margin-bottom:12px;font-size:.9rem;font-weight:600}.pay-nominal strong{color:#059669}.rek-num{font-family:monospace;font-size:.95rem;letter-spacing:1px}.spec-table{border:var(--border);border-radius:var(--radius);overflow:hidden;margin-bottom:16px;box-shadow:var(--shadow);background:var(--white)}.spec-row{display:flex;border-bottom:2px solid #e5e7eb}.spec-row:last-child{border-bottom:none}.spec-label{width:40%;padding:12px;background:#f8fafc;font-weight:700;font-size:.85rem;border-right:2px solid #e5e7eb}.spec-value{width:60%;padding:12px;font-size:.85rem;color:#333;line-height:1.4}.rating-section{padding:24px 20px;border-bottom:var(--border);background:var(--white)}.rating-summary{display:flex;gap:20px;align-items:center;border:var(--border);border-radius:var(--radius);padding:20px;background:#fffbeb;box-shadow:var(--shadow)}.rating-big{text-align:center;min-width:100px}.big-num{display:block;font-size:2.5rem;font-weight:700;color:var(--black);line-height:1}.big-star{display:block;font-size:.9rem;margin:4px 0}.big-count{display:block;font-size:.7rem;color:#666}.rating-bars{flex:1}.bar-row{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:.75rem;font-weight:600}.bar-track{flex:1;height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden}.bar-fill{height:100%;background:#f59e0b;border-radius:4px}.footer-links{margin-bottom:16px}.footer-links p{font-size:.8rem;margin-bottom:4px}.footer-links a{color:#aaa;text-decoration:none}.footer-links strong{color:#ccc;font-size:.85rem}.price-grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:10px}.custom-hint{font-size:.85rem;color:#555;text-align:center;margin-top:16px;padding:10px;background:var(--yellow);border:var(--border);border-radius:10px}.modal-size-grid-2col{display:grid;grid-template-columns:1fr 1fr;gap:8px}.custom-pill{display:block;margin-top:12px}.custom-pill span{display:block;text-align:center;padding:14px 10px;border:2px dashed var(--black);border-radius:12px;font-weight:700;font-size:.9rem;color:var(--black);background:var(--bg);cursor:pointer;transition:all .15s}.custom-pill input{display:none}.custom-pill input:checked+span{background:var(--green);border-style:solid;border-width:3px;transform:translate(3px,3px)}.custom-calc{margin-top:12px;border:var(--border);border-radius:var(--radius);padding:16px;background:var(--white);box-shadow:var(--shadow)}.custom-calc h4{text-align:center;font-size:.9rem;color:#059669;letter-spacing:1px;margin-bottom:14px}.custom-inputs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}.custom-field label{display:block;font-size:.8rem;font-weight:700;margin-bottom:6px}.custom-field input{width:100%;padding:12px;border:var(--border);border-radius:10px;font-size:1rem;font-family:inherit;text-align:center;box-shadow:2px 2px 0 var(--black)}.custom-field input:focus{outline:none;background:var(--yellow)}.custom-result{background:var(--green);border:var(--border);border-radius:10px;padding:12px 16px;margin-bottom:12px;font-size:.95rem;font-weight:600}.custom-result strong{color:var(--black)}.custom-warning{background:#fff3cd;border:2px solid #FFB300;border-radius:8px;padding:10px 12px;font-size:.82rem;font-weight:600;color:#7a5800;text-align:center}.custom-result.error{background:#fee2e2;border-color:#dc2626;color:#991b1b}.custom-result.error strong{color:#dc2626}.total-line{font-size:1.1rem}.dp-line{margin-top:6px;font-size:.85rem;padding:8px 10px;background:#fef3c7;border:2px solid #F59E0B;border-radius:8px;color:#92400e}.dp-line strong{color:#92400e}.dp-line small{color:#b45309}.about-factory-img{margin-bottom:16px;text-align:center}.about-factory-img img{width:100%;border-radius:var(--radius);border:var(--border);box-shadow:var(--shadow);object-fit:cover;aspect-ratio:1/1}.img-caption{display:block;font-size:.8rem;color:#555;font-weight:600;margin-top:8px}.gallery-section{padding:24px 20px;border-bottom:var(--border);background:var(--white)}.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gallery-item{text-align:center}.gallery-item img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius);border:var(--border);box-shadow:var(--shadow)}.gallery-item span{display:block;font-size:.75rem;font-weight:700;margin-top:6px;color:var(--black)}.gallery-scroll{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 0 12px}.gallery-scroll::-webkit-scrollbar{display:none}.gallery-card{flex:0 0 70%;scroll-snap-align:start;text-align:center}.gallery-card img{width:100%;border-radius:var(--radius);border:var(--border);box-shadow:var(--shadow)}.gallery-card span{display:block;font-size:.8rem;font-weight:700;margin-top:6px;color:var(--black)}.gallery-hint{text-align:center;font-size:.75rem;color:#888;margin-top:4px}.custom-pill span{background:#ff6b00!important;border-style:solid!important;border-color:var(--black)!important;color:#fff!important}.custom-pill input:checked+span{background:#e85d00!important;transform:translate(3px,3px)}.custom-calc-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.custom-calc-header h4{margin-bottom:0}.btn-close-custom{background:#dc2626;color:#fff;border:2px solid var(--black);border-radius:8px;padding:6px 12px;font-size:.72rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:2px 2px 0 var(--black)}.btn-close-custom:active{transform:translate(2px,2px);box-shadow:none}.gal-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.gal-item{text-align:center;overflow:hidden}.gal-item img{display:block;width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;border-radius:var(--radius);border:var(--border);box-shadow:var(--shadow)}.gal-item span{display:block;font-size:.72rem;font-weight:700;margin-top:5px;color:var(--black)}.form-error{background:#fee2e2;border:2px solid #DC2626;border-radius:8px;color:#991b1b;font-size:.82rem;font-weight:700;padding:10px 14px;margin-top:8px}.input-wrap select{width:100%;padding:12px;border:var(--border);border-radius:var(--radius);font-size:.95rem;font-family:inherit;background:var(--white);appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 8L1 3h10z' fill='%23000'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;cursor:pointer}.input-wrap select:focus{outline:3px solid var(--primary)}