/* Gaya khusus Minimalis 1 (Amplop dan Bunga), watercolor. Aksen blush #E8C4BA / #C98E86.
   Keadaan diam (tanpa animasi) = posisi akhir, jadi saat "kurangi gerakan" semua langsung tampil di tempatnya. */
body[data-gaya="amplop"] .wc{display:block;max-width:none;height:auto;user-select:none;-webkit-user-drag:none}
/* Tekstur kertas T01 sebagai latar halus (dipasang JS setelah dibuka lewat variabel --wc-kertas) */
body[data-gaya="amplop"] #inv-isi,body[data-gaya="amplop"] .amplop{background-color:var(--t-bg);background-image:var(--wc-kertas,none);background-size:360px auto;background-blend-mode:multiply}

/* ---------- Amplop watercolor: tertutup -> terbuka (silang-pudar) ---------- */
.m1-amplop{position:absolute;left:50%;top:46%;width:260px;height:297px;transform:translate(-50%,-50%)}
.m1-amplop img{position:absolute;left:0;bottom:0;width:100%}
.m1-terbuka{opacity:0}
.segel{position:absolute;left:50%;border-radius:50%;display:grid;place-items:center;font-family:'Cormorant Garamond',serif;font-weight:600}
.m1-amplop .segel{top:77%;width:56px;height:56px;margin:-28px 0 0 -28px;background:#E8C4BA;color:#6E3F3A;font-size:17px;box-shadow:0 0 0 2px #FFF8F4,0 0 0 3.5px #C98E86}
.amplop.buka .m1-tertutup{animation:m1Pudar .6s ease .65s both}
.amplop.buka .m1-terbuka{animation:m1Muncul .6s ease .65s both}
.amplop.buka .segel{animation:segel .35s ease .3s both}
.amplop.buka{animation:turun .8s cubic-bezier(.55,0,.8,.2) 1.35s both}
@keyframes m1Pudar{from{opacity:1}to{opacity:0}}
@keyframes m1Muncul{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes segel{from{transform:none;opacity:1}to{transform:scale(.6);opacity:0}}
@keyframes turun{from{transform:none}to{transform:translateY(105%)}}

/* ---------- Peony besar: muncul di tengah, lalu dua salinan mengecil ke sudut kanan dan kiri ---------- */
.m1-terbang{position:absolute;inset:0;z-index:7;pointer-events:none;overflow:hidden}
.m1-terbang[hidden]{display:none}
.m1-terbang.selesai{opacity:0;transition:opacity .35s ease}
.m1-tb{position:absolute;left:50%;top:300px;width:200px;margin:-96px 0 0 -100px;opacity:0}
.m1-terbang.main .m1-tb.kanan{animation:m1Kanan 2.6s cubic-bezier(.45,0,.25,1) both}
.m1-terbang.main .m1-tb.kiri{animation:m1Kiri 2.6s cubic-bezier(.45,0,.25,1) both}
/* Daftar fungsi transform sama di semua titik supaya tidak ada putaran aneh saat interpolasi */
@keyframes m1Kanan{0%{opacity:0;transform:translate(0px,60px) scale(.2,.2)}22%,46%{opacity:1;transform:translate(0px,0px) scale(1,1)}100%{opacity:1;transform:translate(var(--m1-tx),-248px) scale(.42,.42)}}
@keyframes m1Kiri{0%{opacity:0;transform:translate(0px,60px) scale(-.2,.2)}22%,46%{opacity:1;transform:translate(0px,0px) scale(-1,1)}100%{opacity:1;transform:translate(calc(-1 * var(--m1-tx)),-248px) scale(-.42,.42)}}

/* ---------- Hiasan sudut atas di hero (posisi akhir peony) ---------- */
.bunga-min{position:absolute;left:0;top:0;width:100%;height:200px;pointer-events:none;z-index:0}
.hero > :not(.bunga-min){position:relative;z-index:1}
.panggung.siap .bunga-min{opacity:0}
.m1-sudut{position:absolute;top:0;width:140px}
.m1-sudut img{width:100%}
.m1-sudut.kiri{left:0;transform-origin:0 0}
.m1-sudut.kanan{right:0;transform-origin:100% 0}
.m1-sudut.kanan img{transform:scaleX(-1)}
.m1-pe{position:absolute;top:12px;width:84px;z-index:1;transition:opacity .35s ease}
.m1-pe.kiri{left:6px;transform:scaleX(-1)}
.m1-pe.kanan{right:6px}
.bunga-min.tunggu .m1-pe{opacity:0}
body[data-gaya="amplop"] .panggung.main .m1-sudut{animation:m1Sudut .9s ease 1.9s both}
@keyframes m1Sudut{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:none}}

/* ---------- Rangkaian kecil di bawah nama: eukaliptus kiri-kanan, baby's breath, mawar krem ---------- */
.m1-rangkai{position:relative;width:200px;height:70px;margin:0 auto 8px}
.m1-rangkai img{position:absolute}
.m1-rk-gyp{left:64px;top:0;width:72px}
.m1-rk-daun{top:20px;width:92px;transform:var(--tf)}
.m1-rk-daun.kiri{left:8px;transform-origin:100% 70%}
.m1-rk-daun.kanan{left:100px;transform-origin:0 70%}
.m1-rk-mawar{left:76px;top:14px;width:48px}
body[data-gaya="amplop"] .panggung.siap .m1-rangkai{opacity:0}
body[data-gaya="amplop"] .panggung.main .m1-rk-daun{animation:m1Daun 1s cubic-bezier(.3,.7,.3,1) 1.3s both}
body[data-gaya="amplop"] .panggung.main .m1-rk-gyp{animation:fadeIn 1s ease 1.7s both}
body[data-gaya="amplop"] .panggung.main .m1-rk-mawar{animation:m1Mekar 1s cubic-bezier(.3,1.3,.5,1) 1.9s both}
@keyframes m1Daun{from{opacity:0;transform:var(--tf) scale(.3)}to{opacity:1;transform:var(--tf) scale(1)}}
@keyframes m1Mekar{from{opacity:0;transform:scale(.5) rotate(-20deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}

/* Kelopak blush watercolor */
body[data-gaya="amplop"] .kelopak img{display:block;height:auto}

@media (prefers-reduced-motion: reduce){
  .m1-terbang{display:none !important}
  .bunga-min.tunggu .m1-pe{opacity:1}
}
