/* tpl-minang.css — LAPISAN "minang".
   Karakter: undangan adat Minangkabau — marun/merah bata, emas songket, krem,
   hitam. Tiga motif khas dipakai konsisten: gonjong (atap runcing rumah gadang),
   tenun/songket (pita bergaris + belah ketupat), dan daun sirih.

   Alasan teknis:
   - Ornamen digambar sendiri sebagai SVG data-URI yang dipakai sebagai
     mask-image + background:currentColor, jadi warnanya ikut token tema
     (--accent / emas) tanpa berkas gambar eksternal.
   - TIDAK ada URL http(s) dan tidak ada Google Fonts: CSP produksi memblokir
     keduanya. Skema di dalam xmlns pun di-encode (%3A%2F%2F) supaya tidak ada
     satu pun string skema-URL mentah di berkas ini.
   - Semua selektor berscope .inv.tpl-minang agar tidak bocor ke lapisan lain.
   - Ornamen selalu terpusat (left:50% + margin negatif) dan dipasang absolut,
     jadi tata letak 390px maupun 1440px tidak bergeser. */

.inv.tpl-minang{
  --minang-marun:#7a1f2b;
  --minang-emas:#c9a227;
  --minang-krem:#f4e9d8;
  /* Emas TEKS dipisah dari emas ornamen: #c9a227 di latar krem hanya 2,25:1. */
  --minang-emas-teks:#7d6212;
  --minang-hitam:#1a1013;
  background:var(--background);
}

/* ---------- pembatas tenun (belah ketupat songket) ----------
   Elemen .rule asli cuma garis 1px; di lapisan ini jadi pita songket. */
.inv.tpl-minang .rule{
  width:min(13rem,70%);height:22px;background:none;
  background-color:var(--minang-emas);opacity:.8;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1 23 12 12 23 1 12Z M12 7 17 12 12 17 7 12Z' fill='%23000' fill-rule='evenodd'%2F%3E%3C%2Fsvg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1 23 12 12 23 1 12Z M12 7 17 12 12 17 7 12Z' fill='%23000' fill-rule='evenodd'%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat:repeat-x;mask-repeat:repeat-x;
  -webkit-mask-size:22px 22px;mask-size:22px 22px;
}
.inv.tpl-minang .orn{color:var(--minang-emas);opacity:.9}
.inv.tpl-minang .orn-corner{color:var(--minang-emas);opacity:.6}

/* ---------- cover: panel marun berbingkai emas ---------- */
.inv.tpl-minang .cover__inner{
  position:relative;border:1px solid var(--minang-emas);
  outline:1px solid color-mix(in srgb,var(--minang-emas) 45%,transparent);outline-offset:6px;
  background:color-mix(in srgb,var(--minang-marun) 94%,#000);
  color:var(--minang-krem);
  padding:3.4rem 1.5rem 2.6rem;
  max-width:min(32rem,calc(100% - 2.2rem));
}
/* saat ada foto latar: panel dibuat tembus pandang, bukan marun pekat */
.inv.tpl-minang .cover.has-cover .cover__inner{background:rgba(26,16,19,.72)}
.inv.tpl-minang .cover__inner .cover__names,
.inv.tpl-minang .cover__inner .cover__date,
.inv.tpl-minang .cover__inner .cover__to,
.inv.tpl-minang .cover__inner .cover__guestname,
.inv.tpl-minang .cover__inner .eyebrow{color:var(--minang-krem)}
.inv.tpl-minang .cover__inner .cover__date{letter-spacing:.3em;text-transform:uppercase;font-size:.78rem;color:var(--minang-emas-teks)}
.inv.tpl-minang .cover__names{letter-spacing:.05em;font-weight:600;line-height:1.08}
.inv.tpl-minang .cover__to{letter-spacing:.12em}

/* mahkota gonjong di kepala panel cover (terpusat, absolut -> tak menggeser teks) */
.inv.tpl-minang .cover__inner::before{
  content:'';position:absolute;top:-2.9rem;left:50%;width:96px;height:52px;margin-left:-48px;
  background:currentColor;color:var(--minang-emas);opacity:.9;pointer-events:none;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 100 56'%3E%3Cpath d='M50 0C44 20 24 38 4 52V56h92v-4C76 38 56 20 50 0Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 100 56'%3E%3Cpath d='M50 0C44 20 24 38 4 52V56h92v-4C76 38 56 20 50 0Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;
  animation:minangGonjong 5.5s ease-in-out infinite;
}
/* sepasang daun sirih di sudut atas panel — satu pseudo, dua lapis mask */
.inv.tpl-minang .cover__inner::after{
  content:'';position:absolute;inset:10px;pointer-events:none;
  background:currentColor;color:var(--minang-emas);opacity:.5;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 40 40'%3E%3Cpath d='M20 37C6 27 3 14 10 6c4-4 8-4 10 0 2-4 6-4 10 0 7 8 4 21-10 31Z' fill='%23000'%2F%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 40 40'%3E%3Cpath d='M20 37C6 27 3 14 10 6c4-4 8-4 10 0 2-4 6-4 10 0 7 8 4 21-10 31Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 40 40'%3E%3Cpath d='M20 37C6 27 3 14 10 6c4-4 8-4 10 0 2-4 6-4 10 0 7 8 4 21-10 31Z' fill='%23000'%2F%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 40 40'%3E%3Cpath d='M20 37C6 27 3 14 10 6c4-4 8-4 10 0 2-4 6-4 10 0 7 8 4 21-10 31Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat:no-repeat,no-repeat;mask-repeat:no-repeat,no-repeat;
  -webkit-mask-position:left top,right top;mask-position:left top,right top;
  -webkit-mask-size:26px 26px,26px 26px;mask-size:26px 26px,26px 26px;
  animation:minangSirih 6.5s ease-in-out infinite;
}

/* ---------- tiap section: gonjong di kepala + pembatas tenun ---------- */
.inv.tpl-minang .sec{
  max-width:min(68rem,calc(100% - 1.4rem));
  border-top:1px solid color-mix(in srgb,var(--minang-emas) 30%,transparent);
}
.inv.tpl-minang .sec::before{
  content:'';position:absolute;top:.6rem;left:50%;width:84px;height:46px;margin-left:-42px;
  background:currentColor;color:var(--minang-emas);opacity:.85;pointer-events:none;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 100 56'%3E%3Cpath d='M50 0C44 20 24 38 4 52V56h92v-4C76 38 56 20 50 0Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 100 56'%3E%3Cpath d='M50 0C44 20 24 38 4 52V56h92v-4C76 38 56 20 50 0Z' fill='%23000'%2F%3E%3C%2Fsvg%3E");
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;
  animation:minangGonjong 6.5s ease-in-out infinite;
}
.inv.tpl-minang .sec::after{
  content:'';position:absolute;top:0;left:0;right:0;height:8px;pointer-events:none;opacity:.45;
  background:repeating-linear-gradient(90deg,
    color-mix(in srgb,var(--minang-emas) 65%,transparent) 0 8px,transparent 8px 16px);
  background-size:16px 8px;
  animation:minangTenun 9s linear infinite;
}
.inv.tpl-minang .eyebrow{color:var(--minang-emas-teks);letter-spacing:.2em}

/* quote: blok marun penuh, khidmat */
.inv.tpl-minang .sec--quote{
  background:color-mix(in srgb,var(--minang-marun) 90%,#000);
  color:var(--minang-krem);
  border-top:1px solid var(--minang-emas);border-bottom:1px solid var(--minang-emas);
}
.inv.tpl-minang .sec--quote .quote{color:var(--minang-krem)}
/* Konteks GELAP: di dalam blok marun, emas-teks (gelap) jatuh ke 1,96:1 — di sini
   yang benar justru warna terang. Satu token tidak bisa melayani dua latar. */
.inv.tpl-minang .sec--quote .eyebrow{color:var(--minang-krem)}
.inv.tpl-minang .sec--quote .quote cite{color:color-mix(in srgb,var(--minang-emas) 80%,#fff)}
.inv.tpl-minang .sec--quote .orn{color:var(--minang-emas)}

/* ---------- hero ---------- */
.inv.tpl-minang .hero__names{letter-spacing:.04em}
.inv.tpl-minang .hero__date{letter-spacing:.3em;text-transform:uppercase;font-size:.78rem;color:var(--minang-emas-teks)}
.inv.tpl-minang .hero__photo{
  border-radius:2px;box-shadow:none;padding:9px;
  border:1px solid var(--minang-emas);
  background:color-mix(in srgb,var(--minang-marun) 10%,var(--surface));
}
.inv.tpl-minang .prose{color:var(--text);opacity:.92}

/* ---------- mempelai ---------- */
.inv.tpl-minang .couple__photo{
  border-radius:2px;box-shadow:none;padding:9px;
  border:1px solid var(--minang-emas);
  background:color-mix(in srgb,var(--minang-marun) 10%,var(--surface));
}
.inv.tpl-minang .couple__photo--empty{background:color-mix(in srgb,var(--minang-marun) 16%,var(--surface))}
.inv.tpl-minang .couple__amp{color:var(--minang-emas-teks);font-size:2.4rem}
.inv.tpl-minang .couple__name{letter-spacing:.03em}
.inv.tpl-minang .couple__nick{color:var(--minang-emas-teks)}
.inv.tpl-minang .couple__ig{color:var(--minang-marun);text-decoration-color:var(--minang-emas)}

/* ---------- acara: kartu berhias pita songket ---------- */
.inv.tpl-minang .event{
  position:relative;border-radius:2px;box-shadow:none;padding:2rem 1.3rem 1.6rem;
  background:var(--surface);
  border:1px solid color-mix(in srgb,var(--minang-emas) 50%,transparent);
}
.inv.tpl-minang .event::before{
  content:'';position:absolute;top:0;left:0;right:0;height:6px;pointer-events:none;
  background:repeating-linear-gradient(90deg,
    var(--minang-marun) 0 6px,var(--minang-emas) 6px 12px);
  opacity:.75;
}
.inv.tpl-minang .event__title{color:var(--minang-marun);letter-spacing:.06em}
.inv.tpl-minang .event__when{color:var(--text)}

/* ---------- hitung mundur: kartu marun, angka emas ---------- */
.inv.tpl-minang .count__unit{
  border-radius:2px;
  background:color-mix(in srgb,var(--minang-marun) 88%,#000);
  border:1px solid color-mix(in srgb,var(--minang-emas) 55%,transparent);
}
/* Ubin hitung mundur berlatar MARUN, jadi angkanya harus terang: emas gelap di sini
   hanya 2,0:1 dan marun 1,13:1. Emas yang lebih muda dipakai khusus di konteks ini. */
.inv.tpl-minang .count__num{color:#e0bc4a}
.inv.tpl-minang .count__lbl{color:color-mix(in srgb,var(--minang-krem) 80%,transparent)}

/* ---------- galeri ---------- */
.inv.tpl-minang .gallery__item{
  border-radius:2px;border:1px solid color-mix(in srgb,var(--minang-emas) 45%,transparent);
  padding:4px;background:var(--surface);
}
.inv.tpl-minang .gallery__item img{border-radius:1px}
.inv.tpl-minang .gallery__item:hover{transform:none;filter:brightness(1.05)}

/* ---------- hadiah ---------- */
.inv.tpl-minang .gift{
  position:relative;border-radius:2px;box-shadow:none;padding-top:1.8rem;
  background:var(--surface);
  border:1px solid color-mix(in srgb,var(--minang-emas) 50%,transparent);
  outline:1px solid color-mix(in srgb,var(--minang-marun) 30%,transparent);outline-offset:4px;
}
.inv.tpl-minang .gift::before{
  content:'';position:absolute;top:0;left:0;right:0;height:6px;pointer-events:none;opacity:.8;
  background:repeating-linear-gradient(90deg,
    var(--minang-marun) 0 6px,var(--minang-emas) 6px 12px);
}
.inv.tpl-minang .gift__kind{color:var(--minang-emas-teks)}
.inv.tpl-minang .gift__provider{color:var(--minang-marun)}
.inv.tpl-minang .gift__number{color:var(--text);letter-spacing:.08em}

/* ---------- ucapan ---------- */
.inv.tpl-minang .wish{
  border-radius:2px;background:var(--surface);
  border:1px solid color-mix(in srgb,var(--minang-emas) 35%,transparent);
  border-left:3px solid var(--minang-marun);
}
.inv.tpl-minang .wish__name{color:var(--minang-marun)}

/* ---------- tombol, footer, musik, lightbox ---------- */
.inv.tpl-minang .btn{border-radius:2px;letter-spacing:.14em}
.inv.tpl-minang .btn--primary{
  background:var(--minang-marun);color:var(--minang-krem);border:1px solid var(--minang-emas);
}
.inv.tpl-minang .btn--ghost{border-color:var(--minang-emas);color:var(--text)}
.inv.tpl-minang .btn--open{border:1px solid var(--minang-emas);animation:minangBara 3.2s ease-in-out infinite}
.inv.tpl-minang .footer__names{color:var(--minang-marun);letter-spacing:.05em}
.inv.tpl-minang .share{margin-top:1.4rem}
.inv.tpl-minang .music{border-radius:2px;border-color:color-mix(in srgb,var(--minang-emas) 55%,transparent)}
.inv.tpl-minang .music__toggle{border-radius:2px;background:var(--minang-marun);color:var(--minang-emas)}
.inv.tpl-minang .lightbox img{border-radius:2px}
.inv.tpl-minang .lightbox__nav{color:var(--minang-emas)}

/* ---------- gerak ----------
   Empat gerak yang sengaja dibedakan supaya tidak terasa seragam:
   gonjong naik-turun halus (nafas atap), tenun bergeser mendatar (menenun),
   daun sirih mengapung, dan masuk (fade+naik) saat halaman dibuka. */
.inv.tpl-minang .cover__inner{animation:minangMasuk 1s cubic-bezier(.2,.8,.2,1) both}
@keyframes minangMasuk{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes minangGonjong{0%,100%{transform:translateY(0) scaleY(1)}50%{transform:translateY(-5px) scaleY(1.07)}}
@keyframes minangTenun{from{background-position:0 0}to{background-position:32px 0}}
@keyframes minangSirih{0%,100%{transform:translateY(0) rotate(0deg);opacity:.42}50%{transform:translateY(7px) rotate(-2deg);opacity:.66}}
@keyframes minangBara{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--minang-emas) 55%,transparent)}50%{box-shadow:0 0 0 13px transparent}}
.inv.tpl-minang .eyebrow{animation:minangMasuk .9s cubic-bezier(.2,.8,.2,1) both}

/* semua gerak di berkas ini dimatikan bila pengguna minta gerak minimal */
@media (prefers-reduced-motion:reduce){
  .inv.tpl-minang .cover__inner,
  .inv.tpl-minang .cover__inner::before,
  .inv.tpl-minang .cover__inner::after,
  .inv.tpl-minang .sec::before,
  .inv.tpl-minang .sec::after,
  .inv.tpl-minang .btn--open,
  .inv.tpl-minang .eyebrow{animation:none}
}

/* lebar besar: kreasi gonjong sedikit lebih kecil, jarak mempelai dilonggarkan */
@media (min-width:900px){
  .inv.tpl-minang .sec--hero{text-align:center;grid-template-columns:1fr;gap:2rem}
  .inv.tpl-minang .hero__photo{margin-inline:auto;max-width:24rem}
  .inv.tpl-minang .couple__wrap{gap:2.5rem}
}