/* ═══════════════════════════════════════════════════════════
   SANDI & MAYANG — V2 · Royal Navy × Champagne Gold
   luxury · calm · immersive 3D scroll
   ═══════════════════════════════════════════════════════════ */

:root{
  --ink:      #0d1b36;
  --navy:     #16294e;
  --navy-2:   #1f3a68;
  --steel:    #7f97c4;
  --powder:   #d9e2f2;
  --mist:     #f2f4f8;
  --paper:    #fcfcfd;
  --line:     #ccd6e8;
  --gold:     #c9a962;
  --gold-lt:  #e8d5a4;
  --gold-dk:  #96742f;
  --gold-line:#d8c088;

  --script: "Pinyon Script", cursive;
  --serif:  "Cormorant Garamond", serif;
  --lux:    "Cinzel", serif;
  --caps:   "Marcellus", serif;
  --arab:   "Amiri", serif;

  --ease-lux: cubic-bezier(.19,.74,.22,1);
  --cover-bg: url("https://memulaikembali.com/v2/wp-content/uploads/2024/11/Basic-01-3-1.png");
  --section-bg: url("https://memulaikembali.com/v2/wp-content/uploads/2024/11/Taufiq-Linda-3-1.png");
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family: var(--serif);
  color: var(--ink);
  background: var(--mist);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body::before{
  content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(44rem 44rem at 112% -10%, #e2e9f6 0%, transparent 60%),
    radial-gradient(38rem 38rem at -14% 28%, #e7ecf7 0%, transparent 55%),
    radial-gradient(26rem 26rem at 108% 82%, #efe9da 0%, transparent 52%),
    radial-gradient(rgba(22,41,78,.045) 1px, transparent 1.2px);
  background-size: auto, auto, auto, 28px 28px;
}
body.locked{ overflow:hidden; }
img{ max-width:100%; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
[hidden]{ display:none !important; }

/* ── gold foil ─────────────────────────────────────────── */
.foil, .foil-soft{
  background: linear-gradient(105deg,
    #96742f 0%, #d9bc7a 20%, #f4e7c3 38%, #c9a962 52%, #96742f 68%, #d9bc7a 84%, #f4e7c3 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  animation: foilSweep 7s linear infinite;
}
.foil-soft{ animation-duration: 11s; }
@keyframes foilSweep{ 0%{ background-position: 0% 0; } 100%{ background-position: 220% 0; } }

/* gold scroll progress */
#progress{
  position:fixed; top:0; left:0; right:0; height:3px; z-index:70;
  background: linear-gradient(90deg, #96742f, #e8d5a4, #c9a962);
  transform-origin: 0 50%; transform: scaleX(var(--sp, 0));
  box-shadow: 0 1px 6px rgba(150,116,47,.4);
  pointer-events:none;
}

/* ── shared ───────────────────────────────────────────── */
section{ padding: clamp(72px, 14vw, 128px) 20px; position:relative; overflow:hidden; }
section > *{ position:relative; z-index:1; }

.duo{ text-align:center; line-height:.9; margin-bottom: 10px; font-weight:400; position:relative; }
.duo .script{
  display:block; font-family:var(--script); font-weight:400;
  font-size: clamp(48px, 12.5vw, 78px); color: var(--navy);
  transform: rotate(-3deg);
}
.duo .caps{
  display:block; font-family:var(--lux); font-weight:500;
  font-size: clamp(13px, 3.6vw, 19px); letter-spacing:.52em; text-indent:.52em;
  color: var(--ink); margin-top: 6px; text-transform: uppercase;
}
.duo-div{ display:block; width:170px; margin:0 auto clamp(30px, 6vw, 48px); color:var(--gold); }
.duo-with-bf{
  width:min(430px, 100%);
  margin-left:auto;
  margin-right:auto;
}
.duo-butterfly{
  position:absolute;
  z-index:2;
  width:clamp(36px, 9.6vw, 54px);
  height:auto;
  pointer-events:none;
  object-fit:contain;
  filter: drop-shadow(0 8px 12px rgba(13,27,54,.13));
  transform:translate3d(0,0,0) rotate(var(--bf-rot, 10deg));
  animation: duoButterflyFloat var(--bf-dur, 12s) ease-in-out infinite;
}
.duo-bf-story .duo-butterfly{
  top:clamp(-10px, -1vw, -2px);
  left:calc(50% + clamp(102px, 29vw, 142px));
  --bf-rot:12deg;
  --bf-dur:13.5s;
  --bf-travel:clamp(190px, 54vw, 260px);
  --bf-y1:-13px;
  --bf-y2:7px;
  --bf-y3:12px;
}
.duo-bf-gift .duo-butterfly{
  top:clamp(-2px, 1vw, 8px);
  left:calc(50% + clamp(78px, 23vw, 118px));
  width:clamp(34px, 9vw, 50px);
  --bf-rot:9deg;
  --bf-dur:12.2s;
  --bf-travel:clamp(150px, 43vw, 215px);
  --bf-y1:-11px;
  --bf-y2:6px;
  --bf-y3:10px;
}
@keyframes duoButterflyFloat{
  0%,8%{
    transform:translate3d(0,0,0) rotate(var(--bf-rot, 10deg));
  }
  24%{
    transform:translate3d(calc(var(--bf-travel, 190px) * -.42), var(--bf-y1, -12px), 0) rotate(calc(var(--bf-rot, 10deg) + 5deg));
  }
  48%,58%{
    transform:translate3d(calc(var(--bf-travel, 190px) * -1), var(--bf-y2, 7px), 0) rotate(calc(var(--bf-rot, 10deg) - 4deg));
  }
  76%{
    transform:translate3d(calc(var(--bf-travel, 190px) * -.52), var(--bf-y3, 11px), 0) rotate(calc(var(--bf-rot, 10deg) + 2deg));
  }
  92%,100%{
    transform:translate3d(0,0,0) rotate(var(--bf-rot, 10deg));
  }
}
@media (max-width: 380px){
  .duo-bf-story .duo-butterfly{ left:calc(50% + 108px); }
  .duo-bf-gift .duo-butterfly{ left:calc(50% + 86px); }
}

.reveal{ opacity:0; transition: opacity 1.15s ease, transform 1.15s var(--ease-lux); }
.reveal:not([data-p3d]){ transform: translateY(34px); }
.reveal.in{ opacity:1; }
.reveal.in:not([data-p3d]){ transform:none; }
.d1{ transition-delay:.12s; } .d2{ transition-delay:.24s; } .d3{ transition-delay:.38s; }
.d4{ transition-delay:.52s; } .d5{ transition-delay:.68s; }

/* 3D scroll engine targets */
[data-p3d]{
  transform:
    perspective(1200px)
    rotateX(calc(var(--p, 0) * var(--rx, 0deg)))
    translateY(calc(var(--p, 0) * var(--ty, 0px)))
    scale(calc(1 - var(--pa, 0) * var(--sc, 0)));
  will-change: transform;
}
[data-depth]{ will-change: transform; }

/* corner filigrees */
.fili{ position:absolute; width: clamp(44px, 12vw, 60px); height: clamp(44px, 12vw, 60px); color: var(--gold); z-index:2; pointer-events:none; opacity:.9; }
.fili.tl{ top:14px; left:14px; }
.fili.tr{ top:14px; right:14px; transform: scaleX(-1); }
.fili.bl{ bottom:14px; left:14px; transform: scaleY(-1); }
.fili.br{ bottom:14px; right:14px; transform: scale(-1); }

/* sparkles */
.sparkle-host{ position:absolute; inset:-14px; pointer-events:none; z-index:3; }
.sp{
  position:absolute; display:block;
  width:var(--sz,8px); height:var(--sz,8px);
  background: radial-gradient(circle at 50% 40%, #fdf6dd, #e8d5a4 55%, #c9a962);
  clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
  opacity:0; animation: twinkle var(--dur,3s) ease-in-out var(--del,0s) infinite;
  filter: drop-shadow(0 0 3px rgba(232,213,164,.8));
}
@keyframes twinkle{
  0%,100%{ opacity:0; transform: scale(.2) rotate(0deg); }
  50%    { opacity:.95; transform: scale(1) rotate(90deg); }
}

/* butterflies */
.bf{ position:absolute; width:56px; height:46px; object-fit:contain; z-index:0; pointer-events:none;
     animation: bfloat 8s ease-in-out infinite; opacity:.9; }
@keyframes bfloat{
  0%,100%{ transform: translate(0,0) rotate(-8deg); }
  50%    { transform: translate(7px,-16px) rotate(7deg); }
}

/* ═══════════════ COVER ═══════════════ */
#cover{
  position:fixed; inset:0; z-index:60; overflow:hidden;
  background:
    linear-gradient(rgba(242,244,248,.2), rgba(242,244,248,.72)),
    var(--cover-bg) center/cover no-repeat,
    var(--mist);
  transition: opacity .95s ease, visibility 0s linear 1s;
  perspective: 1200px;
}
#cover::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(32rem 26rem at 84% 6%, rgba(227,234,247,.68) 0%, transparent 60%),
    radial-gradient(24rem 24rem at 6% 90%, rgba(239,233,218,.72) 0%, transparent 55%),
    radial-gradient(rgba(22,41,78,.045) 1px, transparent 1.2px);
  background-size:auto,auto,28px 28px;
  transition:opacity .7s ease;
}
.cover-veil{
  position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.5) 50%, transparent 70%);
  background-size: 260% 100%;
  animation: veil 9s ease-in-out infinite;
  mix-blend-mode: soft-light;
  transition:opacity .7s ease;
}
@keyframes veil{ 0%,100%{ background-position: 120% 0; } 50%{ background-position: -20% 0; } }
#cover.curtain-open{
  background:transparent;
}
#cover.curtain-open::before,
#cover.curtain-open .cover-veil{
  opacity:0;
}
#cover.away{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.cover-inner{
  position:relative; z-index:4; height:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap: clamp(8px, 2.2vh, 18px);
  padding: 32px 22px; text-align:center;
  transform-style: preserve-3d;
  transform: rotateY(calc(var(--mx,0) * 4deg)) rotateX(calc(var(--my,0) * -4deg));
  transition: opacity .82s ease, filter .82s ease, transform .9s var(--ease-lux);
}
#cover.curtain-stage .cover-inner,
#cover.curtain-open .cover-inner{
  opacity:0;
  filter:blur(1.4px);
  transform:translateY(-12px) scale(.988);
}
#cover .bf-cover-bottom{ bottom:12%; left:12%; width:42px; animation-delay:1.1s; }

.cover-curtain{
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
  opacity:0;
  transition:opacity .7s ease;
  overflow:hidden;
}
#cover.curtain-stage .cover-curtain,
#cover.curtain-open .cover-curtain{ opacity:1; }
.cover-curtain::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  background:
    radial-gradient(42rem 26rem at 50% 46%, rgba(244,231,195,.26), transparent 62%),
    linear-gradient(90deg, rgba(5,13,28,.28), transparent 19%, transparent 81%, rgba(5,13,28,.28));
  opacity:0;
  transition:opacity 1.8s ease .45s;
}
#cover.curtain-open .cover-curtain::before{ opacity:1; }
.cover-curtain-panel{
  position:absolute;
  top:0;
  bottom:0;
  width:50.5%;
  background-image:
    linear-gradient(90deg, rgba(4,12,30,.2), transparent 18%, rgba(255,255,255,.035) 48%, rgba(4,12,30,.22)),
    url("assets/img/curtain-navy-floral.png");
  background-size:200% 100%, 200% 100%;
  background-repeat:no-repeat;
  will-change:transform;
  transform:translate3d(0,0,0);
  transition:transform 5.15s cubic-bezier(.16,.78,.14,1) .85s, filter 5.15s ease .85s;
  filter:drop-shadow(0 0 0 rgba(0,0,0,0));
  backface-visibility:hidden;
}
.cover-curtain-left{
  left:0;
  background-position:left center;
}
.cover-curtain-right{
  right:0;
  background-position:right center;
}
#cover.curtain-open .cover-curtain-left{
  transform:translate3d(-101%,0,0);
  filter:drop-shadow(18px 0 24px rgba(5,12,28,.2));
}
#cover.curtain-open .cover-curtain-right{
  transform:translate3d(101%,0,0);
  filter:drop-shadow(-18px 0 24px rgba(5,12,28,.2));
}
.cover-curtain-sparkles{
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
}
.cover-curtain-sparkles span{
  position:absolute;
  width:8px;
  height:8px;
  background:radial-gradient(circle, #fff8dd, #e8d5a4 58%, transparent 70%);
  clip-path:polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
  opacity:0;
  filter:drop-shadow(0 0 7px rgba(232,213,164,.72));
}
#cover.curtain-open .cover-curtain-sparkles span{
  animation:coverCurtainBlink 4.6s ease-in-out both;
}
.cover-curtain-sparkles span:nth-child(1){ left:14%; top:22%; animation-delay:.46s; }
.cover-curtain-sparkles span:nth-child(2){ left:82%; top:18%; width:10px; height:10px; animation-delay:.72s; }
.cover-curtain-sparkles span:nth-child(3){ left:27%; top:63%; animation-delay:.98s; }
.cover-curtain-sparkles span:nth-child(4){ left:68%; top:66%; width:9px; height:9px; animation-delay:1.24s; }
.cover-curtain-sparkles span:nth-child(5){ left:48%; top:24%; animation-delay:1.5s; }
.cover-curtain-sparkles span:nth-child(6){ left:90%; top:48%; width:11px; height:11px; animation-delay:1.76s; }
.cover-curtain-sparkles span:nth-child(7){ left:10%; top:53%; animation-delay:2.02s; }
.cover-curtain-sparkles span:nth-child(8){ left:38%; top:42%; width:9px; height:9px; animation-delay:2.28s; }
.cover-curtain-sparkles span:nth-child(9){ left:58%; top:34%; animation-delay:2.54s; }
.cover-curtain-sparkles span:nth-child(10){ left:80%; top:81%; animation-delay:2.8s; }
.cover-curtain-sparkles span:nth-child(11){ left:18%; top:84%; width:10px; height:10px; animation-delay:3.06s; }
.cover-curtain-sparkles span:nth-child(12){ left:52%; top:76%; animation-delay:3.32s; }
.cover-curtain-butterfly{
  position:absolute;
  z-index:5;
  left:-78px;
  top:47%;
  width:clamp(54px, 15vw, 76px);
  height:auto;
  opacity:0;
  object-fit:contain;
  filter:drop-shadow(0 16px 18px rgba(8,16,36,.3));
  will-change:transform, opacity;
  backface-visibility:hidden;
}
#cover.curtain-open .cover-curtain-butterfly{
  animation:coverButterflyPass 7.4s cubic-bezier(.2,.72,.18,1) 2s both;
}
@keyframes coverCurtainBlink{
  0%,100%{ opacity:0; transform:scale(.2) rotate(0deg); }
  16%,34%,58%,78%{ opacity:.98; transform:scale(1) rotate(90deg); }
  46%,68%{ opacity:.2; transform:scale(.48) rotate(135deg); }
}
@keyframes coverButterflyPass{
  0%{ opacity:0; transform:translate3d(0, 16px, 0) rotate(-12deg) scale(.92); }
  9%{ opacity:1; }
  32%{ transform:translate3d(calc(32vw - 10px), -28px, 0) rotate(9deg) scale(1.04); }
  58%{ opacity:1; transform:translate3d(calc(62vw + 8px), 13px, 0) rotate(-5deg) scale(1); }
  82%{ opacity:1; transform:translate3d(calc(88vw + 24px), -12px, 0) rotate(7deg) scale(.98); }
  100%{ opacity:0; transform:translate3d(calc(100vw + 130px), -8px, 0) rotate(10deg) scale(.96); }
}

.kicker{
  font-family:var(--lux); font-size: clamp(10px, 2.8vw, 12px); letter-spacing:.52em; text-indent:.52em;
  text-transform:uppercase; color:var(--gold-dk);
}
.youre{ line-height:.95; font-weight:400; display:flex; flex-direction:column; align-items:center; gap:0; }
.youre .script{
  display:block; font-family:var(--script); font-size: clamp(52px, 14vw, 84px);
  color: var(--navy); transform: rotate(-3deg); line-height:1;
}
.youre .amp{ font-family:var(--script); font-size: clamp(26px, 7vw, 40px); line-height:1; margin:2px 0; }
.cover-date{
  display:flex; align-items:center; gap:14px;
  font-family:var(--lux); font-size: clamp(12px, 3.4vw, 15px); letter-spacing:.34em; text-indent:.1em;
  color:var(--ink);
}
.cover-date .rule{ width: clamp(28px, 8vw, 48px); height:1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.cover-date .rule:last-child{ background: linear-gradient(90deg, var(--gold), transparent); }

/* envelope stage */
.env-stage{ position:relative; margin: 1.6vh 0; transform-style:preserve-3d; }
.env-cluster{ position:absolute; z-index:5; pointer-events:none; }
.env-cluster .fl{ position:absolute; }
.cl-left{ left:-44px; bottom:-38px; width:150px; height:150px; transform: translateZ(40px); }
.cl-left .sprig-1{ width:64px; height:170px; left:-4px; bottom:-6px; transform: rotate(-24deg); }
.cl-left .lily-1 { width:104px; height:104px; left:10px; bottom:-14px; transform: rotate(-10deg); }
.cl-left .bloom-1{ width:78px; height:78px; left:64px; bottom:-24px; transform: rotate(14deg); }
.cl-right{ right:-46px; top:-30px; width:150px; height:190px; transform: translateZ(30px); }
.cl-right .sprig-2{ width:60px; height:160px; right:2px; top:-38px; transform: rotate(18deg); }
.cl-right .bloom-2{ width:86px; height:86px; right:-6px; top:36px; }
.cl-right .lily-2 { width:96px; height:96px; right:20px; top:86px; transform: rotate(9deg); }

.env{
  position:relative; display:block;
  width:min(330px, 76vw); aspect-ratio:3/2;
  perspective:1100px; -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transition:none;
  animation: envBob 5.2s ease-in-out infinite;
}
.env:hover,
.env:active,
.env:focus-visible{
  transform:none;
}
#cover.curtain-stage .env,
#cover.curtain-open .env,
#cover.curtain-stage .env-shadow,
#cover.curtain-open .env-shadow{
  animation:none;
  transform:none;
}
#cover.curtain-stage .env,
#cover.curtain-open .env{
  translate:0 0;
}
#cover.curtain-stage .env-shadow,
#cover.curtain-open .env-shadow{
  opacity:.75;
}
@keyframes envBob{ 0%,100%{ translate:0 0; } 50%{ translate:0 -8px; } }
.env-shadow{
  position:absolute; left:8%; right:8%; bottom:-9%; height:12%;
  background: radial-gradient(50% 100% at 50% 50%, rgba(13,27,54,.35), transparent 70%);
  animation: shBob 5.2s ease-in-out infinite;
}
@keyframes shBob{ 0%,100%{ transform:scaleX(1); opacity:1;} 50%{ transform:scaleX(.88); opacity:.65;} }
.env-body{ position:absolute; inset:0; transform-style:preserve-3d; }
.env-back{
  position:absolute; inset:0; border-radius:14px;
  background:
    radial-gradient(120% 90% at 30% 10%, rgba(255,255,255,.14), transparent 45%),
    linear-gradient(150deg, #22406e, #0d1b36);
  box-shadow:
    0 30px 60px -20px rgba(13,27,54,.6),
    inset 0 0 0 1.5px rgba(201,169,98,.5);
}
.env-letter{
  position:absolute; left:5%; right:5%; top:7%; bottom:12%;
  background: linear-gradient(175deg, #ffffff, #f2f0e6);
  border-radius:8px; z-index:2;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  transform: translateY(5%);
  transition: transform 1.1s var(--ease-lux) .55s;
  box-shadow: 0 4px 16px rgba(13,27,54,.2), inset 0 0 0 1px rgba(201,169,98,.35);
}
.letter-mono{ font-family:var(--lux); font-weight:600; font-size:30px; letter-spacing:.14em; text-indent:.14em; }
.letter-line{ font-family:var(--caps); font-size:9px; letter-spacing:.4em; text-indent:.4em; color:var(--steel); text-transform:uppercase; }
.env-front{ position:absolute; inset:0; border-radius:14px; overflow:hidden; z-index:3; pointer-events:none; }
.env-front::before{
  content:""; position:absolute; inset:0;
  clip-path: polygon(0 0, 50% 58%, 100% 0, 100% 100%, 0 100%);
  background:
    radial-gradient(120% 100% at 70% 100%, rgba(255,255,255,.07), transparent 50%),
    linear-gradient(165deg, #2b4a7e 0%, #17294d 46%, #0c1830 100%);
}
.env-front::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(to bottom right, transparent 49.35%, rgba(232,213,164,.35) 49.7%, transparent 50.25%),
    linear-gradient(to bottom left,  transparent 49.35%, rgba(232,213,164,.22) 49.7%, transparent 50.25%);
}
.env-flap{
  position:absolute; inset:0; z-index:4;
  transform-origin: 50% 0%; transform-style:preserve-3d;
  transition: transform .95s cubic-bezier(.55,.06,.28,1) .05s, z-index 0s .5s;
}
.flap-face{
  position:absolute; inset:0;
  clip-path: polygon(0 0, 100% 0, 50% 60%);
  backface-visibility:hidden; -webkit-backface-visibility:hidden;
}
.flap-outer{
  background:
    radial-gradient(100% 80% at 50% 0%, rgba(255,255,255,.1), transparent 55%),
    linear-gradient(180deg, #33538a 0%, #1c3560 58%, #142a4e 100%);
  border-radius:14px 14px 0 0;
  filter: drop-shadow(0 3px 4px rgba(8,16,32,.3));
}
.flap-outer::after{
  content:""; position:absolute; inset:0;
  clip-path: polygon(0 0, 100% 0, 50% 60%);
  background:
    linear-gradient(to bottom right, transparent 49%, rgba(232,213,164,.5) 49.6%, transparent 50.4%) ,
    linear-gradient(to bottom left, transparent 49%, rgba(232,213,164,.5) 49.6%, transparent 50.4%);
}
.flap-liner{ transform: rotateX(180deg); background:#faf8f1; border-radius:0 0 14px 14px; }
.flap-liner svg{ display:block; width:100%; height:100%; }
.env-seal{
  position:absolute; width:27%; left:36.5%; top:42%; z-index:6;
  filter: drop-shadow(0 5px 10px rgba(76,58,20,.5));
  transition: transform .5s ease, opacity .4s ease;
}

.guest{ display:flex; flex-direction:column; gap:6px; margin-top:1vh; }
.guest span{ font-family:var(--caps); font-size:11px; letter-spacing:.3em; text-indent:.3em; text-transform:uppercase; color:var(--steel); }
.guest strong{ font-family:var(--serif); font-weight:600; font-size: clamp(21px, 5.6vw, 27px); color:var(--ink); font-style:italic; }
.hint{ font-family:var(--serif); font-style:italic; font-size:16px; color:var(--gold-dk); animation: pulseHint 2.6s ease-in-out infinite; }
@keyframes pulseHint{ 0%,100%{opacity:.5;} 50%{opacity:1;} }

.rise{ opacity:0; transform: translateY(26px); animation: riseIn 1.15s var(--ease-lux) forwards; }
.r1{ animation-delay:.15s; } .r2{ animation-delay:.35s; } .r3{ animation-delay:.62s; }
.r4{ animation-delay:.9s; } .r5{ animation-delay:1.1s; }
@keyframes riseIn{ to{ opacity:1; transform:none; } }

/* ═══════════════ HERO ═══════════════ */
.hero{
  padding-top: 0; display:flex; flex-direction:column; align-items:center;
  background: transparent;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0 -22px 0;
  z-index:0;
  opacity:.46;
  background:
    linear-gradient(180deg, rgba(242,244,248,0), rgba(242,244,248,.04) 58%, rgba(242,244,248,.05)),
    var(--section-bg) center center / 100% 100% no-repeat;
}
.hero-glow{
  position:absolute; inset:-10% -20% auto; height:70%;
  background:
    radial-gradient(40rem 26rem at 50% 0%, #dfe7f4 0%, transparent 65%),
    radial-gradient(18rem 18rem at 16% 30%, #efe9da 0%, transparent 60%);
  z-index:0;
  opacity:.36;
}
.bf-h1{ top:112px; right:7%; width:46px; z-index:2; }

.hero-env{ position:relative; width:min(440px, 100%); z-index:1; margin-bottom:2px; }
.flap-open{ display:block; width:100%; filter: drop-shadow(0 16px 26px rgba(13,27,54,.22)); }
.hero-seal{
  position:absolute; width: clamp(46px, 12%, 58px); left:50%; top:57%;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 6px 10px rgba(76,58,20,.45));
}

.section-separator{
  position:relative;
  z-index:1;
  width:100%;
  overflow:hidden;
  padding:0 0 clamp(6px, 2vw, 12px);
  margin: clamp(-22px, -4vw, -12px) 0 clamp(-10px, -2vw, -4px);
  text-align:center;
  pointer-events:none;
}
.section-separator img{
  display:block;
  width:min(275px, 64vw);
  max-width:none;
  margin:0 auto;
  opacity:.8;
  filter: drop-shadow(0 8px 12px rgba(13,27,54,.06));
  animation: flowerDividerFloat 5.8s ease-in-out infinite;
}
.sep-before-story img{ animation-delay:-1.3s; }
.sep-before-gallery img{ animation-delay:-2.4s; }
.sep-before-rsvp img{ animation-delay:-3.2s; }
@keyframes flowerDividerFloat{
  0%,100%{ transform:translate3d(0,-3px,0) rotate(-.3deg); }
  50%{ transform:translate3d(0,7px,0) rotate(.35deg); }
}
.sep-before-story{
  padding-top: clamp(4px, 1.6vw, 10px);
  margin-top: clamp(-10px, -2vw, -4px);
}
.sep-before-gallery{
  padding-top: clamp(2px, 1.2vw, 8px);
  margin-top: clamp(-18px, -3vw, -8px);
}
.sep-before-rsvp{
  margin-top: clamp(-18px, -3vw, -8px);
}
.hero-cluster{ position:absolute; pointer-events:none; }
.hero-cluster .fl{ position:absolute; }
.hc-left{ left:-14px; top:-6px; }
.hc-left .fl{ width:92px; height:92px; left:-26px; top:-18px; transform:rotate(-14deg); }
.hc-left .f2{ width:64px; height:64px; left:34px; top:-34px; transform:rotate(10deg); }
.hc-left .f3{ width:52px; height:130px; left:-40px; top:30px; transform:rotate(-30deg); }
.hc-right{ right:-10px; top:-10px; }
.hc-right .fl{ width:80px; height:80px; right:-20px; top:-24px; transform:rotate(12deg); }
.hc-right .f2{ width:88px; height:88px; right:30px; top:-32px; transform:rotate(-8deg); }
.hc-right .f3{ width:50px; height:126px; right:-34px; top:26px; transform:rotate(26deg); }

.arch{
  position:relative; margin-top:-30px; z-index:2;
  width:min(320px, 100%);
  background:
    radial-gradient(140% 60% at 50% 0%, #fffef9 0%, transparent 55%),
    linear-gradient(178deg, #fdfdfc, #f4f5f8);
  border:1.5px solid var(--gold);
  border-radius: 999px 999px 18px 18px;
  padding: clamp(54px, 14vw, 74px) 26px 56px;
  text-align:center;
  box-shadow:
    0 30px 60px -24px rgba(13,27,54,.4),
    inset 0 0 0 1px rgba(255,255,255,.8);
}
.arch::before{
  content:""; position:absolute; inset:9px;
  border:1px solid var(--line); border-radius: 999px 999px 12px 12px;
  pointer-events:none;
}
.arch .fili.tl{ top:30px; left:22px; width:38px; height:38px; }
.arch .fili.tr{ top:30px; right:22px; width:38px; height:38px; }
.arch-kicker{ font-family:var(--lux); font-size:11px; letter-spacing:.4em; text-indent:.4em; text-transform:uppercase; color:var(--gold-dk); margin-bottom:12px; }
.arch-photo{
  position:relative;
  width:min(196px, 60vw);
  aspect-ratio:4/5;
  margin:0 auto 16px;
  padding:8px;
  border:1px solid rgba(201,169,98,.82);
  border-radius:999px 999px 24px 24px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(244,231,195,.3)),
    linear-gradient(145deg, rgba(201,169,98,.32), rgba(143,165,205,.18));
  box-shadow:
    0 18px 34px -24px rgba(13,27,54,.72),
    inset 0 0 0 1px rgba(255,255,255,.72);
  overflow:hidden;
}
.arch-photo::before{
  content:"";
  position:absolute;
  inset:11px;
  z-index:2;
  border:1px solid rgba(244,231,195,.72);
  border-radius:999px 999px 18px 18px;
  pointer-events:none;
}
.arch-photo::after{
  content:"";
  position:absolute;
  inset:7px;
  z-index:1;
  border-radius:999px 999px 20px 20px;
  background:
    linear-gradient(180deg, rgba(13,27,54,.02), transparent 54%, rgba(13,27,54,.18)),
    radial-gradient(80% 35% at 50% 0%, rgba(255,255,255,.32), transparent 72%);
  pointer-events:none;
}
.arch-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 35%;
  border-radius:999px 999px 20px 20px;
  filter:saturate(1.03) contrast(1.02);
}
.arch-name{ font-family:var(--script); font-weight:400; font-size: clamp(44px, 12vw, 58px); color:var(--navy); line-height:1.05; }
.arch-amp{ font-family:var(--script); font-size:30px; line-height:1.3; }
.arch-div{ width:150px; margin:12px auto 10px; display:block; color:var(--gold); }
.arch-date{ font-family:var(--lux); font-size:11.5px; letter-spacing:.24em; text-indent:.24em; color:var(--ink); text-transform:uppercase; }

.badge{ position:absolute; }
.badge svg{ display:block; width:100%; filter: drop-shadow(0 12px 20px rgba(13,27,54,.4)); }
.badge-txt{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; color:#fff; line-height:1; gap:2px;
}
.badge-date{ width: clamp(134px, 36vw, 162px); left: clamp(-62px, -11vw, -38px); top:31%; animation: envBob 6s ease-in-out infinite; }
.badge-date em{ font-family:var(--serif); font-style:italic; font-weight:600; font-size: clamp(45px, 11vw, 58px); color:#f3ead1; }
.badge-date span{ font-family:var(--caps); font-size: clamp(13px, 3.6vw, 16px); letter-spacing:.08em; text-transform:none; color:var(--gold-lt); }
.badge-mono{ width: clamp(148px, 42vw, 170px); right: clamp(-36px, -6vw, -22px); bottom:-54px; animation: envBob 6.8s ease-in-out infinite reverse; }
.badge-txt.mono{ align-items:center; justify-content:center; }
.mono-mark{
  display:block;
  width:100%;
  text-align:center;
  font-family:var(--lux);
  font-weight:500;
  font-size:clamp(30px, 8vw, 38px);
  letter-spacing:.04em;
  line-height:1;
}

.vinyl{ margin-top:78px; display:flex; flex-direction:column; align-items:center; gap:13px; }
.vinyl-disc{
  width:92px; height:92px; border-radius:50%; display:block; position:relative;
  background:
    radial-gradient(circle, #16294e 0 16%, #e8d5a4 16.5% 18.5%, transparent 19%),
    repeating-radial-gradient(circle, #131313 0 1.6px, #262626 1.6px 3.4px);
  box-shadow:
    0 14px 30px -8px rgba(9,17,33,.6),
    0 0 0 2px #c9a962,
    0 0 0 3.5px rgba(201,169,98,.25),
    inset 0 0 8px rgba(255,255,255,.12);
}
.vinyl-disc::after{
  content:"S·M"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--lux); font-size:11px; letter-spacing:.08em; color:#f3ead1;
}
body.playing .vinyl-disc{ animation: spin 3.6s linear infinite; }
@keyframes spin{ to{ transform: rotate(360deg); } }
.vinyl-cap{ font-family:var(--lux); font-size:10px; letter-spacing:.3em; text-indent:.3em; text-transform:uppercase; color:var(--gold-dk); }

.scroll-cue{ margin-top:48px; width:24px; height:40px; border:1.5px solid var(--gold); border-radius:14px; display:flex; justify-content:center; }
.scroll-cue span{ width:3px; height:9px; border-radius:3px; background:var(--gold); margin-top:7px; animation: cue 2s ease-in-out infinite; }
@keyframes cue{ 0%,100%{ transform:translateY(0); opacity:1;} 60%{ transform:translateY(12px); opacity:.2;} }

/* ═══════════════ COUNTING ═══════════════ */
.counting{ text-align:center; }
.counting::before{
  content:"Counting"; position:absolute; top:10px; left:50%; transform:translateX(-50%) rotate(-6deg);
  font-family:var(--script); font-size: clamp(120px, 34vw, 210px); color:rgba(22,41,78,.04);
  white-space:nowrap; z-index:0;
}
.count-grid{ display:flex; align-items:flex-start; justify-content:center; gap: clamp(5px, 1.8vw, 16px); }
.count-grid i{ font-family:var(--serif); font-style:normal; font-weight:500; font-size: clamp(30px, 8vw, 50px); color:var(--gold); line-height:1.1; }
.cu{ display:flex; flex-direction:column; gap:8px; min-width: clamp(48px, 13vw, 84px); perspective:400px; }
.cu em{
  display:block;
  font-family:var(--serif); font-style:normal; font-weight:600; font-size: clamp(40px, 10.5vw, 62px);
  line-height:1; color:var(--ink); font-variant-numeric: tabular-nums;
}
.cu em.tick{ animation: numFlip .55s var(--ease-lux); }
@keyframes numFlip{
  0%{ transform: rotateX(0); }
  45%{ transform: rotateX(88deg); opacity:.15; }
  55%{ transform: rotateX(-88deg); opacity:.15; }
  100%{ transform: rotateX(0); opacity:1; }
}
.cu span{ font-family:var(--lux); font-size: clamp(9px, 2.5vw, 11.5px); letter-spacing:.32em; text-indent:.32em; text-transform:uppercase; color:var(--gold-dk); }

.cal-month{
  margin: clamp(48px, 10vw, 72px) 0 20px;
  font-family:var(--script); font-weight:400; font-size: clamp(46px, 12vw, 64px);
  color:var(--navy); transform: rotate(-3deg);
}
.calendar{
  width:min(400px, 100%); margin:0 auto;
  display:grid; grid-template-columns: repeat(7, 1fr); row-gap:14px;
  background: rgba(255,255,255,.72);
  border:1px solid var(--gold-line); border-radius:24px;
  padding: 24px 14px 28px;
  backdrop-filter: blur(5px);
  box-shadow: 0 24px 48px -26px rgba(13,27,54,.35), inset 0 0 0 4px rgba(255,255,255,.5);
}
.calendar .dow{ font-family:var(--lux); font-size:11px; color:var(--navy); padding-bottom:8px; border-bottom:1px solid var(--gold-line); margin-bottom:6px; }
.calendar .dow.jum{ color:var(--gold-dk); font-weight:600; }
.calendar span{ font-weight:500; font-size: clamp(14px, 3.6vw, 17px); display:flex; align-items:center; justify-content:center; height:34px; }
.the-day{ position:relative; }
.the-day svg{ position:absolute; width:40px; height:37px; left:50%; top:50%; transform:translate(-50%,-52%); animation: beat 1.7s ease-in-out infinite; }
.the-day b{ position:relative; font-weight:700; color:var(--gold-dk); }
@keyframes beat{ 0%,100%{ transform:translate(-50%,-52%) scale(1);} 12%{ transform:translate(-50%,-52%) scale(1.14);} 24%{ transform:translate(-50%,-52%) scale(1);} }

/* ═══════════════ QUOTE ═══════════════ */
.quote{ display:flex; justify-content:center; }
.quote-frame{
  width:min(460px, 100%); text-align:center;
  border:1.5px solid var(--gold); border-radius: 180px 180px 28px 28px;
  padding: clamp(48px, 11vw, 66px) clamp(24px, 6vw, 44px) 44px;
  background:
    radial-gradient(120% 50% at 50% 0%, #fffef9 0%, transparent 50%),
    linear-gradient(180deg, #fdfdfc, #f3f5f8);
  position:relative;
  box-shadow: 0 26px 52px -26px rgba(13,27,54,.35);
}
.quote-frame::before{ content:""; position:absolute; inset:9px; border:1px solid var(--line); border-radius:172px 172px 22px 22px; pointer-events:none; }
.quote-frame .fili.tl{ top:36px; left:24px; width:36px; height:36px; }
.quote-frame .fili.tr{ top:36px; right:24px; width:36px; height:36px; }
.quote-frame .fili.bl{ bottom:22px; left:24px; width:36px; height:36px; }
.quote-frame .fili.br{ bottom:22px; right:24px; width:36px; height:36px; }
.q-div{ width:160px; color:var(--gold); display:block; margin:0 auto; }
.q-div.flip{ transform: rotate(180deg); margin-top:18px; }
.q-text{ margin:20px 0 14px; font-size: clamp(16.5px, 4.4vw, 19px); font-style:italic; line-height:1.8; color:#2a3c5e; }
.q-src{ font-family:var(--lux); font-size:11.5px; letter-spacing:.32em; text-indent:.32em; text-transform:uppercase; color:var(--gold-dk); }

/* ═══════════════ COUPLE PLAQUE ═══════════════ */
.couple{
  display:flex;
  justify-content:center;
  position:relative;
  overflow:hidden;
  perspective:1200px;
  isolation:isolate;
}
.couple-curtain{
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
  overflow:hidden;
  opacity:1;
  transform:translate3d(0,0,0);
  contain:paint;
  backface-visibility:hidden;
  visibility:visible;
  transition:visibility 0s linear 0s;
}
.couple.curtain-open .couple-curtain{
  visibility:hidden;
  transition-delay:6.1s;
}
.couple-curtain::before{
  content:"";
  position:absolute;
  top:0;
  left:50%;
  z-index:5;
  width:min(320px, 74vw);
  height:54px;
  transform:translateX(-50%);
  border-radius:0 0 999px 999px;
  background:
    linear-gradient(90deg, transparent, rgba(232,213,164,.52) 20%, rgba(244,231,195,.82) 50%, rgba(232,213,164,.52) 80%, transparent),
    linear-gradient(180deg, rgba(10,23,52,.82), rgba(31,58,104,.48));
  box-shadow:0 10px 22px -14px rgba(8,16,36,.8), inset 0 -1px 0 rgba(232,213,164,.65);
  transition: opacity 2.35s ease 2.2s, transform 3.35s var(--ease-lux) 1.1s;
}
.couple.curtain-open .couple-curtain::before{
  opacity:0;
  transform:translate(-50%, -22px) scale(.9);
}
.curtain-panel{
  position:absolute;
  top:0;
  bottom:0;
  width:50.8%;
  overflow:hidden;
  background-image:
    linear-gradient(90deg, rgba(3,10,26,.18), rgba(7,18,44,.04) 46%, rgba(3,10,26,.16));
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position:center;
  box-shadow:
    inset 0 0 0 1px rgba(201,169,98,.18),
    inset 0 0 72px rgba(2,9,24,.42);
  transition:
    transform 5.6s cubic-bezier(.16,1,.3,1),
    filter 5.6s ease,
    opacity 2.1s ease 3.55s;
  will-change:transform, filter;
  transform:translate3d(0,0,0);
  backface-visibility:hidden;
}
.curtain-panel::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.98;
  background-image:url("assets/img/curtain-navy-floral.png?v=20260704c");
  background-repeat:no-repeat;
  background-size:auto 100%;
  background-position:left center;
  transform:translateZ(0);
  backface-visibility:hidden;
}
.curtain-panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(2,8,23,.34), transparent 22%, rgba(255,255,255,.04) 42%, transparent 62%, rgba(2,8,23,.32)),
    radial-gradient(26rem 32rem at 100% 50%, rgba(201,169,98,.16), transparent 72%),
    linear-gradient(90deg, rgba(3,11,30,.5), transparent 15%, rgba(255,255,255,.05) 25%, transparent 39%, rgba(3,11,30,.32) 53%, transparent 68%, rgba(255,255,255,.04) 80%, transparent 92%);
  opacity:.72;
}
.curtain-left{
  left:0;
  transform-origin:left center;
}
.curtain-right{
  right:0;
  transform-origin:right center;
}
.curtain-right::before{
  background-position:right center;
}
.couple.curtain-open .curtain-left{
  transform:translate3d(-101.5%,0,0);
  filter:brightness(.88) saturate(.98);
  opacity:0;
}
.couple.curtain-open .curtain-right{
  transform:translate3d(101.5%,0,0);
  filter:brightness(.88) saturate(.98);
  opacity:0;
}
.curtain-flower{
  display:none;
}
.curtain-seal{
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:72px;
  transform:translate(-50%, -50%) scale(1);
  filter:drop-shadow(0 10px 18px rgba(5,10,24,.55));
  transition: opacity 2s ease 1.35s, transform 3s var(--ease-lux) .9s;
  will-change:transform, opacity;
}
.curtain-seal svg{ display:block; width:100%; height:auto; }
.couple.curtain-open .curtain-seal{
  opacity:0;
  transform:translate(-50%, -50%) scale(.18) rotate(26deg);
}
.plaque{
  width:min(430px, 100%); text-align:center; position:relative; overflow:hidden;
  background:
    radial-gradient(28rem 20rem at 82% -12%, #2c4d84 0%, transparent 55%),
    radial-gradient(22rem 22rem at 6% 110%, #23406f 0%, transparent 50%),
    linear-gradient(168deg, #1d3763 0%, #12234a 60%, #0a1734 100%);
  border-radius: 210px 210px 210px 210px / 150px 150px 110px 110px;
  padding: clamp(64px, 15vw, 90px) clamp(22px, 6vw, 40px);
  color: var(--powder);
  box-shadow:
    0 40px 70px -28px rgba(8,16,36,.65),
    inset 0 0 0 1.5px rgba(201,169,98,.55),
    inset 0 0 60px rgba(9,18,40,.5);
}
.plaque::before{
  content:""; position:absolute; inset:12px; pointer-events:none; z-index:2;
  border:1px solid rgba(216,192,136,.5);
  border-radius: 198px 198px 198px 198px / 138px 138px 98px 98px;
}
.plaque-damask{ position:absolute; inset:0; opacity:.05; pointer-events:none; }
.plaque-lily{ position:absolute; width:230px; height:230px; opacity:.08; pointer-events:none; }
.pl-1{ top:-40px; left:-56px; }
.pl-2{ bottom:-48px; right:-60px; transform: rotate(30deg); }
.bismillah{ font-family:var(--arab); font-size: clamp(24px, 6.4vw, 30px); color:#f3ead1; margin-bottom:22px; }
.salam{ font-family:var(--lux); font-size: clamp(10.5px, 2.9vw, 12px); letter-spacing:.16em; text-transform:uppercase; color:#d5c48f; margin-bottom:16px; }
.pl-body{ font-size: clamp(15.5px, 4.1vw, 17px); font-style:italic; line-height:1.75; color:#b9c8e4; max-width:320px; margin:0 auto 38px; }
.pl-photo{
  width:min(190px, 52vw); aspect-ratio: 3/3.9; margin:0 auto 20px; position:relative;
  border-radius: 999px 999px 14px 14px;
}
.pl-photo img{
  width:100%; height:100%; object-fit:cover; object-position:center 18%;
  border-radius: 999px 999px 14px 14px;
  border:2px solid rgba(232,213,164,.85);
  outline:1px solid rgba(201,169,98,.45); outline-offset:6px;
  display:block;
  box-shadow: 0 18px 36px -14px rgba(5,10,24,.7);
}
.pl-fl{ position:absolute; width:58px; height:58px; right:-16px; bottom:-6px; }
.pl-person h3{ font-family:var(--script); font-weight:400; font-size: clamp(30px, 8.4vw, 40px); line-height:1.15; margin-bottom:10px; }
.pl-person p{ font-size: clamp(14.5px, 3.9vw, 16px); line-height:1.7; color:#aabcdd; max-width:290px; margin:0 auto; }
.pl-amp{ display:flex; align-items:center; justify-content:center; gap:2px; margin:30px 0; }
.pl-amp span{ font-family:var(--script); font-size:48px; line-height:1; }
.laurel{ width:34px; height:80px; opacity:.9; }
.laurel.rgt{ transform: scaleX(-1); }

/* ═══════════════ STORY ═══════════════ */
.story::before{
  content:"Asmaraloka"; position:absolute; top:16px; left:-3%;
  font-family:var(--script); font-size: clamp(90px, 26vw, 170px); color:rgba(22,41,78,.04);
  white-space:nowrap; transform:rotate(-5deg);
}
.story-photo{
  position:relative;
  width:min(326px, 86vw);
  aspect-ratio:4/5;
  margin:-12px auto 28px;
  padding:9px;
  border:1px solid rgba(201,169,98,.78);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.9), rgba(244,231,195,.26)),
    linear-gradient(145deg, rgba(201,169,98,.28), rgba(143,165,205,.18));
  box-shadow:
    0 22px 44px -28px rgba(13,27,54,.62),
    inset 0 0 0 1px rgba(255,255,255,.72);
  overflow:hidden;
}
.story-photo::before{
  content:"";
  position:absolute;
  inset:14px;
  z-index:2;
  border:1px solid rgba(244,231,195,.7);
  border-radius:22px;
  pointer-events:none;
}
.story-photo::after{
  content:"";
  position:absolute;
  inset:9px;
  z-index:1;
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(13,27,54,.01), transparent 58%, rgba(13,27,54,.16)),
    radial-gradient(80% 34% at 50% 0%, rgba(255,255,255,.28), transparent 72%);
  pointer-events:none;
}
.story-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
  border-radius:22px;
  filter:saturate(1.03) contrast(1.02);
}
.story-lede{ text-align:center; font-style:italic; font-size: clamp(16px, 4.3vw, 18px); color:#41547a; max-width:340px; margin:0 auto 48px; line-height:1.75; }
.chapters{ max-width:430px; margin:0 auto; position:relative; }
.chapters::before{ content:""; position:absolute; left:27px; top:30px; bottom:36px; border-left:1.5px dashed rgba(201,169,98,.5); }
.chapter{ display:flex; gap:18px; align-items:flex-start; margin-bottom:36px; position:relative; }
.chapter:last-child{ margin-bottom:0; }
.ch-no{ flex:0 0 56px; width:56px; height:56px; position:relative; }
.ch-no svg{ display:block; width:100%; height:100%; filter: drop-shadow(0 6px 12px rgba(13,27,54,.35)); }
.ch-no span{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-style:italic; font-weight:600; font-size:19px; color:#f3ead1; }
.ch-body{
  background:rgba(255,255,255,.78); border:1px solid var(--gold-line); border-radius:18px;
  padding:20px 22px; backdrop-filter: blur(4px); flex:1;
  box-shadow: 0 16px 36px -22px rgba(13,27,54,.35);
}
.ch-body h3{ font-family:var(--lux); font-weight:500; font-size:13px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-dk); margin-bottom:9px; }
.ch-body p{ font-size:16px; line-height:1.75; color:#33466b; }
.hrt{ color:var(--gold-dk); font-style:normal; }

/* ═══════════════ GALLERY ═══════════════ */
.gallery{
  text-align:center;
  padding-left:0;
  padding-right:0;
  background:
    linear-gradient(rgba(242,244,248,.72), rgba(242,244,248,.88)),
    var(--cover-bg) center/cover no-repeat,
    var(--mist);
}
.gallery .duo,
.gallery .duo-div,
.gallery .g-lede{
  padding-left:20px;
  padding-right:20px;
}
.g-lede{ font-style:italic; font-size:16.5px; color:#41547a; max-width:380px; margin:-16px auto 36px; }
.g-grid{
  width:100vw;
  margin:0 calc(50% - 50vw);
  display:flex;
  flex-direction:column;
  gap:clamp(12px, 3vw, 20px);
  text-align:left;
  opacity:1;
  transform:none;
  --g-size:clamp(150px, 42vw, 188px);
  --g-gap:clamp(12px, 3.4vw, 22px);
  padding:clamp(8px, 2vw, 16px) 0 clamp(12px, 3vw, 22px);
}
.g-row{
  position:relative;
  overflow:hidden;
  border-radius:0;
  padding:4px 0;
  height:calc(var(--g-size) + 8px);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
  mask-image:linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}
.g-row::before{
  content:none;
}
.g-track{
  display:inline-flex;
  align-items:center;
  width:auto;
  gap:var(--g-gap);
  height:var(--g-size);
  will-change:transform;
  transform:translate3d(0,0,0);
  -webkit-transform:translate3d(0,0,0);
}
.g-row-top,
.g-row-bottom{ transform:none; margin-top:0; }
.g-row-top .g-track{ animation: galleryRight 72s linear infinite; }
.g-row-bottom .g-track{ animation: galleryLeft 70s linear infinite; }
@keyframes galleryLeft{
  from{ transform:translate3d(0,0,0); }
  to{ transform:translate3d(-50%,0,0); }
}
@keyframes galleryRight{
  from{ transform:translate3d(-50%,0,0); }
  to{ transform:translate3d(0,0,0); }
}
.g-item{
  flex:0 0 var(--g-size);
  width:var(--g-size);
  height:var(--g-size);
  margin:0;
  overflow:hidden; border-radius:0;
  border:0; background:#fff; cursor:zoom-in; position:relative;
  outline:1px solid rgba(232,213,164,.58);
  outline-offset:0;
  box-shadow: 0 16px 30px -18px rgba(13,27,54,.48);
  transform:translate3d(0,0,0);
  transition: transform .6s var(--ease-lux), box-shadow .6s ease;
}
.g-item::after{
  content:""; position:absolute; inset:6px; border:1px solid rgba(232,213,164,0);
  border-radius:0; transition: border-color .5s ease; pointer-events:none;
}
.g-item img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  transition: transform .8s var(--ease-lux);
}
@media (hover:hover){
  .g-row:hover .g-track{ animation-play-state:paused; }
  .g-item:hover{ transform:translate3d(0,-4px,0) scale(1.025); box-shadow: 0 26px 48px -20px rgba(13,27,54,.52); }
  .g-item:hover img{ transform: scale(1.07); }
  .g-item:hover::after{ border-color: rgba(201,169,98,.8); }
}
@media (min-width: 760px){
  .g-grid{ width:100vw; --g-size:224px; --g-gap:20px; }
}
@media (max-width: 380px){
  .g-grid{ --g-size:142px; --g-gap:12px; }
}
html.is-ios .g-row{
  overflow:hidden;
  touch-action:pan-y;
  scrollbar-width:none;
}
html.is-ios .g-row::-webkit-scrollbar{ display:none; }
html.is-ios .g-track{
  animation:none !important;
}

/* lightbox */
#lightbox{
  position:fixed; inset:0; z-index:80; background: rgba(8,15,31,.96);
  display:flex; align-items:center; justify-content:center;
  backdrop-filter: blur(8px);
}
#lbImg{ max-width:88vw; max-height:80vh; border-radius:10px; box-shadow:0 30px 90px rgba(0,0,0,.7), 0 0 0 1px rgba(201,169,98,.4); }
.lb-close{ position:absolute; top:14px; right:20px; font-size:44px; font-family:var(--serif); color:#e8d5a4; line-height:1; }
.lb-nav{ position:absolute; top:50%; transform:translateY(-50%); font-family:var(--serif); font-size:60px; color:#e8d5a4; padding:20px; line-height:1; }
.lb-prev{ left:4px; } .lb-next{ right:4px; }
.lb-nav:hover, .lb-close:hover{ color:#fff; }
.lb-count{ position:absolute; bottom:18px; left:0; right:0; text-align:center; font-family:var(--lux); font-size:11px; letter-spacing:.32em; color:#b3924e; }

/* ═══════════════ EVENT ═══════════════ */
.event{ display:flex; flex-direction:column; align-items:center; }
.event-card{
  width:min(420px, 100%); text-align:center;
  background:
    radial-gradient(120% 40% at 50% 0%, #fffef9 0%, transparent 55%),
    linear-gradient(180deg, #fdfdfc, #f3f5f8);
  border:1.5px solid var(--gold); border-radius:34px;
  padding: clamp(44px, 10vw, 58px) clamp(22px, 6vw, 40px);
  position:relative;
  box-shadow: 0 30px 56px -26px rgba(13,27,54,.4), inset 0 0 0 1px rgba(255,255,255,.8);
}
.event-card::before{ content:""; position:absolute; inset:9px; border:1px solid var(--line); border-radius:27px; pointer-events:none; }
.ev-day{ font-family:var(--script); font-size: clamp(34px, 9vw, 42px); color:var(--navy); }
.ev-num{
  font-family:var(--serif); font-weight:600; font-size: clamp(78px, 22vw, 104px); line-height:1;
  display:flex; align-items:center; justify-content:center; gap:18px;
}
.ev-num::before, .ev-num::after{ content:""; height:1px; width: clamp(38px, 11vw, 64px); background: linear-gradient(90deg, transparent, var(--gold)); }
.ev-num::after{ background: linear-gradient(90deg, var(--gold), transparent); }
.ev-month{ font-family:var(--lux); font-weight:500; font-size: clamp(15px, 4.2vw, 19px); letter-spacing:.32em; text-indent:.32em; text-transform:uppercase; color:var(--navy); margin-bottom:20px; }
.ev-time{ display:flex; justify-content:center; }
.ev-time span{
  font-family:var(--lux); font-size:11px; letter-spacing:.2em; text-indent:.2em; text-transform:uppercase;
  color:var(--ink); border:1px solid var(--gold); border-radius:999px; padding:10px 22px;
  background: linear-gradient(180deg, rgba(232,213,164,.16), rgba(232,213,164,.05));
}
.ev-dress{
  width:min(245px, 88%);
  margin:14px auto 0;
  padding:11px 18px 12px;
  border:1px solid rgba(143,165,205,.58);
  border-radius:999px;
  background:linear-gradient(135deg, rgba(220,236,249,.76), rgba(255,255,255,.48));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.66), 0 12px 26px -20px rgba(13,27,54,.5);
}
.ev-dress span{
  display:block;
  font-family:var(--lux);
  font-size:9px;
  line-height:1;
  letter-spacing:.28em;
  text-indent:.28em;
  text-transform:uppercase;
  color:var(--gold-dk);
}
.ev-dress strong{
  display:block;
  margin-top:5px;
  font-family:var(--serif);
  font-size:clamp(18px, 4.8vw, 22px);
  line-height:1;
  font-weight:700;
  color:#27466f;
}
.ev-sep{ width:170px; margin:28px auto; color:var(--gold); }
.ev-sep svg{ display:block; width:100%; }
.ev-frame{
  position:relative;
  width:118px;
  margin:0 auto 18px;
}
.ev-house{
  display:block;
  width:100%;
  filter: drop-shadow(0 10px 14px rgba(13,27,54,.18));
}
.ev-loc-title{ font-family:var(--lux); font-size:10.5px; letter-spacing:.36em; text-indent:.36em; text-transform:uppercase; color:var(--gold-dk); margin-bottom:9px; }
.ev-loc{ font-size: clamp(18px, 5vw, 21px); font-weight:600; line-height:1.5; color:var(--ink); margin-bottom:26px; }
.ev-actions{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
.btn-navy{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--lux); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:#f3ead1; background: linear-gradient(150deg, #27466f, #10203f);
  padding:14px 24px; border-radius:999px; text-decoration:none;
  box-shadow: 0 12px 26px -8px rgba(13,27,54,.6), inset 0 0 0 1px rgba(201,169,98,.55);
  transition: transform .3s var(--ease-lux), box-shadow .3s ease;
}
.btn-navy:hover{ transform: translateY(-2px); box-shadow: 0 16px 30px -8px rgba(13,27,54,.65), inset 0 0 0 1px rgba(232,213,164,.8); }
.btn-ghost{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--lux); font-size:11px; letter-spacing:.18em; text-transform:uppercase;
  color:var(--navy); border:1.5px solid var(--gold);
  padding:13px 22px; border-radius:999px; text-decoration:none;
  transition: background .3s ease, color .3s ease;
}
.btn-ghost:hover{ background:var(--navy); color:#f3ead1; }

/* ═══════════════ GIFT ═══════════════ */
.gift{ text-align:center; }
.gift-lede{ font-style:italic; font-size: clamp(15.5px, 4.2vw, 17px); line-height:1.75; color:#41547a; max-width:380px; margin:-16px auto 40px; }
.bank-card{
  width:min(360px, 100%); margin:0 auto; text-align:left; position:relative; overflow:hidden;
  background:
    radial-gradient(20rem 14rem at 92% -14%, #2e5087 0%, transparent 55%),
    linear-gradient(155deg, #20406e 0%, #10203f 70%, #0a1734 100%);
  border-radius:24px; padding:28px 28px 26px; color:#fff;
  box-shadow:
    0 32px 56px -24px rgba(8,16,36,.7),
    inset 0 0 0 1.5px rgba(201,169,98,.55);
}
.bank-sheen{
  position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(115deg, transparent 32%, rgba(232,213,164,.14) 48%, rgba(255,255,255,.1) 52%, transparent 68%);
  background-size: 240% 100%;
  animation: veil 7s ease-in-out infinite;
}
.bank-lily{ position:absolute; width:190px; height:190px; right:-46px; bottom:-52px; opacity:.12; pointer-events:none; }
.bank-top{ display:flex; justify-content:space-between; align-items:center; margin-bottom:32px; }
.bank-name{ font-family:var(--lux); font-weight:600; font-size:22px; letter-spacing:.24em; }
.bank-no{ font-family:var(--serif); font-weight:600; font-size: clamp(26px, 7.6vw, 31px); letter-spacing:.1em; font-variant-numeric:tabular-nums; margin-bottom:7px; color:#f7f2e2; }
.bank-no a,
.bank-no a:link,
.bank-no a:visited,
a[x-apple-data-detectors],
a[x-apple-data-detectors]:link,
a[x-apple-data-detectors]:visited{
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  text-decoration:none !important;
  font:inherit !important;
}
.bank-holder{ font-style:italic; font-size:15px; color:#c4b78d; margin-bottom:22px; }
.btn-copy{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--lux); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  background: linear-gradient(180deg, #f0e3bb, #d9bc7a); color:#4f3d17;
  padding:12px 20px; border-radius:999px;
  box-shadow: 0 8px 18px -6px rgba(0,0,0,.4);
  transition: transform .3s var(--ease-lux);
}
.btn-copy:hover{ transform: translateY(-2px); }

/* ═══════════════ RSVP ═══════════════ */
.rsvp{ display:flex; flex-direction:column; align-items:center; }
.wish-form{
  width:min(430px, 100%);
  background:rgba(255,255,255,.84); border:1px solid var(--gold-line); border-radius:24px;
  padding:28px 26px; backdrop-filter: blur(5px);
  display:flex; flex-direction:column; gap:17px;
  box-shadow: 0 22px 44px -26px rgba(13,27,54,.4);
}
.wish-form label{ display:flex; flex-direction:column; gap:8px; }
.wish-form label > span, .w-label{
  font-family:var(--lux); font-size:10px; letter-spacing:.3em; text-indent:.3em; text-transform:uppercase; color:var(--gold-dk);
}
.wish-form input[type="text"], .wish-form textarea{
  font-family:var(--serif); font-size:17px; color:var(--ink);
  background:#fff; border:1px solid var(--line); border-radius:13px;
  padding:13px 15px; outline:none; resize:vertical;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.wish-form input:focus, .wish-form textarea:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,169,98,.22); }
.attend{ display:flex; gap:8px; flex-wrap:wrap; }
.attend label{ flex-direction:row; }
.attend input{ position:absolute; opacity:0; pointer-events:none; }
.attend span{
  font-family:var(--lux); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  border:1.5px solid var(--line); color:#5d719a; border-radius:999px; padding:10px 17px;
  cursor:pointer; transition: all .3s ease; display:inline-block;
}
.attend input:checked + span{ background:var(--navy); border-color:var(--gold); color:#f3ead1; }
.attend input:focus-visible + span{ box-shadow:0 0 0 3px rgba(201,169,98,.35); }
.btn-navy.full{ width:100%; justify-content:center; border:0; cursor:pointer; }
.btn-navy[disabled]{ opacity:.6; pointer-events:none; }

.wish-list{
  width:min(430px, 100%); margin-top:24px; max-height:430px; overflow-y:auto;
  display:flex; flex-direction:column; gap:12px; padding-right:4px;
  scrollbar-width:thin; scrollbar-color: var(--gold) transparent;
}
.wish{
  display:flex; gap:13px; align-items:flex-start; text-align:left;
  background:rgba(255,255,255,.8); border:1px solid var(--gold-line); border-radius:18px; padding:15px 17px;
}
.w-ava{
  flex:0 0 40px; width:40px; height:40px; border-radius:50%;
  background: linear-gradient(150deg, #27466f, #10203f); color:#f3ead1;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-weight:600; font-size:18px; font-style:italic;
  box-shadow: inset 0 0 0 1px rgba(201,169,98,.5);
}
.w-head{ display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin-bottom:3px; }
.w-name{ font-family:var(--caps); font-size:13.5px; color:var(--ink); }
.w-att{ font-family:var(--lux); font-size:8.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--navy); background:#eee5cb; border-radius:999px; padding:3px 9px; }
.w-att.no{ color:#5d719a; background:var(--powder); }
.w-time{ font-size:12.5px; font-style:italic; color:var(--steel); }
.w-msg{ font-size:15.5px; line-height:1.65; color:#33466b; }
.wish-empty{ text-align:center; font-style:italic; color:var(--steel); padding:22px 0; }

/* ═══════════════ CLOSING ═══════════════ */
.closing{
  text-align:center; padding-bottom:0;
  background:
    linear-gradient(180deg, rgba(242,244,248,.72), rgba(226,232,244,.82) 78%),
    var(--section-bg) center bottom/cover no-repeat;
}
.bf-c1{ top:60px; right:9%; width:44px; }
.close-body{ max-width:360px; margin:0 auto 22px; font-style:italic; font-size: clamp(16px, 4.3vw, 17.5px); line-height:1.8; color:#33466b; }
.close-salam{ font-family:var(--lux); font-size: clamp(10.5px, 2.9vw, 12px); letter-spacing:.18em; text-transform:uppercase; color:var(--navy); margin-bottom:28px; }
.close-photo{
  position:relative;
  width:min(304px, 78vw);
  aspect-ratio:4/5;
  margin:0 auto 30px;
  padding:9px;
  border:1px solid rgba(201,169,98,.78);
  border-radius:999px 999px 28px 28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(244,231,195,.28)),
    linear-gradient(145deg, rgba(201,169,98,.3), rgba(143,165,205,.2));
  box-shadow:
    0 22px 46px -28px rgba(13,27,54,.68),
    inset 0 0 0 1px rgba(255,255,255,.72);
  overflow:hidden;
}
.close-photo::before{
  content:"";
  position:absolute;
  inset:14px;
  z-index:2;
  border:1px solid rgba(244,231,195,.72);
  border-radius:999px 999px 20px 20px;
  pointer-events:none;
}
.close-photo::after{
  content:"";
  position:absolute;
  inset:9px;
  z-index:1;
  border-radius:999px 999px 22px 22px;
  background:
    linear-gradient(180deg, rgba(13,27,54,.01), transparent 58%, rgba(13,27,54,.18)),
    radial-gradient(80% 35% at 50% 0%, rgba(255,255,255,.28), transparent 72%);
  pointer-events:none;
}
.close-photo img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 42%;
  border-radius:999px 999px 22px 22px;
  filter:saturate(1.03) contrast(1.02);
}
.close-kicker{ font-family:var(--lux); font-size:10.5px; letter-spacing:.36em; text-indent:.36em; text-transform:uppercase; color:var(--gold-dk); margin-bottom:12px; }
.close-names-wrap{ position:relative; display:inline-block; padding:0 30px; }
.close-names{ font-family:var(--script); font-size: clamp(48px, 13vw, 70px); color:var(--navy); line-height:1.1; transform:rotate(-2deg); }
.close-names i{ font-size:.55em; font-style:normal; }
.close-cluster{ position:relative; height:120px; width:230px; margin:28px auto 0; }
.close-cluster .fl{ position:absolute; width:84px; height:84px; left:8px; top:20px; transform:rotate(-12deg); }
.close-cluster .f2{ width:104px; height:104px; left:66px; top:2px; transform:rotate(6deg); }
.close-cluster .f3{ width:72px; height:72px; right:10px; top:30px; transform:rotate(16deg); }
footer{ padding:28px 0 32px; }
footer p{ font-family:var(--lux); font-size:10px; letter-spacing:.32em; text-indent:.32em; text-transform:uppercase; color:#a08d5c; }
.site-credit{
  margin-top:18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
  font-family:var(--lux);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#8a7a55;
}
.site-credit a{
  color:var(--gold-dk);
  text-decoration:none;
}
.ig-credit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  letter-spacing:.12em;
}
.ig-credit svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
}

/* ═══════════════ FLOATING MUSIC ═══════════════ */
#musicToggle{
  position:fixed; right:16px; bottom:16px; z-index:40;
  width:50px; height:50px; border-radius:50%;
  background: linear-gradient(150deg, #27466f, #10203f); color:#f3ead1;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 26px -6px rgba(8,16,36,.6), inset 0 0 0 1.5px rgba(201,169,98,.6);
}
.mt-disc{
  position:absolute; inset:5px; border-radius:50%;
  border:1.5px dashed rgba(232,213,164,.6);
}
body.playing .mt-disc{ animation: spin 3.2s linear infinite; }
#musicToggle:not(.on) .mt-icon{ display:none; }
#musicToggle:not(.on)::after{
  content:""; width:0; height:0; margin-left:3px;
  border-style:solid; border-width:7px 0 7px 11px;
  border-color:transparent transparent transparent #f3ead1;
}

/* toast */
#toast{
  position:fixed; left:50%; bottom:26px; transform:translate(-50%, 20px);
  z-index:95; background:var(--ink); color:#f3ead1;
  font-family:var(--serif); font-size:15.5px; font-style:italic;
  padding:13px 26px; border-radius:999px; opacity:0; pointer-events:none;
  transition: opacity .4s ease, transform .4s var(--ease-lux);
  box-shadow:0 16px 34px -8px rgba(8,16,36,.7), inset 0 0 0 1px rgba(201,169,98,.5);
  display:block; width:max-content; max-width:86vw; text-align:center;
}
#toast.show{ opacity:1; transform:translate(-50%, 0); }

/* ═══════════════ V3 ORNATE GARDEN LAYER ═══════════════ */
body.v3{
  --v3-blue-glow: rgba(127,151,196,.22);
  --v3-gold-glow: rgba(201,169,98,.34);
  --v3-petal: rgba(232,238,251,.72);
  --v3-leaf: rgba(89,114,160,.38);
}
body.v3::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(20rem 20rem at 12% 16%, rgba(201,169,98,.12), transparent 64%),
    radial-gradient(24rem 24rem at 92% 34%, rgba(127,151,196,.15), transparent 66%),
    radial-gradient(18rem 18rem at 8% 82%, rgba(46,78,128,.12), transparent 68%);
  opacity:.72;
}
body.v3 #cover::after{
  content:"";
  position:absolute;
  inset:18px;
  z-index:1;
  pointer-events:none;
  border:1px solid rgba(201,169,98,.2);
  background:
    radial-gradient(9rem 9rem at 12% 10%, rgba(31,58,104,.12), transparent 62%),
    radial-gradient(10rem 10rem at 88% 88%, rgba(201,169,98,.12), transparent 66%);
  animation:v3OrnPulse 6.8s ease-in-out infinite;
  transition:opacity .7s ease;
}
body.v3 #cover.curtain-open::after{ opacity:0; }
body.v3 .cover-inner{ z-index:4; }
body.v3 .hero::after,
body.v3 .counting::after,
body.v3 .quote::after,
body.v3 .couple::after,
body.v3 .story::after,
body.v3 .gallery::after,
body.v3 .event::after,
body.v3 .gift::after,
body.v3 .rsvp::after,
body.v3 .closing::after{
  content:"";
  position:absolute;
  inset:clamp(12px, 4vw, 34px) clamp(10px, 3vw, 24px);
  z-index:0;
  pointer-events:none;
  border:1px solid rgba(201,169,98,.18);
  border-radius:clamp(28px, 9vw, 72px);
  background:
    radial-gradient(8rem 8rem at 0 0, rgba(201,169,98,.12), transparent 68%),
    radial-gradient(9rem 9rem at 100% 0, rgba(127,151,196,.16), transparent 68%),
    radial-gradient(9rem 9rem at 0 100%, rgba(127,151,196,.14), transparent 70%),
    radial-gradient(8rem 8rem at 100% 100%, rgba(201,169,98,.12), transparent 68%);
  opacity:.9;
  animation:v3OrnPulse 7.5s ease-in-out infinite;
}
body.v3 .hero::after,
body.v3 .gallery::after{ border-radius:0; inset:18px 0; border-left:0; border-right:0; }
@keyframes v3OrnPulse{
  0%,100%{ opacity:.55; transform:scale(.992); }
  50%{ opacity:1; transform:scale(1); }
}
body.v3 .duo::before,
body.v3 .duo::after{
  content:"";
  position:absolute;
  top:48%;
  width:clamp(42px, 13vw, 76px);
  height:clamp(38px, 11vw, 66px);
  pointer-events:none;
  opacity:.68;
  background:
    radial-gradient(18px 14px at 30% 34%, rgba(244,231,195,.72), transparent 70%),
    radial-gradient(20px 16px at 66% 56%, rgba(143,165,205,.45), transparent 72%),
    linear-gradient(130deg, transparent 47%, rgba(201,169,98,.62) 48% 51%, transparent 52%);
  filter:drop-shadow(0 8px 10px rgba(13,27,54,.08));
  animation:v3HeadingBloom 6s ease-in-out infinite;
}
body.v3 .duo::before{ right:calc(50% + clamp(104px, 33vw, 168px)); transform:rotate(-14deg); }
body.v3 .duo::after{ left:calc(50% + clamp(104px, 33vw, 168px)); transform:scaleX(-1) rotate(-14deg); animation-delay:-2.6s; }
@keyframes v3HeadingBloom{
  0%,100%{ translate:0 0; opacity:.48; }
  50%{ translate:0 -8px; opacity:.82; }
}
body.v3 .duo .script{ text-shadow:0 10px 24px rgba(201,169,98,.12); }
body.v3 .duo-div{
  filter:drop-shadow(0 0 8px rgba(201,169,98,.24));
  animation:v3DividerGlow 5.4s ease-in-out infinite;
}
@keyframes v3DividerGlow{
  0%,100%{ opacity:.82; transform:translateY(0) scale(.98); }
  50%{ opacity:1; transform:translateY(-3px) scale(1.02); }
}
body.v3 .arch,
body.v3 .quote-frame,
body.v3 .plaque,
body.v3 .count-grid,
body.v3 .calendar,
body.v3 .chapter,
body.v3 .event-card,
body.v3 .bank-card,
body.v3 .wish-form,
body.v3 .wish-list,
body.v3 .close-names-wrap{
  position:relative;
  isolation:isolate;
}
body.v3 .arch::after,
body.v3 .quote-frame::after,
body.v3 .plaque::after,
body.v3 .count-grid::after,
body.v3 .calendar::after,
body.v3 .chapter::after,
body.v3 .event-card::after,
body.v3 .bank-card::after,
body.v3 .wish-form::after,
body.v3 .wish-list::after,
body.v3 .close-names-wrap::after{
  content:"";
  position:absolute;
  inset:8px;
  z-index:2;
  pointer-events:none;
  border:1px solid rgba(232,213,164,.22);
  border-radius:inherit;
  background:
    radial-gradient(36px 28px at 8% 10%, rgba(244,231,195,.2), transparent 70%),
    radial-gradient(42px 32px at 92% 88%, rgba(143,165,205,.16), transparent 72%);
  opacity:.72;
}
body.v3 .chapter::after{ border-radius:18px; inset:4px; }
body.v3 .count-grid::after,
body.v3 .calendar::after{ border-radius:24px; }
body.v3 .g-item{
  box-shadow:
    0 16px 30px -18px rgba(13,27,54,.48),
    0 0 0 1px rgba(232,213,164,.2);
}
body.v3 .g-item::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(115deg, transparent 28%, rgba(255,255,255,.34) 48%, transparent 68%);
  transform:translateX(-115%);
  animation:v3PhotoShimmer 6.8s ease-in-out infinite;
}
body.v3 .g-item:nth-child(3n+2)::before{ animation-delay:-2.1s; }
body.v3 .g-item:nth-child(3n+3)::before{ animation-delay:-4.2s; }
@keyframes v3PhotoShimmer{
  0%,42%,100%{ transform:translateX(-115%); opacity:0; }
  54%{ opacity:.6; }
  72%{ transform:translateX(115%); opacity:0; }
}
body.v3 .btn-primary,
body.v3 .btn-ghost,
body.v3 .btn-copy,
body.v3 .wish-form button{
  position:relative;
  overflow:hidden;
}
body.v3 .btn-primary::after,
body.v3 .btn-ghost::after,
body.v3 .btn-copy::after,
body.v3 .wish-form button::after{
  content:"";
  position:absolute;
  inset:-40% -20%;
  pointer-events:none;
  background:linear-gradient(110deg, transparent 34%, rgba(244,231,195,.34) 48%, transparent 62%);
  transform:translateX(-115%);
  animation:v3ButtonGleam 5.8s ease-in-out infinite;
}
@keyframes v3ButtonGleam{
  0%,48%,100%{ transform:translateX(-115%); }
  66%{ transform:translateX(115%); }
}
body.v3 .section-separator img{
  filter:drop-shadow(0 12px 16px rgba(13,27,54,.08)) saturate(1.04);
}

/* ═══════════════ MOTION SAFETY ═══════════════ */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.2s !important; }
  .reveal, .rise{ opacity:1; transform:none; }
  [data-p3d]{ transform:none !important; }
  .sp{ display:none; }
  .duo-butterfly, .section-separator img{ animation:none !important; }
  .couple-curtain{ display:none; }
}
