:root{--orange:#f45b20;--orange2:#ff7b2f;--ink:#17212b;--muted:#6e7884;--line:#e8ebef;--cream:#fff7f1;--bg:#f7f8fa;--green:#188e63}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Manrope,Arial,sans-serif;color:var(--ink);background:#fff}.shell{width:min(1180px,calc(100% - 40px));margin:auto}.topbar{height:34px;background:#17212b;color:#dbe1e6;display:flex;justify-content:space-between;align-items:center;padding:0 max(20px,calc((100vw - 1180px)/2));font-size:11px;letter-spacing:.2px}header{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 4px 24px #15202b0a}.header-main{height:78px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:800;line-height:.9;letter-spacing:-.8px}.brand b{color:var(--orange)}.brand small{display:block;font-size:7px;letter-spacing:2px;color:#77818b;margin-top:7px}.brand-mark{display:grid;place-items:center;width:39px;height:43px;color:white;background:linear-gradient(145deg,var(--orange2),var(--orange));border-radius:13px 13px 13px 4px;font-size:24px;box-shadow:0 7px 18px #f45b2045}.search{height:46px;display:flex;flex:1;max-width:620px;background:var(--bg);border:1px solid #e3e6e9;border-radius:12px;overflow:hidden}.search:focus-within{border-color:var(--orange);box-shadow:0 0 0 3px #f45b2015}.search input{border:0;outline:0;background:transparent;padding:0 18px;flex:1;font:inherit;font-size:13px}.search button{width:54px;border:0;background:var(--orange);color:#fff;font-size:24px;cursor:pointer}.icon-btn{border:0;background:transparent;position:relative;color:var(--ink);cursor:pointer;display:grid;place-items:center;gap:2px}.icon-btn span{font-size:21px}.icon-btn small{font:600 10px Manrope}.icon-btn i{position:absolute;right:1px;top:-5px;background:var(--orange);color:#fff;border-radius:20px;font:700 9px Manrope;padding:2px 5px}nav{height:42px;display:flex;align-items:center;gap:32px;font-size:12px;font-weight:700}nav a{color:#4d5862;text-decoration:none}nav a:hover{color:var(--orange)}nav button{margin-left:auto;border:1px solid var(--line);background:#fff;padding:7px 13px;border-radius:8px;font:700 11px Manrope;cursor:pointer}.hero{min-height:515px;display:grid;grid-template-columns:1.08fr .92fr;border-radius:0 0 28px 28px;overflow:hidden;background:linear-gradient(120deg,#fff8f3 0%,#fff 55%,#ffe9dc 100%)}.hero-copy{padding:80px 30px 60px 62px;position:relative;z-index:2}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-weight:800;font-size:10px;color:var(--orange)}h1{font-size:49px;line-height:1.07;letter-spacing:-2.3px;margin:15px 0 20px;max-width:630px}h1 em{font-style:normal;color:var(--orange)}.hero p{font-size:15px;line-height:1.7;color:var(--muted);max-width:560px}.hero-actions{display:flex;gap:12px;margin:30px 0}.primary,.secondary{border:0;border-radius:11px;padding:14px 20px;font:700 12px Manrope;text-decoration:none;display:inline-block;cursor:pointer}.primary{background:linear-gradient(135deg,var(--orange2),var(--orange));color:white;box-shadow:0 10px 20px #f45b2032}.secondary{background:white;color:var(--ink);border:1px solid var(--line)}.trust{display:flex;gap:26px;margin-top:40px;color:var(--muted);font-size:10px}.trust b{display:block;color:var(--ink);font-size:15px}.hero-visual{position:relative;display:grid;place-items:center}.glow{position:absolute;width:360px;height:360px;border-radius:50%;background:#ffbd9277;filter:blur(3px)}.phone{width:210px;height:390px;background:#171c24;border:8px solid #2c3139;border-radius:37px;transform:rotate(9deg);box-shadow:30px 35px 60px #a64d233b;position:relative;padding:9px}.speaker{position:absolute;width:60px;height:9px;border-radius:10px;background:#171c24;top:10px;left:67px;z-index:2}.screen{height:100%;border-radius:23px;background:radial-gradient(circle at 70% 30%,#ffbc8e,#f45b20 48%,#a72a0c);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff}.screen span{border:1px solid #ffffff88;padding:7px;border-radius:9px;font-weight:800}.screen b{font-size:29px;letter-spacing:4px;margin-top:14px}.screen small{opacity:.7}.float-card{position:absolute;background:#ffffffeb;border:1px solid #fff;border-radius:13px;padding:13px 17px;box-shadow:0 15px 35px #66280d25;font-size:11px;font-weight:700;backdrop-filter:blur(8px)}.float-card small{display:block;color:var(--muted);font-weight:500;margin-top:3px}.fc1{left:0;top:150px}.fc2{right:6px;bottom:98px}.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border:1px solid var(--line);border-radius:15px;margin-top:30px;overflow:hidden}.benefits article{display:flex;gap:12px;padding:22px;background:#fff;align-items:center;border-right:1px solid var(--line)}.benefits article:last-child{border:0}.benefits article>span{color:var(--orange);font-size:19px}.benefits b,.benefits small{display:block}.benefits b{font-size:11px}.benefits small{color:var(--muted);font-size:9px;margin-top:3px}.section{padding-top:76px;padding-bottom:76px}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:27px}.section h2,.flash-wrap h2,.member h2{font-size:27px;letter-spacing:-1px;margin:5px 0}.section-head>a{font-size:11px;color:var(--orange);text-decoration:none;font-weight:800}.categories{display:grid;grid-template-columns:repeat(6,1fr);gap:13px}.category{padding:23px 12px 18px;text-align:center;border:1px solid var(--line);border-radius:15px;background:#fff;transition:.2s;cursor:pointer}.category:hover{transform:translateY(-5px);border-color:#f7b89d;box-shadow:0 13px 26px #2221}.category span{display:grid;place-items:center;width:55px;height:55px;background:var(--cream);border-radius:16px;margin:0 auto 13px;font-size:25px}.category b{display:block;font-size:11px}.category small{color:var(--muted);font-size:9px}.flash-wrap{background:#17212b;color:#fff;padding:55px 0}.flash-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.flash-tag{background:var(--orange);font-weight:800;font-size:10px;padding:7px 10px;border-radius:7px}.timer{display:flex;gap:6px;align-items:center;font-size:12px}.timer span{color:#aeb7c0;margin-right:7px}.timer b{background:#2c3742;padding:8px;border-radius:6px}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.product-card{background:#fff;border:1px solid var(--line);border-radius:15px;overflow:hidden;color:var(--ink);position:relative;transition:.2s}.product-card:hover{transform:translateY(-4px);box-shadow:0 16px 36px #1018201a}.product-image{height:185px;display:grid;place-items:center;background:linear-gradient(145deg,#f8f9fa,#eef0f2);font-size:70px;position:relative}.product-image:after{content:'';position:absolute;width:100px;height:25px;background:#10182012;filter:blur(12px);border-radius:50%;bottom:22px}.discount{position:absolute;top:10px;left:10px;background:var(--orange);color:white;border-radius:7px;padding:5px 7px;font-size:9px;font-weight:800;z-index:2}.product-info{padding:15px}.product-info small{font-size:8px;color:var(--orange);font-weight:800;letter-spacing:.7px}.product-info h3{font-size:12px;line-height:1.4;margin:7px 0 10px;min-height:34px}.price{font-size:15px;font-weight:800;color:var(--orange)}.old-price{text-decoration:line-through;color:#99a0a7;font-size:9px;margin-left:5px}.meta{display:flex;justify-content:space-between;color:#8b939b;font-size:8px;margin-top:10px}.add-cart{position:absolute;right:12px;bottom:12px;width:31px;height:31px;border-radius:9px;border:0;background:#fff0e9;color:var(--orange);cursor:pointer;font-weight:800;font-size:17px}.add-cart:hover{background:var(--orange);color:#fff}.products-large{grid-template-columns:repeat(5,1fr)}.products-large .product-image{height:170px}.filter-pills{display:flex;gap:6px}.filter-pills button{border:1px solid var(--line);background:#fff;padding:8px 13px;border-radius:20px;font:700 9px Manrope;cursor:pointer}.filter-pills button.active{background:var(--ink);color:#fff;border-color:var(--ink)}.load-more{display:block;margin:32px auto 0;border:1px solid var(--line);background:#fff;padding:12px 25px;border-radius:10px;font:700 11px Manrope;cursor:pointer}.member{margin-bottom:75px;background:linear-gradient(125deg,#fff4ec,#ffe2cf);border-radius:23px;padding:55px 65px;display:flex;justify-content:space-between;align-items:center;overflow:hidden}.member>div:first-child{max-width:540px}.member p{color:var(--muted);font-size:12px;line-height:1.7}.member-card{width:310px;height:185px;border-radius:20px;background:linear-gradient(145deg,#202b35,#111820);color:white;padding:28px;box-shadow:20px 25px 50px #822a0b33;transform:rotate(4deg);display:flex;flex-direction:column}.member-card span{color:#ff9b68;font-size:9px;letter-spacing:2px}.member-card b{margin-top:8px}.member-card small{font-size:7px;letter-spacing:2px;color:#929ca5}.member-card strong{margin-top:auto;letter-spacing:3px}footer{background:#111820;color:#d4dae0;padding:55px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:55px}.footer-brand{color:white}.footer-grid p{color:#86919b;font-size:10px;line-height:1.7;max-width:300px}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:10px}.footer-grid b{font-size:11px;margin-bottom:7px}.footer-grid a,.footer-grid small{color:#86919b;text-decoration:none;font-size:9px}.copyright{border-top:1px solid #2b343d;margin-top:40px;padding-top:18px;color:#64707b;font-size:9px}.drawer{position:fixed;top:0;right:-450px;width:min(420px,100%);height:100vh;background:#fff;z-index:51;display:flex;flex-direction:column;transition:.3s;box-shadow:-20px 0 60px #0002}.drawer.open{right:0}.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:22px;border-bottom:1px solid var(--line)}.drawer-head h3{margin:0}.close,.modal-close{border:0;background:none;font-size:25px;cursor:pointer}.drawer-body{flex:1;overflow:auto;padding:18px}.empty{text-align:center;color:var(--muted);padding-top:100px}.cart-row{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.cart-thumb{height:54px;background:var(--bg);border-radius:10px;display:grid;place-items:center;font-size:27px}.cart-row b{font-size:10px;display:block}.cart-row small{font-size:9px;color:var(--orange)}.cart-row button{border:0;background:none;cursor:pointer;color:#aaa}.drawer-foot{padding:20px;border-top:1px solid var(--line)}.drawer-foot>div{display:flex;justify-content:space-between;margin-bottom:15px}.drawer-foot .primary{width:100%}.overlay{position:fixed;inset:0;background:#10182080;z-index:40;opacity:0;pointer-events:none;transition:.2s;backdrop-filter:blur(3px)}.overlay.show{opacity:1;pointer-events:auto}.modal{position:fixed;z-index:52;width:min(430px,calc(100% - 30px));left:50%;top:50%;transform:translate(-50%,-45%) scale(.96);background:#fff;border-radius:20px;padding:32px;opacity:0;pointer-events:none;transition:.2s;box-shadow:0 30px 80px #0004}.modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}.modal-close{position:absolute;right:18px;top:13px}.modal-icon{display:grid;place-items:center;background:var(--orange);color:#fff;font-weight:800;width:43px;height:43px;border-radius:13px}.modal h2{margin:14px 0 7px}.modal>p{font-size:11px;color:var(--muted)}.tabs{display:flex;border-bottom:1px solid var(--line);margin:22px 0 17px}.tabs button{flex:1;border:0;background:#fff;padding:10px;font:700 11px Manrope}.tabs .active{color:var(--orange);border-bottom:2px solid var(--orange)}label{display:block;font-size:9px;font-weight:800;margin-bottom:12px}label input,label textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;margin-top:6px;outline:0;font:500 11px Manrope}.full{width:100%}.hint{display:block;text-align:center;color:#9ba2a8;font-size:8px;margin-top:12px}.checkout{width:min(740px,calc(100% - 30px))}.checkout-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:25px;margin:20px 0}.payment-box{background:var(--bg);border-radius:14px;padding:22px}.payment-box p{font-size:10px;margin-bottom:4px}.payment-box strong{display:block;font-size:17px}.payment-box small{color:var(--muted);font-size:8px}.order-total{border-top:1px solid #ddd;margin-top:25px;padding-top:17px;display:flex;justify-content:space-between;font-size:11px}.admin{width:min(800px,calc(100% - 30px))}.admin-title{display:flex;justify-content:space-between;align-items:start}.status{font-size:8px;background:#e8fff4;color:var(--green);padding:7px 10px;border-radius:20px}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.admin-stats>div{background:var(--bg);border-radius:10px;padding:14px}.admin-stats small,.admin-stats b{display:block}.admin-stats small{font-size:8px;color:var(--muted)}.admin-stats b{font-size:18px;margin-top:3px}.upload-box{display:flex;align-items:center;gap:12px;border:1px dashed #bdc3c9;padding:17px;border-radius:12px;margin:16px 0}.upload-box>span{font-size:25px}.upload-box div{flex:1}.upload-box b,.upload-box small{display:block}.upload-box b{font-size:11px}.upload-box small{font-size:8px;color:var(--muted)}.file-label{margin:0}.file-label input{display:none}.admin-actions{display:flex;gap:9px}.mini-table{margin-top:18px;border:1px solid var(--line);border-radius:10px;overflow:hidden}.mini-table>div{display:grid;grid-template-columns:2fr 1fr .5fr .5fr;padding:10px 12px;border-bottom:1px solid var(--line);font-size:9px;align-items:center}.mini-table>div:first-child{background:var(--bg)}.mini-table i{font-style:normal;color:var(--green)}.mini-table .warn{color:#e98a16}.toast{position:fixed;z-index:80;bottom:25px;left:50%;transform:translate(-50%,30px);background:#17212b;color:#fff;padding:12px 18px;border-radius:10px;font-size:10px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}@media(max-width:900px){.products-large{grid-template-columns:repeat(3,1fr)}.categories{grid-template-columns:repeat(3,1fr)}.hero{grid-template-columns:1fr}.hero-copy{padding:60px 35px}.hero-visual{display:none}.benefits{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,1fr)}.member-card{display:none}.footer-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.topbar{display:none}.header-main{height:auto;padding:13px 0;flex-wrap:wrap}.brand{flex:1}.search{order:3;flex-basis:100%;max-width:none}.account-trigger{display:none}nav{overflow:auto;gap:18px}nav button{display:none}h1{font-size:38px}.hero-copy{padding:55px 22px}.trust{gap:15px}.benefits{grid-template-columns:1fr 1fr}.categories{grid-template-columns:repeat(2,1fr)}.product-grid,.products-large{grid-template-columns:repeat(2,1fr);gap:9px}.product-image,.products-large .product-image{height:140px}.section-head{align-items:start}.filter-pills{display:none}.member{padding:35px 25px}.footer-grid{grid-template-columns:1fr 1fr;gap:35px 20px}.checkout-grid{grid-template-columns:1fr}.admin-stats{grid-template-columns:1fr 1fr 1fr}.upload-box{align-items:start;flex-wrap:wrap}.mini-table{display:none}}
/* Khalisa Ponsel official brand and store details */
.brand-logo{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 5px 10px #0002)}
.screen img{width:78px;height:78px;object-fit:contain;filter:drop-shadow(0 8px 14px #0005)}
.member-card{position:relative}
.member-card img{position:absolute;width:64px;height:64px;object-fit:contain;right:20px;top:17px}
.member-card span{color:#a3dc49!important}
.footer-text{color:#86919b;text-decoration:none;font-size:9px}
label select{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px;margin-top:6px;outline:0;font:500 11px Manrope;background:#fff}
.copy-bank{margin-top:12px;border:1px solid #d9dee3;background:#fff;border-radius:8px;padding:8px 10px;font:700 9px Manrope;cursor:pointer}

.product-category-row { display:flex; align-items:center; justify-content:space-between; min-height:25px; }
.share-product { width:27px; height:27px; display:grid; place-items:center; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--muted); font-size:15px; line-height:1; cursor:pointer; transition:.2s; }
.share-product:hover,.share-product:focus-visible { color:#fff; background:var(--orange); border-color:var(--orange); outline:none; }
.shared-highlight { animation:sharedPulse 1s ease 3; }
@keyframes sharedPulse { 50% { box-shadow:0 0 0 5px #f45b2045,0 16px 36px #1018201a; } }
.share-modal>strong { display:block; color:var(--orange); margin-top:8px; }
.share-options { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:22px; }
.share-options button { display:flex; align-items:center; gap:9px; border:1px solid var(--line); background:#fff; border-radius:11px; padding:11px; font:700 10px Manrope; cursor:pointer; text-align:left; }
.share-options button:hover { border-color:#f7b89d; background:var(--cream); }
.share-options span { width:30px; height:30px; display:grid; place-items:center; flex:0 0 30px; border-radius:9px; background:#fff0e9; color:var(--orange); font-weight:800; font-size:12px; }
@media(max-width:380px) { .share-options { grid-template-columns:1fr; } }
.products-large.grouped-catalog { display:block; }
.category-product-group { margin-bottom:42px; }
.category-product-group:last-child { margin-bottom:0; }
.category-group-head { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); margin-bottom:16px; padding-bottom:10px; }
.category-group-head h3 { margin:0; font-size:19px; letter-spacing:-.4px; }
.category-group-head span { color:var(--muted); background:var(--bg); border-radius:20px; padding:6px 10px; font-size:10px; font-weight:700; }
.catalog-empty { text-align:center; color:var(--muted); padding:45px; border:1px dashed var(--line); border-radius:14px; }
