/* =========================================================
   FAHRI & MEGA — 3D FLORAL ROMANTIC OVERRIDE
   Visual-only layer: preserves existing layout, content and JS.
========================================================= */
:root{
  --floral-bg:#fff9f7;
  --floral-bg2:#f7e8e7;
  --floral-rose:#b86f78;
  --floral-rose-dark:#7f4651;
  --floral-blush:#e8b8b8;
  --floral-champagne:#c9a46b;
  --floral-cream:#fffdf9;
  --floral-text:#4a3438;
  --floral-muted:#876f73;
  --floral-glass:rgba(255,253,249,.76);
  --floral-shadow:0 25px 70px rgba(103,65,71,.14);
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 12% 8%,rgba(232,184,184,.34),transparent 24%),
    radial-gradient(circle at 88% 18%,rgba(201,164,107,.15),transparent 22%),
    linear-gradient(135deg,#fffdfb 0%,#fff7f5 45%,#f8e9e8 100%) !important;
  color:var(--floral-text)!important;
  overflow-x:hidden;
}
body::before{
  opacity:.5!important;
  z-index:-4!important;
  background-image:
    radial-gradient(circle,rgba(184,111,120,.11) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(201,164,107,.09) 1px,transparent 1.5px)!important;
  background-size:42px 42px,68px 68px!important;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 0% 50%,rgba(184,111,120,.10),transparent 30%),
    radial-gradient(ellipse at 100% 70%,rgba(201,164,107,.10),transparent 28%);
}
.section{
  background:linear-gradient(180deg,rgba(255,253,250,.93),rgba(250,236,235,.94))!important;
  color:var(--floral-text)!important;
}
.section:nth-of-type(even){
  background:linear-gradient(180deg,rgba(255,250,248,.96),rgba(247,230,230,.92))!important;
}
.section::before{
  content:"❀  ✦  ❀"!important;
  color:rgba(184,111,120,.24)!important;
  letter-spacing:12px!important;
}
.opening-section,.hero-section{
  background:
    radial-gradient(circle at 18% 20%,rgba(255,255,255,.95),transparent 30%),
    radial-gradient(circle at 82% 75%,rgba(232,184,184,.32),transparent 34%),
    linear-gradient(135deg,#fffdfa 0%,#f9e8e7 55%,#eed4d4 100%)!important;
  color:var(--floral-text)!important;
}
.opening-section::before,.hero-section::before{
  background-image:
    radial-gradient(circle,rgba(184,111,120,.12) 1px,transparent 1px)!important;
  background-size:32px 32px!important;
  opacity:.45!important;
}
.opening-overlay{
  background:
    linear-gradient(125deg,transparent 0 44%,rgba(201,164,107,.08) 46%,transparent 48%),
    linear-gradient(55deg,transparent 0 48%,rgba(184,111,120,.06) 50%,transparent 52%)!important;
  background-size:90px 90px!important;
}
.bismillah,.arabic,.hero-subtitle{
  color:var(--floral-rose-dark)!important;
  text-shadow:0 3px 18px rgba(184,111,120,.15)!important;
}
.opening-small,.opening-date,.hero-label,.hero-date{
  color:var(--floral-muted)!important;
}
.opening-name,.couple-name{
  color:var(--floral-rose-dark)!important;
  text-shadow:0 8px 32px rgba(103,65,71,.14)!important;
}
.opening-name .amp,.couple-name .amp{
  color:var(--floral-champagne)!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(255,255,255,.88),rgba(255,246,244,.70))!important;
  color:var(--floral-text)!important;
  border:1px solid rgba(184,111,120,.22)!important;
  box-shadow:var(--floral-shadow),inset 0 1px rgba(255,255,255,.95)!important;
  backdrop-filter:blur(18px);
}
.guest-wrapper::before,.hero-guest::before,.couple-card::before,.count-card::before,.event-card::before,.gift-card::before{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid rgba(201,164,107,.20);
  border-radius:inherit;
  pointer-events:none;
}
.guest-wrapper h3,.hero-guest strong,.count-card strong,.event-date,.event-location,.event-time,.rekening-name{
  color:var(--floral-rose-dark)!important;
}
.section-title span,.section-title h2,.gold{
  color:var(--floral-rose-dark)!important;
}
.section-title p,.parent-text,.translation,.text-muted{
  color:var(--floral-muted)!important;
}
.btn-gold,.btn-primary{
  background:linear-gradient(135deg,#a95e69,#cf8a91 55%,#e2b17f)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.6)!important;
  box-shadow:0 13px 32px rgba(127,70,81,.20)!important;
}
.btn-outline-gold{
  color:var(--floral-rose-dark)!important;
  border-color:rgba(184,111,120,.55)!important;
  background:rgba(255,255,255,.42)!important;
}
.btn-gold:hover,.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(127,70,81,.27)!important;
}
.photo-3d{
  filter:drop-shadow(0 25px 35px rgba(103,65,71,.20));
}
.photo-3d::before{
  border:1px solid rgba(201,164,107,.48)!important;
  box-shadow:8px 8px 0 rgba(232,184,184,.20);
}
.photo-3d img{
  box-shadow:0 0 0 5px rgba(255,253,249,.95),0 0 0 7px rgba(201,164,107,.55),0 25px 55px rgba(103,65,71,.22)!important;
}
.gallery-item{
  border:1px solid rgba(201,164,107,.34)!important;
  box-shadow:0 18px 45px rgba(103,65,71,.16)!important;
}
.gallery-item:hover{
  box-shadow:0 28px 65px rgba(103,65,71,.24)!important;
}
.music-button{
  background:linear-gradient(135deg,#a95e69,#7f4651)!important;
  border:2px solid rgba(255,255,255,.75)!important;
  box-shadow:0 0 0 7px rgba(184,111,120,.09),0 16px 42px rgba(103,65,71,.25)!important;
}
.scroll-down{color:var(--floral-rose-dark)!important}
.footer{
  background:linear-gradient(145deg,#6f3c47,#9c5d67)!important;
  color:#fff!important;
}
.footer-bismillah,.footer-brand{color:#fff!important}

/* Elegant 3D floral atmosphere */
.floral-bg{
  position:fixed;
  inset:0;
  z-index:1;
  pointer-events:none;
  overflow:hidden;
}
.floral-orb{
  position:absolute;
  width:170px;
  height:170px;
  opacity:.62;
  transform-style:preserve-3d;
  filter:drop-shadow(0 24px 24px rgba(103,65,71,.16));
  animation:floralFloat 11s ease-in-out infinite;
}
.floral-orb::before{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 50% 16%,rgba(255,255,255,.92) 0 12%,transparent 13%),
    radial-gradient(ellipse at 50% 7%,#e7b0b2 0 20%,transparent 21%),
    radial-gradient(ellipse at 92% 50%,#c9848c 0 20%,transparent 21%),
    radial-gradient(ellipse at 50% 93%,#d99a9f 0 20%,transparent 21%),
    radial-gradient(ellipse at 8% 50%,#b96e78 0 20%,transparent 21%),
    radial-gradient(circle at 50% 50%,#f2d2a2 0 13%,#c89a5d 14% 20%,transparent 21%);
  transform:rotateX(18deg) rotateY(-18deg);
  box-shadow:inset 0 15px 22px rgba(255,255,255,.32),0 18px 28px rgba(103,65,71,.14);
}
.floral-orb::after{
  content:"";
  position:absolute;
  width:38px;
  height:105px;
  left:66px;
  top:105px;
  border-radius:100% 0 100% 0;
  background:linear-gradient(145deg,rgba(116,148,112,.65),rgba(72,104,74,.35));
  transform:rotate(35deg) skewX(-12deg);
  transform-origin:top center;
  filter:blur(.2px);
}
.floral-a{left:-55px;top:8%;transform:scale(1.05) rotate(-12deg)}
.floral-b{right:-58px;top:30%;transform:scale(.82) rotate(15deg);animation-delay:-3s}
.floral-c{left:-72px;bottom:15%;transform:scale(.72) rotate(18deg);animation-delay:-6s}
.floral-d{right:-68px;bottom:5%;transform:scale(1.1) rotate(-18deg);animation-delay:-8s}
.floral-frame{
  position:absolute;
  inset:18px;
  border:1px solid rgba(184,111,120,.15);
  border-radius:34px;
  box-shadow:inset 0 0 0 7px rgba(255,255,255,.25);
}
@keyframes floralFloat{
  0%,100%{transform:translate3d(0,0,0) rotate(-5deg)}
  50%{transform:translate3d(0,-18px,25px) rotate(5deg)}
}
#loadingScreen{
  background:
    radial-gradient(circle at center,rgba(232,184,184,.25),transparent 35%),
    #fffaf8!important;
}
.islamic-loader{
  border-color:var(--floral-rose)!important;
  box-shadow:0 0 0 10px rgba(184,111,120,.07),0 15px 40px rgba(103,65,71,.10);
}
.islamic-loader i{color:var(--floral-champagne)!important}
.loading-content h5{color:var(--floral-rose-dark)!important}
.loading-content p{color:var(--floral-muted)!important}

/* Keep decorative layer behind readable content */
#mainInvitation,.opening-content,.container{position:relative;z-index:3}
@media(max-width:768px){
  .floral-orb{width:120px;height:120px;opacity:.42}
  .floral-frame{inset:9px;border-radius:22px}
}
@media(prefers-reduced-motion:reduce){
  .floral-orb{animation:none}
}