*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Google Sans,Product Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;color:#1a1a1a;background:#fff;overflow-x:hidden}:root{--color-primary: #FF8C42;--color-primary-gradient: linear-gradient(135deg, #FF8C42 0%, #6B2D5C 100%);--color-success: #4caf50;--color-warning: #ff9800;--color-error: #f44336;--color-text: #1a1a1a;--color-text-secondary: #5c5c5c;--color-text-muted: #7c7c7c;--color-border: #e7e0ec;--color-bg: #fff;--color-bg-secondary: #fffbfe;--color-bg-tertiary: #f7f2fa;--radius-sm: 12px;--radius-md: 20px;--radius-lg: 24px;--radius-xl: 28px;--shadow-sm: 0 2px 8px rgba(0,0,0,.04);--shadow-md: 0 4px 12px rgba(255, 140, 66, .15);--shadow-lg: 0 8px 24px rgba(255, 140, 66, .35);--shadow-xl: 0 8px 32px rgba(107, 45, 92, .08)}.h1,h1{font-size:clamp(32px,8vw,64px);font-weight:800;line-height:1.15;letter-spacing:-.02em}.h2,h2{font-size:clamp(24px,6vw,36px);font-weight:700;letter-spacing:-.01em}.h3,h3{font-size:clamp(18px,4.5vw,20px);font-weight:700}.h4,h4{font-size:clamp(16px,4vw,18px);font-weight:600}.h5,h5{font-size:clamp(15px,4vw,16px);font-weight:600}.text-secondary{color:var(--color-text-secondary)}.text-muted{color:var(--color-text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;font-size:16px;font-weight:600;border-radius:24px;border:none;cursor:pointer;transition:all .2s ease;text-decoration:none}.btn-primary{background:var(--color-primary-gradient);color:#fff;box-shadow:var(--shadow-md)}.btn-primary:hover{box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn-text{background:transparent;color:#49454f}.btn-text:hover{color:var(--color-primary)}.btn-lg{height:clamp(52px,12vw,64px);font-size:clamp(16px,4vw,20px);padding-left:clamp(24px,6vw,36px);padding-right:clamp(24px,6vw,36px);border-radius:32px}.btn-sm{height:clamp(32px,8vw,36px);padding:0 clamp(16px,4vw,20px);font-size:clamp(12px,3vw,13px);border-radius:18px}.btn-block{width:100%}.card{background:#fff;border-radius:var(--radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);transition:all .2s ease;overflow:hidden;height:auto}.card-hover:hover{box-shadow:var(--shadow-xl);transform:translateY(-2px)}.card-body{padding:28px 20px}.row .card{margin-bottom:0}.row{display:flex;flex-wrap:wrap;margin:0 -10px}.col,.col-12,.col-6,.col-4,.col-3,.col-sm-12,.col-sm-6,.col-sm-4,.col-sm-3,.col-md-12,.col-md-6,.col-md-4,.col-md-3{flex:1;padding:10px;width:100%}.col-12{flex:0 0 100%;max-width:100%}.col-6{flex:0 0 50%;max-width:50%}.col-4{flex:0 0 33.333%;max-width:33.333%}.col-3{flex:0 0 25%;max-width:25%}@media(min-width:576px){.col-sm-12{flex:0 0 100%;max-width:100%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-4{flex:0 0 33.333%;max-width:33.333%}.col-sm-3{flex:0 0 25%;max-width:25%}}@media(min-width:768px){.col-md-12{flex:0 0 100%;max-width:100%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-4{flex:0 0 33.333%;max-width:33.333%}.col-md-3{flex:0 0 25%;max-width:25%}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;opacity:0;visibility:hidden;transition:all .3s ease}.modal-overlay.open{opacity:1;visibility:visible}.modal{background:#fff;border-radius:var(--radius-lg);max-width:90vw;max-height:90vh;overflow:auto;transform:scale(.9);transition:transform .3s ease}.modal-overlay.open .modal{transform:scale(1)}.modal-content{padding:24px}.drawer{position:fixed;top:0;right:0;bottom:0;width:280px;background:#fffbfefa;z-index:2000;transform:translate(100%);transition:transform .3s ease;box-shadow:-4px 0 16px #0000001a}.drawer.open{transform:translate(0)}.drawer-content{padding:24px 20px}.dropdown{position:relative;display:inline-block}.dropdown-menu{position:absolute;top:100%;left:0;min-width:160px;background:#fff;border-radius:var(--radius-sm);box-shadow:0 4px 16px #00000026;z-index:1000;opacity:0;visibility:hidden;transform:translateY(-10px);transition:all .2s ease}.dropdown.open .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-item{display:block;padding:12px 16px;color:#1a1a1a;text-decoration:none;cursor:pointer;transition:background .2s}.dropdown-item:hover{background:#ff8c4214;color:var(--color-primary)}.steps{display:flex;justify-content:space-between;position:relative;margin-bottom:36px;padding:0 10px}.steps:before{content:"";position:absolute;top:16px;left:10%;right:10%;height:2px;background:#e7e0ec;z-index:0}.step{flex:1;text-align:center;position:relative;z-index:1;padding:0 5px}.step-icon{width:32px;height:32px;border-radius:50%;background:var(--color-primary-gradient);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 8px;font-size:14px;font-weight:600}.step-title{font-size:clamp(12px,3vw,14px);font-weight:600;margin-bottom:4px;line-height:1.3}.step-desc{font-size:clamp(11px,2.8vw,13px);color:var(--color-text-secondary);line-height:1.3}@media(max-width:480px){.steps{padding:0 5px}.step{padding:0 2px}.step-icon{width:28px;height:28px;font-size:12px}}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:16px;font-size:12px;font-weight:500;white-space:nowrap}.badge-good{background:#e8f5e9;color:#2e7d32}.badge-warning{background:#fff3e0;color:#ef6c00}.badge-bad{background:#ffebee;color:#c62828}.desktop-only{display:none!important}.mobile-only{display:flex!important}@media(min-width:768px){.desktop-only{display:block!important}.desktop-only.navbar-nav{display:flex!important}.mobile-only{display:none!important}}.footer-email-full{display:none}.footer-email-short{display:inline}@media(min-width:480px){.footer-email-full{display:inline}.footer-email-short{display:none}}.icon{display:inline-flex;align-items:center;justify-content:center;width:1em;height:1em}.section{padding:80px 20px}.container{max-width:1100px;margin:0 auto}.text-center{text-align:center}.gradient-text{background:var(--color-primary-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.payment-page{min-height:100vh;background:linear-gradient(135deg,#fff5eb,#ffe4d6,#f0e6ff);padding:6rem 1.5rem 3rem;display:flex;flex-direction:column;align-items:center}.pricing-page{min-height:100vh;background:linear-gradient(135deg,#fff5eb,#ffe4d6,#f0e6ff);padding:6rem 1.5rem 3rem}.pricing-toggle{display:flex;justify-content:center;gap:.5rem;margin-bottom:2rem}.pricing-toggle-btn{padding:.5rem 1.5rem;border-radius:2rem;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.pricing-toggle-btn.active{background:linear-gradient(135deg,#ff8c42,#6b2d5c);color:#fff}.pricing-toggle-btn.inactive{background:#ff8c421a;color:#6b2d5c}.tier-cards{display:flex;gap:1.5rem;max-width:1100px;margin:0 auto 2.5rem}.tier-card{flex:1;background:#fff;border-radius:20px;padding:2rem;border:1px solid #e7e0ec;transition:transform .2s,box-shadow .2s;position:relative}.tier-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px #6b2d5c14}.tier-card.recommended{border-color:#ff8c42;box-shadow:0 4px 12px #ff8c4226}.tier-card-badge{position:absolute;top:-.6rem;right:1rem;background:linear-gradient(135deg,#ff8c42,#6b2d5c);color:#fff;padding:.2rem .8rem;border-radius:1rem;font-size:.7rem;font-weight:700}.tier-name{font-size:.85rem;color:#7c7c7c;margin-bottom:.3rem}.tier-card.recommended .tier-name{color:#ff8c42}.tier-price{font-size:2.2rem;font-weight:800;color:#1a1a1a}.tier-price-period{font-size:.8rem;color:#7c7c7c}.tier-features{margin-top:1rem;font-size:.8rem;color:#5c5c5c;line-height:1.8}.tier-cta{margin-top:1.5rem;width:100%;padding:.7rem;border-radius:24px;font-size:.85rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.tier-cta-primary{background:linear-gradient(135deg,#ff8c42,#6b2d5c);color:#fff;box-shadow:0 4px 12px #ff8c4226}.tier-cta-primary:hover{box-shadow:0 8px 24px #ff8c4259;transform:translateY(-1px)}.tier-cta-secondary{background:#ff8c4214;color:#ff8c42}.tier-cta-secondary:hover{background:#ff8c4226}.topup-section{max-width:1100px;margin:0 auto;background:#fff;border-radius:20px;padding:1.5rem;border:1px solid #e7e0ec}.topup-title{font-size:.85rem;color:#7c7c7c;margin-bottom:1rem}.topup-cards{display:flex;gap:.8rem}.topup-card{flex:1;background:#fffbfe;border-radius:12px;padding:1rem;text-align:center;cursor:pointer;transition:all .2s;border:1px solid #e7e0ec}.topup-card:hover{border-color:#ff8c42;box-shadow:0 2px 8px #ff8c421a}.topup-card.recommended{border-color:#ff8c42;background:#fff5eb}.topup-price{font-size:1.1rem;font-weight:700;color:#1a1a1a}.topup-points{font-size:.7rem;color:#7c7c7c}.topup-card.recommended .topup-points{color:#ff8c42}.topup-bonus{font-size:.65rem;color:#ff8c42;margin-top:.2rem;font-weight:600}.login-page{min-height:100vh;background:linear-gradient(135deg,#fff5eb,#ffe4d6,#f0e6ff);display:flex;align-items:center;justify-content:center;padding:1rem}.login-card{max-width:360px;width:100%;background:#fff;border-radius:20px;padding:2rem;border:1px solid #e7e0ec;box-shadow:0 4px 12px #ff8c4226}.login-title{text-align:center;font-size:1.2rem;font-weight:800;color:#1a1a1a}.login-subtitle{text-align:center;font-size:.8rem;color:#7c7c7c;margin-top:.3rem;margin-bottom:1.5rem}.login-input-group{margin-bottom:1rem}.login-label{font-size:.75rem;color:#7c7c7c;margin-bottom:.4rem}.login-row{display:flex;gap:.5rem}.login-input{flex:1;background:#fffbfe;border:1px solid #e7e0ec;border-radius:12px;padding:.6rem;color:#1a1a1a;font-size:.85rem;outline:none;transition:border-color .2s}.login-input:focus{border-color:#ff8c42}.login-input-full{width:100%}.login-code-btn{background:#ff8c4214;color:#ff8c42;padding:.6rem .8rem;border-radius:12px;font-size:.75rem;border:none;cursor:pointer;white-space:nowrap;transition:all .2s}.login-code-btn:hover{background:#ff8c4226}.login-code-btn:disabled{opacity:.5;cursor:not-allowed}.login-btn{width:100%;background:linear-gradient(135deg,#ff8c42,#6b2d5c);color:#fff;padding:.7rem;border-radius:24px;font-size:.85rem;font-weight:700;border:none;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #ff8c4226}.login-btn:hover{box-shadow:0 8px 24px #ff8c4259;transform:translateY(-1px)}.login-btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.login-footer{text-align:center;margin-top:1rem;font-size:.7rem;color:#7c7c7c}.login-error{color:#f44336;font-size:.75rem;margin-top:.3rem}.checkout-page{min-height:100vh;background:linear-gradient(135deg,#fff5eb,#ffe4d6,#f0e6ff);display:flex;align-items:center;justify-content:center;padding:1rem}.checkout-card{max-width:400px;width:100%;background:#fff;border-radius:20px;padding:2rem;border:1px solid #e7e0ec;box-shadow:0 4px 12px #ff8c4226}.checkout-summary{margin-bottom:1.5rem}.checkout-label{font-size:.75rem;color:#7c7c7c}.checkout-product{font-size:1rem;font-weight:700;color:#1a1a1a;margin-top:.4rem}.checkout-detail{font-size:.8rem;color:#5c5c5c;margin-top:.2rem}.checkout-amount{font-size:1.3rem;font-weight:800;background:linear-gradient(135deg,#ff8c42,#6b2d5c);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-top:.6rem}.checkout-qr-wrapper{background:#fff;border-radius:12px;padding:1.5rem;text-align:center;margin-bottom:1rem;border:1px solid #e7e0ec}.checkout-qr-image{width:200px;height:200px;display:block}.checkout-status{text-align:center;font-size:.85rem;color:#ff8c42;margin-bottom:.3rem;font-weight:600}.checkout-hint{text-align:center;font-size:.75rem;color:#7c7c7c}.checkout-timer{text-align:center;margin-top:1rem;font-size:.75rem;color:#7c7c7c}.checkout-cancel{text-align:center;margin-top:.5rem}.checkout-cancel a{font-size:.75rem;color:#7c7c7c;text-decoration:underline;cursor:pointer}.checkout-cancel a:hover{color:#ff8c42}.checkout-error{color:#f44336;font-size:.8rem;text-align:center;margin-top:.5rem}.checkout-success-page{min-height:100vh;background:linear-gradient(135deg,#fff5eb,#ffe4d6,#f0e6ff);display:flex;align-items:center;justify-content:center;padding:1rem}.checkout-success-card{max-width:360px;width:100%;background:#fff;border-radius:20px;padding:2rem;border:1px solid #e7e0ec;box-shadow:0 4px 12px #ff8c4226;text-align:center}.success-icon{width:64px;height:64px;margin:0 auto 1rem;background:linear-gradient(135deg,#ff8c42,#6b2d5c);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.8rem;color:#fff}.success-title{font-size:1.2rem;font-weight:800;color:#1a1a1a}.success-tier{font-size:.85rem;color:#ff8c42;margin-top:.3rem;font-weight:600}.success-summary{background:#fffbfe;border-radius:12px;padding:1rem;margin-top:1.2rem;border:1px solid #e7e0ec}.summary-row{display:flex;justify-content:space-between;font-size:.75rem;padding:.3rem 0}.summary-label{color:#7c7c7c}.summary-value{color:#1a1a1a}.summary-value.highlight{color:#ff8c42;font-weight:600}.success-cta{width:100%;background:linear-gradient(135deg,#ff8c42,#6b2d5c);color:#fff;padding:.7rem;border-radius:24px;font-size:.85rem;font-weight:700;border:none;cursor:pointer;margin-top:1rem;transition:all .2s;box-shadow:0 4px 12px #ff8c4226}.success-cta:hover{box-shadow:0 8px 24px #ff8c4259;transform:translateY(-1px)}.success-note{font-size:.7rem;color:#7c7c7c;margin-top:.5rem}@media(max-width:768px){.tier-cards{flex-direction:column}.topup-cards{flex-wrap:wrap}.topup-card{min-width:calc(50% - .4rem)}.pricing-page{padding:5rem 1rem 2rem}}@media(max-width:480px){.topup-card{min-width:calc(50% - .4rem)}}