:root{--bg:#07111f;--bg2:#0b1527;--card:rgba(255,255,255,.08);--card2:rgba(255,255,255,.12);--text:#f8fafc;--muted:#a8b3c7;--line:rgba(255,255,255,.14);--primary:#ff7a18;--primary2:#ffb000;--dark:#0f172a;--white:#fff;--green:#16a34a;--red:#ef4444;--blue:#38bdf8;--shadow:0 24px 90px rgba(0,0,0,.38);--radius:28px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:radial-gradient(circle at top left,rgba(255,122,24,.20),transparent 30%),radial-gradient(circle at 80% 10%,rgba(56,189,248,.18),transparent 26%),linear-gradient(180deg,#07111f 0%,#0b1222 42%,#f7f8fb 42%,#fff 100%);color:var(--text);overflow-x:hidden}a{color:inherit;text-decoration:none}.container{width:min(1180px,92%);margin:auto}.nav{position:sticky;top:0;z-index:80;background:rgba(7,17,31,.78);backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:-.03em}.logo{width:44px;height:44px;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--primary2));display:grid;place-items:center;color:#111827;box-shadow:0 16px 38px rgba(255,122,24,.35);font-weight:900}.menu{display:flex;gap:22px;align-items:center;color:#dbeafe;font-weight:800;font-size:14px}.menu a,.menu span a{opacity:.88}.menu a:hover,.menu span a:hover{opacity:1;color:#fff}.btn{border:0;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;border-radius:999px;font-weight:900;cursor:pointer;transition:.25s ease;text-decoration:none;white-space:nowrap}.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary2));color:#111827;box-shadow:0 18px 45px rgba(255,122,24,.32)}.btn-ghost{background:rgba(255,255,255,.08);border:1px solid var(--line);color:inherit}.btn-light{background:#fff;color:#111827}.wide{width:100%}.cart-pill{position:relative}.cart-count{background:#fff;color:#111827;border-radius:999px;min-width:24px;height:24px;display:grid;place-items:center;padding:0 7px}.hero{position:relative;min-height:690px;padding:92px 0 120px;overflow:hidden}.orb{position:absolute;border-radius:999px;filter:blur(8px);opacity:.8;animation:floaty 8s ease-in-out infinite}.orb-1{width:270px;height:270px;background:rgba(255,122,24,.22);right:8%;top:100px}.orb-2{width:180px;height:180px;background:rgba(56,189,248,.20);left:3%;bottom:150px;animation-delay:1.2s}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:58px;align-items:center}.badge,.section-label,.badge-soft{display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;background:rgba(255,122,24,.14);border:1px solid rgba(255,122,24,.28);color:#fed7aa;font-weight:900;font-size:13px}.hero h1{font-size:clamp(42px,6vw,78px);line-height:.96;margin:22px 0;letter-spacing:-.075em}.hero h1 span{background:linear-gradient(135deg,#fff,var(--primary2));-webkit-background-clip:text;color:transparent}.hero p{font-size:19px;line-height:1.75;color:#cbd5e1;max-width:640px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:32px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}.stat{background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:var(--shadow)}.stat strong{display:block;font-size:26px}.stat span{display:block;color:#cbd5e1;margin-top:4px;font-weight:700}.mockup{position:relative;transform:perspective(1100px) rotateY(-8deg) rotateX(4deg);animation:floaty 7s ease-in-out infinite}.mock-screen{border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);box-shadow:0 34px 100px rgba(0,0,0,.48);padding:18px}.browser{height:42px;display:flex;gap:7px;align-items:center}.dot{width:11px;height:11px;border-radius:99px;background:#fff;opacity:.38}.mock-card{background:rgba(255,255,255,.93);color:#111827;border-radius:24px;padding:22px;margin:14px 0;box-shadow:0 18px 55px rgba(0,0,0,.18)}.mock-card.orange{background:linear-gradient(135deg,var(--primary),#ffd166)}.mock-card h2{font-size:32px;margin:12px 0 0}.mock-row{height:13px;border-radius:999px;background:#dbe3ef;margin:13px 0}.w70{width:70%}.w50{width:50%}.section{padding:86px 0;color:#111827}.section-head{text-align:center;max-width:760px;margin:0 auto 42px}.section-label{color:#9a3412;background:#fff7ed;border-color:#fed7aa}.section-title{font-size:clamp(30px,4vw,52px);letter-spacing:-.05em;line-height:1.05;margin:15px 0;color:#0f172a}.section-sub{color:#64748b;font-size:17px;line-height:1.7}.products{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.product{position:relative;background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border:1px solid #e7edf5;border-radius:30px;padding:28px;box-shadow:0 18px 60px rgba(15,23,42,.08);overflow:hidden}.product:before{content:"";position:absolute;inset:-1px;background:linear-gradient(135deg,rgba(255,122,24,.14),transparent 35%,rgba(56,189,248,.10));opacity:0;transition:.3s}.product:hover{transform:translateY(-7px);box-shadow:0 28px 80px rgba(15,23,42,.14)}.product:hover:before{opacity:1}.product>*{position:relative}.product h3{font-size:23px;margin:0 0 10px;letter-spacing:-.03em}.product p{color:#64748b;line-height:1.65}.price{font-size:30px;font-weight:900;letter-spacing:-.04em;margin:18px 0;color:#0f172a}.features{list-style:none;padding:0;margin:0 0 26px}.features li{padding:9px 0;color:#334155;font-weight:700}.features li:before{content:"✓";display:inline-grid;place-items:center;width:21px;height:21px;border-radius:99px;background:#dcfce7;color:#166534;margin-right:8px;font-size:12px}.ribbon{position:absolute;right:18px;top:18px;background:#111827;color:#fff;border-radius:999px;padding:8px 11px;font-size:12px;font-weight:900}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step{background:#fff;border:1px solid #e7edf5;border-radius:28px;padding:26px;box-shadow:0 16px 50px rgba(15,23,42,.07)}.step-num{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary2));font-weight:900;color:#111827}.step p{color:#64748b;line-height:1.65}.faq{max-width:850px;margin:auto}.faq details{background:#fff;border:1px solid #e7edf5;border-radius:24px;padding:22px;margin-bottom:14px;box-shadow:0 14px 42px rgba(15,23,42,.06)}.faq summary{font-weight:900;cursor:pointer}.faq p{color:#64748b;line-height:1.7}.cta{background:linear-gradient(135deg,#111827,#1e293b 55%,#fb923c);color:#fff;border-radius:34px;padding:42px;display:flex;align-items:center;justify-content:space-between;gap:22px;box-shadow:0 30px 90px rgba(15,23,42,.22)}.cta h2{font-size:36px;margin:0 0 8px;letter-spacing:-.04em}.cta p{color:#dbeafe}.footer{background:#07111f;color:#94a3b8;padding:34px 0;text-align:center}.page{min-height:100vh;padding:70px 0;color:#111827;background:linear-gradient(180deg,#f7f8fb,#fff)}.panel{background:#fff;border:1px solid #e7edf5;border-radius:30px;padding:28px;box-shadow:0 18px 60px rgba(15,23,42,.08)}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.field{display:flex;flex-direction:column;gap:8px}.field label{font-weight:900}.field input,.field textarea,.field select{width:100%;border:1px solid #d9e2ef;border-radius:16px;padding:14px 15px;font:inherit;background:#fff;color:#0f172a;outline:none}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(255,122,24,.12)}.summary-line{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #edf2f7;color:#334155}.summary-line.total,.summary-line.grand{font-size:20px;color:#111827}.summary-line.grand strong{color:#ea580c}.table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:22px;border:1px solid #e7edf5;background:#fff}.table th{background:#f8fafc;color:#0f172a;text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.05em}.table th,.table td{padding:16px;border-bottom:1px solid #e7edf5;vertical-align:top}.table tr:last-child td{border-bottom:0}.empty{background:#fff;border:1px dashed #cbd5e1;border-radius:22px;padding:26px;color:#64748b;text-align:center;font-weight:800}.voucher-message{font-size:13px;font-weight:800}.voucher-message.ok{color:#15803d}.voucher-message.bad{color:#b91c1c}.client-summary{display:grid;grid-template-columns:1fr 1fr auto;gap:18px;align-items:center}.status,.pay-stamp{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900}.status-menunggu-pembayaran{background:#fff7ed;color:#9a3412}.status-diproses{background:#e0f2fe;color:#075985}.status-selesai{background:#dcfce7;color:#166534}.status-dibatalkan{background:#fee2e2;color:#991b1b}.pay-stamp{letter-spacing:.05em;text-transform:uppercase}.pay-stamp.paid{background:#dcfce7;color:#166534;border:1px solid #86efac}.pay-stamp.unpaid{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}.print-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center;margin-bottom:18px;flex-wrap:wrap}.invoice-modern{position:relative;background:#fff;border-radius:34px;overflow:hidden;box-shadow:0 30px 100px rgba(15,23,42,.15);border:1px solid #e7edf5}.invoice-modern:before{content:"";position:absolute;left:0;right:0;top:0;height:15px;background:linear-gradient(90deg,var(--primary),var(--primary2),#38bdf8)}.invoice-top{background:radial-gradient(circle at top right,rgba(255,122,24,.28),transparent 32%),linear-gradient(135deg,#0f172a,#111827 62%,#2b1608);color:#fff;padding:54px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:start}.invoice-logo{max-width:190px;max-height:78px;object-fit:contain;background:#fff;border-radius:20px;padding:12px}.invoice-meta{text-align:right}.invoice-meta h1{font-size:54px;margin:16px 0 4px;letter-spacing:-.05em}.invoice-body{padding:44px}.invoice-two{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:24px}.invoice-box{border:1px solid #e7edf5;background:linear-gradient(180deg,#fff,#f8fafc);border-radius:26px;padding:24px}.invoice-box h3{font-size:22px;margin:12px 0 8px}.invoice-box p{color:#64748b;line-height:1.75}.invoice-total-box{width:min(460px,100%);margin:26px 0 0 auto;background:#f8fafc;border:1px solid #e7edf5;border-radius:26px;padding:20px}.invoice-payment-grid{display:grid;grid-template-columns:1fr 270px;gap:22px;align-items:stretch;margin-top:24px}.qris-invoice{border:1px solid #e7edf5;background:#fff;border-radius:28px;padding:20px;text-align:center}.qris-invoice img{width:100%;max-width:220px;border-radius:18px;border:1px solid #e7edf5}.qris-invoice strong{display:block;margin-bottom:10px}.invoice-note{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;border-radius:22px;padding:18px;line-height:1.7}.tiny{color:#64748b;font-size:13px}.reveal-up{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1);transition-delay:var(--delay,0ms)}.reveal-up.show{opacity:1;transform:none}@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}.wa-float{position:fixed;right:22px;bottom:22px;z-index:120}.wa-bubble{width:64px;height:64px;border:0;border-radius:22px;background:linear-gradient(135deg,#25d366,#10b981);color:#fff;box-shadow:0 18px 50px rgba(16,185,129,.4);display:grid;place-items:center;cursor:pointer;position:relative}.wa-icon{font-size:34px;transform:rotate(-10deg)}.wa-pulse{position:absolute;inset:-8px;border-radius:28px;background:rgba(37,211,102,.22);animation:pulse 1.7s infinite}.wa-card{position:absolute;right:0;bottom:78px;width:326px;background:#fff;color:#111827;border-radius:28px;padding:16px;box-shadow:0 25px 90px rgba(15,23,42,.25);border:1px solid #e7edf5;opacity:0;transform:translateY(12px) scale(.96);pointer-events:none;transition:.25s ease}.wa-card.open{opacity:1;transform:none;pointer-events:auto}.wa-head{display:flex;gap:12px;align-items:center;border-bottom:1px solid #e7edf5;padding-bottom:12px}.wa-avatar{width:46px;height:46px;border-radius:17px;background:linear-gradient(135deg,var(--primary),var(--primary2));display:grid;place-items:center;font-weight:900}.wa-head span{display:block;color:#16a34a;font-size:12px;font-weight:800;margin-top:2px}.wa-body{background:#ecfdf5;border-radius:20px;padding:14px;margin:14px 0}.wa-msg{background:#fff;border-radius:16px 16px 16px 4px;padding:10px 12px;margin:8px 0;color:#334155;box-shadow:0 8px 20px rgba(15,23,42,.06);line-height:1.45}@keyframes pulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.25);opacity:0}}@media(max-width:900px){.hero-grid,.products,.steps,.invoice-two,.invoice-payment-grid{grid-template-columns:1fr}.menu{display:none}.stats,.form-grid,.client-summary{grid-template-columns:1fr}.hero{padding:60px 0 80px}.mockup{transform:none}.cta,.invoice-top{grid-template-columns:1fr;display:grid}.invoice-meta{text-align:left}.invoice-top,.invoice-body{padding:30px}.table{display:block;overflow-x:auto}.wa-card{width:300px}.section{padding:62px 0}}@media print{body{background:#fff}.nav,.footer,.print-actions,.wa-float{display:none!important}.page{padding:0;background:#fff}.container{width:100%}.invoice-modern{box-shadow:none;border:0;border-radius:0}.invoice-top{print-color-adjust:exact;-webkit-print-color-adjust:exact}.btn{display:none}}

/* Guard: gunakan popup hijau .wa-float saja, sembunyikan popup baru jika masih tersisa di HTML/cache */
.wa-chat-widget, #waChatWidget { display: none !important; }

/* =========================
   Fix QRIS Payment Page
========================= */

.invoice-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 28px !important;
    align-items: start !important;
}

.invoice-card aside {
    max-width: 320px !important;
    width: 100% !important;
    margin: 0 auto !important;
    text-align: center !important;
    background: #ffffff !important;
    border: 1px solid #e7edf5 !important;
    border-radius: 28px !important;
    padding: 22px !important;
    box-shadow: 0 18px 55px rgba(15, 23, 42, 0.08) !important;
}

.invoice-card img.qris,
img.qris {
    width: 230px !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto 14px auto !important;
    object-fit: contain !important;
    border-radius: 18px !important;
    border: 1px solid #e7edf5 !important;
    background: #fff !important;
    padding: 8px !important;
}

.invoice-card aside p {
    margin: 10px auto 0 !important;
    max-width: 240px !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
    color: #64748b !important;
}

@media (max-width: 900px) {
    .invoice-card {
        grid-template-columns: 1fr !important;
    }

    .invoice-card aside {
        max-width: 280px !important;
        order: -1 !important;
    }

    .invoice-card img.qris,
    img.qris {
        width: 200px !important;
        max-width: 78vw !important;
    }
}

@media (max-width: 480px) {
    .invoice-card aside {
        max-width: 240px !important;
        padding: 16px !important;
        border-radius: 22px !important;
    }

    .invoice-card img.qris,
    img.qris {
        width: 180px !important;
    }
}
.qris-img {
    width: 220px !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 12px auto !important;
}

/* === ILMAWEB FINAL FIX 20260513 === */
/* Global anti-cache-friendly fixes: QRIS/logo responsive, invoice print clean, WA green popup only */
.wa-chat-widget,
#waChatWidget,
.wa-chat-box,
.wa-chat-button {
    display: none !important;
    visibility: hidden !important;
}

.wa-float {
    position: fixed !important;
    right: 22px !important;
    bottom: 22px !important;
    z-index: 99999 !important;
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
}
.wa-float .wa-card {
    position: absolute !important;
    right: 0 !important;
    bottom: 78px !important;
    width: 326px !important;
    max-width: calc(100vw - 32px) !important;
    background: #fff !important;
    color: #111827 !important;
    border-radius: 28px !important;
    padding: 16px !important;
    box-shadow: 0 25px 90px rgba(15,23,42,.25) !important;
    border: 1px solid #e7edf5 !important;
    opacity: 0;
    transform: translateY(12px) scale(.96);
    pointer-events: none;
    transition: .25s ease;
}
.wa-float .wa-card.open { opacity: 1 !important; transform: none !important; pointer-events: auto !important; }
.wa-float .wa-bubble {
    width: 64px !important;
    height: 64px !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: linear-gradient(135deg,#25d366,#10b981) !important;
    color: #fff !important;
    box-shadow: 0 18px 50px rgba(16,185,129,.4) !important;
    display: grid !important;
    place-items: center !important;
    cursor: pointer !important;
    position: relative !important;
}

.invoice-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 320px !important;
    gap: 28px !important;
    align-items: start !important;
}
.invoice-card aside,
.qris-invoice,
.qris-box,
.payment-qris {
    max-width: 320px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}
.invoice-card aside {
    background: #fff !important;
    border: 1px solid #e7edf5 !important;
    border-radius: 28px !important;
    padding: 22px !important;
    box-shadow: 0 18px 55px rgba(15,23,42,.08) !important;
}
img.qris,
.qris,
.qris-img,
.qris-invoice img,
.qris-box img,
.payment-qris img,
.invoice-card img[src*="qris"],
.invoice-card img[src*="qwe8yhuiqweb"],
.invoice-modern img[src*="qris"],
.invoice-modern img[src*="qwe8yhuiqweb"],
img[src*="qris"],
img[src*="qwe8yhuiqweb"] {
    width: 220px !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 220px !important;
    display: block !important;
    margin: 12px auto !important;
    object-fit: contain !important;
    border-radius: 18px !important;
    border: 1px solid #e7edf5 !important;
    background: #fff !important;
    padding: 8px !important;
}
.invoice-logo,
.payment-logo,
.logo-img,
.invoice-modern img[src*="logo"],
.invoice-card img[src*="logo"],
img[src*="logo-ilmaweb"] {
    max-width: 180px !important;
    width: auto !important;
    height: auto !important;
    max-height: 72px !important;
    object-fit: contain !important;
}
.invoice-top .invoice-logo {
    background: #fff !important;
    border-radius: 20px !important;
    padding: 12px !important;
}
.invoice-payment-grid {
    grid-template-columns: minmax(0, 1fr) 270px !important;
}

@media (max-width: 900px) {
    .invoice-card,
    .invoice-payment-grid {
        grid-template-columns: 1fr !important;
    }
    .invoice-card aside,
    .qris-invoice,
    .qris-box,
    .payment-qris {
        max-width: 280px !important;
    }
    .invoice-card aside { order: -1 !important; }
    .wa-float .wa-card { width: 300px !important; }
}
@media (max-width: 600px) {
    img.qris,
    .qris,
    .qris-img,
    .qris-invoice img,
    .qris-box img,
    .payment-qris img,
    .invoice-card img[src*="qris"],
    .invoice-card img[src*="qwe8yhuiqweb"],
    .invoice-modern img[src*="qris"],
    .invoice-modern img[src*="qwe8yhuiqweb"],
    img[src*="qris"],
    img[src*="qwe8yhuiqweb"] {
        width: 180px !important;
        max-width: 78vw !important;
        max-height: 180px !important;
    }
    .invoice-logo,
    .payment-logo,
    .logo-img,
    .invoice-modern img[src*="logo"],
    .invoice-card img[src*="logo"],
    img[src*="logo-ilmaweb"] {
        max-width: 145px !important;
        max-height: 56px !important;
    }
}
@media print {
    .wa-float,
    .wa-chat-widget,
    #waChatWidget,
    .wa-card,
    .wa-bubble { display: none !important; }
    img.qris,
    .qris-invoice img,
    img[src*="qris"],
    img[src*="qwe8yhuiqweb"] {
        width: 170px !important;
        max-height: 170px !important;
    }
    .invoice-logo,
    img[src*="logo-ilmaweb"] {
        max-width: 165px !important;
        max-height: 65px !important;
    }
}
/* === END ILMAWEB FINAL FIX 20260513 === */