/* =========================================================
   FAHRI & MEGA — ISLAMIC BLUE MOTION THEME
========================================================= */
:root{
  --fm-navy:#061b3a;
  --fm-blue:#0b3b78;
  --fm-royal:#1456a0;
  --fm-sky:#5db9ff;
  --fm-ice:#eaf6ff;
  --fm-gold:#e5c77a;
  --fm-white:#f8fbff;
  --fm-glass:rgba(8,38,76,.72);
}
html{scroll-behavior:smooth}
body{background:linear-gradient(135deg,#03152f 0%,#062a59 48%,#0a437c 100%);color:var(--fm-white);overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background-image:linear-gradient(30deg,rgba(255,255,255,.035) 12%,transparent 12.5%,transparent 87%,rgba(255,255,255,.035) 87.5%,rgba(255,255,255,.035)),linear-gradient(150deg,rgba(255,255,255,.035) 12%,transparent 12.5%,transparent 87%,rgba(255,255,255,.035) 87.5%,rgba(255,255,255,.035));background-size:44px 76px;opacity:.65}
body::after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(circle at 15% 15%,rgba(93,185,255,.18),transparent 25%),radial-gradient(circle at 85% 75%,rgba(229,199,122,.09),transparent 30%)}
.section{position:relative}
.section::before{content:"✦  ۞  ✦";position:absolute;top:18px;left:50%;transform:translateX(-50%);color:rgba(229,199,122,.16);letter-spacing:16px;font-size:18px;pointer-events:none}
.opening-section,.hero-section{background:radial-gradient(circle at 50% 20%,rgba(20,86,160,.35),transparent 38%),linear-gradient(145deg,#03162f,#082e5c 55%,#061b3a)!important}
.opening-section::before,.hero-section::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.12) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent);opacity:.22;animation:fmDrift 18s linear infinite}
.bismillah,.arabic,.hero-subtitle{color:var(--fm-gold)!important;text-shadow:0 0 24px rgba(229,199,122,.2)}
.opening-name,.couple-name{color:#f7fbff!important;text-shadow:0 8px 35px rgba(0,0,0,.3)}
.opening-name .amp,.couple-name .amp{color:var(--fm-gold)!important}
.opening-date,.hero-date{color:#bfe4ff!important}
.guest-wrapper,.hero-guest,.quote-card,.couple-card,.count-card,.event-card,.story-card,.gift-card,.rsvp-card,.wish-card{background:linear-gradient(145deg,rgba(10,47,91,.82),rgba(6,27,58,.72))!important;border-color:rgba(229,199,122,.38)!important;box-shadow:0 22px 70px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.08)!important;backdrop-filter:blur(16px)}
.guest-wrapper,.hero-guest{position:relative;overflow:hidden}
.guest-wrapper::after,.hero-guest::after,.couple-card::after,.count-card::after{content:"";position:absolute;inset:-40%;background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.10) 50%,transparent 58%);transform:translateX(-60%) rotate(8deg);animation:fmShine 7s ease-in-out infinite;pointer-events:none}
.guest-wrapper h3,.hero-guest strong{color:#fff!important}
.section-title span,.section-title h2,.gold{color:var(--fm-gold)!important}
.section-title p,.parent-text,.translation{color:#c9e7ff!important}
.photo-3d{position:relative;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 20px 35px rgba(0,0,0,.28))}
.photo-3d::before{content:"";position:absolute;inset:-10px;border:1px solid rgba(93,185,255,.45);border-radius:inherit;transform:translateZ(-8px) rotate(3deg);pointer-events:none}
.photo-3d img{box-shadow:0 0 0 5px rgba(229,199,122,.55),0 0 0 10px rgba(93,185,255,.12),0 25px 50px rgba(0,0,0,.35)!important}
.count-card strong{color:#fff!important;text-shadow:0 0 25px rgba(93,185,255,.25)}
.btn-gold,.btn-primary{background:linear-gradient(135deg,#c8a85e,#f0d88e)!important;color:#061b3a!important;border:0!important;box-shadow:0 12px 30px rgba(229,199,122,.18)}
.music-button{background:linear-gradient(135deg,#0e5cad,#082e5c)!important;border:1px solid rgba(229,199,122,.65)!important;box-shadow:0 0 0 6px rgba(93,185,255,.08),0 14px 40px rgba(0,0,0,.35)!important}
.music-button.is-playing{animation:fmPulse 1.6s ease-in-out infinite}
.gallery-item{border:1px solid rgba(229,199,122,.25)!important;box-shadow:0 18px 45px rgba(0,0,0,.28);transform:translateZ(0);transition:transform .45s,box-shadow .45s}
.gallery-item:hover{transform:translateY(-8px) scale(1.015)!important;box-shadow:0 28px 65px rgba(0,0,0,.38)}
.scroll-down{color:var(--fm-gold)!important;animation:fmBounce 2s infinite}
.fm-particle{position:fixed;width:5px;height:5px;border-radius:50%;background:rgba(189,228,255,.75);box-shadow:0 0 18px rgba(93,185,255,.65);pointer-events:none;z-index:4;animation:fmFloat linear infinite}
.fm-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#5db9ff,#e5c77a);z-index:10000;box-shadow:0 0 14px rgba(93,185,255,.7)}
.fm-cursor-glow{position:fixed;width:180px;height:180px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(93,185,255,.10),transparent 68%);transform:translate(-50%,-50%);mix-blend-mode:screen}
@keyframes fmFloat{from{transform:translate3d(0,105vh,0) scale(.4);opacity:0}15%{opacity:.8}to{transform:translate3d(30px,-15vh,0) scale(1.2);opacity:0}}
@keyframes fmShine{0%,55%{transform:translateX(-65%) rotate(8deg)}75%,100%{transform:translateX(65%) rotate(8deg)}}
@keyframes fmDrift{from{background-position:0 0}to{background-position:180px 180px}}
@keyframes fmPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes fmBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
@media(max-width:768px){.section::before{letter-spacing:8px}.fm-cursor-glow{display:none}.guest-wrapper{margin-left:8px;margin-right:8px}.opening-name{font-size:clamp(3rem,14vw,5rem)!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.fm-particle,.fm-cursor-glow{display:none!important}}


/* =====================================================
   ISLAMIC FLORAL 3D DECORATIONS
===================================================== */
:root{--fm-blue-deep:#041a3b;--fm-blue:#1677d2;--fm-sky:#74d8ff;--fm-gold:#e9ca72;--fm-flower:#dff6ff}
.section,.opening-section,.hero-section{position:relative;overflow:hidden}
.section:before,.section:after,.hero-section:before,.hero-section:after,.opening-section:before,.opening-section:after{content:"";position:absolute;pointer-events:none;z-index:0;opacity:.65}
.section:before,.hero-section:before{width:170px;height:170px;left:-45px;top:28px;background:radial-gradient(circle at 50% 10%,rgba(116,216,255,.7) 0 7px,transparent 8px),radial-gradient(ellipse at 30% 30%,rgba(233,202,114,.32) 0 18px,transparent 19px),radial-gradient(ellipse at 70% 30%,rgba(116,216,255,.28) 0 20px,transparent 21px),radial-gradient(ellipse at 50% 70%,rgba(233,202,114,.24) 0 24px,transparent 25px);filter:drop-shadow(0 0 12px rgba(116,216,255,.18));transform:rotate(-18deg);animation:fmFlowerFloat 8s ease-in-out infinite}
.section:after,.hero-section:after{width:190px;height:190px;right:-55px;bottom:20px;background:radial-gradient(circle at 50% 10%,rgba(233,202,114,.65) 0 7px,transparent 8px),radial-gradient(ellipse at 30% 30%,rgba(116,216,255,.25) 0 20px,transparent 21px),radial-gradient(ellipse at 70% 30%,rgba(233,202,114,.3) 0 18px,transparent 19px),radial-gradient(ellipse at 50% 70%,rgba(116,216,255,.22) 0 25px,transparent 26px);filter:drop-shadow(0 0 14px rgba(233,202,114,.15));transform:rotate(22deg);animation:fmFlowerFloat2 10s ease-in-out infinite}
.opening-section:before{inset:0;background:radial-gradient(circle at 15% 22%,rgba(116,216,255,.13),transparent 18%),radial-gradient(circle at 86% 76%,rgba(233,202,114,.12),transparent 20%);mix-blend-mode:screen}
.fm-floral{position:absolute;z-index:1;width:92px;height:92px;pointer-events:none;filter:drop-shadow(0 8px 18px rgba(0,0,0,.22));opacity:.8}
.fm-floral:before,.fm-floral:after{content:"";position:absolute;inset:20px;border-radius:50%;background:radial-gradient(circle at 50% 10%,rgba(116,216,255,.75) 0 18%,transparent 20%),radial-gradient(circle at 90% 50%,rgba(233,202,114,.7) 0 18%,transparent 20%),radial-gradient(circle at 50% 90%,rgba(116,216,255,.6) 0 18%,transparent 20%),radial-gradient(circle at 10% 50%,rgba(233,202,114,.55) 0 18%,transparent 20%);transform:rotate(12deg);animation:fmPetalSpin 18s linear infinite}
.fm-floral:after{inset:36px;background:radial-gradient(circle,#f8e7a9 0 32%,#d6ad43 34% 55%,transparent 58%);animation:none}
.fm-floral.tl{top:8%;left:2%}.fm-floral.tr{top:14%;right:3%;transform:scale(.78) rotate(25deg)}.fm-floral.bl{bottom:8%;left:4%;transform:scale(.68) rotate(-20deg)}.fm-floral.br{bottom:5%;right:3%;transform:scale(.88) rotate(15deg)}
.section>.container,.hero-section>.container,.opening-section>.container{position:relative;z-index:2}
@keyframes fmFlowerFloat{0%,100%{translate:0 0 rotate(-18deg)}50%{translate:0 12px rotate(-8deg)}}
@keyframes fmFlowerFloat2{0%,100%{translate:0 0 rotate(22deg)}50%{translate:0 -14px rotate(10deg)}}
@keyframes fmPetalSpin{to{transform:rotate(372deg)}}
@media(max-width:768px){.fm-floral{opacity:.5;transform:scale(.7)}.section:before,.section:after{opacity:.42}}
@media(prefers-reduced-motion:reduce){.fm-floral:before,.section:before,.section:after{animation:none!important}}

/* =========================================================
   BLUE ROMANTIC ISLAMIC BACKGROUND — V2
========================================================= */
body{background:radial-gradient(circle at 50% 8%,rgba(70,150,235,.18),transparent 28%),radial-gradient(circle at 12% 70%,rgba(44,122,206,.16),transparent 28%),radial-gradient(circle at 88% 45%,rgba(233,202,114,.08),transparent 24%),linear-gradient(145deg,#020e25 0%,#06285a 48%,#0b4786 100%)!important}
body::before{background-image:linear-gradient(30deg,rgba(126,203,255,.045) 12%,transparent 12.5%,transparent 87%,rgba(126,203,255,.045) 87.5%),linear-gradient(150deg,rgba(233,202,114,.035) 12%,transparent 12.5%,transparent 87%,rgba(233,202,114,.035) 87.5%),radial-gradient(circle,rgba(255,255,255,.18) 0 1px,transparent 1.5px);background-size:52px 90px,52px 90px,110px 110px;opacity:.7}
body::after{background:radial-gradient(circle at 50% -5%,rgba(126,203,255,.16),transparent 32%),radial-gradient(circle at 50% 100%,rgba(233,202,114,.10),transparent 28%)}
.section:not(.opening-section):not(.hero-section){background:linear-gradient(180deg,rgba(3,20,49,.12),rgba(4,29,65,.34))}
.section:nth-of-type(even)::after{content:'✦';position:absolute;right:5%;bottom:7%;font-size:90px;color:rgba(233,202,114,.055);animation:fmFloatStar 8s ease-in-out infinite;pointer-events:none}
.rekening-card{position:relative;overflow:hidden}.rekening-card:before{content:'۞';position:absolute;right:-10px;bottom:-35px;font-size:120px;color:rgba(116,216,255,.055);transform:rotate(-12deg);pointer-events:none}
@keyframes fmFloatStar{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-14px) rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.section:nth-of-type(even)::after{animation:none}}


/* Username sosial media tamu: teks biasa, tanpa tautan */
.wish-social-text {
    font-size: .82rem;
    font-weight: 500;
    color: inherit;
    opacity: .68;
    white-space: nowrap;
}


/* Balasan pengantin: tersembunyi sampai tombol ditekan */
.wish-reply-toggle-wrap {
    margin-top: 11px;
}
.wish-reply-toggle {
    appearance: none;
    border: 1px solid rgba(229,198,106,.45);
    background: transparent;
    color: #e5c66a;
    border-radius: 999px;
    padding: 5px 11px;
    font-size: .75rem;
    line-height: 1.2;
    cursor: pointer;
    transition: all .2s ease;
}
.wish-reply-toggle:hover,
.wish-reply-toggle:focus-visible {
    background: rgba(229,198,106,.10);
    border-color: rgba(229,198,106,.75);
    outline: none;
}
.wish-reply-public {
    margin-top: 9px;
    padding: 10px 13px;
    border-left: 2px solid #e5c66a;
    border-radius: 9px;
    background: rgba(229,198,106,.055);
}
.wish-reply-public[hidden] {
    display: none !important;
}
.wish-reply-public-label {
    font-size: .74rem;
    font-weight: 700;
    color: #e5c66a;
    margin-bottom: 4px;
}
.wish-reply-public-text {
    color: rgba(255,255,255,.88);
    line-height: 1.5;
    white-space: pre-wrap;
}
.rg-hidden-section{display:none!important}
.rg-hidden-section{display:none!important}
