/* ==========================================================
   DInvite — Tema "Pinisi Sutra" (Adat Bugis-Makassar)
   Kapal Pinisi berlayar di laut senja Pantai Losari, kain lipa' sabbe
   (sarung sutra Bugis kotak-kotak) sebagai tirai pembuka & pita bagian,
   ornamen emas timpa laja (atap bertingkat rumah panggung Bugis), bosara.
   Ungu tua, magenta sutra, emas, jingga senja, hijau zamrud.
   Pemandangan dipasang pinisi.js; gerak dimatikan bila diminta perangkat.
   ========================================================== */
.t-pinisi {
    --bg: #fbf3ea; --bg-2: #f6e8de; --card: #fffaf4; --ink: #3a0f40; --muted: #6e5466;
    --accent: #b3164f; --accent-2: #3a0f40; --on-accent: #fff; --line: rgba(179,22,79,.2);
    --plum: #3a0f40; --plum-2: #4a1550; --gold-1: #e0b04a; --emerald: #0f7a5a;
    --gold: linear-gradient(180deg, #fff1bf, #e8bf5c 40%, #b8852c 70%, #f2d27a);
    --hero-rgb: 58,15,64; --tint-a: .45; --hero-ink: #fff6e8;
    --sabbe: url(../../img/themes/pinisi/sabbe.webp) 0 0 / 180px 180px;
    --sky: linear-gradient(180deg, #2a0b35 0%, #5a1a5e 22%, #a3215f 42%, #e2564f 58%, #f79a4e 70%, #ffd27a 78%);
    --am-seam: linear-gradient(#f2d27a, #b8852c, #f2d27a);
    --ease: cubic-bezier(.22,.61,.12,1);
    color-scheme: light;
}
@keyframes pnBob { 0%, 100% { transform: translate(-50%, 0) rotate(-1.6deg); } 50% { transform: translate(-50%, -8px) rotate(1.4deg); } }
@keyframes pnSail { 0%, 100% { margin-left: -4%; } 50% { margin-left: 4%; } }
@keyframes pnSea1 { from { background-position: 0 0; } to { background-position: -1200px 0; } }
@keyframes pnSea2 { from { background-position: 0 0; } to { background-position: 1200px 0; } }
@keyframes pnGlint { 0%, 100% { opacity: .55; } 50% { opacity: .95; } }
@keyframes pnSun { from { transform: translate(-50%, 40%); } to { transform: translate(-50%, 0); } }
@keyframes pnUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes pnShine { 0%, 65% { background-position: 200% 0; } 100% { background-position: -100% 0; } }
@keyframes pnBird { 0% { transform: translate(-10vw, 0) scale(var(--s)); } 100% { transform: translate(115vw, -4vh) scale(var(--s)); } }
@keyframes pnTick { from { opacity: 0; transform: translateY(-40%); } to { opacity: 1; transform: none; } }

/* ---------- Huruf ---------- */
.t-pinisi { font-family: 'Lora', Georgia, serif; color: var(--ink); background: var(--bg); }
.t-pinisi .page { background: var(--bg); }
.t-pinisi .names { font-family: 'Pinyon Script', cursive; font-weight: 400; font-style: normal; color: var(--ink); line-height: 1.12; }
.t-pinisi .names i { font-family: 'Cinzel', serif; font-style: normal; font-size: .4em; color: var(--gold-1); vertical-align: .35em; }
.t-pinisi .cover .names { font-size: clamp(3rem, 14vw, 4.3rem); }
.t-pinisi .names--lg { font-size: clamp(3.4rem, 16vw, 5rem); }
.t-pinisi .names--xl { font-size: clamp(3.8rem, 5.6vw, 5.6rem); }
.t-pinisi .names--md { font-size: 2.2rem; }
.t-pinisi .kicker { font: 600 .74rem/1 'Cinzel', serif; letter-spacing: .36em; text-transform: uppercase; color: var(--accent); padding-left: .36em; }
.t-pinisi .sec { padding: 4.4rem 1.6rem; }
.t-pinisi .sec__title { font: 600 clamp(1.7rem, 7.5vw, 2.2rem)/1.2 'Cinzel', serif; letter-spacing: .05em; color: var(--ink); }
.t-pinisi .sec__title::before { content: ''; display: block; width: 74px; height: 62px; margin: 0 auto .5rem; background: url(../../img/themes/pinisi/timpa.webp) center / contain no-repeat; }
.t-pinisi .sec__title::after { content: ''; display: block; width: 150px; height: 8px; margin: .8rem auto 0; background: var(--sabbe); border-top: 1px solid var(--gold-1); border-bottom: 1px solid var(--gold-1); }
.t-pinisi .cover__date, .t-pinisi .hero__date, .t-pinisi .aside__date, .t-pinisi .countdown__date { font: 600 .84rem/1.4 'Cinzel', serif; font-style: normal; letter-spacing: .22em; text-transform: uppercase; color: var(--ink); }
.t-pinisi .lead-txt, .t-pinisi .person__parents, .t-pinisi .story { line-height: 1.8; color: var(--muted); }
.t-pinisi .quote { font: italic 400 1.12rem/1.8 'Lora', serif; color: var(--ink); }
.t-pinisi .thanks { font: 400 2.6rem 'Pinyon Script', cursive; color: var(--accent); }
.t-pinisi .amp { font: 400 3rem 'Pinyon Script', cursive; color: var(--accent); }
.t-pinisi .ornament { color: var(--accent); }
.t-pinisi .divider { background: var(--sabbe); height: 5px; width: 80px; border-radius: 3px; }

/* ---------- Tombol ---------- */
.t-pinisi .ibtn { border-radius: 999px; border: 1px solid var(--accent); color: var(--accent); font: 600 .74rem/1 'Cinzel', serif; letter-spacing: .16em; text-transform: uppercase; transition: background .35s, color .35s, transform .25s; }
.t-pinisi .ibtn:hover { background: var(--accent); color: #fff; }
.t-pinisi .ibtn--solid { position: relative; overflow: hidden; background: linear-gradient(135deg, #c41d5a, #8a0f3e); border-color: transparent; color: #fff; box-shadow: 0 14px 30px -14px rgba(179,22,79,.9); }
.t-pinisi .ibtn--solid::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(105deg, transparent 38%, rgba(255,236,190,.45) 50%, transparent 62%) 200% 0 / 250% 100% no-repeat; animation: pnShine 5s ease-in-out infinite 1.4s; }
.t-pinisi .ibtn--solid:hover { background: linear-gradient(135deg, #d4266a, #9c1448); color: #fff; }

/* ==========================================================
   PEMANDANGAN: laut senja Losari & kapal Pinisi
   ========================================================== */
.t-pinisi .pn-host { overflow: hidden; isolation: isolate; }
.t-pinisi .pn-host:not(.cover) { position: relative; }
.t-pinisi .pn-host > :not(.pn-scene):not(.am-open) { position: relative; z-index: 2; }
.t-pinisi .pn-scene { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; background: var(--sky); }
.t-pinisi .pn-sun { position: absolute; left: 50%; bottom: 33%; width: 170px; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, 0);
    background: radial-gradient(circle, #fff3c4 0 30%, #ffd27a 40%, rgba(255,190,110,.45) 52%, rgba(255,150,90,0) 70%); animation: pnSun 3s var(--ease) .2s both; }
.t-pinisi .pn-sea { position: absolute; left: 0; right: 0; bottom: 0; height: 36%; background: url(../../img/themes/pinisi/ombak.webp) 0 0 / 1200px 100% repeat-x; animation: pnSea1 40s linear infinite; }
.t-pinisi .pn-sea::after { content: ''; position: absolute; left: 0; right: 0; top: 99%; height: 40vh; background: #2f1748; }
.t-pinisi .pn-sea--b { height: 22%; opacity: .85; filter: brightness(.8); animation: pnSea2 28s linear infinite; }
.t-pinisi .pn-glint { position: absolute; left: 50%; bottom: 0; width: 90px; height: 34%; transform: translateX(-50%); background: repeating-linear-gradient(180deg, rgba(255,214,150,.75) 0 2px, transparent 2px 9px); -webkit-mask: linear-gradient(180deg, #000, transparent); mask: linear-gradient(180deg, #000, transparent); animation: pnGlint 3s ease-in-out infinite; }
.t-pinisi .pn-ship { position: absolute; left: 50%; bottom: 23%; width: min(72vw, 360px); transform-origin: 50% 90%; animation: pnBob 5.5s ease-in-out infinite, pnSail 26s ease-in-out infinite; filter: drop-shadow(0 10px 14px rgba(30,6,30,.45)); }
.t-pinisi .pn-ship img { display: block; width: 100%; height: auto; }
.t-pinisi .pn-birds { position: absolute; left: 0; top: 18%; width: 100%; height: 18%; }
.t-pinisi .pn-birds svg { position: absolute; left: 0; width: 24px; height: 10px; animation: pnBird var(--d, 30s) linear infinite; animation-delay: var(--delay, 0s); }
.t-pinisi .pn-birds path { fill: none; stroke: #3a0f40; stroke-width: 1.6; stroke-linecap: round; }
.t-pinisi .pn-band { position: absolute; left: 0; right: 0; height: 14px; background: var(--sabbe); box-shadow: 0 1px 0 var(--gold-1), 0 -1px 0 var(--gold-1); z-index: 1; }
.t-pinisi .pn-band--top { top: 0; }

/* ---------- Sampul ---------- */
.t-pinisi .cover, body.t-pinisi .cover.has-photo { background: var(--plum); color: var(--hero-ink); place-items: center; padding: 1.4rem; }
.t-pinisi .cover::before, .t-pinisi .cover::after { display: none; }
.t-pinisi .cover .tm-house, .t-pinisi .cover .lx-tilt { display: none; }
.t-pinisi .cover__inner { position: relative; z-index: 3; gap: .5rem; width: min(350px, calc(100vw - 44px)); padding: 1.6rem 1.2rem 1.6rem; border-radius: 22px;
    background: linear-gradient(180deg, rgba(42,11,53,.78), rgba(58,15,64,.9)); border: 1.5px solid #e0b04a;
    box-shadow: inset 0 0 0 5px rgba(42,11,53,.6), inset 0 0 0 6px rgba(224,176,74,.4), 0 30px 60px -20px rgba(0,0,0,.65); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.t-pinisi .cover .cover__to { background: rgba(255,246,232,.07); }
.t-pinisi .cover .names, .t-pinisi .hero .names, .t-pinisi .aside .names, .t-pinisi .sec--closing .names { color: #fff6e8; text-shadow: 0 4px 24px rgba(42,11,53,.55); }
.t-pinisi .cover .names i, .t-pinisi .hero .names i, .t-pinisi .aside .names i { color: #ffd27a; }
.t-pinisi .cover .kicker, .t-pinisi .hero .kicker, .t-pinisi .aside .kicker { color: #ffd27a; }
.t-pinisi .cover__date, .t-pinisi .hero__date, .t-pinisi .aside__date { color: #fff6e8; text-shadow: 0 1px 10px rgba(42,11,53,.6); }
.t-pinisi .pn-emblem { width: 86px; height: 72px; margin: 0 auto .2rem; background: url(../../img/themes/pinisi/timpa.webp) center / contain no-repeat; filter: drop-shadow(0 4px 10px rgba(42,11,53,.5)); }
.t-pinisi .cover__to { margin: .2rem 0 .5rem; padding: .7rem 1rem; border-radius: 14px; background: rgba(42,11,53,.45); border: 1px solid rgba(224,176,74,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.t-pinisi .cover__to small { color: rgba(255,246,232,.85); }
.t-pinisi .cover__to strong { font: 600 1.3rem 'Cinzel', serif; color: #fff6e8; }
.t-pinisi .cover .pn-emblem { animation: pnUp 1s var(--ease) .3s both; }
.t-pinisi .cover .kicker { animation: pnUp 1s var(--ease) .5s both; }
.t-pinisi .cover .names { animation: pnUp 1.3s var(--ease) .7s both; }
.t-pinisi .cover__date { animation: pnUp 1s var(--ease) .95s both; }
.t-pinisi .cover__to { animation: pnUp 1s var(--ease) 1.1s both; }
.t-pinisi .cover .ibtn { animation: pnUp 1s var(--ease) 1.3s both; }
@media (max-height: 720px) { .t-pinisi .cover { padding-top: 4vh; } .t-pinisi .pn-emblem { width: 64px; height: 54px; } .t-pinisi .cover__inner { gap: .35rem; } }
/* Pembuka: tirai kain lipa' sabbe tersibak */
.t-pinisi .am-panel::before { background: linear-gradient(90deg, rgba(0,0,0,.18), rgba(255,255,255,.08) 20%, rgba(0,0,0,.16) 38%, rgba(255,255,255,.1) 56%, rgba(0,0,0,.2) 76%, rgba(255,255,255,.06) 92%, rgba(0,0,0,.25)), var(--sabbe), #b3164f; }
.t-pinisi .am-panel { transition: transform 1.8s cubic-bezier(.65,.02,.2,1) .2s; box-shadow: inset -12px 0 0 -6px var(--gold-1); }
.t-pinisi .am-panel--b { box-shadow: inset 12px 0 0 -6px var(--gold-1); }
body.am-has-opening.t-pinisi .cover.is-open .cover__inner { opacity: 0; transform: scale(.95); transition: opacity .45s, transform .6s; }
body.am-has-opening.t-pinisi .cover.is-open .cover__inner > * { animation: none; }
.t-pinisi .cover .am-open { z-index: 1; }
.t-pinisi .cover .pn-scene { display: none; }   /* sampul: kain sabbe; laut & Pinisi tampil setelah tirai tersibak */

/* ---------- Bagian pembuka & panel kiri ---------- */
.t-pinisi .hero, .t-pinisi .aside, body.t-pinisi .hero.has-photo, body.t-pinisi .aside.has-photo { min-height: 100svh; background: var(--plum); color: var(--hero-ink); place-items: start center; padding: 12vh 1.5rem 3rem; }
.t-pinisi .hero .tm-house, .t-pinisi .aside .tm-house, .t-pinisi .hero .lx-tilt, .t-pinisi .aside .lx-tilt { display: none; }
.t-pinisi .hero__scroll { position: absolute; left: 50%; bottom: 1.6rem; margin-left: -11px; border-color: rgba(255,246,232,.7); color: #fff6e8; z-index: 3; }
.t-pinisi .pn-portrait { width: min(140px, 36vw); aspect-ratio: 1; margin: 0 auto .4rem; border-radius: 50%; background: var(--cover, var(--tp-hero, none)) center 25% / cover no-repeat;
    box-shadow: 0 0 0 3px #e0b04a, 0 0 0 9px rgba(179,22,79,.55), 0 0 0 10px #e0b04a, 0 20px 40px -14px rgba(42,11,53,.7); }
body.t-pinisi:not(.is-locked) .hero .kicker { animation: pnUp 1.1s var(--ease) .5s both; }
body.t-pinisi:not(.is-locked) .hero .names { animation: pnUp 1.4s var(--ease) .75s both; }
body.t-pinisi:not(.is-locked) .hero__date { animation: pnUp 1.1s var(--ease) 1s both; }
.t-pinisi .hero .countdown div { background: rgba(42,11,53,.45); border-color: rgba(224,176,74,.5); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.t-pinisi .hero .countdown b { color: #ffd27a; }
.t-pinisi .hero .countdown small { color: rgba(255,246,232,.85); }
.t-pinisi .hero .ibtn:not(.ibtn--solid) { color: #fff6e8; border-color: rgba(255,246,232,.7); }

/* ==========================================================
   ISI
   ========================================================== */
.t-pinisi .reveal { opacity: 0; transform: translateY(24px); transition: opacity 1s var(--ease), transform 1.1s var(--ease); }
.t-pinisi .reveal.is-visible { opacity: 1; transform: none; }
/* Bagian ungu: diapit pita kain sabbe */
.t-pinisi .sec--tint, .t-pinisi .sec--countdown { background: radial-gradient(80% 50% at 50% 0%, rgba(179,22,79,.3), transparent 70%), linear-gradient(180deg, var(--plum-2), var(--plum)); color: #fff6e8; padding-block: 5rem; }
.t-pinisi .sec--tint::before, .t-pinisi .sec--countdown::before, .t-pinisi .sec--tint::after, .t-pinisi .sec--countdown::after { content: ''; position: absolute; left: 0; right: 0; height: 14px; background: var(--sabbe); z-index: 1; }
.t-pinisi .sec--tint::before, .t-pinisi .sec--countdown::before { top: 0; box-shadow: 0 1px 0 var(--gold-1); }
.t-pinisi .sec--tint::after, .t-pinisi .sec--countdown::after { bottom: 0; box-shadow: 0 -1px 0 var(--gold-1); }
.t-pinisi .sec--tint .sec__title, .t-pinisi .sec--countdown .sec__title { color: #fff6e8; }
.t-pinisi .sec--tint .lead-txt, .t-pinisi .sec--tint .muted { color: rgba(255,246,232,.8); }
.t-pinisi .sec--countdown .countdown__date { color: #ffd27a; }
.t-pinisi .sec--tint .ibtn:not(.ibtn--solid), .t-pinisi .sec--countdown .ibtn:not(.ibtn--solid) { color: #ffd27a; border-color: rgba(224,176,74,.7); }
.t-pinisi .sec--tint .ibtn:not(.ibtn--solid):hover, .t-pinisi .sec--countdown .ibtn:not(.ibtn--solid):hover { background: #ffd27a; color: var(--plum); }

/* Mempelai */
.t-pinisi .pframe::before { border: 2px solid var(--gold-1); border-radius: 999px 999px 14px 14px; box-shadow: inset 0 0 0 5px var(--bg), inset 0 0 0 9px rgba(179,22,79,.35); }
.t-pinisi .pframe::after { background: var(--accent); box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--gold-1); }
.t-pinisi .pframe__arch { border-radius: 999px 999px 10px 10px; box-shadow: 0 22px 40px -22px rgba(58,15,64,.7); background: var(--sabbe); }
.t-pinisi .pframe__init { font: 400 4.2rem 'Pinyon Script', cursive; color: #fff6e8; text-shadow: 0 2px 10px rgba(42,11,53,.6); }
.t-pinisi .person__soc .psoc { background: var(--plum); color: #ffd27a; }

/* Hitung mundur */
.t-pinisi .countdown div { border-radius: 14px; border: 1px solid rgba(224,176,74,.55); background: rgba(255,246,232,.06); box-shadow: none; }
.t-pinisi .countdown b { display: block; overflow: hidden; font: 600 2.1rem/1.1 'Cinzel', serif; color: #ffd27a; font-variant-numeric: lining-nums tabular-nums; }
.t-pinisi .countdown b.pn-tick { animation: pnTick .6s var(--ease); }
.t-pinisi .countdown small { color: rgba(255,246,232,.8); letter-spacing: .14em; text-transform: uppercase; font-size: .58rem; }

/* Kartu acara: krem dengan tepi kain sabbe */
.t-pinisi .event { position: relative; overflow: hidden; border-radius: 18px; border: 1px solid rgba(224,176,74,.6); background: var(--card); color: var(--ink); padding: 2rem 1.4rem 1.8rem 1.9rem; box-shadow: 0 24px 44px -28px rgba(0,0,0,.6); }
.t-pinisi .event::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; height: auto; background: var(--sabbe); border: 0; border-right: 1px solid var(--gold-1); inset: 0 auto 0 0; }
.t-pinisi .event h3 { font: 400 2.3rem 'Pinyon Script', cursive; color: var(--accent); }
.t-pinisi .event__date { font-family: 'Cinzel', serif; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--plum) !important; }
.t-pinisi .sec--tint .event p, .t-pinisi .sec--tint .event small, .t-pinisi .sec--tint .event span, .t-pinisi .event__addr { color: var(--muted); }
.t-pinisi .sec--tint .event strong, .t-pinisi .event__place { color: var(--ink); }
.t-pinisi .event .ibtn:not(.ibtn--solid) { color: var(--accent); border-color: var(--accent); }
.t-pinisi .event .ibtn:not(.ibtn--solid):hover { background: var(--accent); color: #fff; }

/* Love story, galeri, kartu */
.t-pinisi .lstory::before { background: linear-gradient(var(--line), var(--accent), var(--line)); }
.t-pinisi .lstory__dot { background: var(--accent); box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--gold-1); }
.t-pinisi .lstory__card { border-radius: 16px; border: 1px solid var(--line); background: var(--card); box-shadow: 0 20px 40px -32px rgba(58,15,64,.55); }
.t-pinisi .lstory__title, .t-pinisi .tale__title { font: 600 1.25rem 'Cinzel', serif; color: var(--accent); }
.t-pinisi .lstory__date { color: var(--emerald); letter-spacing: .16em; text-transform: uppercase; font-size: .68rem; font-weight: 600; }
.t-pinisi .gallery__item, .t-pinisi .gslider__slide, .t-pinisi .gslider__slide img { border-radius: 14px; }
.t-pinisi .gallery__item { box-shadow: 0 0 0 1px rgba(224,176,74,.5), 0 14px 26px -18px rgba(58,15,64,.6); }
.t-pinisi .gslider__dots button.is-active { background: var(--accent); }
.t-pinisi .gift, .t-pinisi .rsvp, .t-pinisi .wish, .t-pinisi .qr-card { border-radius: 18px; border: 1px solid var(--line); background: var(--card); color: var(--ink); box-shadow: 0 20px 40px -32px rgba(58,15,64,.55); }
.t-pinisi .sec--tint .qr-card { color: var(--ink); }
.t-pinisi #hadiah .sec__title::before { background-image: url(../../img/themes/pinisi/bosara.webp); width: 78px; height: 78px; }
.t-pinisi .ifld input, .t-pinisi .ifld textarea, .t-pinisi .ifld select { border-radius: 12px; }
.t-pinisi .ifld > span { color: var(--plum); font-weight: 600; }
.t-pinisi .wishes__title { font-family: 'Cinzel', serif; color: var(--ink); }
.t-pinisi .wish__head strong { color: var(--accent); }

/* Penutup: Pinisi berlayar di senja */
.t-pinisi .sec--closing { min-height: 92svh; display: grid; place-content: start center; padding: 12vh 1.6rem 46vh; background: var(--plum); color: #fff6e8; }
.t-pinisi .sec--closing .tm-house, .t-pinisi .sec--closing .lx-tilt { display: none; }
.t-pinisi .sec--closing .lead-txt { color: rgba(255,246,232,.9); text-shadow: 0 1px 8px rgba(42,11,53,.6); }
.t-pinisi .sec--closing .thanks { color: #ffd27a; }
.t-pinisi .ifoot { border-top: 0; background: var(--plum); color: rgba(255,246,232,.75); }
.t-pinisi .ifoot .ifoot__txt, .t-pinisi .ifoot a { color: rgba(255,246,232,.85); }

@media (min-width: 960px) {
    .t-pinisi .sec { padding-inline: 2.4rem; }
    .t-pinisi .aside .pn-ship { width: 420px; }
}

@media (prefers-reduced-motion: reduce) {
    .t-pinisi .pn-ship, .t-pinisi .pn-sea, .t-pinisi .pn-glint, .t-pinisi .pn-sun, .t-pinisi .pn-birds svg, .t-pinisi .ibtn--solid::after, .t-pinisi .countdown b.pn-tick,
    .t-pinisi .cover *, body.t-pinisi .hero * { animation: none !important; }
    .t-pinisi .pn-birds { display: none; }
    .t-pinisi .reveal { opacity: 1; transform: none; transition: none; }
    .t-pinisi .am-panel { transition-duration: .01s; }
}
/* Hitung mundur di bagian pembuka: kapal sedikit lebih kecil agar tidak tertutup */
.t-pinisi .hero:has(.hero__cd) .pn-ship { width: min(50vw, 250px); bottom: 21%; }
.t-pinisi .hero:has(.hero__cd) { padding-top: 7vh; }