

.wz-rv {
  --wz-rose-text: #B02455;
  --wz-muted:     #4B5563;

  --wz-faint:     #565C6B;

  position: relative;

  overflow: hidden;
  padding: 76px 24px var(--wz-sec-y);

  isolation: isolate;

  background-image:
    linear-gradient(180deg, #FEEEFC 0%, #FFFBFE 42%, #FFFFFF 100%);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

}

.wz-rv::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;

  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26'%3E%3Ccircle cx='1.6' cy='1.6' r='1.6' fill='%23171717' fill-opacity='.06'/%3E%3C/svg%3E"),
    radial-gradient(760px 480px at 80% 28%, rgba(218, 51, 107, .13), transparent 62%),
    radial-gradient(780px 540px at 10% 72%, rgba(123, 63, 242, .15), transparent 60%);
  background-size: 26px 26px, 100% 100%, 100% 100%;
  background-repeat: repeat, no-repeat, no-repeat;
  -webkit-mask-image: var(--wz-decor-mask);
          mask-image: var(--wz-decor-mask);
}

.wz-rv::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("../img/wz-siar-lebar.svg");
  background-size: 100% 100%;
  background-repeat: no-repeat;
  transform-origin: 82.6% 86%;
}

.wz-rv__tag {
  position: absolute;
  top: 16px;
  left: 24px;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px;
  border-radius: 999px;
  background: var(--wz-accent);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .3px;
  line-height: 1.4;
}
.wz-rv__tag span { font-weight: 400; opacity: .85; }

.wz-rv__wrap {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 513px minmax(0, 1fr);
  align-items: center;
  gap: 0;
}

.wz-rv__left { max-width: 493px; }

.wz-rv__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 22px;
  padding: 7px 16px 7px 11px;
  border-radius: 999px;
  background: var(--wz-tint);
  color: var(--wz-rose-text);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.45;
}

.wz-rv__wa {
  flex: 0 0 auto;
  width: 20px;
  height: auto;
  display: block;
}

.wz-rv__h {
  margin: 0 0 20px;
  color: var(--wz-ink);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.9px;
}

.wz-rv__sub {
  margin: 0 0 32px;
  max-width: 488px;
  color: var(--wz-muted);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.66;
}

.wz-rv__mark {
  position: relative;

  isolation: isolate;
  display: inline-block;
  padding: 0 .18em;
  color: var(--wz-ink);
  font-weight: 700;
  white-space: nowrap;
}

.wz-rv__mark::before {
  content: "";
  position: absolute;
  z-index: -1;
  right: 0;
  bottom: .06em;
  left: 0;

  height: .62em;
  border-radius: .14em;
  background: linear-gradient(96deg, #FBD3E2 0%, #F6BFD3 100%);
  transform-origin: 0 50%;
}

.wz-rv__cta {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}

.wz-rv__btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 16px 28px;
  border-radius: 9px;
  background: var(--wz-accent);
  color: #fff;
  font-family: Quicksand, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: background .18s ease, transform .18s ease;
}
.wz-rv__btn:hover,
.wz-rv__btn:focus-visible { background: #A61E4D; color: #fff; transform: translateY(-1px); }
.wz-rv__btn svg { width: 17px; height: 17px; }

.wz-rv__link {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 14px 26px;
  border: 2px solid #E7BFCF;
  border-radius: 9px;
  background: #fff;
  color: var(--wz-rose-text);
  font-family: Quicksand, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: border-color .18s ease, color .18s ease;
}
.wz-rv__link:hover,
.wz-rv__link:focus-visible { border-color: var(--wz-accent); color: #8E1B43; }
.wz-rv__link svg { width: 17px; height: 17px; }

.wz-rv a:focus-visible {
  outline: 2px solid var(--wz-rose-text);
  outline-offset: 3px;
}

.wz-rv__proof {
  position: relative;
  z-index: 1;

  max-width: 800px;
  margin: 0 auto 42px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: start;
}
.wz-rv__defs { position: absolute; width: 0; height: 0; overflow: hidden; }

.wz-rv__pi {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
}

.wz-rv__pi + .wz-rv__pi::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  bottom: 3px;
  width: 1px;
  background: linear-gradient(180deg,
              rgba(196, 40, 92, 0), rgba(196, 40, 92, .2) 45%, rgba(196, 40, 92, 0));
}

.wz-rv__stars {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 2.5px;
}

.wz-rv__stars::before {
  content: "";
  position: absolute;
  inset: -12px -11px;
  background: radial-gradient(58% 66% at 50% 50%, rgba(255, 167, 0, .22), rgba(255, 167, 0, 0) 72%);
  pointer-events: none;
}

.wz-rv__star {
  display: block;
  width: 17.87px;
  height: 17px;
  fill: url(#wz-rv-gold);
}

.wz-rv__q {

  color: #6E4E0B;
  font-family: Quicksand, sans-serif;
  font-size: 16px;
  font-style: italic;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
}

.wz-rv__right {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
}

.wz-rv__right::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 560px;
  height: 560px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(196, 40, 92, .16) 0%, rgba(196, 40, 92, 0) 68%);
  transform: translate(-50%, -56%);
  pointer-events: none;
  z-index: 0;
}

.wz-rv__sim {
  --wa-kanvas: var(--wz-wa-canvas);  --wa-keluar: var(--wz-wa-out);
  --wa-ink: var(--wz-wa-ink);  --wa-dua:    #54656F;  --wa-tipis: #5E6B74;
  --wa-garis:  #E6E0E4;  --wa-biru:   #1583B4;
  --wa-rose:   var(--wz-accent);  --wa-teal:   #00705C;
  position: relative; z-index: 1;
  width: 100%; max-width: 582px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.wz-stage { position: relative; height: 452px; }
.wz-act { position: absolute; inset: 0; }

.wz-act::before {
  content: ""; position: absolute; inset: -18px -22px -30px;
  border-radius: 50%; filter: blur(26px); z-index: 0;
}
.wz-act--1::before { background: radial-gradient(52% 46% at 34% 62%, rgba(196,42,94,.34), rgba(196,42,94,0) 74%); }
.wz-act--2::before { background: radial-gradient(52% 46% at 66% 62%, rgba(0,112,92,.30), rgba(0,112,92,0) 74%); }

.wz-win {
  position: relative; z-index: 1; height: 100%;
  display: flex; flex-direction: column; overflow: hidden;
  border-radius: 15px; background: #fff;

  box-shadow: 0 0 0 1px rgba(58,26,44,.09),
              0 1px 1px rgba(58,26,44,.05),
              0 4px 8px -3px rgba(58,26,44,.09),
              0 14px 26px -10px rgba(58,26,44,.16),
              0 36px 62px -26px rgba(58,26,44,.42),
              0 1px 0 0 rgba(255,255,255,.75) inset;
}
.wz-act--1 .wz-win { --acc: var(--wa-rose); }
.wz-act--2 .wz-win { --acc: var(--wa-teal); }

.wz-app { flex: 0 0 auto; position: relative; z-index: 2; border-radius: 15px 15px 0 0;
  display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px;
  border-bottom: 1px solid rgba(58,26,44,.09);
  background: linear-gradient(180deg, #fff, #FCFAFC); }
.wz-logo { display: block; width: 81px; height: 19px; object-fit: contain; }

.wz-ws { display: inline-flex; align-items: center; gap: 3px; padding: 3px 6px 3px 9px; border-radius: 7px;
  background: #F4F0F4; box-shadow: 0 0 0 1px rgba(58,26,44,.07);
  color: var(--wa-dua); font-size: 10px; font-weight: 700; white-space: nowrap; }
.wz-ws__c { width: 10px; height: 10px; opacity: .6; }
.wz-app__r { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.wz-chip { padding: 3px 9px; border-radius: 999px; background: #F4F0F4;
  box-shadow: 0 0 0 1px rgba(58,26,44,.07); color: var(--wa-dua); font-size: 9.5px; font-weight: 700;
  white-space: nowrap; }
.wz-chip--on { background: #E4F3EA; box-shadow: 0 0 0 1px rgba(11,119,57,.16); color: #0B7739; }
.wz-bell { position: relative; display: grid; place-items: center; color: var(--wa-tipis); }
.wz-bell svg { width: 14px; height: 14px; }
.wz-bell u { position: absolute; top: -1px; right: -1px; width: 6px; height: 6px; border-radius: 999px;
  background: var(--wa-rose); box-shadow: 0 0 0 1.5px #fff; }
.wz-me { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 999px;
  background: linear-gradient(160deg, #E3ECFA, #C9D9F2); color: #26303B; font-size: 9.5px; font-weight: 700;
  box-shadow: 0 0 0 1px rgba(58,26,44,.08); }

.wz-main { position: relative; flex: 1 1 auto; min-height: 0; background: #F4F1F5; }
.wz-scr { position: absolute; inset: 0; display: flex; flex-direction: column; }

.wz-ph2 { flex: 0 0 auto; display: flex; align-items: baseline; gap: 9px; padding: 0 14px; height: 40px;
  border-bottom: 1px solid rgba(58,26,44,.08); background: #fff; }
.wz-ph2 b { align-self: center; color: var(--wa-ink); font-size: 14.5px; font-weight: 700; letter-spacing: -.35px; }
.wz-ph2 > span { align-self: center; color: var(--wa-tipis); font-size: 9.5px; font-weight: 600; }
.wz-auto { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; }
.wz-auto i { width: 5px; height: 5px; border-radius: 999px; background: #12A150; }

.wz-form { flex: 1 1 auto; min-height: 0; display: flex; padding: 12px 14px; }
.wz-card { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 186px; gap: 12px;
  padding: 12px; border-radius: 12px; background: #fff;
  box-shadow: 0 0 0 1px rgba(58,26,44,.07), 0 1px 2px rgba(58,26,44,.05),
              0 10px 20px -14px rgba(58,26,44,.35); }
.wz-kiri { display: flex; flex-direction: column; gap: 10px; min-width: 0; min-height: 0; }

.wz-f--pesan { flex: 1 1 auto; min-height: 0; }
.wz-f { position: relative; display: flex; flex-direction: column; gap: 4px; min-width: 0; }

.wz-lb { display: flex; align-items: center; gap: 6px; color: var(--wa-dua); font-size: 10.5px; font-weight: 600; }
.wz-pers { padding: 1.5px 6px; border-radius: 5px; background: var(--wz-tint); color: var(--wa-rose);
  font-size: 8.5px; font-style: normal; font-weight: 700; }
.wz-in { display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 9px;
  border-radius: 8px; background: #FCFBFC;
  box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset;
  color: var(--wa-ink); font-size: 12px; font-weight: 600; }
.wz-in svg { flex: 0 0 auto; width: 13px; height: 13px; color: var(--wa-tipis); }
.wz-in--sel { position: relative; }

.wz-win i, .wz-prev i { font-style: normal; }
.wz-ph { color: var(--wa-tipis); font-weight: 600; }

.wz-pick { position: absolute; left: 29px; right: 26px; top: 0; bottom: 0;
  display: flex; align-items: center; overflow: hidden; white-space: nowrap; opacity: 0; }
.wz-cv { margin-left: auto; display: grid; place-items: center; color: var(--wa-tipis); }
.wz-cv svg { width: 13px; height: 13px; }
.wz-type { display: inline-block; width: max-content; overflow: hidden; white-space: nowrap; vertical-align: bottom; }
.wz-car { width: 1.5px; height: 14px; background: var(--wa-rose); }

.wz-ta { flex: 1 1 auto; min-height: 0; padding: 8px 10px; border-radius: 8px; background: #FCFBFC;
  box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset;
  color: var(--wa-ink); font-size: 11.5px; line-height: 1.65; }
.wz-tl { display: block; white-space: nowrap; }
.wz-tz { display: inline-block; width: max-content; overflow: hidden; white-space: nowrap; vertical-align: bottom; }
.wz-tz em { padding: 0 3px 0 3px; margin-right: -2px; border-radius: 4px; background: var(--wz-tint);
  color: var(--wa-rose); font-style: normal; font-weight: 700; }
.wz-car2 { display: inline-block; width: 1.5px; height: 12px; vertical-align: -1px; background: var(--wa-rose); }
.wz-vars { display: flex; gap: 5px; }
.wz-vars em { padding: 2.5px 7px; border-radius: 6px; background: #F4F1F5;
  box-shadow: 0 0 0 1px rgba(58,26,44,.07); color: var(--wa-dua);
  font-size: 9px; font-style: normal; font-weight: 700; }

.wz-prev { display: flex; flex-direction: column; gap: 4px; min-height: 0; }
.wz-prev__h { display: flex; align-items: center; gap: 6px; color: var(--wa-dua); font-size: 10.5px; font-weight: 600; }
.wz-prev__h em { margin-left: auto; padding: 1.5px 6px; border-radius: 5px; background: #F4F1F5;
  color: var(--wa-tipis); font-size: 8.5px; font-style: normal; font-weight: 700; }
.wz-prev__c { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden;
  display: flex; flex-direction: column; align-items: flex-end; gap: 7px; padding: 9px;
  border-radius: 9px; background-color: var(--wa-kanvas);
  background-image: url("../img/wa-doodle.svg"); background-size: 118px 118px;
  box-shadow: 0 0 0 1px rgba(58,26,44,.09), 0 2px 6px -3px rgba(58,26,44,.3) inset; }
.wz-hari { align-self: center; padding: 2px 8px; border-radius: 6px; background: rgba(255,255,255,.88);
  box-shadow: 0 1px 1px rgba(11,20,26,.1); color: var(--wa-tipis); font-size: 8.5px; font-weight: 700; }
.wz-sk { position: absolute; left: 9px; right: 9px; top: 33px; overflow: hidden;
  display: flex; flex-direction: column; gap: 6px; padding: 4px 4px 9px;
  border-radius: 10px 3px 10px 10px; background: rgba(255,255,255,.72); }
.wz-sk i { height: 54px; border-radius: 8px 2px 4px 4px; background: rgba(84,101,111,.17); }
.wz-sk u { height: 7px; margin: 0 5px; border-radius: 999px; background: rgba(84,101,111,.2); }
.wz-sk u:nth-of-type(2) { width: 78%; }
.wz-sk u:nth-of-type(3) { width: 50%; }
.wz-sk::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(100deg, transparent 22%, rgba(255,255,255,.85) 50%, transparent 78%);
  transform: translateX(-100%); }

.wz-pv { position: relative; width: 100%; overflow: hidden; border-radius: 10px 3px 10px 10px;
  background: var(--wa-keluar); box-shadow: 0 1px 2px rgba(11,20,26,.2); }
.wz-pv__m { display: block; padding: 3px 3px 0; }
.wz-pv__m img { display: block; width: 100%; height: 56px; object-fit: cover; object-position: 50% 62%;
  border-radius: 8px 2px 4px 4px; }
.wz-pv__t { display: block; padding: 6px 8px 5px; color: var(--wa-ink); font-size: 10.5px; line-height: 1.45; }
.wz-pv__t b { border-radius: 3px; font-weight: 700; }

.wz-pl { display: block; width: max-content; overflow: hidden; white-space: nowrap; }
.wz-pv__t u { display: block; margin-top: 2px; text-align: right; color: var(--wa-tipis);
  font-size: 8.5px; text-decoration: none; }

.wz-pv__k { display: flex; align-items: center; justify-content: center; gap: 5px; height: 25px;
  border-top: 1px solid rgba(11,20,26,.11); color: var(--wa-teal); font-size: 10px; font-weight: 700; }
.wz-pv__k svg { width: 11px; height: 11px; }

.wz-drop { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 9;
  display: flex; flex-direction: column; padding: 5px; border-radius: 10px; background: #fff;
  transform-origin: 50% 0;
  box-shadow: 0 0 0 1px rgba(58,26,44,.1), 0 2px 4px rgba(58,26,44,.06),
              0 12px 22px -8px rgba(58,26,44,.28), 0 26px 46px -20px rgba(58,26,44,.4);
  opacity: 0; }
.wz-opt { position: relative; display: flex; align-items: center; gap: 7px; height: 29px; padding: 0 9px; border-radius: 7px;
  color: var(--wa-ink); font-size: 11px; font-weight: 600; }
.wz-opt em { margin-left: auto; color: var(--wa-tipis); font-size: 9px; font-style: normal; font-weight: 700; }
.wz-ok { display: grid; place-items: center; width: 13px; height: 13px; color: var(--wa-rose); opacity: 0; }
.wz-ok svg { width: 11px; height: 11px; }

.wz-foot { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; padding: 0 14px; height: 44px;
  border-top: 1px solid rgba(58,26,44,.08); background: #fff; }
.wz-hint { margin-right: auto; display: inline-flex; align-items: center; gap: 6px;
  color: var(--wa-tipis); font-size: 10px; font-weight: 600; }
.wz-hint i { width: 5px; height: 5px; border-radius: 999px; background: var(--wa-rose); }
.wz-hint em { font-style: normal; }

.wz-btn2, .wz-send { flex: 0 0 auto; white-space: nowrap; }
.wz-btn2 { padding: 8px 13px; border-radius: 8px; background: #fff;
  box-shadow: 0 0 0 1px rgba(58,26,44,.12), 0 1px 1.5px rgba(58,26,44,.06);
  color: var(--wa-dua); font-size: 11.5px; font-weight: 700; }
.wz-send { position: relative; overflow: hidden; display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 15px; border-radius: 8px;
  background: linear-gradient(180deg, #E0417B, var(--wa-rose) 62%, #B02455);
  color: #fff; font-family: Quicksand, sans-serif; font-size: 12px; font-weight: 700;
  box-shadow: 0 0 0 1px rgba(150,20,70,.5), 0 1px 1px rgba(58,26,44,.16),
              0 6px 14px -6px rgba(196,42,94,.85), 0 1px 0 0 rgba(255,255,255,.32) inset; }
.wz-send svg { width: 13px; height: 13px; }
.wz-rip { position: absolute; inset: 0; background: #fff; opacity: 0; }

.wz-toast { position: absolute; z-index: 3; top: 12px; right: 12px;
  display: none; align-items: flex-start; gap: 7px; max-width: 216px;
  padding: 8px 11px 8px 9px; border-radius: 9px; background: #fff;
  box-shadow: 0 0 0 1px rgba(58,26,44,.10),
              0 1px 2px rgba(58,26,44,.07),
              0 10px 22px -10px rgba(58,26,44,.34);
  color: var(--wa-dua); font-size: 9.5px; font-weight: 600; }

.wz-rv-js .wz-toast { display: flex; }
.wz-toast__c { flex: 0 0 auto; display: grid; place-items: center; width: 15px; height: 15px;
  margin-top: 1px; border-radius: 50%; background: var(--wa-rose); color: #fff; }
.wz-toast__c svg { width: 9px; height: 9px; }
.wz-toast__t { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.wz-toast b { color: var(--wa-ink); font-size: 10.5px; font-weight: 700; }

.wz-body { position: relative; flex: 1 1 auto; display: flex; min-height: 0; }

.wz-list { flex: 0 0 200px; min-width: 0; overflow: hidden; display: flex; flex-direction: column;
  background: #FBF9FA; border-right: 1px solid var(--wa-garis); }

.wz-cari { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; margin: 8px 10px 7px; padding: 0 10px; height: 28px;
  border-radius: 999px; background: #fff; box-shadow: 0 0 0 1px var(--wa-garis);
  color: var(--wa-tipis); font-size: 10.5px; font-weight: 600; }
.wz-cari svg { width: 12px; height: 12px; }
.wz-filt { flex: 0 0 auto; display: flex; gap: 5px; padding: 0 10px 8px; border-bottom: 1px solid var(--wa-garis); }
.wz-filt em { padding: 3px 9px; border-radius: 999px; color: var(--wa-dua); font-size: 9.5px; font-style: normal; font-weight: 700;
  box-shadow: 0 0 0 1px var(--wa-garis); background: #fff; }
.wz-filt .wz-on { background: var(--wa-teal); color: #fff; box-shadow: none; }
.wz-inb__l { flex: 0 0 auto; margin: 0; padding: 0; list-style: none; }
.wz-inb__l li { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-bottom: 1px solid #F1ECEF; }
.wz-ib { position: relative; flex: 1 1 auto; min-width: 0; }

.wz-pt2 { position: absolute; left: 0; right: 0; bottom: 0; }
.wz-jam { position: relative; display: block; }
.wz-jm2 { position: absolute; right: 0; top: 0; }
.wz-ib b { display: block; color: var(--wa-ink); font-size: 11px; font-weight: 700; line-height: 1.3; }
.wz-ib i { display: block; overflow: hidden; color: var(--wa-dua); font-size: 9.5px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.wz-meta { flex: 0 0 auto; display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.wz-meta em { color: var(--wa-tipis); font-size: 8.5px; font-style: normal; font-weight: 600; }
.wz-meta u { display: grid; place-items: center; min-width: 15px; height: 15px; padding: 0 4px; border-radius: 999px;
  background: var(--wz-wa-green); color: #05341C; font-size: 8.5px; font-weight: 700; text-decoration: none; }

.wz-cnv { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.wz-cnv__h { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding: 8px 12px;
  border-bottom: 1px solid var(--wa-garis); background: #fff; }
.wz-cnv__h .wz-av { width: 25px; height: 25px; font-size: 10px; }
.wz-who b { display: block; color: var(--wa-ink); font-size: 11.5px; font-weight: 700; line-height: 1.25; }
.wz-who i { display: block; color: var(--wa-tipis); font-size: 9px; font-style: normal; font-weight: 600; }

.wz-alat { margin-left: auto; display: grid; place-items: center; width: 25px; height: 25px;
  border-radius: 7px; background: #fff; box-shadow: 0 0 0 1px rgba(58,26,44,.1);
  color: var(--wa-dua); }
.wz-alat + .wz-alat { margin-left: 0; }
.wz-alat svg { width: 13px; height: 13px; }
.wz-cnv__h em { margin-left: 2px; padding: 3px 9px; border-radius: 999px; background: #E3F1EE;
  color: var(--wa-teal); font-size: 9.5px; font-style: normal; font-weight: 700; }

.wz-kosong {
  position: absolute; inset: 0; z-index: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px;
  background-color: var(--wa-kanvas);
  background-image: url("../img/wa-doodle.svg"); background-size: 150px 150px;
  color: var(--wa-tipis); font-size: 11px; font-weight: 600;
}
.wz-kosong svg { width: 34px; height: 34px; opacity: .55; }
.wz-cnv { position: relative; }

.wz-cnv__b { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden;
  background-color: var(--wa-kanvas); background-image: url("../img/wa-doodle.svg"); background-size: 150px 150px; }
.wz-cnv__s { position: absolute; left: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column; gap: 7px; padding: 11px; }
.wz-bub { max-width: 88%; padding: 7px 10px 6px; border-radius: 10px; color: var(--wa-ink);
  font-size: 11.5px; line-height: 1.45; box-shadow: 0 1px 2px rgba(11,20,26,.16); }
.wz-bub u { margin-left: 7px; color: var(--wa-tipis); font-size: 8.5px; text-decoration: none; white-space: nowrap; }
.wz-bub--in { align-self: flex-start; background: #fff; border-top-left-radius: 3px; }
.wz-bub--out { align-self: flex-end; background: var(--wa-keluar); border-top-right-radius: 3px; }
.wz-tick { display: inline-block; vertical-align: -2px; margin-left: 3px; color: var(--wa-biru); }

.wz-tick svg { display: block; width: 12px; height: 12px; }

.wz-b0 { width: 216px; max-width: 88%; padding: 0; overflow: hidden; }
.wz-b0__k { display: flex; align-items: center; gap: 4px; padding: 7px 9px 0;
  color: var(--wa-teal); font-size: 8.5px; font-style: normal; font-weight: 700;
  letter-spacing: .3px; text-transform: uppercase; }
.wz-b0__k svg { width: 9px; height: 9px; }
.wz-b0__m { display: block; padding: 5px 3px 0; }
.wz-b0__m img { display: block; width: 100%; height: 72px; object-fit: cover; object-position: 50% 62%;
  border-radius: 6px; }
.wz-b0__t { display: block; padding: 6px 9px 5px; font-size: 11.5px; line-height: 1.45; }

.wz-b0__t u { display: block; margin: 1px 0 0; text-align: right; color: var(--wa-tipis);
  font-size: 8.5px; text-decoration: none; }
.wz-b0__t .wz-tick { display: inline-block; margin-left: 3px; vertical-align: -2px; }

.wz-b0__c { display: flex; align-items: center; justify-content: center; gap: 5px; height: 26px;
  border-top: 1px solid rgba(11,20,26,.11); color: var(--wa-teal); font-size: 10.5px; font-weight: 700; }
.wz-b0__c svg { width: 11px; height: 11px; }

.wz-qr { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.wz-qr > em { width: 100%; color: var(--wa-dua); font-size: 9px; font-style: normal; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; }
.wz-qrc { padding: 5px 10px; border: 1px solid #C9DCD7; border-radius: 999px; background: rgba(255,255,255,.95);
  color: var(--wa-teal); font-size: 10.5px; font-weight: 700; }

.wz-lbl { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; padding: 1px 6px 1px 5px;
  border-radius: 5px; background: #E3F1EE; box-shadow: 0 0 0 1px #B9D7D0;
  color: var(--wa-teal); font-size: 8.5px; font-weight: 700; vertical-align: 1px; }
.wz-lbl svg { width: 9px; height: 9px; }
.wz-ai { display: flex; flex-direction: column; gap: 4px; padding: 9px 11px; border-radius: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(232,244,240,.98));
  box-shadow: 0 0 0 1px #C9DCD7, 0 4px 12px -5px rgba(0,112,92,.38); }
.wz-ai__h { display: flex; align-items: center; gap: 6px; color: var(--wa-teal); font-size: 9.5px; font-style: normal;
  font-weight: 700; letter-spacing: .4px; text-transform: uppercase; }
.wz-ai__h svg { width: 12px; height: 12px; }
.wz-ail { position: relative; padding-left: 10px; color: var(--wa-ink); font-size: 10.5px; line-height: 1.45; }
.wz-ail b { font-weight: 700; color: var(--wa-teal); }
.wz-ail::before { content: ""; position: absolute; left: 0; top: 6px; width: 3px; height: 3px; border-radius: 999px; background: var(--wa-teal); }

.wz-comp { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; height: 40px; padding: 0 12px;
  border-top: 1px solid var(--wa-garis); background: #fff; color: var(--wa-tipis); }
.wz-comp svg { width: 15px; height: 15px; }
.wz-comp i { flex: 1 1 auto; font-size: 11px; font-style: normal; font-weight: 600; }
.wz-comp b { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 999px; background: var(--wa-teal); color: #fff; }
.wz-comp b svg { width: 13px; height: 13px; }

.wz-av { flex: 0 0 auto; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 999px;
  color: #3B2430; font-size: 10px; font-weight: 700; }
.wz-av--1{background:#F7CFE0}.wz-av--2{background:#CBE3F7}.wz-av--3{background:#F7E4BE}.wz-av--4{background:#CDEBDA}

.wz-cur { position: absolute; left: 0; top: 0; z-index: 20; width: 19px; height: 19px; pointer-events: none; }
.wz-cur svg { width: 100%; height: 100%; filter: drop-shadow(0 3px 5px rgba(31,20,30,.4)); }
.wz-cur u { position: absolute; left: -11px; top: -11px; width: 40px; height: 40px; border-radius: 999px;
  border: 2px solid var(--wa-rose); opacity: 0; }

.wz-int { position: absolute; left: var(--x); top: var(--y); z-index: 4; display: grid; place-items: center;
  width: 38px; height: 38px; border-radius: 11px; background: #fff;
  box-shadow: 0 0 0 1px rgba(60,20,44,.06), 0 2px 4px -1px rgba(60,20,44,.14), 0 10px 22px -8px rgba(60,20,44,.34); }

.wz-int__i { grid-area: 1 / 1; display: grid; place-items: center; }
.wz-int__i img { width: 20px; height: 20px; object-fit: contain; }
.wz-int__i em {
  position: absolute; left: 50%; bottom: calc(100% + 9px); z-index: 6;
  padding: 4px 9px 5px; border-radius: 7px; background: #26303B; color: #fff;
  font-size: 10px; font-style: normal; font-weight: 700; line-height: 1.2; white-space: nowrap;
  box-shadow: 0 6px 16px -6px rgba(20,10,18,.55);
  opacity: 0; transform: translate(-50%, 4px); pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.wz-int__i em::after { content: ""; position: absolute; left: 50%; top: 100%; margin-left: -4px;
  border: 4px solid transparent; border-top-color: #26303B; }

.wz-int--bawah .wz-int__i em { bottom: auto; top: calc(100% + 9px); transform: translate(-50%, -4px); }
.wz-int--bawah .wz-int__i em::after { top: auto; bottom: 100%;
  border-top-color: transparent; border-bottom-color: #26303B; }
@media (hover: hover) {
  .wz-int:hover .wz-int__i em { opacity: 1; transform: translate(-50%, 0); }
}

.wz-rv-js .wz-rv__left > *, .wz-rv-js .wz-pnl,
.wz-rv-js .wz-rv__proof { opacity: 0; transform: translateY(16px); }
.wz-rv-js .wz-rv__right::before, .wz-rv-js .wz-int { opacity: 0; }

@keyframes wz-rv-naik  { to { opacity: 1; transform: none; } }
@keyframes wz-rv-sinar { to { opacity: 1; } }
@keyframes wz-rv-sapu { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes wz-int-masuk { to { opacity: 1; } }

.wz-rv-js .wz-rv.is-in .wz-rv__left > *,
.wz-rv-js .wz-rv.is-in .wz-pnl,
.wz-rv-js .wz-rv.is-in .wz-rv__proof { animation: wz-rv-naik .62s cubic-bezier(.22,.61,.36,1) both; }
.wz-rv-js .wz-rv.is-in .wz-rv__proof { animation-delay: .02s; }
.wz-rv-js .wz-rv.is-in .wz-rv__left > :nth-child(1) { animation-delay: .04s; }
.wz-rv-js .wz-rv.is-in .wz-rv__left > :nth-child(2) { animation-delay: .11s; }
.wz-rv-js .wz-rv.is-in .wz-rv__left > :nth-child(3) { animation-delay: .18s; }
.wz-rv-js .wz-rv.is-in .wz-rv__left > :nth-child(4) { animation-delay: .27s; }
.wz-rv-js .wz-rv.is-in .wz-rv__left > :nth-child(5) { animation-delay: .34s; }
.wz-rv-js .wz-rv.is-in .wz-pnl { animation-delay: .12s; }
.wz-rv-js .wz-rv.is-in .wz-rv__right::before { animation: wz-rv-sinar 1.1s ease-out .1s both; }

@keyframes wz-rv-siar {
  0%, 38.6%   { opacity: 1;   transform: scale(1); }
  39.4%       { opacity: 1;   transform: scale(1.014); }
  43.5%       { opacity: 1;   transform: scale(1.035); }
  62%, 100%   { opacity: 1;   transform: scale(1); }
}
.wz-rv-js .wz-rv.is-in::after { animation: wz-rv-siar 40s linear infinite; }

.wz-rv-js .wz-rv.is-in .wz-int { animation: wz-int-masuk .5s ease-out both, wz-int-pindah 21s cubic-bezier(.5,0,.2,1) infinite;
  animation-delay: calc(.5s + var(--d)), var(--d); }
.wz-rv-js .wz-rv__mark::before { transform: scaleX(0); }
.wz-rv-js .wz-rv.is-in .wz-rv__mark::before { animation: wz-rv-sapu .5s cubic-bezier(.22,1,.36,1) .62s forwards; }

.wz-rv-js .wz-act--1, .wz-rv-js .wz-act--2, .wz-rv-js .wz-toast,
.wz-rv-js .wz-inb__l li, .wz-rv-js .wz-cnv__h, .wz-rv-js .wz-cnv__b,
.wz-rv-js .wz-bub:not(.wz-b0), .wz-rv-js .wz-qr, .wz-rv-js .wz-qrc, .wz-rv-js .wz-lbl,
.wz-rv-js .wz-ai, .wz-rv-js .wz-ail, .wz-rv-js .wz-cur, .wz-rv-js .wz-pick,
.wz-rv-js .wz-pv, .wz-rv-js .wz-ok { opacity: 0; }
.wz-rv-js .wz-type, .wz-rv-js .wz-tz, .wz-rv-js .wz-pl { max-width: 0; }
.wz-rv-js .wz-pv__t u { opacity: 0; }
.wz-rv-js .wz-car, .wz-rv-js .wz-car2 { width: 0; }
.wz-rv-js .wz-int__i, .wz-rv-js .wz-pt2, .wz-rv-js .wz-jm2 { opacity: 0; }
@keyframes wz-kedip { 0%,45% { opacity: 1; } 55%,100% { opacity: 0; } }

@keyframes wz-babak1 {
  0%, 39.75% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,.06,.9,.5); }
  40.625% { opacity: 0; transform: translateY(-9px) scale(.988); }
  97.375% { opacity: 0; transform: translateY(11px) scale(.986); animation-timing-function: cubic-bezier(.16,1,.3,1); }
  100% { opacity: 1; transform: none; }
}
@keyframes wz-babak2 {
  0%, 40.625% { opacity: 0; transform: translateY(11px) scale(.986); animation-timing-function: cubic-bezier(.16,1,.3,1); }
  42.125%, 96.5% { opacity: 1; transform: none; animation-timing-function: cubic-bezier(.55,.06,.9,.5); }
  97.375% { opacity: 0; transform: translateY(-9px) scale(.988); }
  100% { opacity: 0; transform: translateY(11px) scale(.986); }
}
@keyframes wz-kursor {
  0.0% { transform: translate(545px, 438px); opacity: 0; animation-timing-function: linear; }
  2.0% { transform: translate(545px, 438px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  4.5% { transform: translate(303px, 131px); opacity: 1; animation-timing-function: linear; }
  12.25% { transform: translate(303px, 131px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  13.75% { transform: translate(189px, 187px); opacity: 1; animation-timing-function: linear; }
  15.5% { transform: translate(189px, 187px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  16.5% { transform: translate(189px, 229px); opacity: 1; animation-timing-function: linear; }
  18.875% { transform: translate(189px, 229px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  19.75% { transform: translate(189px, 244px); opacity: 1; animation-timing-function: linear; }
  21.5% { transform: translate(189px, 244px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  22.5% { transform: translate(189px, 285px); opacity: 1; animation-timing-function: linear; }
  25.0% { transform: translate(189px, 285px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  26.5% { transform: translate(309px, 324px); opacity: 1; animation-timing-function: linear; }
  36.5% { transform: translate(309px, 324px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  38.0% { transform: translate(496px, 427px); opacity: 1; animation-timing-function: linear; }
  39.5% { transform: translate(496px, 427px); opacity: 1; animation-timing-function: linear; }
  40.25% { transform: translate(496px, 427px); opacity: 0; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  45.75% { transform: translate(545px, 438px); opacity: 0; animation-timing-function: linear; }
  46.5% { transform: translate(545px, 438px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  49.0% { transform: translate(97px, 130px); opacity: 1; animation-timing-function: linear; }
  55.25% { transform: translate(97px, 130px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  56.5% { transform: translate(373px, 384px); opacity: 1; animation-timing-function: linear; }
  73.5% { transform: translate(373px, 384px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  75.25% { transform: translate(474px, 58px); opacity: 1; animation-timing-function: linear; }
  77.5% { transform: translate(474px, 58px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  79.0% { transform: translate(507px, 58px); opacity: 1; animation-timing-function: linear; }
  84.5% { transform: translate(507px, 58px); opacity: 1; animation-timing-function: linear; }
  85.5% { transform: translate(507px, 58px); opacity: 0; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
  100.0% { transform: translate(545px, 438px); opacity: 0; animation-timing-function: linear; }
}
@keyframes wz-klik {
  0% { opacity: 0; transform: scale(.35); }
  5.2% { opacity: 0; transform: scale(.35); }
  5.65% { opacity: .7; transform: scale(1); }
  6.8% { opacity: 0; transform: scale(1.75); }
  14.45% { opacity: 0; transform: scale(.35); }
  14.9% { opacity: .7; transform: scale(1); }
  16.05% { opacity: 0; transform: scale(1.75); }
  17.325% { opacity: 0; transform: scale(.35); }
  17.775% { opacity: .7; transform: scale(1); }
  18.925% { opacity: 0; transform: scale(1.75); }
  20.45% { opacity: 0; transform: scale(.35); }
  20.9% { opacity: .7; transform: scale(1); }
  22.05% { opacity: 0; transform: scale(1.75); }
  23.325% { opacity: 0; transform: scale(.35); }
  23.775% { opacity: .7; transform: scale(1); }
  24.925% { opacity: 0; transform: scale(1.75); }
  27.2% { opacity: 0; transform: scale(.35); }
  27.65% { opacity: .7; transform: scale(1); }
  28.8% { opacity: 0; transform: scale(1.75); }
  38.825% { opacity: 0; transform: scale(.35); }
  39.275% { opacity: .7; transform: scale(1); }
  40.425% { opacity: 0; transform: scale(1.75); }
  49.7% { opacity: 0; transform: scale(.35); }
  50.15% { opacity: .7; transform: scale(1); }
  51.3% { opacity: 0; transform: scale(1.75); }
  57.2% { opacity: 0; transform: scale(.35); }
  57.65% { opacity: .7; transform: scale(1); }
  58.8% { opacity: 0; transform: scale(1.75); }
  75.95% { opacity: 0; transform: scale(.35); }
  76.4% { opacity: .7; transform: scale(1); }
  77.55% { opacity: 0; transform: scale(1.75); }
  79.7% { opacity: 0; transform: scale(.35); }
  80.15% { opacity: .7; transform: scale(1); }
  81.3% { opacity: 0; transform: scale(1.75); }
  100% { opacity: 0; transform: scale(.35); }
}
@keyframes wz-pickK {
  0%, 17.875% { opacity: 0; transform: translateY(5px); }
  18.925%, 40.0% { opacity: 1; transform: none; }
  40.75%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes wz-pickW {
  0%, 23.875% { opacity: 0; transform: translateY(5px); }
  24.925%, 40.0% { opacity: 1; transform: none; }
  40.75%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes wz-pratinjau {
  0%, 27.375% { opacity: 0; transform: translateY(8px) scale(.96); }
  28.25%, 40.0% { opacity: 1; transform: none; }
  40.75%, 100% { opacity: 0; transform: translateY(8px) scale(.96); }
}
@keyframes wz-phK {
  0%, 17.875% { opacity: 1; }
  18.625%, 96.5% { opacity: 0; }
  97.25%, 100% { opacity: 1; }
}
@keyframes wz-phW {
  0%, 23.875% { opacity: 1; }
  24.625%, 96.5% { opacity: 0; }
  97.25%, 100% { opacity: 1; }
}
@keyframes wz-rangka {
  0%, 27.375% { opacity: 1; }
  28.125%, 96.5% { opacity: 0; }
  97.25%, 100% { opacity: 1; }
}
@keyframes wz-toastM {
  0%, 41.55% { opacity: 0; transform: translateY(-10px); }
  42.425%, 48.375% { opacity: 1; transform: none; }
  49.25%, 100% { opacity: 0; transform: translateY(-10px); }
}
@keyframes wz-toastHP {
  0%, 41.55% { opacity: 0; transform: translateY(10px); }
  42.425%, 48.375% { opacity: 1; transform: none; }
  49.25%, 100% { opacity: 0; transform: translateY(10px); }
}
@keyframes wz-barisM0 {
  0%, 42.625% { opacity: 0; transform: translateX(-13px); }
  43.575%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM1 {
  0%, 43.125% { opacity: 0; transform: translateX(-13px); }
  44.075%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM2 {
  0%, 43.625% { opacity: 0; transform: translateX(-13px); }
  44.575%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM3 {
  0%, 44.125% { opacity: 0; transform: translateX(-13px); }
  45.075%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM4 {
  0%, 44.625% { opacity: 0; transform: translateX(-13px); }
  45.575%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM5 {
  0%, 45.125% { opacity: 0; transform: translateX(-13px); }
  46.075%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM6 {
  0%, 45.625% { opacity: 0; transform: translateX(-13px); }
  46.575%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-barisM7 {
  0%, 46.125% { opacity: 0; transform: translateX(-13px); }
  47.075%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-13px); }
}
@keyframes wz-kepalaM {
  0%, 50.125% { opacity: 0; transform: translateY(-6px); }
  51.175%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(-6px); }
}
@keyframes wz-badanM {
  0%, 50.25% { opacity: 0; transform: translateX(9px); }
  51.3%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(9px); }
}
@keyframes wz-cnvHP {
  0%, 50.125% { opacity: 0; transform: translateX(52px); }
  51.375%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(52px); }
}
@keyframes wz-pop-wz-b1 {
  0%, 51.0% { opacity: 0; transform: translateY(7px) scale(.88); }
  52.0%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-pop-wz-b2 {
  0%, 58.75% { opacity: 0; transform: translateY(7px) scale(.88); }
  59.75%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-pop-wz-b3 {
  0%, 62.5% { opacity: 0; transform: translateY(7px) scale(.88); }
  63.5%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-pop-wz-b4 {
  0%, 65.5% { opacity: 0; transform: translateY(7px) scale(.88); }
  66.5%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-pop-wz-b5 {
  0%, 69.0% { opacity: 0; transform: translateY(7px) scale(.88); }
  70.0%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-pop-wz-b6 {
  0%, 72.0% { opacity: 0; transform: translateY(7px) scale(.88); }
  73.0%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px) scale(.88); }
}
@keyframes wz-centang0 {
  0%, 59.75% { opacity: 0; color: #5E6B74; }
  60.2%, 61.5% { opacity: 1; color: #5E6B74; }
  62.25%, 96.75% { opacity: 1; color: #1583B4; }
  97.5%, 100% { opacity: 0; color: #5E6B74; }
}
@keyframes wz-centang1 {
  0%, 66.5% { opacity: 0; color: #5E6B74; }
  66.95%, 68.25% { opacity: 1; color: #5E6B74; }
  69.0%, 96.75% { opacity: 1; color: #1583B4; }
  97.5%, 100% { opacity: 0; color: #5E6B74; }
}
@keyframes wz-centang2 {
  0%, 73.0% { opacity: 0; color: #5E6B74; }
  73.45%, 74.75% { opacity: 1; color: #5E6B74; }
  75.5%, 96.75% { opacity: 1; color: #1583B4; }
  97.5%, 100% { opacity: 0; color: #5E6B74; }
}
@keyframes wz-qrM {
  0%, 54.0% { opacity: 0; transform: translateY(7px); }
  55.05%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(7px); }
}
@keyframes wz-qrcM0 {
  0%, 54.25% { opacity: 0; transform: translateY(6px) scale(.94); }
  55.15%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(6px) scale(.94); }
}
@keyframes wz-qrcM1 {
  0%, 54.575% { opacity: 0; transform: translateY(6px) scale(.94); }
  55.475%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(6px) scale(.94); }
}
@keyframes wz-ptA {
  0%, 69.5% { opacity: 1; }
  70.25%, 98.0% { opacity: 0; }
  98.75%, 100% { opacity: 1; }
}
@keyframes wz-ptB {
  0%, 69.5% { opacity: 0; transform: translateY(3px); }
  70.35%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(3px); }
}
@keyframes wz-lblM {
  0%, 76.375% { opacity: 0; transform: translateX(-8px) scale(.7); }
  77.425%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateX(-8px) scale(.7); }
}
@keyframes wz-aiM {
  0%, 80.125% { opacity: 0; transform: translateY(13px) scale(.97); }
  81.5%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(13px) scale(.97); }
}
@keyframes wz-ailM0 {
  0%, 81.125% { opacity: 0; transform: translateY(5px); }
  81.975%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes wz-ailM1 {
  0%, 82.075% { opacity: 0; transform: translateY(5px); }
  82.925%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes wz-ailM2 {
  0%, 83.025% { opacity: 0; transform: translateY(5px); }
  83.875%, 96.75% { opacity: 1; transform: none; }
  97.5%, 100% { opacity: 0; transform: translateY(5px); }
}
@keyframes wz-gulir {
  0%, 51.0% { transform: translateY(367px); }
  54.0% { transform: translateY(367px); }
  54.95% { transform: translateY(314px); }
  58.75% { transform: translateY(314px); }
  59.7% { transform: translateY(277px); }
  62.5% { transform: translateY(277px); }
  63.45% { transform: translateY(240px); }
  65.5% { transform: translateY(240px); }
  66.45% { transform: translateY(187px); }
  69.0% { transform: translateY(187px); }
  69.95% { transform: translateY(150px); }
  72.0% { transform: translateY(150px); }
  72.95% { transform: translateY(97px); }
  80.125% { transform: translateY(97px); }
  81.075% { transform: translateY(0px); }
  97.375% { transform: translateY(0px); }
  99.0%, 100% { transform: translateY(367px); }
}
@keyframes wz-kosongM {
  0%, 39.75% { opacity: 0; }
  40.5%, 50.0% { opacity: 1; }
  50.75%, 100% { opacity: 0; }
}

@keyframes wz-ketik {
  0%, 5.875% { max-width: 0; }
  10.375%, 100% { max-width: 98px; }
}
@keyframes wz-ketikA {
  0%, 27.75% { max-width: 0; }
  31.25%, 100% { max-width: 244px; }
}
@keyframes wz-ketikB {
  0%, 31.25% { max-width: 0; }
  34.25%, 100% { max-width: 182px; }
}

@keyframes wz-ketikP1 {
  0%, 27.75% { max-width: 0; }
  30.188%, 100% { max-width: 147px; }
}
@keyframes wz-ketikP2 {
  0%, 30.188% { max-width: 0; }
  32.174%, 100% { max-width: 121px; }
}
@keyframes wz-ketikP3 {
  0%, 32.174% { max-width: 0; }
  34.25%, 100% { max-width: 111px; }
}
@keyframes wz-jamP {
  0%, 34.25% { opacity: 0; transform: none; }
  35.0%, 40.0% { opacity: 1; transform: none; }
  40.75%, 100% { opacity: 0; transform: none; }
}
@keyframes wz-karet1 {
  0%, 5.375% { width: 0; }
  5.4%, 12.375% { width: 1.5px; }
  12.4%, 100% { width: 0; }
}
@keyframes wz-karet2 {
  0%, 27.375% { width: 0; }
  27.4%, 31.25% { width: 1.5px; }
  31.275%, 100% { width: 0; }
}
@keyframes wz-karet3 {
  0%, 31.25% { width: 0; }
  31.275%, 36.0% { width: 1.5px; }
  36.025%, 100% { width: 0; }
}
@keyframes wz-fokus1 {
  0%, 5.375% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
  5.675%, 13.75% { box-shadow: 0 0 0 1.5px var(--wa-rose), 0 0 0 4px rgba(196,42,94,.14); }
  14.25%, 100% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
}
@keyframes wz-fokus2 {
  0%, 27.375% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
  27.675%, 36.0% { box-shadow: 0 0 0 1.5px var(--wa-rose), 0 0 0 4px rgba(196,42,94,.14); }
  36.5%, 100% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
}
@keyframes wz-fokus3 {
  0%, 14.5% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
  14.8%, 18.25% { box-shadow: 0 0 0 1.5px var(--wa-rose), 0 0 0 4px rgba(196,42,94,.14); }
  18.75%, 100% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
}
@keyframes wz-fokus4 {
  0%, 20.5% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
  20.8%, 24.25% { box-shadow: 0 0 0 1.5px var(--wa-rose), 0 0 0 4px rgba(196,42,94,.14); }
  24.75%, 100% { box-shadow: 0 0 0 1px rgba(58,26,44,.11), 0 1px 1.5px rgba(58,26,44,.05) inset; }
}
@keyframes wz-bukaK {
  0%, 14.625% { opacity: 0; transform: translateY(-6px) scale(.97); }
  15.075%, 18.25% { opacity: 1; transform: none; }
  18.65%, 100% { opacity: 0; transform: translateY(-6px) scale(.97); }
}
@keyframes wz-bukaW {
  0%, 20.625% { opacity: 0; transform: translateY(-6px) scale(.97); }
  21.075%, 24.25% { opacity: 1; transform: none; }
  24.65%, 100% { opacity: 0; transform: translateY(-6px) scale(.97); }
}
@keyframes wz-sorotK {
  0%, 16.5% { background: transparent; }
  16.85%, 17.375% { background: #FBF3F7; }
  17.525%, 17.775% { background: #F8DCE8; }
  18.125%, 18.25% { background: #FBF3F7; }
  18.65%, 100% { background: transparent; }
}
@keyframes wz-sorotW {
  0%, 22.5% { background: transparent; }
  22.85%, 23.375% { background: #FBF3F7; }
  23.525%, 23.775% { background: #F8DCE8; }
  24.125%, 24.25% { background: #FBF3F7; }
  24.65%, 100% { background: transparent; }
}
@keyframes wz-ceklisK {
  0%, 17.5% { opacity: 0; transform: scale(.4); }
  17.95%, 18.25% { opacity: 1; transform: none; }
  18.5%, 100% { opacity: 0; transform: scale(.4); }
}
@keyframes wz-ceklisW {
  0%, 23.5% { opacity: 0; transform: scale(.4); }
  23.95%, 24.25% { opacity: 1; transform: none; }
  24.5%, 100% { opacity: 0; transform: scale(.4); }
}
@keyframes wz-tekan {
  0%, 38.675% { transform: none; }
  38.975% { transform: scale(.965); }
  39.625%, 100% { transform: none; }
}
@keyframes wz-riak {
  0%, 38.775% { opacity: 0; transform: scale(.4); }
  39.125% { opacity: .4; transform: scale(1); }
  40.25%, 100% { opacity: 0; transform: scale(1.5); }
}
@keyframes wz-pilihqr {
  0%, 56.5% { background: rgba(255,255,255,.95); color: #00705C; border-color: #C9DCD7; }
  56.85%, 57.25% { background: #E3F1EE; color: #00705C; border-color: #9FC4BC; }
  57.55%, 60.75% { background: #00705C; color: #fff; border-color: #00705C; }
  61.5%, 100% { background: rgba(255,255,255,.95); color: #00705C; border-color: #C9DCD7; }
}
@keyframes wz-sisip {
  0%, 28.65% { background: transparent; }
  29.05%, 38.25% { background: #FFE9A8; }
  40.0%, 100% { background: transparent; }
}
@keyframes wz-alatL {
  0%, 74.75% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.1); }
  75.15%, 76.0% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.18), 0 2px 5px -2px rgba(58,26,44,.3); }
  76.25% { transform: scale(.9); box-shadow: 0 0 0 1px rgba(58,26,44,.18); }
  76.95%, 100% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.1); }
}
@keyframes wz-alatA {
  0%, 78.5% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.1); }
  78.9%, 79.75% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.18), 0 2px 5px -2px rgba(58,26,44,.3); }
  80.0% { transform: scale(.9); box-shadow: 0 0 0 1px rgba(58,26,44,.18); }
  80.7%, 100% { transform: none; box-shadow: 0 0 0 1px rgba(58,26,44,.1); }
}
@keyframes wz-pilihBaris {
  0%, 49.75% { background: transparent; box-shadow: inset 0 0 0 0 rgba(196,42,94,0); }
  50.375%, 96.75% { background: #FCF2F6; box-shadow: inset 3px 0 0 0 var(--wa-rose); }
  97.5%, 100% { background: transparent; box-shadow: inset 0 0 0 0 rgba(196,42,94,0); }
}
@keyframes wz-lencanaPadam {
  0%, 49.75% { opacity: 1; transform: none; }
  50.375%, 97.5% { opacity: 0; transform: scale(.5); }
  100% { opacity: 0; transform: scale(.5); }
}
@keyframes wz-int-ganti {
  0% { opacity: 0; transform: scale(.72); }
  3%, 31% { opacity: 1; transform: none; }
  36%, 100% { opacity: 0; transform: scale(.72); }
}
@keyframes wz-int-pindah {
  0%, 30% { transform: translate(0, 0); }
  36%, 63% { transform: translate(calc(var(--s) * -10px), 44px); }
  69%, 96% { transform: translate(calc(var(--s) * -5px), -36px); }
  100% { transform: translate(0, 0); }
}
@keyframes wz-kilau {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

.wz-rv-js .wz-rv.is-in .wz-act--1 { animation: wz-babak1 40s linear infinite; }
.wz-rv-js .wz-rv.is-in .wz-act--2 { animation: wz-babak2 40s linear infinite; }
.wz-rv-js .wz-rv.is-in .wz-cur { animation: wz-kursor 40s linear infinite; }
.wz-rv.is-in .wz-cur u { animation: wz-klik 40s linear infinite; }

.wz-rv.is-in .wz-f--judul .wz-in  { animation: wz-fokus1 40s linear infinite; }
.wz-rv.is-in .wz-f--pesan .wz-ta  { animation: wz-fokus2 40s linear infinite; }
.wz-rv.is-in .wz-f--kontak .wz-in { animation: wz-fokus3 40s linear infinite; }
.wz-rv.is-in .wz-f--waktu .wz-in  { animation: wz-fokus4 40s linear infinite; }
.wz-rv-js .wz-rv.is-in .wz-type   { animation: wz-ketik 40s steps(13, end) infinite; }
.wz-rv-js .wz-rv.is-in .wz-tz--1  { animation: wz-ketikA 40s steps(40, end) infinite; }
.wz-rv-js .wz-rv.is-in .wz-tz--2  { animation: wz-ketikB 40s steps(34, end) infinite; }
.wz-rv.is-in .wz-car      { animation: wz-karet1 40s steps(1, end) infinite, wz-kedip .9s steps(1, end) infinite; }
.wz-rv.is-in .wz-car2--1  { animation: wz-karet2 40s steps(1, end) infinite, wz-kedip .9s steps(1, end) infinite; }
.wz-rv.is-in .wz-car2--2  { animation: wz-karet3 40s steps(1, end) infinite, wz-kedip .9s steps(1, end) infinite; }

.wz-rv-js .wz-rv.is-in .wz-drop--k { animation: wz-bukaK 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-drop--w { animation: wz-bukaW 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv.is-in .wz-drop--k .wz-opt:first-child { animation: wz-sorotK 40s linear infinite; }
.wz-rv.is-in .wz-drop--w .wz-opt:first-child { animation: wz-sorotW 40s linear infinite; }
.wz-rv-js .wz-rv.is-in .wz-drop--k .wz-ok { animation: wz-ceklisK 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-drop--w .wz-ok { animation: wz-ceklisW 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-f--kontak .wz-pick { animation: wz-pickK 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-f--kontak .wz-ph   { animation: wz-phK 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-f--waktu  .wz-pick { animation: wz-pickW 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-f--waktu  .wz-ph   { animation: wz-phW 40s ease-out infinite; }
.wz-rv.is-in .wz-send { animation: wz-tekan 40s cubic-bezier(.4,0,.2,1) infinite; }
.wz-rv.is-in .wz-rip  { animation: wz-riak 40s ease-out infinite; }
.wz-rv.is-in .wz-alat--lbl { animation: wz-alatL 40s cubic-bezier(.4,0,.2,1) infinite; }
.wz-rv.is-in .wz-alat--ai  { animation: wz-alatA 40s cubic-bezier(.4,0,.2,1) infinite; }

.wz-rv-js .wz-rv.is-in .wz-int__i { animation: wz-int-ganti 21s ease-in-out infinite both;
  animation-delay: calc(var(--i) * 7s + var(--d)); }
.wz-rv-js .wz-rv.is-in .wz-pv { animation: wz-pratinjau 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-pv b { animation: wz-sisip 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-pl--1 { animation: wz-ketikP1 40s steps(27, end) infinite; }
.wz-rv-js .wz-rv.is-in .wz-pl--2 { animation: wz-ketikP2 40s steps(22, end) infinite; }
.wz-rv-js .wz-rv.is-in .wz-pl--3 { animation: wz-ketikP3 40s steps(23, end) infinite; }
.wz-rv-js .wz-rv.is-in .wz-pv__t u { animation: wz-jamP 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-sk { animation: wz-rangka 40s ease-out infinite; }
.wz-rv.is-in .wz-sk::after { animation: wz-kilau 1.5s ease-in-out infinite; }

.wz-rv-js .wz-rv.is-in .wz-toast   { animation: wz-toastM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(1) { animation: wz-barisM0 40s cubic-bezier(.16,1,.3,1) infinite, wz-pilihBaris 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(2) { animation: wz-barisM1 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(3) { animation: wz-barisM2 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(4) { animation: wz-barisM3 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(5) { animation: wz-barisM4 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(6) { animation: wz-barisM5 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(7) { animation: wz-barisM6 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-inb__l li:nth-child(8) { animation: wz-barisM7 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv.is-in .wz-inb__l li:nth-child(1) .wz-meta u { animation: wz-lencanaPadam 40s cubic-bezier(.4,0,.2,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-cnv__h  { animation: wz-kepalaM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-cnv__b  { animation: wz-badanM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-kosong  { animation: wz-kosongM 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-b1 { transform-origin: 0 100%; animation: wz-pop-wz-b1 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b2 { transform-origin: 100% 100%; animation: wz-pop-wz-b2 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b3 { transform-origin: 0 100%; animation: wz-pop-wz-b3 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b4 { transform-origin: 100% 100%; animation: wz-pop-wz-b4 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b5 { transform-origin: 0 100%; animation: wz-pop-wz-b5 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b6 { transform-origin: 100% 100%; animation: wz-pop-wz-b6 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-b2 .wz-tick { animation: wz-centang0 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-b4 .wz-tick { animation: wz-centang1 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-b6 .wz-tick { animation: wz-centang2 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-cnv__s { animation: wz-gulir 40s cubic-bezier(.33,0,.15,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-pt1, .wz-rv-js .wz-rv.is-in .wz-jm1 { animation: wz-ptA 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-pt2, .wz-rv-js .wz-rv.is-in .wz-jm2 { animation: wz-ptB 40s ease-out infinite; }
.wz-rv-js .wz-rv.is-in .wz-qr      { animation: wz-qrM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-qr .wz-qrc:nth-child(2) { animation: wz-qrcM0 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-qr .wz-qrc:nth-child(3) { animation: wz-qrcM1 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-qr .wz-qrc:nth-child(3) { animation: wz-qrcM1 40s cubic-bezier(.16,1,.3,1) infinite, wz-pilihqr 40s linear infinite; }
.wz-rv-js .wz-rv.is-in .wz-lbl { animation: wz-lblM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-ai  { animation: wz-aiM 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-ai .wz-ail:nth-child(2) { animation: wz-ailM0 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-ai .wz-ail:nth-child(3) { animation: wz-ailM1 40s cubic-bezier(.16,1,.3,1) infinite; }
.wz-rv-js .wz-rv.is-in .wz-ai .wz-ail:nth-child(4) { animation: wz-ailM2 40s cubic-bezier(.16,1,.3,1) infinite; }

@media (max-width: 1100px) {
  .wz-rv__wrap { grid-template-columns: 1fr; gap: 48px; }
  .wz-rv__proof { margin-bottom: 36px; }
  .wz-rv__left { max-width: 620px; }
  .wz-rv__h { font-size: 34px; }

  .wz-rv::after {
    background-image: url("../img/wz-siar-potret.svg");
    transform-origin: 50% 56%;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .wz-rv__left { margin-inline: auto; }
  .wz-rv__sub { max-width: none; text-wrap: balance; }
}

@media (max-width: 760px) {

  .wz-rv__proof {
    grid-template-columns: repeat(2, 1fr);
    gap: 0;
    margin-bottom: 24px;

    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  .wz-rv__pi:last-child { display: none; }

  .wz-rv__pi + .wz-rv__pi::before { display: none; }
  .wz-rv__pi { padding: 0 6px; }
  .wz-rv__stars::before { inset: -9px -8px; }

  .wz-rv__q {
    font-size: clamp(11px, 3.85vw, 13.5px);
    text-align: center;
  }
}

@media (max-width: 640px) {

  .wz-rv { padding: 64px 20px var(--wz-sec-y); }
  .wz-rv__tag { position: static; margin-bottom: 22px; }

  .wz-rv__wrap { gap: 0; }
  .wz-rv__left { display: contents; }

  .wz-rv__eyebrow { order: 1; justify-self: center; }

  .wz-rv .wz-rv__eyebrow { background: #F8D7E2; }
  .wz-rv__h       { order: 2; }
  .wz-rv__right   { order: 3; }
  .wz-rv__cta     { order: 4; }

  .wz-rv__right { margin: 10px 0 76px; }

  .wz-rv__proof { display: none; }

  .wz-rv__h { font-size: 28px; letter-spacing: -.4px; }

  .wz-rv__h { margin-bottom: 14px; }
  .wz-rv__right::before { width: 380px; height: 380px; }

  .wz-rv__cta { gap: 12px; }
  .wz-rv__btn,
  .wz-rv__link { width: 100%; justify-content: center; }

  .wz-rv__left { text-align: center; }

  .wz-rv__sub { display: none; }

  .wz-rv__star { width: 14.2px; height: 13.5px; }
  .wz-rv__pi { gap: 9px; }

  .wz-stage { height: 420px; }

  .wz-ta { min-height: 54px; }

  .wz-stage { container-type: inline-size; }
  .wz-rv-js .wz-rv.is-in .wz-cur { animation-name: wz-kursor-hp; }

  .wz-cur { --wz-qy: 353px; }

  @keyframes wz-kursor-hp {

    0.0%     { transform: translate(calc(100cqw - 30px), 404px); opacity: 0; animation-timing-function: linear; }
    2.0%     { transform: translate(calc(100cqw - 30px), 404px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    4.5%     { transform: translate(calc(100cqw - 80px), 131px); opacity: 1; animation-timing-function: linear; }
    12.25%   { transform: translate(calc(100cqw - 80px), 131px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    13.75%   { transform: translate(43cqw, 187px); opacity: 1; animation-timing-function: linear; }
    15.5%    { transform: translate(43cqw, 187px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
    16.5%    { transform: translate(43cqw, 229px); opacity: 1; animation-timing-function: linear; }
    18.875%  { transform: translate(43cqw, 229px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    19.75%   { transform: translate(43cqw, 244px); opacity: 1; animation-timing-function: linear; }
    21.5%    { transform: translate(43cqw, 244px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
    22.5%    { transform: translate(43cqw, 286px); opacity: 1; animation-timing-function: linear; }
    25.0%    { transform: translate(43cqw, 286px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    26.5%    { transform: translate(57cqw, 324px); opacity: 1; animation-timing-function: linear; }
    36.5%    { transform: translate(57cqw, 324px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    38.0%    { transform: translate(calc(100cqw - 87px), 396px); opacity: 1; animation-timing-function: linear; }
    39.5%    { transform: translate(calc(100cqw - 87px), 396px); opacity: 1; animation-timing-function: linear; }
    40.25%   { transform: translate(calc(100cqw - 87px), 396px); opacity: 0; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    45.75%   { transform: translate(calc(100cqw - 30px), 404px); opacity: 0; animation-timing-function: linear; }
    46.5%    { transform: translate(calc(100cqw - 30px), 404px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    49.0%    { transform: translate(97px, 130px); opacity: 1; animation-timing-function: linear; }
    55.25%   { transform: translate(97px, 130px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    56.5%    { transform: translate(172px, var(--wz-qy)); opacity: 1; animation-timing-function: linear; }
    73.5%    { transform: translate(172px, var(--wz-qy)); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }

    75.25%   { transform: translate(calc(100cqw - 109px), 59px); opacity: 1; animation-timing-function: linear; }
    77.5%    { transform: translate(calc(100cqw - 109px), 59px); opacity: 1; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
    79.0%    { transform: translate(calc(100cqw - 76px), 59px); opacity: 1; animation-timing-function: linear; }
    84.5%    { transform: translate(calc(100cqw - 76px), 59px); opacity: 1; animation-timing-function: linear; }
    85.5%    { transform: translate(calc(100cqw - 76px), 59px); opacity: 0; animation-timing-function: cubic-bezier(.32,.02,.12,1); }
    100.0%   { transform: translate(calc(100cqw - 30px), 404px); opacity: 0; animation-timing-function: linear; }
  }

  .wz-card { grid-template-columns: minmax(0, 1fr); }
  .wz-prev, .wz-vars { display: none; }
  .wz-ph2 b { font-size: 13.5px; }
  .wz-auto { display: none; }

  .wz-btn2 { display: none; }
  .wz-hint em { display: none; }

  .wz-list { position: absolute; inset: 0; z-index: 1; flex-basis: auto; border-right: 0; }
  .wz-cnv { position: absolute; inset: 0; z-index: 2; }
  .wz-kosong { display: none; }
  .wz-rv-js .wz-cnv { opacity: 0; }

  .wz-rv-js .wz-rv.is-in .wz-cnv { animation: wz-cnvHP 40s cubic-bezier(.16,1,.3,1) infinite; }

  .wz-toast { top: auto; bottom: 12px; left: 10px; right: 10px; max-width: none; }
  .wz-rv-js .wz-rv.is-in .wz-toast { animation: wz-toastHP 40s cubic-bezier(.16,1,.3,1) infinite; }

  .wz-act::before { inset: -14px -12px -20px; }

  .wz-int { width: 34px; height: 34px; border-radius: 10px;

    transform: translateX(-50%); }
  .wz-int img { width: 18px; height: 18px; }

  .wz-int { top: calc(100% + 14px); }

  .wz-int:nth-of-type(1) { left: 8.333%; }
  .wz-int:nth-of-type(2) { left: 25%; }
  .wz-int:nth-of-type(3) { left: 41.667%; }
  .wz-int:nth-of-type(4) { left: 58.333%; }
  .wz-int:nth-of-type(5) { left: 75%; }
  .wz-int:nth-of-type(6) { left: 91.667%; }

  .wz-rv-js .wz-rv.is-in .wz-int { animation: wz-int-masuk .5s ease-out both;
    animation-delay: calc(.5s + var(--d)); }
  .wz-int__i em { display: none; }
}

@media (max-width: 352px) { .wz-cur { --wz-qy: 336px; } }
@media (max-width: 339px) { .wz-cur { --wz-qy: 319px; } }

@media (prefers-reduced-motion: reduce) {
  .wz-rv__btn { transition: none !important; }
  .wz-rv__btn:hover { transform: none !important; }
  .wz-rv-js .wz-rv__left > *, .wz-rv-js .wz-pnl, .wz-rv-js .wz-int,
  .wz-rv-js .wz-rv__right::before, .wz-rv-js .wz-act--2,
  .wz-rv-js .wz-inb__l li,
  .wz-rv-js .wz-cnv, .wz-rv-js .wz-cnv__h, .wz-rv-js .wz-cnv__b,
  .wz-rv-js .wz-bub, .wz-rv-js .wz-qr, .wz-rv-js .wz-qrc, .wz-rv-js .wz-lbl,
  .wz-rv-js .wz-ai, .wz-rv-js .wz-ail,
  .wz-rv-js .wz-bub--out .wz-tick { opacity: 1 !important; transform: none !important; animation: none !important; }
  .wz-rv-js .wz-act--1 { opacity: 0 !important; animation: none !important; }
  .wz-rv .wz-cur, .wz-rv .wz-car, .wz-rv .wz-car2, .wz-rv .wz-rip,
  .wz-rv .wz-drop, .wz-rv .wz-sk, .wz-rv .wz-kosong { opacity: 0 !important; animation: none !important; }

  .wz-rv-js .wz-toast { display: none !important; }

  .wz-rv-js .wz-type, .wz-rv-js .wz-tz, .wz-rv-js .wz-pl {
    max-width: none !important; width: max-content !important; animation: none !important; }
  .wz-rv-js .wz-pv__t u { opacity: 1 !important; animation: none !important; }
  .wz-rv-js .wz-pv, .wz-rv-js .wz-pick { opacity: 1 !important; transform: none !important; animation: none !important; }
  .wz-rv-js .wz-ph { opacity: 0 !important; animation: none !important; }
  .wz-rv .wz-in, .wz-rv .wz-ta, .wz-rv .wz-sk::after, .wz-rv .wz-pv__t b,
  .wz-rv .wz-send, .wz-rv .wz-opt, .wz-rv .wz-alat,
  .wz-rv .wz-inb__l li, .wz-rv .wz-meta u { animation: none !important; }

  .wz-rv-js .wz-int__i { opacity: 0 !important; animation: none !important; }
  .wz-rv-js .wz-int__i:first-child { opacity: 1 !important; }
  .wz-rv-js .wz-rv__mark::before { transform: none !important; animation: none !important; }

  .wz-rv-js .wz-rv__proof { opacity: 1 !important; transform: none !important; animation: none !important; }
  .wz-rv-js .wz-rv .wz-rv__star { opacity: 1 !important; transform: none !important; animation: none !important; }

  .wz-rv-js .wz-rv .wz-cnv__s { transform: none !important; animation: none !important; }
  .wz-rv-js .wz-rv .wz-pt1, .wz-rv-js .wz-rv .wz-jm1 { opacity: 0 !important; animation: none !important; }
  .wz-rv-js .wz-rv .wz-pt2, .wz-rv-js .wz-rv .wz-jm2 { opacity: 1 !important; transform: none !important; animation: none !important; }
  .wz-rv-js .wz-rv .wz-ok { opacity: 0 !important; animation: none !important; }

  .wz-rv-js .wz-rv .wz-cur u { animation: none !important; }

  .wz-rv-js .wz-rv.is-in::after { transform: none !important; animation: none !important; }
}

.wz-rot { display: inline-block; vertical-align: baseline; }

.wz-rot__pill {
  display: inline-flex;
  align-items: baseline;
  gap: .32em;

  padding: .258em .44em .099em;
  line-height: 1.1;
  font-weight: 600;
  font-size: calc(1em - 2px);
  border-radius: 999px;
  background: var(--wz-rot-bg, #E7F5C8);
  color: var(--wz-ink);
  letter-spacing: -.4px;
  transition: background-color .42s ease;
}

.wz-rot__dot {
  align-self: center;

  margin-bottom: .159em;
  flex: 0 0 auto;
  width: .38em;
  height: .38em;
  border-radius: 50%;
  background: var(--wz-rot-dot, #5C8A0B);
  transition: background-color .42s ease;
}

.wz-rot__track {
  display: inline-block;
  position: relative;
  width: var(--wz-rot-w, auto);
  overflow: hidden;
  contain: paint;
  text-align: center;
  transition: width .46s cubic-bezier(.32, .72, 0, 1);
}

.wz-rot__word {
  display: inline-block;
  white-space: nowrap;
  transition: transform .46s cubic-bezier(.32, .72, 0, 1), opacity .34s ease;
}

.wz-rot__word.is-enter {
  opacity: 0;
  transform: translateY(.55em);
  transition: none;
}

.wz-rot__ghost { position: absolute; pointer-events: none; }
.wz-rot__ghost::before { content: attr(data-w); }
.wz-rot__ghost.is-leave { opacity: 0; transform: translateY(-.55em); }

.wz-rot__meas {
  position: absolute;
  left: -9999px;
  top: 0;
  visibility: hidden;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .wz-rot__pill,
  .wz-rot__dot,
  .wz-rot__track,
  .wz-rot__word,
  .wz-rot__ghost { transition: none; }
}

body.wz-hero-sunyi .up-conversion,
body.wz-hero-sunyi .wz-cs {
  display: none !important;
}
