@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Outfit:wght@600;700;800&display=swap";:root{--primary:#ff7a00;--primary-hover:#e66e00;--secondary:#ffc107;--accent:#3e2723;--white:#fff;--soft-gray:#f8f9fa;--text-dark:#2d1a16;--text-muted:#6c757d;--shadow-sm:0 2px 4px #0000000d;--shadow-md:0 10px 20px #00000014;--shadow-lg:0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--border-radius:16px;--transition:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:var(--text-dark);background-color:var(--white);background-image:radial-gradient(circle at 10% 20%,#ff7a0008 0%,#0000 20%),radial-gradient(circle at 90% 80%,#ffc10708 0%,#0000 20%);background-attachment:fixed;padding-top:100px;font-family:Inter,sans-serif;line-height:1.6;overflow-x:hidden}h1,h2,h3,h4{font-family:Outfit,sans-serif;font-weight:800;line-height:1.2}a{color:inherit;transition:var(--transition);text-decoration:none}ul{list-style:none}img{max-width:100%;display:block}.container{max-width:1200px;margin:0 auto;padding:0 24px}section{padding:100px 0}@media (width<=768px){section{padding:60px 0}}.text-center{text-align:center}.text-primary{color:var(--primary)}.section-title{color:var(--accent);margin-bottom:16px;font-size:2.5rem}.section-subtitle{color:var(--text-muted);max-width:600px;margin:0 auto 48px;font-size:1.1rem}.btn{cursor:pointer;transition:var(--transition);border:none;border-radius:50px;justify-content:center;align-items:center;gap:10px;padding:16px 32px;font-size:1rem;font-weight:600;display:inline-flex}.btn-primary{background-color:var(--primary);color:var(--white);box-shadow:0 8px 20px #ff7a004d}.btn-primary:hover{background-color:var(--primary-hover);transform:translateY(-2px);box-shadow:0 12px 25px #ff7a0066}.btn-secondary{background-color:var(--white);color:var(--accent);border:2px solid #eee}.btn-secondary:hover{border-color:var(--primary);color:var(--primary)}.promo-bar{background:var(--secondary);color:var(--accent);text-align:center;z-index:1001;justify-content:center;align-items:center;gap:6px;width:100%;padding:8px 0;font-size:.9rem;font-weight:700;display:flex;position:fixed;top:0}header{z-index:1000;width:100%;transition:var(--transition);padding:20px 0;position:fixed;top:0;left:0}header.scrolled{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-sm);background:#fffffff2;padding:12px 0}nav{justify-content:space-between;align-items:center;display:flex}.logo{color:var(--accent);align-items:center;gap:8px;font-family:Outfit,sans-serif;font-size:1.5rem;font-weight:800;display:flex}.logo span{color:var(--primary)}.nav-links{gap:32px;display:flex}.hero{background:linear-gradient(135deg,#fff9f4 0%,#fff 100%);padding:160px 0 100px;position:relative;overflow:hidden}.hero-grid{grid-template-columns:1.2fr 1fr;align-items:center;gap:60px;display:grid}.hero-content h1{color:var(--accent);margin-bottom:24px;font-size:clamp(2.5rem,5vw,4rem)}.hero-content h1 span{color:var(--primary);margin-bottom:8px;font-size:1.5rem;display:block}.hero-content p{color:var(--text-muted);max-width:500px;margin-bottom:40px;font-size:1.25rem}.hero-btns{gap:16px;display:flex}.hero-image{position:relative}.hero-image img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:var(--transition);transform:rotate(-2deg)}.hero-image:hover img{transform:rotate(0)scale(1.02)}@media (width<=992px){.hero-grid{text-align:center;grid-template-columns:1fr}.hero-content p{margin:0 auto 40px}.hero-btns{justify-content:center}.hero-image img{transform:none}}.trust-bar{background:var(--soft-gray);padding:40px 0}.trust-grid{grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.trust-item{align-items:center;gap:12px;padding:10px;display:flex}.trust-icon{background:var(--white);width:48px;height:48px;color:var(--primary);box-shadow:var(--shadow-sm);border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;display:flex}.trust-item span{font-size:.9rem;font-weight:600}@media (width<=768px){.trust-grid{grid-template-columns:repeat(2,1fr)}}.problem-solution{background:var(--white)}.ps-grid{background:var(--accent);color:var(--white);border-radius:var(--radius-lg);grid-template-columns:1fr 1fr;gap:40px;padding:60px;display:grid}.ps-left h3{margin-bottom:20px;font-size:2rem}.ps-right p{color:#fffc;font-size:1.25rem}@media (width<=768px){.ps-grid{text-align:center;grid-template-columns:1fr;padding:40px 24px}}.products{background:#fffbf7}.product-grid{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}.product-card{background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);flex-direction:column;transition:transform .3s,box-shadow .3s;display:flex;overflow:hidden}.product-card:hover{transform:translateY(-10px)}.qty-selector{background:#fdf2e9;border-radius:50px;justify-content:center;align-items:center;gap:15px;margin-bottom:15px;padding:8px;display:flex}.qty-btn{width:32px;height:32px;color:var(--primary);cursor:pointer;box-shadow:var(--shadow-sm);background:#fff;border:none;border-radius:50%;justify-content:center;align-items:center;font-weight:700;transition:all .2s;display:flex}.qty-btn:hover{background:var(--primary);color:#fff}.qty-input{text-align:center;width:30px;color:var(--accent);background:0 0;border:none;font-size:1.1rem;font-weight:700}.order-summary-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;z-index:1000;background:#3e2723f2;border-radius:100px;justify-content:space-between;align-items:center;gap:25px;width:90%;max-width:500px;padding:15px 30px;transition:transform .5s cubic-bezier(.175,.885,.32,1.275);display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)translateY(150%);box-shadow:0 10px 30px #0000004d}.order-summary-bar.active{transform:translate(-50%)translateY(0)}.total-info h4{color:#ffffffb3;margin:0;font-size:.8rem}.total-amount{color:var(--secondary);font-size:1.2rem;font-weight:700}.faq{background:#fff;padding:100px 0}.faq-container{max-width:800px;margin:0 auto}.faq-item{border-bottom:1px solid #eee;margin-bottom:15px}.faq-question{text-align:left;cursor:pointer;width:100%;color:var(--accent);background:0 0;border:none;justify-content:space-between;align-items:center;padding:20px 0;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:600;display:flex}.faq-answer{color:#666;max-height:0;font-size:.95rem;transition:max-height .3s ease-out;overflow:hidden}.faq-item.active .faq-answer{max-height:200px;padding-bottom:20px}.faq-item i{transition:transform .3s}.faq-item.active i{transform:rotate(180deg)}.social-proof{box-shadow:var(--shadow-lg);z-index:999;border-left:4px solid var(--primary);background:#fff;border-radius:12px;align-items:center;gap:15px;max-width:280px;padding:12px 20px;transition:all .5s cubic-bezier(.175,.885,.32,1.275);display:flex;position:fixed;top:100px;left:20px;transform:translate(-150%)}.social-proof.active{transform:translate(0)}.sp-icon{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.sp-content p{margin:0;font-size:.85rem;line-height:1.3}.sp-time{color:#999;font-size:.75rem}.product-img{height:240px;overflow:hidden}.product-img img{object-fit:cover;width:100%;height:100%;transition:var(--transition)}.product-card:hover .product-img img{transform:scale(1.1)}.product-info{flex-grow:1;padding:24px}.product-info h3{margin-bottom:12px;font-size:1.4rem}.product-info p{color:var(--text-muted);margin-bottom:20px;font-size:.95rem}.product-highlights{flex-wrap:wrap;gap:8px;margin-bottom:24px;display:flex}.highlight{background:var(--soft-gray);color:var(--accent);border-radius:20px;padding:4px 12px;font-size:.8rem;font-weight:500}.product-footer{border-top:1px solid #f0f0f0;justify-content:space-between;align-items:center;padding:24px;display:flex}.price{color:var(--primary);font-size:1.25rem;font-weight:800}@media (width<=992px){.product-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.product-grid{grid-template-columns:1fr}}.visual-hook{background:var(--white)}.comparison-card{background:var(--white);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);grid-template-columns:1fr 1fr;gap:2px;display:grid;overflow:hidden}.compare-item{position:relative}.compare-label{color:#fff;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);text-transform:uppercase;background:#0009;border-radius:50px;padding:8px 16px;font-size:.8rem;font-weight:600;position:absolute;top:20px;left:20px}.compare-item img{object-fit:cover;width:100%;height:400px}@media (width<=768px){.comparison-card{grid-template-columns:1fr}.compare-item img{height:300px}}.how-it-works{background:var(--soft-gray)}.steps-grid{grid-template-columns:repeat(3,1fr);gap:40px;display:grid}.step-item{text-align:center}.step-icon{background:var(--white);width:80px;height:80px;color:var(--primary);box-shadow:var(--shadow-md);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 24px;font-size:2rem;display:flex;position:relative}.step-number{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:.9rem;font-weight:700;display:flex;position:absolute;top:0;right:0}@media (width<=768px){.steps-grid{grid-template-columns:1fr}}.testimonials{background:var(--white)}.testimonial-slider{scrollbar-width:none;gap:20px;padding:20px 0 40px;display:flex;overflow-x:auto}.testimonial-card{background:var(--white);border-radius:var(--radius-md);min-width:350px;box-shadow:var(--shadow-md);border:1px solid #f0f0f0;padding:40px}.stars{color:#ffc107;margin-bottom:20px}.testimonial-text{margin-bottom:24px;font-size:1.1rem;font-style:italic}.urgency{color:var(--white);text-align:center;background-color:#0000;background-image:linear-gradient(#ff7a00e6,#ff7a00e6),url(/images/hero.png);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box}.urgency h2{color:#fff;margin-bottom:16px;font-size:3rem}.urgency p{margin-bottom:40px;font-size:1.5rem}footer{background:var(--accent);color:#ffffffb3;padding:60px 0 30px}.footer-grid{grid-template-columns:2fr 1fr 1fr;gap:60px;margin-bottom:40px;display:grid}.footer-logo{color:#fff;margin-bottom:20px;font-size:1.8rem}.footer-title{color:#fff;margin-bottom:20px;font-weight:700}.footer-bottom{text-align:center;border-top:1px solid #ffffff1a;padding-top:30px}.floating-wa{color:#fff;z-index:1000;background:#25d366;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:2rem;animation:2s infinite pulse;display:flex;position:fixed;bottom:30px;right:30px;box-shadow:0 4px 15px #25d36666}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}[data-reveal]{opacity:0;transition:all .8s cubic-bezier(.4,0,.2,1);transform:translateY(30px)}[data-reveal].revealed{opacity:1;transform:translateY(0)}.stats-section{background:linear-gradient(135deg, var(--accent) 0%, #5a3a35 100%);padding:50px 0}.stats-grid{text-align:center;grid-template-columns:repeat(4,1fr);gap:20px;display:grid}.stat-item{padding:20px}.stat-number{color:var(--secondary);margin-bottom:8px;font-family:Outfit,sans-serif;font-size:3rem;font-weight:800;line-height:1}.stat-label{color:#fffc;font-size:.9rem;font-weight:500}@media (width<=768px){.stats-grid{grid-template-columns:repeat(2,1fr)}.stat-number{font-size:2.2rem}}#back-to-top{background:var(--primary);color:#fff;cursor:pointer;z-index:998;opacity:0;border:none;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.1rem;transition:all .3s;display:flex;position:fixed;bottom:100px;right:30px;transform:translateY(20px);box-shadow:0 4px 15px #ff7a0066}#back-to-top.visible{opacity:1;transform:translateY(0)}#back-to-top:hover{background:var(--primary-hover);transform:translateY(-3px)}.dark-mode-btn{cursor:pointer;width:40px;height:40px;color:var(--accent);background:0 0;border:2px solid #ddd;border-radius:50%;justify-content:center;align-items:center;font-size:1rem;transition:all .3s;display:flex}.dark-mode-btn:hover{background:var(--soft-gray)}.nav-right{align-items:center;gap:12px;display:flex}body.dark-mode{color:#e0e0e0;--accent:#f5c842;--text-dark:#e0e0e0;--text-muted:#aaa;--white:#16213e;--soft-gray:#0f3460;background-color:#1a1a2e}body.dark-mode header{background:#1a1a2ef2!important}body.dark-mode .product-card,body.dark-mode .testimonial-card,body.dark-mode .faq-item,body.dark-mode .popup-box,body.dark-mode .wa-chat-box,body.dark-mode .social-proof,body.dark-mode .pwa-banner{color:#e0e0e0;background:#16213e;border-color:#0f3460}body.dark-mode .hero{background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%)}body.dark-mode .wa-chat-body{background:#0f3460}body.dark-mode .wa-bubble{color:#e0e0e0;background:#1a1a2e}body.dark-mode .wa-bubble p{color:#e0e0e0}body.dark-mode .popup-box p,body.dark-mode .spin-box p{color:#aaa}body.dark-mode .cart-item{border-bottom:1px solid #0f3460}.product-card{position:relative}.product-badge{z-index:10;letter-spacing:.5px;border-radius:50px;padding:5px 14px;font-family:Outfit,sans-serif;font-size:.78rem;font-weight:700;position:absolute;top:14px;left:14px;box-shadow:0 3px 10px #0003}.badge-terlaris{background:var(--primary);color:#fff}.badge-favorit{background:var(--secondary);color:var(--accent)}.badge-baru{color:#fff;background:#4caf50}.product-stars{align-items:center;gap:4px;margin-bottom:10px;display:flex}.product-stars .star{color:#ddd;cursor:pointer;font-size:1rem;transition:color .15s}.product-stars .star.active,.product-stars .star:hover{color:var(--secondary)}.rating-label{color:var(--text-muted);margin-left:4px;font-size:.78rem}.stock-tracker{color:#e65100;background:#fff3e0;border:1px dashed #ff9800;border-radius:8px;margin-bottom:12px;padding:6px 12px;font-size:.85rem;font-weight:600;display:inline-block}body.dark-mode .stock-tracker{color:#ffb74d;background:#e6510033;border-color:#f57c00}.popup-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;opacity:0;pointer-events:none;background:#0009;justify-content:center;align-items:center;transition:opacity .4s;display:flex;position:fixed;inset:0}.popup-overlay.active{opacity:1;pointer-events:all}.popup-box{text-align:center;background:#fff;border-radius:24px;width:90%;max-width:380px;padding:40px 32px;animation:.4s cubic-bezier(.175,.885,.32,1.275) popIn;position:relative}@keyframes popIn{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.popup-emoji{margin-bottom:12px;font-size:3rem}.popup-box h3{color:var(--accent);margin-bottom:8px;font-size:1.6rem}.popup-box p{color:#666;margin-bottom:20px}.popup-close{cursor:pointer;color:#aaa;background:0 0;border:none;font-size:1.1rem;position:absolute;top:14px;right:14px}.popup-skip{color:#aaa;cursor:pointer;background:0 0;border:none;margin-top:14px;font-size:.85rem;text-decoration:underline}.cart-items-container{max-height:300px;margin-bottom:16px;padding-right:8px;overflow-y:auto}.cart-items-container::-webkit-scrollbar{width:6px}.cart-items-container::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px}.cart-item{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;padding:12px 0;display:flex}.cart-item-info{text-align:left;flex-grow:1}.cart-item-title{color:var(--accent);margin-bottom:4px;font-size:.95rem;font-weight:700}.cart-item-price{color:var(--primary);font-size:.9rem;font-weight:600}.cart-item-qty{background:var(--soft-gray);border-radius:20px;align-items:center;gap:8px;padding:4px 8px;display:flex}.cart-item-qty button{cursor:pointer;width:24px;height:24px;color:var(--primary);box-shadow:var(--shadow-sm);background:#fff;border:none;border-radius:50%;font-weight:700}.cart-item-qty span{min-width:16px;font-size:.9rem;font-weight:700}.spin-box{max-width:340px}.wheel-container{width:280px;height:280px;margin:0 auto;position:relative}.wheel-arrow{color:var(--accent);z-index:5;filter:drop-shadow(0 2px 4px #0000004d);font-size:2rem;position:absolute;top:-10px;left:50%;transform:translate(-50%)}.spin-result{color:var(--primary);min-height:30px;margin-top:16px;font-size:1.1rem;font-weight:700}.spin-trigger-btn{border:2px solid var(--secondary);cursor:pointer;width:56px;height:56px;box-shadow:var(--shadow-lg);z-index:990;background:#fff;border-radius:50%;font-size:1.5rem;transition:transform .2s;animation:3s ease-in-out infinite wiggle;position:fixed;bottom:100px;left:20px}.spin-trigger-btn:hover{transform:scale(1.15)}@keyframes wiggle{0%,to{transform:rotate(0)}20%{transform:rotate(-10deg)}40%{transform:rotate(10deg)}60%{transform:rotate(-5deg)}80%{transform:rotate(5deg)}}.wa-chat-widget{z-index:1000;flex-direction:column;align-items:flex-end;gap:12px;display:flex;position:fixed;bottom:30px;right:30px}.wa-float-btn{color:#fff;cursor:pointer;background:#25d366;border:none;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;font-size:1.8rem;animation:2s infinite pulse;display:flex;position:relative;box-shadow:0 4px 20px #25d36680}.wa-badge{color:#fff;background:red;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:.7rem;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px}.wa-chat-box{box-shadow:var(--shadow-lg);transform-origin:100% 100%;opacity:0;background:#fff;border-radius:16px;width:300px;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);overflow:hidden;transform:scale(0)translateY(20px)}.wa-chat-box.open{opacity:1;transform:scale(1)translateY(0)}.wa-chat-header{color:#fff;background:#25d366;align-items:center;gap:10px;padding:14px 16px;display:flex}.wa-avatar{background:#fff3;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;display:flex}.wa-chat-header strong{font-size:.95rem;display:block}.wa-online{opacity:.9;font-size:.75rem}.wa-close{color:#fff;cursor:pointer;background:0 0;border:none;margin-left:auto;font-size:1rem}.wa-chat-body{background:#ece5dd;padding:16px}.wa-bubble{background:#fff;border-radius:12px 12px 12px 0;max-width:90%;margin-bottom:8px;padding:10px 14px;box-shadow:0 1px 3px #0000001a}.wa-bubble p{color:#333;margin:0;font-size:.9rem}.wa-time{color:#999;margin-top:4px;font-size:.7rem;display:block}.wa-typing{align-items:center;gap:4px;padding:10px 14px!important;display:flex!important}.wa-typing span{background:#aaa;border-radius:50%;width:8px;height:8px;animation:1.2s infinite typingDot}.wa-typing span:nth-child(2){animation-delay:.2s}.wa-typing span:nth-child(3){animation-delay:.4s}@keyframes typingDot{0%,80%,to{opacity:.5;transform:scale(1)}40%{opacity:1;transform:scale(1.3)}}.wa-chat-btn{color:#fff;background:#25d366;justify-content:center;align-items:center;gap:8px;padding:14px;font-weight:600;text-decoration:none;transition:background .2s;display:flex}.wa-chat-btn:hover{color:#fff;background:#1ebe5d}.pwa-banner{z-index:9998;border-top:3px solid var(--primary);background:#fff;justify-content:space-between;align-items:center;padding:14px 20px;transition:transform .4s;display:flex;position:fixed;bottom:0;left:0;right:0;transform:translateY(100%);box-shadow:0 -4px 20px #0000001a}.pwa-banner.show{transform:translateY(0)}.pwa-content{align-items:center;gap:14px;display:flex}.pwa-content strong{color:var(--accent);display:block}.pwa-content p{color:#666;margin:0;font-size:.8rem}.pwa-actions{align-items:center;gap:10px;display:flex}.pwa-actions button:last-child{color:#aaa;cursor:pointer;background:0 0;border:none;font-size:1.1rem}.mobile-menu-btn{color:var(--accent);cursor:pointer;background:0 0;border:none;margin-left:10px;padding:8px;font-size:1.5rem;display:none}body.dark-mode .mobile-menu-btn{color:var(--white)}@media (width<=768px){.mobile-menu-btn{display:block}.nav-links{background:var(--white);width:100%;box-shadow:var(--shadow-md);text-align:center;flex-direction:column;gap:0;max-height:0;padding:0;transition:max-height .3s;display:flex;position:absolute;top:100%;left:0;overflow:hidden}.nav-links li{width:100%}.nav-links a{border-bottom:1px solid #0000000d;padding:15px 0;display:block}.nav-links.active{max-height:300px}.btn-pesan-nav{display:none!important}.hero{padding:120px 0 60px}.hero-btns{flex-direction:column;width:100%}.hero-btns .btn{width:100%}.footer-grid{text-align:center;grid-template-columns:1fr;gap:30px}.order-summary-bar{gap:15px;width:95%;padding:12px 20px;bottom:15px}.order-summary-bar .btn{padding:10px 15px;font-size:.9rem}.cart-box{max-height:85vh;overflow-y:auto;width:95%!important;padding:20px!important}.trust-grid{grid-template-columns:1fr;max-width:300px;margin:0 auto}}