/* ZAFFAR: /tempah, /terima-kasih, polisi. Token warna sama dengan salespage. */
:root{
  --green:#1C4122;--cream:#F5EDE4;--sage:#6E8168;--white:#fffdf9;--gold:#9A7330;--red:#b3261e;
  --green05:rgba(28,65,34,.05);--green10:rgba(28,65,34,.10);--green16:rgba(28,65,34,.16);--green24:rgba(28,65,34,.24);
  --cream72:rgba(245,237,228,.72);
  --shadow:0 18px 50px rgba(28,65,34,.10);
  --serif:"Iowan Old Style",Baskerville,"Times New Roman",serif;
  --sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --r-lg:22px;--r-md:14px;--r-sm:10px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px;background:#1C4122;overflow-x:hidden;overflow-x:clip}
body.zf{margin:0;overflow-x:hidden;overflow-x:clip;min-height:100vh;min-height:100dvh;color:var(--green);background:var(--cream);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
.zf img{max-width:100%;height:auto;display:block}
.zf a{color:inherit}
.zf h1,.zf h2,.zf h3{margin:0;font-weight:800;line-height:1.2;letter-spacing:-.01em}
.zf-wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 16px}
.zf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Header */
.zf-top{position:sticky;top:0;z-index:20;background:var(--green);color:var(--cream)}
.zf-top-in{display:flex;align-items:center;justify-content:space-between;min-height:58px}
.zf-logo img{width:118px;filter:brightness(0) invert(.94) sepia(.12)}
.zf-secure{display:inline-flex;align-items:center;gap:7px;font-size:.8rem;font-weight:700;color:var(--cream72)}
.zf-secure svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}

/* Kepala */
.zf-main{padding-top:22px;padding-bottom:110px}
.zf-head{margin-bottom:18px}
.zf-eyebrow{margin:0 0 6px;font-size:.72rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--sage)}
.zf-head h1{font-family:var(--serif);font-size:clamp(1.7rem,6vw,2.5rem);font-weight:700;letter-spacing:-.03em}
.zf-ticks{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;padding:0;list-style:none}
.zf-ticks li{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:var(--white);border:1px solid var(--green10);font-size:.8rem;font-weight:700}
.zf-ticks li::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5EDE4' stroke-width='4'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/9px no-repeat}

/* Grid */
.zf-grid{display:grid;gap:16px}
.zf-col-main,.zf-col-side{display:grid;gap:16px;align-content:start;min-width:0}
@media (min-width:900px){
  .zf-grid{grid-template-columns:minmax(0,1fr) 340px;gap:22px}
  .zf-col-side{position:sticky;top:78px}
}
.zf-card{padding:18px;border-radius:var(--r-lg);background:var(--white);border:1px solid var(--green10);box-shadow:var(--shadow)}
@media (min-width:600px){.zf-card{padding:24px}}
.zf-card h2{display:flex;align-items:center;gap:10px;margin-bottom:14px;font-size:1.08rem}
.zf-num{display:inline-grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:var(--green);color:var(--cream);font-size:.82rem}

/* Pakej */
.zf-packages{display:grid;gap:12px}
.zf-pkg{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 12px 12px;border:2px solid var(--green10);border-radius:var(--r-md);background:#fff;cursor:pointer;transition:border-color .2s,box-shadow .2s,background .2s}
.zf-pkg:hover{border-color:var(--green24)}
.zf-pkg.is-on{border-color:var(--green);background:var(--green05);box-shadow:0 0 0 4px var(--green10)}
.zf-pkg input,.zf-paym input{position:absolute;opacity:0;pointer-events:none}
.zf-pkg:has(input:focus-visible),.zf-paym:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px}
.zf-pkg img{width:64px;height:64px;object-fit:cover;border-radius:var(--r-sm)}
.zf-pkg-body{display:grid;gap:2px;min-width:0}
.zf-pkg-name{font-weight:800}
.zf-pkg-kicker{font-size:.8rem;color:var(--sage);font-weight:600}
.zf-pkg-gift{font-size:.76rem;font-weight:700;color:var(--gold)}
.zf-pkg-price{display:grid;justify-items:end;line-height:1.15}
.zf-pkg-price s{font-size:.78rem;color:var(--sage)}
.zf-pkg-price strong{font-family:var(--serif);font-size:1.45rem}
.zf-pkg-price em{margin-top:3px;padding:2px 7px;border-radius:999px;background:var(--sage);color:var(--cream);font-size:.66rem;font-style:normal;font-weight:900}
@media (max-width:420px){
  .zf-card{padding:14px}
  .zf-pkg{grid-template-columns:52px minmax(0,1fr) auto;gap:10px;padding:16px 10px 10px}
  .zf-pkg img{width:52px;height:52px}
  .zf-pkg-price strong{font-size:1.3rem}
}
.zf-badge{position:absolute;top:-10px;left:12px;padding:3px 9px;border-radius:999px;background:var(--gold);color:#fff;font-size:.66rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}

/* Borang */
.zf-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.zf-f{min-width:0}
.zf-wide{grid-column:1/-1}
.zf label:not(.zf-pkg):not(.zf-paym):not(.zf-bump){display:block;margin-bottom:5px;font-size:.85rem;font-weight:700}
.zf-opt{font-weight:500;color:var(--sage)}
.zf input[type=text],.zf input[type=tel],.zf input[type=email],.zf select,.zf textarea{width:100%;min-height:50px;padding:12px 14px;border:1.5px solid var(--green16);border-radius:var(--r-sm);background:#fff;color:var(--green);font:inherit;font-size:16px;outline:none;transition:border-color .2s,box-shadow .2s;appearance:none;-webkit-appearance:none}
.zf textarea{resize:vertical;min-height:74px}
.zf select{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C4122' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 14px center/16px no-repeat;padding-right:40px}
.zf input:focus,.zf select:focus,.zf textarea:focus{border-color:var(--green);box-shadow:0 0 0 4px var(--green10)}
.zf ::placeholder{color:#9aa69a}
.zf-f.has-err input,.zf-f.has-err select,.zf-f.has-err textarea{border-color:var(--red)}
.zf-phone{display:flex;align-items:stretch;border:1.5px solid var(--green16);border-radius:var(--r-sm);background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.zf-phone:focus-within{border-color:var(--green);box-shadow:0 0 0 4px var(--green10)}
.zf-phone-cc{display:flex;align-items:center;padding:0 12px;background:var(--green05);border-right:1.5px solid var(--green16);font-weight:800;font-size:.95rem;white-space:nowrap}
.zf .zf-phone input[type=tel]{border:0;border-radius:0;box-shadow:none;min-width:0}
.zf-f.has-err .zf-phone{border-color:var(--red)}
.zf-auto{animation:zfauto .9s ease}
@keyframes zfauto{0%{background:#fde68a}100%{background:#fff}}
.zf-err{margin:5px 0 0;color:var(--red);font-size:.8rem;font-weight:600}

/* Bayaran */
.zf-pay{display:grid;gap:10px}
.zf-paym{position:relative;display:flex;gap:12px;align-items:flex-start;padding:14px;border:2px solid var(--green10);border-radius:var(--r-md);background:#fff;cursor:pointer;margin:0}
.zf-paym::before{content:"";flex:none;width:20px;height:20px;margin-top:2px;border-radius:50%;border:2px solid var(--green24);background:#fff}
.zf-paym.is-on{border-color:var(--green);background:var(--green05)}
.zf-paym.is-on::before{border:6px solid var(--green)}
.zf-paym span{display:grid;gap:2px}
.zf-paym strong{font-size:.95rem}
.zf-paym small{font-size:.8rem;color:var(--sage);font-weight:500}
.zf-paym.is-off{opacity:.45;cursor:not-allowed}
.zf-paym{flex-wrap:wrap}
.zf-payimg{flex:0 0 100%;width:100%;margin-top:4px;border-radius:10px}/* Halang simpan gambar (klik kanan, seret, tekan lama di telefon) */
.zf img,.zf svg{-webkit-user-drag:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.zf-codnote{margin:10px 0 0;padding:10px 12px;border-radius:var(--r-sm);background:var(--green05);font-size:.82rem}

.zf-sum{width:100%;margin:18px 0 14px;border-collapse:collapse;font-size:.92rem}
.zf-sum th,.zf-sum td{padding:9px 0;border-bottom:1px solid var(--green10);text-align:left;font-weight:600}
.zf-sum td{text-align:right}
.zf-sum-total th,.zf-sum-total td{border-bottom:0;font-size:1.15rem;font-weight:900}
.zf-sum-total td{font-family:var(--serif)}
.zf-formerr{margin:0 0 12px;padding:12px 14px;border-left:4px solid var(--red);border-radius:var(--r-sm);background:#fdecea;color:#5c1611;font-size:.88rem}

/* Butang */
.zf-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;padding:14px 22px;border:0;border-radius:999px;background:var(--green);color:var(--cream)!important;font:inherit;font-size:1.02rem;font-weight:900;letter-spacing:.03em;text-decoration:none;cursor:pointer;box-shadow:0 14px 34px var(--green24);transition:transform .15s,opacity .2s}
.zf-submit::after{content:"";width:18px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5EDE4' stroke-width='2.4'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3'/%3E%3Crect x='4' y='10' width='16' height='11' rx='2.5'/%3E%3C/svg%3E") center/contain no-repeat}
.zf-btn:hover{transform:translateY(-1px)}
.zf-btn:disabled{opacity:.6;cursor:wait;transform:none}
.zf-btn-ghost{background:transparent;color:var(--green)!important;border:2px solid var(--green);box-shadow:none}
.zf-pay-note{margin:14px 0 0;font-size:.8rem;color:var(--sage);text-align:center}
.zf-pay-logos{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.zf-pay-logos b{padding:3px 8px;border:1px solid var(--green16);border-radius:6px;background:#fff;color:var(--green);font-size:.68rem;letter-spacing:.04em}
.zf-terms{margin:10px 0 0;font-size:.74rem;color:var(--sage);text-align:center}

/* Sisi: keyakinan */
.zf-guarantee{background:var(--green);color:var(--cream);border:0}
.zf-guarantee h2{color:var(--cream);margin-bottom:8px}
.zf-guarantee p{margin:0;color:var(--cream72);font-size:.9rem}
.zf-guarantee strong{color:var(--cream)}
.zf-seal{float:right;display:grid;place-items:center;align-content:center;width:72px;height:72px;margin:0 0 6px 12px;border-radius:50%;border:2px dashed #d8b46a;color:#e6c88a;text-align:center;line-height:1}
.zf-seal span{font-family:var(--serif);font-size:1.5rem;font-weight:700}
.zf-seal small{font-size:.5rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.zf-list{display:grid;gap:9px;margin:0;padding:0;list-style:none;font-size:.9rem}
.zf-list li{position:relative;padding-left:24px}
.zf-list li::before{content:"";position:absolute;left:0;top:4px;width:15px;height:15px;border-radius:50%;background:var(--green05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231C4122' stroke-width='3.5'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/10px no-repeat;border:1px solid var(--green16)}
.zf-wa{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:var(--r-lg);background:#fff;border:1px solid var(--green10);text-decoration:none;font-size:.84rem;color:var(--sage)!important}
.zf-wa svg{flex:none;width:30px;height:30px;fill:#1f9d55}
.zf-wa span{display:grid}
.zf-wa strong{color:var(--green);font-size:.92rem}

/* Offer */
.zf-perday{margin-top:3px;font-size:.7rem;font-weight:800;color:var(--sage);white-space:nowrap}
.zf-pkg.is-pop{animation:zfpop .6s ease}
@keyframes zfpop{40%{transform:scale(1.03)}}
.zf-upsell{margin-top:14px;padding:14px;border:2px dashed var(--gold);border-radius:var(--r-md);background:#fbf5ea}
.zf-upsell:empty{display:none}
.zf-upsell p{margin:0}
.zf-upsell-h{font-size:.98rem;font-weight:700}
.zf-upsell-h strong{color:var(--gold)}
.zf-upsell ul{display:grid;gap:4px;margin:8px 0 12px;padding:0;list-style:none;font-size:.86rem}
.zf-upsell li::before{content:"+ ";font-weight:900;color:var(--gold)}
.zf-btn-up{min-height:46px;padding:10px 16px;font-size:.88rem;background:var(--gold);box-shadow:0 10px 24px rgba(154,115,48,.28)}
.zf-upsell.is-best{border-style:solid;border-color:var(--green16);background:var(--green05);font-size:.88rem}
.zf-upsell.is-best strong{color:var(--green)}
.zf-tag{margin-left:6px;padding:2px 7px;border-radius:999px;background:var(--gold);color:#fff;font-size:.66rem;font-style:normal;font-weight:900;letter-spacing:.03em;vertical-align:2px}
.zf-hint{margin:5px 0 0;font-size:.76rem;color:var(--sage)}
.zf-value{margin:18px 0 14px;padding:14px;border-radius:var(--r-md);background:var(--green05);border:1px solid var(--green10)}
.zf-value-h{margin:0 0 4px;font-weight:800;font-size:.92rem}
.zf-value .zf-sum{margin:0}
.zf-value .zf-sum th,.zf-value .zf-sum td{padding:7px 0}
.zf-good td{color:#1f7a3a;font-weight:800}
.zf-good s,.zf-sum s{color:var(--sage);font-weight:600}
.zf-saved{margin:10px 0 0;padding:8px 10px;border-radius:var(--r-sm);background:#fff;font-size:.84rem;text-align:center}
.zf-saved strong{color:#1f7a3a}
.zf-risk{margin:12px 0 0;font-size:.82rem;text-align:center}

/* Jaminan + garis masa (atas checkout) */
.zf-promise{background:var(--green);color:var(--cream);border:0}
.zf-promise-top{display:flex;gap:14px;align-items:flex-start}
.zf-promise .zf-seal{float:none;flex:none;margin:0}
.zf-badge-seal{flex:none;display:block;filter:drop-shadow(0 6px 14px rgba(0,0,0,.28))}
@media (max-width:420px){.zf-badge-seal{width:78px;height:92px}}
.zf-promise h2{display:block;margin:0 0 6px;color:var(--cream);font-family:var(--serif);font-size:1.3rem;font-weight:700;line-height:1.2}
.zf-promise p{margin:0;color:var(--cream72);font-size:.9rem}
.zf-promise p strong{color:var(--cream)}
.zf-tl-h{margin:18px 0 10px;padding-top:16px;border-top:1px solid rgba(245,237,228,.18);font-size:.72rem!important;font-weight:900!important;letter-spacing:.14em;text-transform:uppercase;color:#e6c88a}
.zf-tl{position:relative;display:grid;gap:12px;margin:0;padding:0;list-style:none}
.zf-tl::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:rgba(245,237,228,.22)}
.zf-tl li{position:relative;display:grid;grid-template-columns:86px 1fr;gap:10px;padding-left:22px;font-size:.86rem;line-height:1.45}
.zf-tl li::before{content:"";position:absolute;left:0;top:4px;width:12px;height:12px;border-radius:50%;background:#e6c88a;box-shadow:0 0 0 3px var(--green)}
.zf-tl b{color:#e6c88a;font-size:.8rem}
.zf-tl span{color:var(--cream72)}
.zf-tl strong{color:var(--cream)}
@media (max-width:420px){.zf-tl li{grid-template-columns:1fr;gap:2px}}

/* Pesanan anda */
.zf-chosen{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px;border:2px solid var(--green);border-radius:var(--r-md);background:var(--green05)}
.zf-chosen img{width:64px;height:64px;object-fit:cover;border-radius:var(--r-sm)}
.zf-chosen-body{display:grid;gap:2px;min-width:0}
.zf-chosen-body span{font-size:.8rem;color:var(--sage);font-weight:600}
.zf-chosen-body .zf-pkg-gift{color:var(--gold)}
.zf-change{margin-top:10px}
.zf-change summary{display:inline-block;cursor:pointer;font-size:.85rem;font-weight:800;text-decoration:underline;text-underline-offset:3px;color:var(--green)}
.zf-change[open] summary{margin-bottom:12px}
.zf-change summary::-webkit-details-marker{display:none}

/* Order bump */
.zf label.zf-bump[hidden]{display:none}
.zf label.zf-bump{display:block;margin:16px 0 0;border:2px dashed #c0392b;border-radius:var(--r-md);background:#fffbea;cursor:pointer;overflow:hidden;font-weight:500;transition:border-color .2s,background .2s}
.zf-bump.is-on{border-style:solid;border-color:#1f7a3a;background:#f0f8f1}
.zf-bump-top{display:flex;align-items:center;gap:10px;padding:11px 12px;background:#fde68a;font-size:.92rem;line-height:1.3}
.zf-bump.is-on .zf-bump-top{background:#cdebd3}
.zf-bump-top input{position:absolute;opacity:0;pointer-events:none}
.zf-bump-box{flex:none;width:22px;height:22px;border:2px solid var(--green);border-radius:6px;background:#fff}
.zf-bump.is-on .zf-bump-box{background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5EDE4' stroke-width='4'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat}
.zf-bump:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px}
.zf-bump-top::before{content:"➜";color:#c0392b;font-weight:900;animation:zfnudge 1.2s ease-in-out infinite}
.zf-bump.is-on .zf-bump-top::before{content:none}
@keyframes zfnudge{50%{transform:translateX(4px)}}
.zf-bump-body{display:flex;gap:12px;align-items:center;padding:11px 12px;font-size:.84rem;line-height:1.45}
.zf-bump-body img{flex:none;width:56px;height:56px;border-radius:var(--r-sm);object-fit:cover}
.zf-bump-body s{color:var(--sage)}
.zf-bump-body em{display:block;margin-top:3px;font-style:normal;font-weight:800;color:#c0392b}
@media (prefers-reduced-motion:reduce){.zf-bump-top::before{animation:none}}

/* Bar bawah (telefon) */
.zf-sticky{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--white);border-top:1px solid var(--green16);box-shadow:0 -10px 30px rgba(28,65,34,.12);transform:translateY(110%);transition:transform .25s}
.zf-sticky.is-on{transform:none}
.zf-sticky-sum{display:grid;flex:1;min-width:0;line-height:1.2}
.zf-sticky-sum small{font-size:.75rem;color:var(--sage);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zf-sticky-sum strong{font-family:var(--serif);font-size:1.35rem}
.zf-sticky .zf-btn{width:auto;min-height:48px;padding:10px 20px;font-size:.92rem;box-shadow:none}
@media (min-width:900px){.zf-sticky{display:none}}

/* Terima kasih & polisi */
.zf-narrow{max-width:720px;padding-bottom:40px}
.zf-done{text-align:left}
.zf-done-ic{display:grid;place-items:center;width:56px;height:56px;margin-bottom:14px;border-radius:50%;background:var(--green)}
.zf-done-ic svg{width:28px;height:28px;fill:none;stroke:var(--cream);stroke-width:3}
.zf-done-ic.is-wait{background:var(--gold)}
.zf-done h1{font-family:var(--serif);font-size:clamp(1.6rem,6vw,2.2rem);font-weight:700;letter-spacing:-.02em;margin-bottom:8px}
.zf-done p{margin:0 0 12px}
.zf-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0;padding:0;list-style:none}
.zf-meta li{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--sage)}
.zf-meta li strong{display:block;margin-top:2px;font-size:.98rem;letter-spacing:0;text-transform:none;color:var(--green)}
.zf-addr{margin:0;padding:12px 14px;border-radius:var(--r-sm);background:var(--green05);font-size:.9rem;font-style:normal}
.zf-steps{display:grid;gap:12px;margin:0 0 18px;padding:0;list-style:none;counter-reset:s;font-size:.92rem}
.zf-steps li{position:relative;padding-left:38px;counter-increment:s}
.zf-steps li::before{content:counter(s);position:absolute;left:0;top:0;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--green);color:var(--cream);font-size:.8rem;font-weight:900}
.zf-stack{display:grid;gap:16px}
.zf-doc h1{font-family:var(--serif);font-size:clamp(1.6rem,6vw,2.2rem);margin-bottom:6px}
.zf-doc h2{font-size:1.05rem;margin:22px 0 8px}
.zf-doc p,.zf-doc li{font-size:.94rem}
.zf-doc ul{padding-left:20px}
.zf-doc .zf-upd{color:var(--sage);font-size:.82rem}

/* Kaki */
.zf-foot{padding:24px 0 34px;font-size:.78rem;color:var(--sage);text-align:center}
.zf-foot p{margin:4px 0}
.zf-foot-links{display:flex;justify-content:center;flex-wrap:wrap;gap:14px}
.zf-foot-links a{text-decoration:underline;text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* Kotak claim ebook di page terima kasih */
.zf-claim{border:2px solid var(--gold,#d3a95a);background:#fbf7ef}
.zf-claim-kicker{margin:0 0 4px;font-size:.75rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#a87b33}
.zf-claim p{margin:0 0 14px}
