:root{--vq-primary:#6d5dfc;--vq-secondary:#12b8a6;--vq-dark:#101828;--vq-muted:#667085;--vq-bg:#f7f8fc;--vq-card:#fff;--vq-border:#e7eaf1;--vq-radius:18px;--vq-shadow:0 18px 50px rgba(15,23,42,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--vq-dark);background:var(--vq-bg);line-height:1.6}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select,textarea{font:inherit}.container{width:min(1180px,calc(100% - 32px));margin:auto}.section{padding:86px 0}.section-sm{padding:48px 0}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:#edeaff;color:#5848e6;font-weight:800;font-size:13px;letter-spacing:.02em}.title{font-size:clamp(34px,5vw,62px);line-height:1.08;letter-spacing:-.045em;margin:18px 0}.section-title{font-size:clamp(28px,4vw,44px);line-height:1.15;letter-spacing:-.035em;margin:0 0 14px}.lead{font-size:18px;color:var(--vq-muted);max-width:760px}.text-muted{color:var(--vq-muted)}.text-center{text-align:center}.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:8px}.gap-3{gap:14px}.gap-4{gap:22px}.grid{display:grid;gap:24px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:var(--vq-card);border:1px solid var(--vq-border);border-radius:var(--vq-radius);box-shadow:0 8px 30px rgba(15,23,42,.045)}.card-pad{padding:26px}.badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:#eef2ff;color:#4338ca;font-size:12px;font-weight:800}.badge.success{background:#ecfdf3;color:#027a48}.badge.warning{background:#fffaeb;color:#b54708}.badge.danger{background:#fff1f3;color:#c01048}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:none;border-radius:12px;padding:12px 18px;font-weight:800;cursor:pointer;transition:.2s ease}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(135deg,var(--vq-primary),#8b5cf6);color:#fff;box-shadow:0 12px 28px rgba(109,93,252,.24)}.btn-secondary{background:#eef2ff;color:#4f46e5}.btn-dark{background:#111827;color:#fff}.btn-light{background:#fff;color:#111827;border:1px solid var(--vq-border)}.btn-danger{background:#fff1f3;color:#c01048}.btn-sm{padding:8px 12px;border-radius:9px;font-size:13px}.btn-block{width:100%}.nav{height:76px;position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border-bottom:1px solid rgba(226,232,240,.8)}.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between}.brand img{width:220px;height:auto}.nav-links{display:flex;align-items:center;gap:24px;font-weight:700;font-size:14px}.mobile-menu{display:none}.hero{padding:78px 0 70px;overflow:hidden;background:radial-gradient(circle at 85% 10%,#d9d3ff 0,transparent 34%),radial-gradient(circle at 5% 85%,#c8fff5 0,transparent 28%),linear-gradient(#fff,#f8f9ff)}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:52px;align-items:center}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.hero-points{display:flex;gap:18px;flex-wrap:wrap;color:#475467;font-weight:700;font-size:14px}.hero-points span:before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;margin-right:7px;border-radius:50%;background:#dcfae6;color:#079455}.app-mock{background:#101828;border:8px solid #101828;border-radius:30px;box-shadow:0 38px 90px rgba(15,23,42,.25);transform:rotate(1.2deg);overflow:hidden}.mock-top{background:#fff;padding:16px 18px;display:flex;justify-content:space-between}.mock-body{background:#f5f7fb;padding:18px;display:grid;grid-template-columns:160px 1fr;gap:16px}.mock-side,.mock-panel{background:#fff;border-radius:15px;padding:14px}.mock-menu{height:10px;background:#e8eaf0;border-radius:99px;margin:11px 0}.mock-menu.active{background:#6d5dfc;width:72%}.mock-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mock-stat{height:74px;border-radius:12px;background:linear-gradient(135deg,#edeaff,#fff)}.mock-chart{height:170px;margin-top:12px;border-radius:14px;background:linear-gradient(180deg,#f4f0ff,#fff);position:relative;overflow:hidden}.mock-chart:after{content:"";position:absolute;left:-10%;right:-10%;bottom:26px;height:75px;border-top:5px solid #6d5dfc;border-radius:50%;transform:rotate(-4deg)}.logo-cloud{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:40px}.logo-pill{background:#fff;border:1px solid var(--vq-border);padding:15px;text-align:center;border-radius:13px;font-weight:800;color:#667085}.feature-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#edeaff;color:#5b4bea;font-size:21px;margin-bottom:16px}.feature-card{padding:24px}.feature-card h3{margin:0 0 7px}.number{font-size:48px;font-weight:900;line-height:1;color:#6d5dfc}.pricing-card{padding:28px;position:relative}.pricing-card.popular{border:2px solid #6d5dfc;box-shadow:0 24px 60px rgba(109,93,252,.16);transform:translateY(-10px)}.pricing-card ul{list-style:none;padding:0;margin:22px 0}.pricing-card li{padding:7px 0;color:#475467}.pricing-card li:before{content:"✓";color:#079455;font-weight:900;margin-right:9px}.price{font-size:38px;font-weight:900;letter-spacing:-.04em}.theme-showcase{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.theme-mini{height:160px;border-radius:18px;border:1px solid rgba(255,255,255,.4);padding:12px;overflow:hidden;box-shadow:0 15px 35px rgba(15,23,42,.11);transition:.2s}.theme-mini:hover{transform:translateY(-5px)}.theme-mini-head{height:20px;border-radius:7px;background:rgba(255,255,255,.86);margin-bottom:9px}.theme-mini-hero{height:48px;border-radius:9px;background:rgba(255,255,255,.62);margin-bottom:8px}.theme-mini-products{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.theme-mini-products i{height:46px;border-radius:7px;background:rgba(255,255,255,.84)}.cta{background:linear-gradient(135deg,#17122b,#312e81);color:#fff;border-radius:32px;padding:54px;position:relative;overflow:hidden}.cta:after{content:"";position:absolute;width:280px;height:280px;border-radius:50%;background:#6d5dfc;filter:blur(15px);opacity:.38;right:-80px;top:-100px}.footer{background:#0f172a;color:#cbd5e1;padding:60px 0 25px}.footer h4{color:#fff}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:38px}.footer a{display:block;margin:8px 0;color:#cbd5e1}.auth-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.auth-side{padding:50px;background:radial-gradient(circle at 70% 20%,#9187ff,transparent 28%),linear-gradient(135deg,#1c1744,#4f46e5);color:#fff;display:flex;flex-direction:column;justify-content:space-between}.auth-main{display:grid;place-items:center;padding:40px}.auth-box{width:min(460px,100%)}.form-group{margin-bottom:16px}.form-label{display:block;font-size:14px;font-weight:800;margin-bottom:7px}.form-control,.form-select,.form-textarea{width:100%;border:1px solid #d8dee9;border-radius:11px;padding:12px 13px;background:#fff;outline:none}.form-control:focus,.form-select:focus,.form-textarea:focus{border-color:#7c6ff1;box-shadow:0 0 0 4px rgba(109,93,252,.1)}.form-textarea{min-height:120px;resize:vertical}.help{font-size:12px;color:#667085;margin-top:5px}.alert{padding:12px 15px;border-radius:11px;margin:12px 0;font-weight:650}.alert-success{background:#ecfdf3;color:#027a48}.alert-warning{background:#fffaeb;color:#b54708}.alert-danger{background:#fff1f3;color:#c01048}.alert-info{background:#eff8ff;color:#175cd3}.dashboard{min-height:100vh;background:#f5f7fb}.dash-sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#111827;color:#cbd5e1;padding:24px 17px;z-index:40}.dash-brand img{width:190px;filter:brightness(0) invert(1)}.dash-menu{margin-top:30px}.dash-menu a{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;margin:4px 0;font-weight:700;font-size:14px}.dash-menu a:hover,.dash-menu a.active{background:#29255a;color:#fff}.dash-main{margin-left:250px}.dash-top{height:72px;background:#fff;border-bottom:1px solid #e7eaf1;padding:0 28px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:30}.dash-content{padding:28px}.page-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}.page-head h1{font-size:28px;margin:0}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.stat-card{padding:20px}.stat-label{color:#667085;font-weight:700;font-size:13px}.stat-value{font-size:30px;font-weight:900;margin-top:7px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:13px 14px;border-bottom:1px solid #edf0f5;text-align:left;white-space:nowrap}.table th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:#667085}.product-thumb{width:52px;height:52px;border-radius:10px;object-fit:cover;background:#eef2f7}.empty{padding:52px;text-align:center;color:#667085}.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.theme-card{overflow:hidden;position:relative}.theme-preview{height:150px;padding:12px}.theme-preview .bar{height:18px;background:rgba(255,255,255,.9);border-radius:6px;margin-bottom:8px}.theme-preview .hero-bar{height:50px;background:rgba(255,255,255,.62);border-radius:9px;margin-bottom:7px}.theme-preview .boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.theme-preview .boxes i{height:42px;background:rgba(255,255,255,.85);border-radius:7px}.theme-info{padding:14px}.theme-card.current:after{content:"Aktif";position:absolute;right:10px;top:10px;background:#12b76a;color:#fff;font-size:11px;font-weight:900;padding:5px 8px;border-radius:99px}.domain-box{border:1px dashed #a7b2c4;background:#f8fafc;padding:18px;border-radius:13px}.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#111827;color:#e2e8f0;padding:3px 7px;border-radius:6px;font-size:13px}.install{min-height:100vh;background:radial-gradient(circle at top left,#e0dcff,transparent 32%),#f7f8fc;padding:45px 0}.install-box{width:min(800px,calc(100% - 32px));margin:auto}.steps{display:flex;gap:10px;margin:20px 0}.step{height:7px;flex:1;background:#e4e7ec;border-radius:99px}.step.active{background:#6d5dfc}
@media(max-width:980px){.grid-4,.theme-grid{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.hero-grid,.auth-shell{grid-template-columns:1fr}.hero-copy{text-align:center}.hero .lead{margin-inline:auto}.hero-actions,.hero-points{justify-content:center}.auth-side{display:none}.theme-showcase{grid-template-columns:repeat(3,1fr)}.dash-sidebar{transform:translateX(-100%);transition:.2s}.dash-sidebar.open{transform:none}.dash-main{margin-left:0}.mobile-menu{display:inline-flex}.stat-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.nav-links{display:none}.brand img{width:180px}.section{padding:62px 0}.grid-2,.grid-3,.grid-4,.theme-grid,.stat-grid{grid-template-columns:1fr}.logo-cloud{grid-template-columns:repeat(2,1fr)}.theme-showcase{grid-template-columns:repeat(2,1fr)}.theme-showcase .theme-mini:nth-child(n+7){display:none}.mock-body{grid-template-columns:1fr}.mock-side{display:none}.cta{padding:34px 24px}.footer-grid{grid-template-columns:1fr}.dash-content{padding:18px}.dash-top{padding:0 17px}.page-head{align-items:flex-start;flex-direction:column}.pricing-card.popular{transform:none}.auth-main{padding:25px}.hide-mobile{display:none}}

/* VQuickShop v1.1 real theme gallery and visual builder */
.theme-grid-real{grid-template-columns:repeat(3,minmax(0,1fr))}.theme-grid-real .theme-card{display:flex;flex-direction:column}.theme-desc{font-size:12px;margin:8px 0 14px;min-height:46px;line-height:1.55}.theme-real-preview{height:225px;background:var(--tp-bg);padding:10px;position:relative;overflow:hidden}.tp-nav{height:25px;background:#fff;border-radius:7px;padding:6px;display:flex;align-items:center;gap:6px;box-shadow:0 3px 10px #0001}.tp-nav i{width:38px;height:10px;background:var(--tp-primary);border-radius:3px;margin-right:auto}.tp-nav b{width:18px;height:4px;background:#cbd5e1;border-radius:4px}.tp-hero{height:91px;border-radius:10px;margin:8px 0;background-size:cover;background-position:center;display:flex;align-items:end;padding:10px;color:#fff;position:relative;overflow:hidden}.tp-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,#0008)}.tp-hero strong{font-size:12px;position:relative;z-index:1}.tp-body{display:flex;gap:7px}.tp-side{width:38px;border-radius:6px;background:#fff;display:block}.tp-products{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;flex:1}.tp-products i{height:67px;background:#fff;border-radius:7px;box-shadow:0 3px 8px #0001}.theme-sidebar-right .tp-side{order:2}.theme-editorial .tp-products i:first-child{grid-column:span 2}.theme-editorial .tp-products{grid-template-columns:repeat(3,1fr)}.theme-catalog .tp-products,.theme-market .tp-products{grid-template-columns:repeat(5,1fr)}.theme-catalog .tp-products i,.theme-market .tp-products i{height:58px}.theme-luxury .tp-hero,.theme-classic .tp-hero{border-radius:0}.theme-bold .tp-nav{background:#111}.theme-bold .tp-products i{border:2px solid #111;box-shadow:3px 3px 0 #111}.theme-playful .tp-products i{border-radius:18px}.theme-tech{background:#07111f}.theme-tech .tp-products i{background:#111d2b;border:1px solid var(--tp-secondary)}.theme-masonry .tp-products{display:block;columns:4}.theme-masonry .tp-products i{display:block;margin-bottom:5px;height:31px}.theme-masonry .tp-products i:nth-child(2n){height:45px}.builder-note{padding:15px 18px;border-radius:12px;background:#eef2ff;color:#3730a3;margin-bottom:20px}.toggle-grid{display:flex;gap:18px;flex-wrap:wrap;padding:14px;border-radius:12px;background:#f8fafc}.code-editor{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;min-height:170px}.color-control{height:48px;padding:5px}.builder-sections{display:grid;gap:12px}.builder-section{border:1px solid #e5e7eb;border-radius:13px;overflow:hidden;background:#fff}.builder-section summary{cursor:pointer;padding:15px 18px;display:flex;justify-content:space-between;gap:20px;background:#f8fafc}.builder-section summary span{font-size:12px;color:#667085;max-width:60%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.builder-section-body{padding:18px}.builder-thumb{width:100%;max-width:220px;height:110px;object-fit:cover;border-radius:10px;margin-top:8px}.menu-builder-row{display:grid;grid-template-columns:1fr 1.3fr auto auto;gap:8px;align-items:center;margin-bottom:9px}.menu-builder-row label{padding:10px 3px}.theme-card.current{outline:3px solid #12b76a}
@media(max-width:1100px){.theme-grid-real{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.theme-grid-real{grid-template-columns:1fr}.menu-builder-row{grid-template-columns:1fr 1fr}.builder-section summary span{display:none}}
.real-home-showcase>a{display:block}.real-home-showcase .theme-real-preview{height:170px;border-radius:18px;box-shadow:0 14px 35px rgba(15,23,42,.11)}.real-home-showcase .tp-hero{height:65px}.real-home-showcase .tp-products i{height:43px}.real-home-showcase .tp-side{height:43px}

/* VQuickShop v1.2: product variants and merchant payment settings */
.variant-enable{display:flex;align-items:center;gap:9px;padding:10px 14px;border-radius:12px;background:#eef2ff;color:#4338ca;font-weight:800}.variant-editor{margin-top:22px}.variant-editor.is-disabled{opacity:.5;pointer-events:none}.variant-editor-head,.variant-row{display:grid;grid-template-columns:1.35fr 1fr 1.1fr auto;gap:14px}.variant-editor-head{padding:10px 14px;background:#f8fafc;border:1px solid var(--vq-border);border-radius:12px 12px 0 0;color:#667085;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.variant-row{padding:18px 14px;border:1px solid var(--vq-border);border-top:0;background:#fff;align-items:start}.variant-row:last-child{border-radius:0 0 12px 12px;margin-bottom:14px}.variant-row .form-group{margin-bottom:10px}.variant-thumb{width:62px;height:62px;object-fit:cover;border-radius:10px;margin-bottom:8px}.payment-admin-grid{align-items:start}.payment-admin-card{margin-bottom:14px}.payment-admin-card h3{margin:8px 0}.payment-type-icon{font-size:30px}.admin-account-number{font-size:22px;font-weight:900;letter-spacing:.04em}.qris-admin-preview{width:170px;max-height:210px;object-fit:contain;border:1px solid var(--vq-border);border-radius:12px;padding:8px;background:#fff;margin-bottom:10px}.order-product-line{padding:6px 0;border-bottom:1px solid #edf0f5}.order-product-line:last-child{border-bottom:0}.order-product-line small{display:block;color:#667085}
@media(max-width:1100px){.variant-editor-head{display:none}.variant-row{grid-template-columns:1fr 1fr}.variant-row>div:last-child{grid-column:1/-1}.payment-admin-grid{grid-template-columns:1fr}}
@media(max-width:720px){.variant-row{grid-template-columns:1fr;padding:16px}.variant-row>div:last-child{grid-column:auto}}

/* VQuickShop v1.3 — full template previews and read-only demo dashboard */
.theme-real-preview{height:210px;position:relative;overflow:hidden;background:#eef1f6;border-bottom:1px solid var(--vq-border)}
.theme-real-preview img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .35s ease}
.theme-card:hover .theme-real-preview img,.real-home-showcase a:hover .theme-real-preview img{transform:scale(1.025)}
.theme-preview-label{position:absolute;left:10px;bottom:10px;background:rgba(17,24,39,.88);color:#fff;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:900;letter-spacing:.04em}
.real-home-showcase .theme-real-preview{height:185px}
.demo-readonly-pill{margin:18px 0 4px;padding:7px 10px;border:1px solid #4b5563;border-radius:9px;text-align:center;font-size:11px;font-weight:900;letter-spacing:.1em;color:#fbbf24}
.demo-readonly-notice{padding:13px 16px;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:12px;margin-bottom:22px}
.demo-credential-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#f5f3ff;border:1px solid #ddd6fe;padding:14px;border-radius:13px;margin:18px 0}
.demo-credential-box span{display:block;color:#667085;font-size:12px}.demo-credential-box strong{display:block;font-size:14px;word-break:break-word}
.stat-grid .stat-card{background:#fff;border:1px solid var(--vq-border);border-radius:16px;box-shadow:0 8px 30px rgba(15,23,42,.045)}
.stat-card span,.stat-card small{display:block;color:#667085}.stat-card strong{display:block;font-size:27px;margin:7px 0}.stat-card small{font-size:12px}
.demo-bars{height:230px;display:flex;align-items:end;gap:14px;padding-top:18px}.demo-bars>div{flex:1;height:100%;display:flex;flex-direction:column;justify-content:end;align-items:center;gap:7px}.demo-bars span{width:100%;max-width:34px;background:linear-gradient(180deg,#8b5cf6,#5b4bea);border-radius:8px 8px 2px 2px}.demo-bars small{color:#667085}
.activity-list p{display:flex;flex-direction:column;padding:12px 0;border-bottom:1px solid #edf0f5;margin:0}.activity-list span{font-size:12px;color:#667085}
.product-cell{display:flex;align-items:center;gap:11px}.product-cell img{width:52px;height:52px;border-radius:10px;object-fit:cover}.product-cell small{display:block;color:#667085}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
@media(max-width:760px){.demo-credential-box{grid-template-columns:1fr}.theme-real-preview{height:190px}}