.js .reveal { opacity: 1; transform: none; }
}

/* ======================================================================
   TEMA: SANTRI CERIA
   ====================================================================== */

:root {
  --bg: #fffbeb; --surface: #fff; --text: #134e4a; --heading: #0f766e; --muted: #5b7f7a;
  --accent: #0f766e; --orange: #f97316; --line: rgba(15, 118, 110, .2);
  --font-head: 'Baloo 2', cursive; --font-script: 'Baloo 2', cursive; --font-body: 'Nunito', sans-serif;
  --btn-bg: linear-gradient(135deg, #fb923c, #f97316); --btn-color: #fff; --btn-shadow: 0 8px 0 #c2410c;
  --input-bg: #fff; --radius: 26px; --radius-sm: 16px; --photo-radius: 999px 999px 26px 26px; --toast-bg: #0f766e;
  --stars: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27120%27%20height%3D%27120%27%3E%3Cg%20fill%3D%27%23fde68a%27%3E%3Ccircle%20cx%3D%2710%27%20cy%3D%2714%27%20r%3D%271.4%27/%3E%3Ccircle%20cx%3D%2764%27%20cy%3D%2730%27%20r%3D%271%27/%3E%3Ccircle%20cx%3D%27100%27%20cy%3D%278%27%20r%3D%271.6%27/%3E%3Ccircle%20cx%3D%2734%27%20cy%3D%2770%27%20r%3D%271.1%27/%3E%3Ccircle%20cx%3D%2788%27%20cy%3D%2784%27%20r%3D%271.3%27/%3E%3Ccircle%20cx%3D%2714%27%20cy%3D%27104%27%20r%3D%271%27/%3E%3Ccircle%20cx%3D%27112%27%20cy%3D%2760%27%20r%3D%271%27/%3E%3C/g%3E%3C/svg%3E"); --wave: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%201200%2040%27%20preserveAspectRatio%3D%27none%27%3E%3Cpath%20d%3D%27M0%2020c150%2025%20300-25%20450%200s300%2025%20450%200%20225-20%20300%200v20H0z%27%20fill%3D%27%23fffbeb%27/%3E%3C/svg%3E");
}
body { font-weight: 600; }
h1, h2, h3 { font-weight: 800; }
.btn-main:active { transform: translateY(4px); box-shadow: 0 4px 0 #c2410c; }
.sec-title { color: var(--heading); font-size: clamp(2.3rem, 9vw, 3.2rem); }
.sec-eyebrow, .hero-eyebrow, .cover-label { color: var(--orange); letter-spacing: .2em; font-weight: 800; }
.person-name, .closing-names, .couple-amp { font-weight: 800; color: var(--orange); }
.btn-ghost { color: var(--accent); border-width: 2px; }
.lantern { position: absolute; top: 0; width: 34px; color: var(--orange); pointer-events: none; animation: sway 4s ease-in-out infinite; transform-origin: top center; }
.lantern.l1 { left: 10%; } .lantern.l2 { left: 26%; width: 26px; animation-delay: -1s; color: #fbbf24; }
.lantern.l3 { right: 12%; animation-delay: -2s; } .lantern.l4 { right: 28%; width: 26px; animation-delay: -3s; color: #fbbf24; }
@keyframes sway { 50% { transform: rotate(6deg); } }
.mosque { position: absolute; left: 50%; bottom: 0; width: min(520px, 130%); transform: translateX(-50%); color: rgba(255, 255, 255, .12); pointer-events: none; }
.crescent { display: block; width: 54px; margin: 0 auto 1rem; color: #fde68a; }
.wave-bottom { position: absolute; left: 0; right: 0; bottom: -1px; height: 36px; background: var(--wave) center / 100% 100% no-repeat; pointer-events: none; }

/* Panel malam teal berbintang */
.cover, .hero, .sec-event, .closing { background-color: #0f766e; background-image: var(--stars), linear-gradient(180deg, #115e59, #0f766e); color: #f0fdfa; }
.cover-photo { display: none; }
.cover-figure { width: min(170px, 48vw); aspect-ratio: 3 / 4; border-radius: 999px 999px 24px 24px; border: 5px solid #fde68a; }
.cover-names, .hero-names { color: #fde68a; font-weight: 800; }
.cover-names { font-size: clamp(3.6rem, 18vw, 5rem); }
.cover-label, .hero-eyebrow { color: #fdba74; }
.cover-guest { background: rgba(255, 255, 255, .1); border-radius: 18px; }
.hero-bg { opacity: .2; }
.hero-names { font-size: clamp(4.5rem, 22vw, 7rem); }
.hero .divider, .closing .divider, .sec-event .sec-head .divider { color: #fde68a; }
.scroll-hint { color: #fde68a; }
.card-x { border: 2px solid var(--line); box-shadow: 0 10px 0 rgba(15, 118, 110, .12); }
.event-icon { background: #ccfbf1; border: 0; }
.cd-item { border: 2px solid var(--line); }
.cd-num { color: var(--orange); }
.person-photo { border: 5px solid #fde68a; box-shadow: 0 0 0 3px var(--accent); }
.arabic { color: var(--heading); }
.quote-box { background: #fff; border-radius: 26px; padding: 2rem 1.25rem; border: 2px dashed var(--line); }
.sec-event .sec-title { color: #fde68a; }
.sec-event .sec-eyebrow { color: #fdba74; }
.sec-event .cd-item { background: rgba(255, 255, 255, .1); border-color: rgba(253, 230, 138, .4); }
.sec-event .cd-num { color: #fde68a; }
.sec-event .cd-label { color: #99f6e4; }
.sec-event .card-x { color: var(--text); }
.g-item { border-radius: 22px; border: 4px solid #fff; box-shadow: 0 10px 0 rgba(15, 118, 110, .15); }
.gift-card { border-radius: 24px; }
.gift-bca { --gift-bg: var(--stars), linear-gradient(135deg, #14b8a6, #0f766e 60%, #115e59); --gift-color: #fff; }
.gift-mandiri { --gift-bg: linear-gradient(135deg, #fdba74, #f97316 60%, #ea580c); --gift-color: #fff; }
.closing-title { color: #fde68a; }
.closing-families strong { color: #fff; }
.music-btn { border: 3px solid #fde68a; }