  .js .reveal { opacity: 1; transform: none; }
}

/* ======================================================================
   TEMA: PASTEL FLORAL & WATERCOLOR
   ====================================================================== */

:root {
  --bg: #fdf2f8; --surface: #fff; --text: #4a3540; --heading: #b4536a; --muted: #8a7480;
  --accent: #fb7185; --accent-2: #86efac; --sage: #4d8a63; --line: rgba(251, 113, 133, .24);
  --font-head: 'Great Vibes', cursive; --font-script: 'Great Vibes', cursive; --font-body: 'Poppins', sans-serif;
  --btn-bg: linear-gradient(135deg, #fda4af, #fb7185); --btn-color: #fff; --btn-shadow: 0 10px 25px -10px rgba(251, 113, 133, .75);
  --input-bg: #fff; --radius: 28px; --radius-sm: 18px; --photo-radius: 50%; --toast-bg: #fb7185;
}
body { font-weight: 300; }
h1, h2, h3 { font-weight: 400; }
.sec-title { font-size: clamp(2.9rem, 11vw, 3.9rem); color: var(--heading); }
.sec-eyebrow, .hero-eyebrow, .cover-label { color: var(--sage); }
.event-card h3, .address-card h3 { font-size: 2.5rem; color: var(--heading); }
.feed-card h3, .cd-num, .stats strong { font-family: 'Poppins', sans-serif; font-weight: 600; }
.cd-num { color: var(--accent); font-size: clamp(1.6rem, 7vw, 2.2rem); }
.stats strong { color: var(--accent); font-size: 1.5rem; }
.person-full { font-weight: 600; }
.btn-ghost { color: var(--accent); }
.btn-ghost:hover { background: #fff1f2; }

/* Cat air (watercolor blobs) */
.wc { position: absolute; z-index: -1; pointer-events: none; border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; filter: blur(26px); opacity: .6; }
.wc-pink  { width: 320px; height: 300px; top: -60px; left: -90px; background: radial-gradient(circle, #fbcfe8, #fda4af 60%, transparent 72%); }
.wc-sage  { width: 280px; height: 260px; bottom: -50px; right: -80px; opacity: .5; background: radial-gradient(circle, #d9f99d, #86efac 55%, transparent 72%); }
.wc-peach { width: 220px; height: 220px; top: 40%; right: -60px; opacity: .5; background: radial-gradient(circle, #fed7aa, #fecaca 60%, transparent 72%); }
.wc-rose2 { width: 240px; height: 240px; bottom: 10%; left: -70px; opacity: .45; background: radial-gradient(circle, #ffe4e6, #fecdd3 60%, transparent 72%); }

/* Buket bunga */
.bouquet { position: absolute; width: min(210px, 46vw); height: auto; pointer-events: none; filter: drop-shadow(0 6px 10px rgba(251, 113, 133, .2)); }
.bouquet-tl { top: -45px; left: -45px; transform: rotate(160deg); }
.bouquet-br { bottom: -45px; right: -45px; }
.bouquet-tr { top: -45px; right: -45px; transform: rotate(250deg); }
.bouquet-bl { bottom: -45px; left: -45px; transform: rotate(70deg); }

/* Kelopak berjatuhan */
.petal { position: absolute; top: -6%; width: 14px; height: 18px; border-radius: 150% 0 150% 0; background: linear-gradient(135deg, #fda4af, #ffe4e6); opacity: .8; animation: fall linear infinite; pointer-events: none; }
.petal:nth-child(1) { left: 8%;  animation-duration: 11s; }
.petal:nth-child(2) { left: 22%; animation-duration: 14s; animation-delay: -4s; }
.petal:nth-child(3) { left: 38%; animation-duration: 12s; animation-delay: -8s; width: 10px; height: 13px; }
.petal:nth-child(4) { left: 52%; animation-duration: 16s; animation-delay: -2s; }
.petal:nth-child(5) { left: 66%; animation-duration: 13s; animation-delay: -6s; width: 11px; height: 14px; }
.petal:nth-child(6) { left: 78%; animation-duration: 15s; animation-delay: -10s; }
.petal:nth-child(7) { left: 90%; animation-duration: 12s; animation-delay: -3s; width: 9px; height: 12px; }
.petal:nth-child(8) { left: 45%; animation-duration: 18s; animation-delay: -12s; }
@keyframes fall { to { transform: translate(70px, 115vh) rotate(560deg); } }
.petals { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }

/* Cover */
.cover { background: linear-gradient(180deg, #fdf2f8, #fff1f2); }
.cover-photo { display: none; }
.cover-figure { width: min(200px, 54vw); aspect-ratio: 1; border-radius: 50%; border: 6px solid #fff; box-shadow: 0 0 0 2px #fecdd3, 0 20px 40px -20px rgba(251, 113, 133, .7); }
.cover-names { color: var(--heading); font-size: clamp(3.4rem, 15vw, 4.6rem); }
.cover-guest { background: rgba(255, 255, 255, .75); border-radius: 20px; box-shadow: 0 12px 30px -20px rgba(251, 113, 133, .6); }

/* Hero */
.hero-overlay { background: linear-gradient(180deg, rgba(253, 242, 248, .65), rgba(253, 242, 248, .88) 60%, #fdf2f8); }
.hero-names { color: var(--heading); font-size: clamp(4rem, 17vw, 6.5rem); }

/* Kartu & foto */
.card-x { background: rgba(255, 255, 255, .88); border: 1px solid #fce7f3; box-shadow: 0 22px 45px -28px rgba(251, 113, 133, .6); backdrop-filter: blur(4px); }
.cd-item { background: #fff; border-color: #fecdd3; border-radius: 20px; }
.event-icon { background: #fff1f2; border-color: #fecdd3; }
.person-photo { width: min(200px, 58vw); aspect-ratio: 1; border: 6px solid #fff; box-shadow: 0 0 0 2px #fecdd3, 0 20px 40px -20px rgba(251, 113, 133, .6); }
.arabic { color: var(--heading); }
.g-item { border-radius: 24px; border: 4px solid #fff; box-shadow: 0 14px 30px -18px rgba(251, 113, 133, .6); }
.video-box { border: 5px solid #fff; box-shadow: 0 20px 40px -22px rgba(251, 113, 133, .7); }

/* Kartu bank pastel */
.gift-card { border-radius: 24px; box-shadow: 0 20px 40px -24px rgba(251, 113, 133, .7); }
.gift-bca { --gift-bg: radial-gradient(circle at 85% 15%, rgba(255, 255, 255, .65), transparent 40%), linear-gradient(135deg, #fecdd3, #fda4af 55%, #fb7185); --gift-color: #4a1d2a; }
.gift-mandiri { --gift-bg: radial-gradient(circle at 85% 15%, rgba(255, 255, 255, .65), transparent 40%), linear-gradient(135deg, #dcfce7, #bbf7d0 50%, #86efac); --gift-color: #1f4d33; }
.gift-bank { font-family: 'Great Vibes', cursive; font-style: normal; font-weight: 400; font-size: 2rem; }

/* Section */
.sec-event { background: linear-gradient(180deg, #fdf2f8, #fff1f2 50%, #fdf2f8); }
.closing { background: linear-gradient(180deg, #fdf2f8, #ffe4e6); }
.closing-title { color: var(--heading); font-size: clamp(3.2rem, 13vw, 4.2rem); }
.closing-names { font-size: 3rem; }
.music-btn::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid #fda4af; animation: ring 2.2s ease-out infinite; }
@keyframes ring { from { transform: scale(.9); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }
/* warna daun (sebelumnya atribut style inline) */
.leaf-green-200 { color: #bbf7d0; }
.leaf-green-300 { color: #86efac; }
.leaf-green-400 { color: #4ade80; }
