/* ═══════════════════════════════════════════════════════════
   TEMPLATE 03 — MINIMAL IVORY LUXURY
   ShaadiPath Wedding Website Builder

   PALETTE:
   --rose   : #C8A870  (pale gold — the only warm accent)
   --blush  : #E8DFC8  (champagne)
   --gold   : #C8A870  (same as rose — monochromatic)
   --ivory  : #F0E8D4  (warm ivory)
   --cream  : #F8F4ED  (warm white base)
   --sage   : #B0A080  (platinum)
   --deep   : #2A2420  (charcoal ebony)
   --peach  : #D4C8B0  (warm sand)

   LUXURY ANIMATION SYSTEM (T03-exclusive):
   1. SHIMMER SWEEP — horizontal light sweep on hover (cards, button)
   2. ARCH PARALLAX — couple floats at different rate from arch on scroll
   3. PLATINUM LINE DRAW — SVG line animates in on section entry
   4. WORD REVEAL — names split and slide in from opposite sides
   5. BREATHE PULSE — urns breathe gently (scale 1.0→1.02, 6s)
   6. SILK FADE — ultra-slow opacity transitions (1.4s) for premium feel
   7. MAGNETIC CURSOR — custom crosshair cursor with platinum ring
═══════════════════════════════════════════════════════════ */

/* ═══ TOKENS ═══ */
:root{
  --rose:#C8A870;--blush:#E8DFC8;--gold:#C8A870;--ivory:#F0E8D4;
  --cream:#F8F4ED;--sage:#B0A080;--deep:#2A2420;--peach:#D4C8B0;
  /* T03 fonts */
  --ff-d:'Cormorant Garamond',Georgia,serif;
  --ff-s:'Cormorant Garamond',Georgia,serif;
  --ff-b:'Raleway',sans-serif;
  /* Easing tokens */
  --royal:cubic-bezier(0.16,1,0.3,1);
  --spring:cubic-bezier(0.34,1.56,0.64,1);
  --silk:cubic-bezier(0.25,0.46,0.45,0.94);
  --editorial:cubic-bezier(0.77,0,0.175,1);
  --jelly:cubic-bezier(0.34,1.56,0.64,1);
  /* Glass tokens — warm ivory surface */
  --glass-bg:rgba(248,244,237,0.72);
  --glass-blur:blur(14px) saturate(130%);
  --glass-border:1px solid rgba(200,168,112,0.28);
  --emboss:inset 0 1px 0 rgba(255,255,255,0.60),inset 0 -1px 0 rgba(42,36,32,0.06);
  --shadow-sm:0 2px 8px rgba(42,36,32,.08);
  --shadow-md:0 8px 32px rgba(42,36,32,.12),0 2px 8px rgba(42,36,32,.06);
  --shadow-lg:0 24px 64px rgba(42,36,32,.16),0 6px 20px rgba(42,36,32,.10);
  --shadow-gold:0 12px 40px rgba(200,168,112,.22),0 4px 12px rgba(200,168,112,.14);
}

/* ═══ PERFORMANCE — content-visibility ═══ */
.s-story,.s-gallery,.s-things,.s-rsvp,.footer{
  content-visibility:auto;contain-intrinsic-size:0 600px;
}

/* ═══ RESET ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--ff-b);background:var(--cream);color:var(--deep);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}

/* ═══ LUXURY ANIMATION 7: MAGNETIC CURSOR ═══
   Platinum crosshair ring — minimal, architectural
   Replaces the rose ring of T01/T02 with a platinum thin-ring
═══════════════════════════════════════════════ */
@media(pointer:fine){
  body.cursor-active{cursor:none}
  .c-ring{
    position:fixed;inset:0;
    width:28px;height:28px;
    border:1px solid rgba(176,160,128,.55);
    border-radius:50%;
    pointer-events:none;z-index:9999;
    transform:translate(-50%,-50%);
    transition:width .35s var(--editorial),height .35s var(--editorial),
               border-color .35s ease,background .35s ease,
               box-shadow .45s cubic-bezier(0.23,1,0.32,1);
    top:-100px;left:-100px;
    background:transparent;
  }
  /* Crosshair lines inside ring */
  .c-ring::before,.c-ring::after{
    content:'';position:absolute;background:rgba(176,160,128,.40);
  }
  .c-ring::before{width:1px;height:8px;left:50%;top:50%;transform:translate(-50%,-50%)}
  .c-ring::after {width:8px;height:1px;left:50%;top:50%;transform:translate(-50%,-50%)}
  .c-dot{
    position:fixed;width:3px;height:3px;
    background:var(--gold);border-radius:50%;
    pointer-events:none;z-index:9999;
    transform:translate(-50%,-50%);top:-100px;left:-100px;
  }
  body.ch .c-ring{
    width:48px;height:48px;
    border-color:rgba(200,168,112,.65);
    background:rgba(200,168,112,.04);
  }
}

/* ═══ PRELOADER — gold mandala trace on warm ivory (T03 editorial pace) ═══ */
.preloader{
  position:fixed;inset:0;z-index:2000;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(170deg,#F8F4ED 0%,#F0E8D4 55%,#E8DFC8 100%);
  transition:opacity .8s var(--editorial),visibility .8s ease;
}
.preloader.away{opacity:0;visibility:hidden;pointer-events:none}
.pl-content{display:flex;flex-direction:column;align-items:center;gap:24px}
.pl-mandala-wrap{display:flex;align-items:center;justify-content:center}
.pl-mandala{overflow:visible}

/* Rings trace in */
.pl-m-ring{stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 0s}
.preloader.li .pl-m-r1{stroke-dashoffset:0;transition-duration:.70s;transition-delay:0s}
.preloader.li .pl-m-r2{stroke-dashoffset:0;transition-duration:.60s;transition-delay:.10s}
.preloader.li .pl-m-r3{stroke-dashoffset:0;transition-duration:.50s;transition-delay:.18s}

/* Petals fade in with names */
.pl-m-petals{opacity:0;transition:opacity .6s var(--editorial)}
.preloader.ni .pl-m-petals{opacity:1}
.pl-m-dot{opacity:0;transform-origin:60px 60px;transform:scale(0);transition:opacity .4s ease .15s,transform .6s var(--spring) .15s}
.preloader.ni .pl-m-dot{opacity:.70;transform:scale(1)}

/* Slow editorial spin */
.preloader.ni .pl-mandala{animation:mandalaSpin 12s linear infinite}
@keyframes mandalaSpin{to{transform:rotate(360deg)}}

/* Names — charcoal on warm ivory */
.pl-names{
  font-family:var(--ff-s);font-style:italic;font-weight:300;
  font-size:clamp(1.1rem,4vw,1.6rem);color:var(--deep);
  display:flex;align-items:baseline;gap:12px;
  opacity:0;transform:translateY(12px);
  transition:opacity 1.0s var(--editorial),transform 1.0s var(--editorial);
  letter-spacing:.04em;
}
.preloader.ni .pl-names{opacity:1;transform:translateY(0)}
.pl-weds{font-size:.58em;color:var(--gold);font-weight:300;letter-spacing:.12em;text-transform:uppercase}

/* ═══ NAV — hidden ═══ */
#nav,#nav.sc,.mobile-menu{display:none!important}

/* ═══ HERO SCROLL SCENE ═══ */
.hero-wrap{position:relative;height:240vh}
@media(max-width:767px){.hero-wrap{height:210vh}}
@media(min-width:1400px){.hero-wrap{height:270vh}}
@media(prefers-reduced-motion:reduce){.hero-wrap{height:100svh}}

.hero-pin{
  position:sticky;top:0;
  height:100svh;min-height:600px;
  overflow:hidden;
}
@media(prefers-reduced-motion:reduce){.hero-pin{position:relative}}

/* Sky — warm white to champagne, almost invisible gradient */
.hero-sky{
  position:absolute;inset:0;
  background:linear-gradient(170deg,#F8F4ED 0%,#F0E8D4 50%,#E8DFC8 85%,#D4C8B0 100%);
}

/* ── CSS ambient floating particles (T03-exclusive luxury detail) ── */
.hero-particles{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.hp{
  position:absolute;width:2px;height:2px;border-radius:50%;
  background:var(--gold);opacity:0;
  animation:hpFloat var(--dur,12s) var(--del,0s) ease-in-out infinite;
}
@keyframes hpFloat{
  0%   {opacity:0;transform:translateY(100vh) translateX(0)}
  8%   {opacity:.4}
  85%  {opacity:.25}
  100% {opacity:0;transform:translateY(-10vh) translateX(var(--dx,20px))}
}

/* T03 has no hero-moon CSS element — removed */
.hero-moon{display:none}

.hl{position:absolute;will-change:transform}

/* ── ARCH — wider than palace, same zoom mechanic ── */
.hl-palace{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  transform-origin:bottom center;
  bottom:8%;
  width:min(92vw,900px);
  height:auto;
  z-index:5;
  filter:drop-shadow(0 12px 40px rgba(42,36,32,.10));
  opacity:1;
  transition:opacity 1.2s var(--editorial);
  will-change:transform,filter;
}
body.pl-active .hl-palace{opacity:0}
body.pl-active .hl-palace.in{opacity:1}

/* Mobile: arch pushed UP so couple is visible in upper portion */
@media(max-width:600px){
  .hl-palace{ width:98vw; bottom:12%; }
  .hl-couple{ width:52vw; bottom:14%; }
}

/* Mobile float glow on arch — substitute for mouse tilt */
@media(pointer:coarse){
  .hl-palace{ animation:archMobileGlow 8s ease-in-out infinite; }
  @keyframes archMobileGlow{
    0%,100%{filter:drop-shadow(0 12px 40px rgba(42,36,32,.10))}
    50%    {filter:drop-shadow(0 18px 55px rgba(42,36,32,.16)) drop-shadow(0 4px 18px rgba(200,168,112,.12))}
  }
}

/* ═══ GOLD AMBIENT ORBS — ivory sky version (T03) ═══ */
.rangoli-orb{
  position:absolute;width:55px;height:55px;
  background:radial-gradient(circle,rgba(200,168,112,.18) 0%,rgba(200,168,112,.06) 55%,transparent 75%);
  border-radius:50%;filter:blur(9px);z-index:3;pointer-events:none;
  animation:orbFloat 26s ease-in-out infinite;will-change:transform;
}
.rangoli-orb:nth-of-type(2){
  width:38px;height:38px;
  background:radial-gradient(circle,rgba(176,160,128,.14) 0%,rgba(200,168,112,.06) 58%,transparent 78%);
  animation-duration:32s;animation-direction:reverse;
}
@keyframes orbFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  33%{transform:translateY(-50px) rotate(12deg)}
  66%{transform:translateY(-24px) rotate(-8deg)}
}

/* ═══ HERO COUNTDOWN — gold on warm ivory (T03) ═══ */
.hc-countdown{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(6px,2vw,18px);
  margin-top:clamp(6px,1vh,12px);
  pointer-events:none;flex-wrap:nowrap;
  width:100%;
}
.hc-cd-unit{display:flex;flex-direction:column;align-items:center;gap:3px}
.hc-cd-num{
  font-family:var(--ff-s);font-style:italic;font-weight:300;
  font-size:clamp(1.1rem,3.5vw,1.8rem);
  color:var(--deep);line-height:1;
  text-shadow:0 1px 12px rgba(248,244,237,.95);
  min-width:2ch;text-align:center;
}
.hc-cd-label{
  font-family:var(--ff-b);font-size:clamp(7px,1.6vw,9px);
  font-weight:300;letter-spacing:.16em;text-transform:uppercase;
  color:var(--deep);opacity:.40;
}
.hc-cd-sep{
  font-family:var(--ff-s);font-style:italic;
  font-size:clamp(.8rem,2vw,1.2rem);
  color:var(--gold);opacity:.55;line-height:1;margin-bottom:10px;
}
/* Countdown reveal — same timing as names */
body.pl-active .hero-copy.in .hc-countdown{opacity:1;transform:none;transition-delay:.62s}

/* UPDATED: Countdown mobile +30% bigger */
@media(max-width:600px){
  .hc-countdown{gap:5px;margin-top:6px}
  .hc-cd-num{font-size:clamp(1.3rem,7.15vw,1.82rem)}
  .hc-cd-sep{font-size:clamp(0.91rem,3.25vw,1.17rem)}
  .hc-cd-label{font-size:9px;letter-spacing:.10em}
}
@media(max-width:360px){
  .hc-cd-unit:last-child,.hc-cd-sep:last-of-type{display:none}
}

/* Sits between arch (z:5) and sky (z:1), so z:3.
   Positioned to appear inside the arch opening.
   Has a DIFFERENT parallax rate from arch — this creates depth.
   JS drives arch at scale 1→1.45; couple at scale 1→1.20 (slower zoom)
   Net effect: couple appears to recede into arch as user scrolls.
*/

/* UPDATED: Desktop couple — 50% smaller + perfect center of screen */
.hl-couple{
  position:absolute;
  left:50%;
  top:50%;                          /* perfect vertical center */
  transform:translate(-50%, -52%);  /* perfect center + tiny arch adjustment */
  transform-origin:center center;
  width:min(18vw,160px);            /* exactly 50% smaller */
  height:auto;
  z-index:4;
  mix-blend-mode:multiply;
  filter:drop-shadow(0 8px 24px rgba(42,36,32,.08));
  opacity:1;
  transition:opacity 1.2s var(--editorial) .2s;
}
body.pl-active .hl-couple{opacity:0}
body.pl-active .hl-couple.in{opacity:1}

/* UPDATED: Mobile couple — moved DOWN towards center */
@media(max-width:600px){
  .hl-palace{ width:98vw; bottom:20%; }
  .hl-couple{ 
    width:52vw; 
    bottom:8%;                    /* ← decreased = moved DOWN (now sits inside arch center) */
    left:50%; 
    transform:translateX(-50%);    
  }
}	

/* ═══ LUXURY ANIMATION 4: WORD REVEAL — hero names ═══ */
.hero-copy{
  position:absolute;
  /* Desktop: below arch at bottom */
  bottom:2%;
  left:0;right:0;
  z-index:9;
  display:flex;
  flex-direction:row;
  align-items:baseline;
  justify-content:center;
  flex-wrap:wrap;
  gap:0 0.5em;
  text-align:center;
  padding:0 16px;
  pointer-events:none;
}
/* Mobile: names move to UPPER section above the arch */
@media(max-width:600px){
  .hero-copy{
    bottom:auto;
    top:8%;
    flex-direction:column;
    align-items:center;
    gap:0.04em;
  }
}
.hc-bride,.hc-groom{
  font-family:var(--ff-d);font-weight:300;font-style:italic;
  font-size:clamp(2rem,4.5vw,5rem);
  color:var(--deep);line-height:1.05;
  text-shadow:0 2px 24px rgba(248,244,237,.95);
  /* Word reveal clip */
  overflow:hidden;
}
/* Inner span does the sliding */
.hc-bride span,.hc-groom span{
  display:block;
  opacity:0;
  transition:opacity 1.0s var(--editorial),transform 1.0s var(--editorial);
}
.hc-bride span{transform:translateX(-32px)}
.hc-groom span{transform:translateX(32px)}
.hero-copy.in .hc-bride span{opacity:1;transform:translateX(0);transition-delay:.12s}
.hero-copy.in .hc-groom span{opacity:1;transform:translateX(0);transition-delay:.40s}
.hc-weds{
  font-family:var(--ff-b);font-style:normal;font-weight:200;
  font-size:clamp(.7rem,1.4vw,1.4rem);
  color:var(--gold);line-height:1;
  padding-bottom:0.3em;
  letter-spacing:.22em;text-transform:uppercase;
  opacity:0;transition:opacity 1.0s var(--editorial) .28s;
}
.hero-copy.in .hc-weds{opacity:1}

/* UPDATED: Names mobile +30% bigger */
@media(max-width:600px){
  .hc-bride,.hc-groom{ font-size:clamp(2.34rem,10.4vw,3.9rem); }
  .hc-weds{ font-size:clamp(0.845rem,3.9vw,1.17rem); }
}

/* Scroll nudge — platinum on cream */
.scroll-nudge{
  position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);
  z-index:9;text-align:center;transition:opacity .6s;animation:snPulse 2.5s ease-in-out infinite;
}
.scroll-nudge span{
  display:block;font-size:.65rem;letter-spacing:.32em;
  text-transform:uppercase;color:var(--deep);opacity:.65;margin-bottom:8px;font-weight:200;
}
.sn-line{width:2px;height:36px;background:rgba(42,36,32,.28);margin:0 auto;position:relative;overflow:hidden}
.sn-dot{position:absolute;top:-8px;left:0;width:2px;height:8px;background:var(--gold);opacity:.85;animation:snDrop 2.4s ease-in-out infinite}
@keyframes snDrop{0%{top:-8px;opacity:.8}100%{top:100%;opacity:0}}
@keyframes snPulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.05)}}
@keyframes snAttention{0%{transform:translateX(-50%) scale(1)}40%{transform:translateX(-50%) scale(1.25)}70%{transform:translateX(-50%) scale(1.1)}100%{transform:translateX(-50%) scale(1)}}

/* Hero float ornaments — muted for T03 */
.hero-floats{position:absolute;inset:0;z-index:8;pointer-events:none}
.fl{position:absolute;mix-blend-mode:multiply}
.diya-l{
  width:clamp(48px,6vw,82px);top:16%;left:5%;transform-origin:50% 0%;
  filter:drop-shadow(0 4px 12px rgba(42,36,32,.08));
  animation:swing 4.8s ease-in-out infinite; /* T03: double speed */
  opacity:.7;
}
.diya-r{
  width:clamp(44px,5.5vw,76px);top:20%;right:5%;transform-origin:50% 0%;
  filter:drop-shadow(0 4px 12px rgba(42,36,32,.08));
  animation:swingR 4.8s ease-in-out infinite 2.4s;
  opacity:.7;
}
.fall-l{width:clamp(38px,5vw,68px);left:8%;animation:fallLeaf 14s ease-in-out infinite;opacity:.5;filter:drop-shadow(0 3px 8px rgba(42,36,32,.07))}
.fall-r{width:clamp(34px,4.5vw,60px);right:8%;animation:fallLeaf 16s ease-in-out infinite 4s;opacity:.5;filter:drop-shadow(0 3px 8px rgba(42,36,32,.07))}
@keyframes swing {0%,100%{transform:rotate(-8deg)}50%{transform:rotate(8deg)}}
@keyframes swingR {0%,100%{transform:scaleX(-1) rotate(-8deg)}50%{transform:scaleX(-1) rotate(8deg)}}
@keyframes fallLeaf{
  0% {transform:translateY(-70px) rotate(-12deg);opacity:0}
  6% {opacity:.4}
  40% {transform:translateY(28vh) rotate(6deg) translateX(10px);opacity:.4}
  75% {transform:translateY(62vh) rotate(-6deg) translateX(-8px);opacity:.25}
  100%{transform:translateY(102vh) rotate(4deg) translateX(6px);opacity:0}
}
@keyframes leafL{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes leafR{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-6deg)}}

/* ═══ URN BRIDGE — replaces elephant bridge ═══
   Two terracotta urns flank the transition.
   LUXURY ANIMATION 5: BREATHE PULSE on each urn
═══════════════════════════════════════════════ */
.urn-bridge{
  position:relative;
  width:100%;
  height:300px;
  /* Gradient continues warm-white → champagne — seamless from hero sky */
  background:linear-gradient(180deg,#E8DFC8 0%,#F0E8D4 40%,#F8F4ED 100%);
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  overflow:visible;
  z-index:10;
}
@media(max-width:600px){.urn-bridge{height:210px}}

.urn{
  position:relative;
  width:36%;
  max-width:220px;
  flex-shrink:0;
}
.urn-l{
  align-self:flex-end;
  /* LUXURY ANIMATION 5: BREATHE */
  animation:urnBreath 6.5s ease-in-out infinite;
  transform-origin:50% 100%;
}
.urn-r{
  align-self:flex-end;
  animation:urnBreath 6.5s ease-in-out infinite 3.25s;
  transform-origin:50% 100%;
}
@keyframes urnBreath{
  0%,100%{ transform:scale(1) translateY(0); }
  50%    { transform:scale(1.025) translateY(-5px); }
}
.urn img{
  width:100%;height:auto;display:block;
  mix-blend-mode:multiply;
  filter:drop-shadow(0 10px 28px rgba(42,36,32,.12));
}

/* ─── Thin platinum line that draws across the bridge centre ─── */
.urn-bridge-line{
  position:absolute;
  bottom:60px;
  left:50%;transform:translateX(-50%);
  width:0;height:1px;
  background:linear-gradient(to right,transparent,rgba(176,160,128,.35),transparent);
  transition:width 1.4s var(--editorial);
}
.urn-bridge.line-drawn .urn-bridge-line{width:40%}
@media(max-width:600px){.urn-bridge-line{display:none}}

/* Water cascade canvas for merlion bridge */
.water-canvas{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  pointer-events:none;
  z-index:8;                   /* above bridge bg, below merlion imgs (z:10) */
  overflow:visible;
}
/* No confetti canvas for T03 */
.petal-canvas{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:10}
.wdiv,.w-out{line-height:0}
.wdiv svg,.w-out svg{width:100%;display:block}

/* ═══ SHARED ═══ */
.container{max-width:1080px;margin:0 auto;padding:0 24px}
section{position:relative;overflow:hidden;padding:100px 0}
.bg-fill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;z-index:0}
.s-head{text-align:center;margin-bottom:56px;position:relative;z-index:1}
.sh-eye{
  display:block;font-weight:200;font-size:.52rem;letter-spacing:.40em;
  text-transform:uppercase;color:var(--gold);margin-bottom:12px;
}
.sh-h{
  font-family:var(--ff-d);font-weight:300;font-style:italic;
  font-size:clamp(2rem,5vw,3.2rem);color:var(--deep);line-height:1.1;
}
.sh-h em{font-style:italic;color:var(--rose)}
.sh-eye--lt{color:rgba(200,168,112,.6)}
.sh-h--lt{color:var(--ivory)}
.sh-h--lt em{color:var(--gold)}

/* ═══ LUXURY ANIMATION 6: SILK FADE scroll-in ═══
   Slower than T01's .8s — T03 uses 1.2s editorial pace
════════════════════════════════════════════════ */
.scroll-in{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .9s var(--editorial),transform .75s var(--spring);
  transition-delay:var(--sd,0s);
}
.scroll-in.vis{opacity:1;transform:translateY(0)}
body:not(.pl-active) .scroll-in:not(.vis){animation:scrollInFallback .01s 5s forwards}
@keyframes scrollInFallback{to{opacity:1;transform:none}}

/* ═══ LUXURY ANIMATION 3: PLATINUM LINE DRAW ═══
   A hairline SVG underline that draws across headings on entry.
   Applied to .sh-line elements via JS IntersectionObserver.
═══════════════════════════════════════════════ */
.sh-line-wrap{
  display:flex;justify-content:center;margin-bottom:40px;overflow:hidden;
}
.sh-line{
  height:1px;width:0;
  background:linear-gradient(to right,transparent,var(--gold),transparent);
  transition:width 1.4s var(--editorial);
}
.sh-line.drawn{width:min(200px,40vw)}

/* ═══ INVITATION ═══ */
.s-invite{background:var(--cream);padding-top:0;padding-bottom:80px}
.s-invite .bg-fill{opacity:.05;mix-blend-mode:multiply}

.invite-couple-bg{
  position:absolute;right:-2%;bottom:0;
  width:48%;max-width:380px;
  mix-blend-mode:multiply;opacity:.08;z-index:1;
  pointer-events:none;
  animation:coupleFloat 8s ease-in-out infinite;
}
@keyframes coupleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media(max-width:640px){.invite-couple-bg{width:70%;right:-5%;opacity:.06}}

/* No toran for T03 — replaced by geometric border strip */
.toran{position:absolute;top:0;left:0;right:0;height:80px;overflow:hidden;z-index:2;pointer-events:none}
.toran-img{width:100%;height:100%;object-fit:cover;object-position:top center}

.fl-moon{position:absolute;top:12%;right:3%;width:72px;mix-blend-mode:multiply;z-index:2;animation:moonFloat 9s ease-in-out infinite;pointer-events:none;opacity:.6}
.fl-leaf-l{position:absolute;bottom:14%;left:1%;width:68px;mix-blend-mode:multiply;z-index:2;animation:leafL 8s ease-in-out infinite;pointer-events:none;opacity:.55}
.fl-leaf-r{position:absolute;bottom:12%;right:1%;width:60px;mix-blend-mode:multiply;z-index:2;animation:leafR 9s ease-in-out infinite 4s;pointer-events:none;opacity:.5}
@keyframes moonFloat{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-10px) rotate(3deg)}}

.s-invite .container{position:relative;z-index:3;padding-top:120px}

/* ═══ LUXURY ANIMATION 1: SHIMMER SWEEP on invite card ═══ */
.invite-card{
  max-width:520px;margin:0 auto;
  background:rgba(248,244,237,0.82);
  backdrop-filter:blur(14px) saturate(120%) brightness(1.02);
  -webkit-backdrop-filter:blur(14px) saturate(120%) brightness(1.02);
  border-top:1px solid rgba(255,255,255,0.70);
  border-left:1px solid rgba(255,255,255,0.50);
  border-right:1px solid rgba(200,168,112,0.20);
  border-bottom:1px solid rgba(200,168,112,0.16);
  padding:52px 44px;text-align:center;
  position:relative;overflow:hidden;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.55),
    inset 0 -1px 0 rgba(42,36,32,0.04),
    0 20px 60px rgba(42,36,32,0.08),
    0 0 0 1px rgba(200,168,112,0.10);
  transition:transform .65s var(--jelly),box-shadow .65s var(--jelly);
}
@media(pointer:fine){
  .invite-card:hover{
    transform:scale(1.012) rotate(0.3deg);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.65),
      0 32px 80px rgba(42,36,32,0.12),
      0 0 0 1px rgba(200,168,112,0.22);
  }
}
/* Shimmer line sweeps across card on scroll-in */
.invite-card::before{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.18) 50%,transparent 80%);
  transform:translateX(-100%);
  transition:transform 1.6s var(--editorial);
  pointer-events:none;z-index:10;
}
.invite-card.vis::before{transform:translateX(100%)}
@media(max-width:480px){.invite-card{padding:36px 20px}}

.card-tl,.card-tr{position:absolute;top:0}
.card-tl{left:0}.card-tr{right:0}

.i-ganesha{margin-bottom:16px;display:flex;justify-content:center}
.i-ganesha-img{
  width:90px;height:90px;object-fit:contain;mix-blend-mode:multiply;
  filter:drop-shadow(0 4px 16px rgba(200,168,112,.30));
  animation:lotusFloat 5s ease-in-out infinite;
}
/* Lotus floats + breathes */
@keyframes lotusFloat{
  0%,100%{transform:scale(1) translateY(0)}
  50%{transform:scale(1.04) translateY(-3px)}
}
.i-rule{margin:14px auto;max-width:280px;display:flex;justify-content:center}
.i-bless{font-family:var(--ff-s);font-style:italic;font-size:.88rem;line-height:2;color:rgba(42,36,32,.6);margin-bottom:12px}
.i-label{font-size:.50rem;font-weight:200;letter-spacing:.36em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.i-names{display:flex;align-items:baseline;justify-content:center;gap:10px;margin:4px 0 16px;flex-wrap:wrap}
.i-bride,.i-groom{
  font-family:var(--ff-d);font-style:italic;font-weight:400;
  font-size:clamp(2rem,5.5vw,3.2rem);color:var(--deep);
  opacity:0;transform:translateY(28px) scale(.90);
  transition:opacity 1.1s var(--editorial),transform 1.1s var(--editorial);
}
.i-amp{
  font-family:var(--ff-s);font-style:italic;font-size:1.4rem;color:var(--gold);
  opacity:0;transform:scale(.6);
  transition:opacity .9s var(--editorial) .3s,transform .9s var(--editorial) .3s;
}
.invite-card.vis .i-bride{opacity:1;transform:translateY(0) scale(1);transition-delay:.14s}
.invite-card.vis .i-amp  {opacity:1;transform:scale(1);transition-delay:.36s}
.invite-card.vis .i-groom{opacity:1;transform:translateY(0) scale(1);transition-delay:.56s}
.i-fam{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin:14px 0;font-family:var(--ff-b);font-weight:300;font-size:.76rem;line-height:2;color:rgba(42,36,32,.55)}
.i-fam em{font-style:italic;color:var(--deep);display:block;font-size:.84rem}
.fam-dot{color:var(--gold);align-self:center;font-size:.65rem;opacity:.6}
.i-close{font-family:var(--ff-s);font-style:italic;font-size:.82rem;color:var(--deep);opacity:.5;margin-top:12px}

/* ═══ EVENTS — warm cream section ═══ */
.s-events{background:#F5F0E6;padding:120px 0 160px}
.s-events .bg-fill{opacity:.04;mix-blend-mode:multiply}
.ev-paper-veil{
  position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(248,244,237,.90) 0%,rgba(240,232,212,.80) 100%);
  pointer-events:none;
}
.s-events .container,.s-events .s-head{position:relative;z-index:2}
.s-events .fl-leaf-l{top:8%;bottom:auto;opacity:.35}
.s-events .fl-leaf-r{top:14%;bottom:auto;opacity:.28}

/* Journey line — platinum */
.ev-journey-wrap{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.ev-journey-svg{position:absolute;top:0;left:0;width:100%;height:100%;overflow:visible}
.ej-track{stroke:rgba(176,160,128,.10);stroke-width:1;stroke-dasharray:4 10}
.ej-drawn{stroke:rgba(176,160,128,.28);stroke-width:1;stroke-linecap:round;transition:stroke-dashoffset .04s linear}

.ev-float-stage{
  position:relative;z-index:2;
  --row-gap:160px;--icon-w:190px;
  display:grid;
  grid-template-columns:repeat(var(--ev-cols,3),1fr);
  grid-template-rows:auto auto;
  column-gap:0;row-gap:0;
  padding:20px 40px 40px;
}
.ev-row1{grid-row:1;align-self:start}
.ev-row2{grid-row:2;align-self:start;margin-top:-60px}
.ev-row2:nth-child(4){margin-top:0px}
.ev-row2:nth-child(5){margin-top:-40px}
.ev-row2:nth-child(6){margin-top:20px}
.ev-float-stage[data-ev-count="4"]{max-width:70%;margin-left:auto;margin-right:auto;}

@media(max-width:680px){
  .ev-float-stage{display:flex;flex-direction:column;align-items:center;gap:60px;padding:20px 0 20px}
  .ev-row2{margin-top:0!important}
}

.ev-node{text-align:center;cursor:pointer;padding:8px 12px 16px;width:100%;max-width:var(--icon-w);margin:0 auto}

.ev-icon-wrap{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  transition:transform .9s var(--editorial),filter .9s var(--editorial);
}
.ev-node:nth-child(1) .ev-icon-wrap{animation:evFloat 7s ease-in-out infinite}
.ev-node:nth-child(2) .ev-icon-wrap{animation:evFloat 7.8s ease-in-out infinite 1.4s}
.ev-node:nth-child(3) .ev-icon-wrap{animation:evFloat 6.4s ease-in-out infinite .7s}
.ev-node:nth-child(4) .ev-icon-wrap{animation:evFloat 8.2s ease-in-out infinite 2.5s}
.ev-node:nth-child(5) .ev-icon-wrap{animation:evFloat 7.2s ease-in-out infinite 1.0s}
.ev-node:nth-child(6) .ev-icon-wrap{animation:evFloat 6.8s ease-in-out infinite 2.0s}
@keyframes evFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.ev-node:hover .ev-icon-wrap{transform:translateY(-10px) scale(1.04);animation-play-state:paused}
/* ═══ LUXURY ANIMATION 2: ARCH SHIMMER on icon hover ═══ */
.ev-node:hover .ev-icon{
  filter:drop-shadow(0 10px 24px rgba(200,168,112,.30))
         drop-shadow(0 2px 8px rgba(42,36,32,.08));
}
.ev-node:hover .ev-glow{opacity:1;transform:scale(1.3)}

/* Icons — multiply on light bg, fine-line charcoal */
.ev-icon{
  width:82px;height:82px;object-fit:contain;mix-blend-mode:multiply;
  display:block;position:relative;z-index:1;
  filter:drop-shadow(0 4px 12px rgba(176,160,128,.18)) drop-shadow(0 1px 4px rgba(42,36,32,.06));
  transition:filter .9s var(--editorial);
  opacity:.88;
}
.ev-node--hero .ev-icon{width:100px;height:100px;opacity:.95}
@media(max-width:680px){
  .ev-icon{width:108px!important;height:108px!important}
  .ev-node--hero .ev-icon{width:132px!important;height:132px!important}
}

.ev-glow{
  position:absolute;inset:-20px;border-radius:50%;
  background:radial-gradient(circle,rgba(200,168,112,.12) 0%,rgba(200,168,112,0) 68%);
  z-index:0;opacity:.4;transition:opacity .9s ease,transform .9s ease;
}

/* Labels */
.ev-label{margin-top:12px;transition:transform .6s var(--editorial)}
.ev-name{display:block;font-family:var(--ff-d);font-style:italic;font-weight:300;font-size:1rem;color:var(--deep);line-height:1.2}
.ev-date{display:block;margin-top:4px;font-size:.50rem;font-weight:300;letter-spacing:.20em;text-transform:uppercase;color:var(--deep);opacity:.55}
.ev-node:hover .ev-label{transform:translateY(2px)}

.ev-detail{
  margin-top:10px;opacity:0;transform:translateY(6px);max-height:0;overflow:hidden;
  transition:opacity .8s var(--editorial),transform .8s var(--editorial),max-height .8s var(--editorial);
}
.ev-node:hover .ev-detail,.ev-node.ev-active .ev-detail{opacity:1;transform:translateY(0);max-height:140px}
.ev-venue{font-size:.54rem;font-weight:300;letter-spacing:.18em;text-transform:uppercase;color:rgba(200,168,112,.80);margin-bottom:4px}
.ev-desc{font-family:var(--ff-s);font-style:italic;font-size:.74rem;line-height:1.7;color:var(--deep);opacity:.55;margin-bottom:8px}
.ev-cta{display:inline-block;font-size:.48rem;font-weight:300;letter-spacing:.24em;text-transform:uppercase;color:var(--rose);border-bottom:1px solid rgba(200,168,112,.25);padding-bottom:1px;transition:border-color .3s,letter-spacing .3s}
.ev-cta:hover{border-color:var(--rose);letter-spacing:.32em}

/* ═══ DIVIDERS — platinum hairline ═══ */
.leaf-div{padding:6px 0;background:var(--cream);line-height:0}
.leaf-div svg{width:100%;display:block}
.diya-div{padding:3px 0;background:var(--cream);line-height:0}
.diya-div svg{width:100%;display:block}

/* ═══ STORY — warm white stage with champagne curtains ═══ */
.s-story{position:relative;background:var(--cream);padding:0;overflow:hidden}
.st-paper-bg{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(ellipse 65% 55% at 50% 42%,rgba(200,168,112,.10) 0%,transparent 62%),
    linear-gradient(180deg,#F8F4ED 0%,#F0E8D4 100%);
}
.st-stage{position:relative;width:100%;height:532px;overflow:hidden}
@media(max-width:900px){.st-stage{height:448px}}
@media(max-width:600px){.st-stage{height:392px}}
@media(max-width:420px){.st-stage{height:350px}}

.st-reveal{
  position:absolute;top:0;left:0;right:0;bottom:0;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  text-align:center;pointer-events:none;padding:48px 24px 60px;
}
.st-mandala{
  position:absolute;top:38%;left:50%;transform:translate(-50%,-50%);
  z-index:0;pointer-events:none;opacity:0;
  transition:opacity 2.0s var(--editorial) .8s;
}
.st-reveal.revealed .st-mandala{opacity:1}
.st-rv-inner{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:100%}
.st-rv-header{
  margin-bottom:14px;opacity:0;transform:translateY(16px);
  transition:opacity 1.2s var(--editorial),transform 1.2s var(--editorial);
}
.st-rv-header .sh-eye{display:block;font-weight:200;font-size:.52rem;letter-spacing:.40em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.st-rv-header .sh-h{font-family:var(--ff-d);font-weight:300;font-style:italic;font-size:clamp(1.6rem,3.8vw,2.6rem);color:var(--deep);line-height:1.1}
.st-rv-header .sh-h em{font-style:italic;color:var(--rose)}
.st-rv-names{
  display:flex;align-items:baseline;justify-content:center;gap:12px;flex-wrap:wrap;margin-bottom:10px;
  opacity:0;transform:translateY(28px) scale(.82);
  transition:opacity 1.3s var(--editorial) .22s,transform 1.3s var(--editorial) .22s;
}
.st-rv-bride,.st-rv-groom{font-family:var(--ff-d);font-style:italic;font-weight:400;font-size:clamp(2.2rem,5.2vw,4rem);color:var(--deep)}
.st-rv-amp{font-family:var(--ff-s);font-style:italic;font-size:clamp(1.1rem,2.2vw,1.6rem);color:var(--gold)}
.st-rv-verse{
  font-family:var(--ff-s);font-style:italic;font-size:clamp(.82rem,1.7vw,.94rem);
  color:var(--deep);line-height:2;margin-bottom:18px;opacity:0;transform:translateY(14px);
  transition:opacity 1.0s var(--editorial) .44s,transform 1.0s var(--editorial) .44s;
}
.st-rv-tags{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;width:min(340px,88%);justify-items:stretch}
.st-rv-tag{
  font-size:.50rem;font-weight:300;letter-spacing:.16em;text-transform:uppercase;
  color:var(--deep);padding:7px 14px;
  background:rgba(248,244,237,.85);border:1px solid rgba(200,168,112,.30);text-align:center;
  opacity:0;transform:translateY(10px);
  transition:opacity .7s var(--editorial),transform .7s var(--editorial);
}
.st-rv-tag:nth-child(1){transition-delay:.62s}
.st-rv-tag:nth-child(2){transition-delay:.76s}
.st-rv-tag:nth-child(3){transition-delay:.90s}
.st-rv-tag:nth-child(4){transition-delay:1.04s}
.st-reveal.revealed .st-rv-header{opacity:1;transform:translateY(0)}
.st-reveal.revealed .st-rv-names {opacity:1;transform:translateY(0) scale(1)}
.st-reveal.revealed .st-rv-verse {opacity:.68;transform:translateY(0)}
.st-reveal.revealed .st-rv-tag   {opacity:1;transform:translateY(0)}

.st-petals{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:9}

/* Curtains — champagne linen with gold ribbon edge */
.st-curtains{position:absolute;top:0;left:0;right:0;bottom:0;z-index:4;pointer-events:none}
.st-curt{
  position:absolute;top:0;bottom:0;width:50%;
  overflow:hidden;will-change:transform;transition:filter 1.6s ease;
  /* Warm cream backing so curtain fabric reads clearly */
  background:#F0E8D4;
}
.st-curt-l{left:0;transform-origin:left center}
.st-curt-r{right:0;transform-origin:right center}
.st-curt-img{display:block;position:absolute;top:0;height:100%;width:auto;max-width:none;mix-blend-mode:multiply}
.st-curt-l .st-curt-img{right:0;left:auto;filter:drop-shadow(6px 0 32px rgba(42,36,32,.22))}
.st-curt-r .st-curt-img{left:0;right:auto;transform:scaleX(-1);filter:drop-shadow(-6px 0 32px rgba(42,36,32,.22))}
.st-curt-shadow{position:absolute;top:0;bottom:0;width:50px;pointer-events:none;z-index:2}
.st-curt-shadow-l{right:0;background:linear-gradient(to right,transparent,rgba(42,36,32,.10))}
.st-curt-shadow-r{left:0;background:linear-gradient(to left,transparent,rgba(42,36,32,.10))}

/* Characters — equal fixed height so bride (wide) matches groom (portrait) */
.st-char{position:absolute;bottom:0;z-index:6;pointer-events:none}
/* Groom: portrait image — 30% shorter. Bride: landscape image — naturally smaller */
.st-groom {
  right: calc(50% - clamp(90px, 10vw, 170px) - 12px);
  width: clamp(90px, 10vw, 170px); /* Keep groom narrow (portrait) */
}

.st-bride {
  /* We increase the width significantly because her image is short/wide */
  left: calc(50% - clamp(160px, 18vw, 240px) - 12px); 
  width: clamp(160px, 18vw, 240px); /* Increased from 150px/18vw */
}
.st-char-img{
  display:block;width:100%;
  object-fit:contain;object-position:bottom center;
  mix-blend-mode:multiply;
  filter:drop-shadow(0 6px 18px rgba(42,36,32,.10));
}
/* Update these lines to ensure they SCALE together */
.st-groom .st-char-img, 
.st-bride .st-char-img {
  display: block;
  width: 100%;
  height: auto; /* This prevents the 'elongated' stretching */
  object-fit: contain;
  mix-blend-mode: multiply;
  filter: drop-shadow(0 6px 18px rgba(42,36,32,.10));
  /* Set a matching max-height so they appear equal on screen */
  max-height: clamp(250px, 40vh, 400px); 
}
.st-bride .st-char-img{animation:stIdleFloat 7s ease-in-out infinite}
.st-groom .st-char-img{animation:stIdleFloat 7.8s ease-in-out infinite 1.4s}
@keyframes stIdleFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.st-bride.st-pull .st-char-img{animation:bridePull .80s cubic-bezier(0.4,0,0.2,1) forwards}
@keyframes bridePull{0%{transform:translateY(0) translateX(0) rotate(0deg)}50%{transform:translateY(-9px) translateX(-12px) rotate(-3deg)}100%{transform:translateY(-5px) translateX(-9px) rotate(-2deg)}}
.st-bride.st-tension .st-char-img{animation:brideTension .45s ease-in-out forwards}
@keyframes brideTension{0%{transform:translateY(-5px) translateX(-9px) rotate(-2deg)}50%{transform:translateY(-7px) translateX(-11px) rotate(-2.5deg)}100%{transform:translateY(-4px) translateX(-8px) rotate(-1.5deg)}}
.st-groom.st-pull .st-char-img{animation:groomPull .80s cubic-bezier(0.4,0,0.2,1) forwards}
@keyframes groomPull{0%{transform:translateY(0) translateX(0) rotate(0deg)}50%{transform:translateY(-9px) translateX(12px) rotate(3deg)}100%{transform:translateY(-5px) translateX(9px) rotate(2deg)}}
.st-groom.st-tension .st-char-img{animation:groomTension .45s ease-in-out forwards}
@keyframes groomTension{0%{transform:translateY(-5px) translateX(9px) rotate(2deg)}50%{transform:translateY(-7px) translateX(11px) rotate(2.5deg)}100%{transform:translateY(-4px) translateX(8px) rotate(1.5deg)}}
/* Mobile: proportional characters — groom naturally taller (portrait image) */
@media(max-width:600px){
  .st-bride{left:0;transform-origin:right bottom;width:clamp(120px,35vw,180px)}
  .st-groom{right:0;width:clamp(90px,24vw,145px)}
  .st-groom .st-char-img{height:auto!important;max-height:clamp(80px,18vh,105px)!important}
  .st-bride .st-char-img{height:auto!important;max-height:clamp(70px,15vh,90px)!important}
}

/* ═══ GALLERY ═══ */
.s-gallery{background:#F5F0E6}
.s-gallery .bg-fill{opacity:.04}
.s-gallery .container{position:relative;z-index:1}
.gal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:640px){.gal-grid{grid-template-columns:repeat(4,1fr)}}
.gal-item{
  aspect-ratio:4/5;overflow:hidden;
  transition:transform .8s var(--editorial);
}
/* ═══ LUXURY ANIMATION 1: SHIMMER SWEEP on gallery hover ═══ */
.gal-item{position:relative}
.gal-item::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.12) 50%,transparent 80%);
  transform:translateX(-100%);
  transition:transform 1.0s var(--editorial);
  pointer-events:none;
}
.gal-item:hover{transform:scale(1.01)}
.gal-item:hover::after{transform:translateX(100%)}
.gal-tall{aspect-ratio:3/5}
@media(min-width:640px){.gal-tall{grid-row:span 2;aspect-ratio:auto}}
.gal-ph{width:100%;height:100%;background:linear-gradient(135deg,#EEE8D8,#F5EFE4);border:1px solid rgba(200,168,112,.10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.gal-m{font-family:var(--ff-d);font-style:italic;font-weight:300;font-size:1.6rem;color:var(--gold);opacity:.5}
.gal-s{font-size:.50rem;font-weight:200;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);opacity:.35}

/* ═══ THINGS TO KNOW ═══ */
.s-things{position:relative;padding:110px 0;overflow:hidden;background:#F0EAD8}
.things-sky{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.04;mix-blend-mode:multiply}
.things-veil{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(ellipse 65% 50% at 50% 28%,rgba(200,168,112,.10) 0%,transparent 60%),
    linear-gradient(180deg,#F0EAD8 0%,#E8DFCA 100%);
}
.s-things .container{position:relative;z-index:2}
.tt-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:680px;margin:0 auto}
@media(min-width:640px){.tt-row{grid-template-columns:repeat(auto-fit,minmax(130px,175px));justify-content:center;gap:20px}}
/* ═══ LUXURY ANIMATION 1: SHIMMER on knowledge cards ═══ */
.tt{
  background:rgba(248,244,237,.75);border:1px solid rgba(200,168,112,.18);
  padding:30px 14px;text-align:center;position:relative;overflow:hidden;
  transition:background .5s,border-color .5s,transform .5s var(--editorial),box-shadow .5s;
}
.tt::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.12) 50%,transparent 80%);
  transform:translateX(-100%);transition:transform 1.0s var(--editorial);pointer-events:none;
}
.tt:hover{
  background:rgba(248,244,237,.95);border-color:rgba(200,168,112,.40);
  transform:translateY(-3px);
  box-shadow:0 12px 32px rgba(42,36,32,.06),0 3px 10px rgba(200,168,112,.08);
}
.tt:hover::after{transform:translateX(100%)}
.tt-ic{margin:0 auto 10px;display:block}
.tt-l{display:block;font-size:.48rem;font-weight:300;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:8px}
.tt-v{font-family:var(--ff-s);font-style:italic;font-size:.88rem;line-height:1.65;color:var(--deep)}
.tt-ig{text-align:center;margin-top:38px;font-size:.52rem;letter-spacing:.20em;text-transform:uppercase;color:rgba(42,36,32,.35)}
.tt-ig a{color:var(--gold);display:block;margin-top:6px;font-size:.72rem;letter-spacing:.05em;text-transform:none}
.tt-ig a:hover{text-decoration:underline}

/* ═══ RSVP — warm champagne section ═══ */
.s-rsvp{position:relative;background:#F8F4ED;padding:120px 0 100px;overflow:hidden}
.rsvp-paper-veil{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 50% at 50% 30%,rgba(200,168,112,.07) 0%,transparent 58%),
    linear-gradient(180deg,#F8F4ED 0%,#F0E8D4 100%);
}
.rsvp-florals{position:absolute;inset:0;pointer-events:none;z-index:0}
.rsvp-fl{position:absolute}
.rsvp-fl--tl{top:-30px;left:-30px;width:180px;height:180px}
.rsvp-fl--br{bottom:-30px;right:-30px;width:180px;height:180px;transform:rotate(180deg)}
.rsvp-fl--tr{top:-20px;right:5%;width:120px;height:120px}
.rsvp-fl--bl{bottom:-20px;left:5%;width:120px;height:120px}
.s-diya-l{position:absolute;left:4%;top:18%;width:clamp(44px,5.5vw,72px);filter:drop-shadow(0 4px 12px rgba(42,36,32,.08));animation:swing 4.8s ease-in-out infinite;z-index:1;mix-blend-mode:multiply;opacity:.65}
.s-diya-r{position:absolute;right:4%;top:22%;width:clamp(40px,5vw,66px);filter:drop-shadow(0 4px 12px rgba(42,36,32,.08));animation:swingR 4.8s ease-in-out infinite 2.4s;z-index:1;mix-blend-mode:multiply;opacity:.65}
.rsvp-toran{position:absolute;top:0;left:0;right:0;height:90px;overflow:hidden;z-index:2;pointer-events:none}

.rsvp-body{position:relative;z-index:1;text-align:center}
.rsvp-rule{display:flex;justify-content:center;margin-bottom:14px}
.rsvp-eye{display:block;font-weight:200;font-size:.52rem;letter-spacing:.40em;text-transform:uppercase;color:var(--rose);margin-bottom:12px;position:relative;z-index:1}
.rsvp-heading{font-family:var(--ff-d);font-weight:300;font-style:italic;font-size:clamp(2.2rem,5vw,3.8rem);color:var(--deep);line-height:1.1;margin-bottom:16px;position:relative;z-index:1}
.rsvp-heading em{font-style:italic;color:var(--rose)}
.rsvp-sub{font-family:var(--ff-s);font-style:italic;font-size:.94rem;line-height:1.95;color:var(--deep);opacity:.65;max-width:480px;margin:0 auto 44px;position:relative;z-index:1}
.rsvp-cta-wrap{margin-bottom:24px;position:relative;z-index:1}

/* ═══ LUXURY ANIMATION 1: SHIMMER on RSVP button ═══ */
.rsvp-wa-btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  text-decoration:none;overflow:hidden;
  border-radius:1px;
  background:var(--deep);
  box-shadow:0 2px 0 rgba(255,255,255,.04) inset,0 1px 0 rgba(0,0,0,.08) inset,
             0 6px 28px rgba(42,36,32,.14),0 0 0 1px rgba(200,168,112,.20);
  padding:0;cursor:pointer;
  transition:transform .7s var(--editorial),box-shadow .7s var(--editorial);
}
.rsvp-wa-shimmer{
  position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.10) 50%,transparent 75%);
  transform:translateX(-100%);transition:transform .9s var(--editorial);
  pointer-events:none;z-index:0;
}
.rsvp-wa-btn:hover .rsvp-wa-shimmer{transform:translateX(100%)}
.rsvp-wa-btn:hover{
  transform:translateY(-3px) scale(1.01);
  box-shadow:0 2px 0 rgba(255,255,255,.04) inset,0 1px 0 rgba(0,0,0,.08) inset,
             0 14px 40px rgba(42,36,32,.18),0 4px 14px rgba(200,168,112,.14),
             0 0 0 1px rgba(200,168,112,.35);
}
.rsvp-wa-btn:active{
  transform:translateY(1px) scale(0.975);
  transition-duration:.08s;
  box-shadow:
    inset 0 2px 5px rgba(42,36,32,.14),
    inset 0 1px 0 rgba(0,0,0,.08),
    0 1px 4px rgba(200,168,112,.15);
}
@media(max-width:520px){.rsvp-wa-btn:hover{transform:none}}
.rsvp-wa-inner{
  position:relative;z-index:1;display:flex;align-items:center;gap:10px;
  padding:18px 52px;font-family:var(--ff-b);font-size:.66rem;font-weight:300;
  letter-spacing:.30em;text-transform:uppercase;color:var(--ivory);white-space:nowrap;
}
.rsvp-wa-icon{flex-shrink:0;opacity:.8;transition:opacity .4s,transform .5s var(--editorial)}
.rsvp-wa-btn:hover .rsvp-wa-icon{opacity:1;transform:scale(1.10)}
@media(max-width:520px){
  .rsvp-wa-inner{padding:16px 28px;letter-spacing:.22em;font-size:.60rem}
  .rsvp-wa-btn{width:min(340px,90vw)}
}
.rsvp-ps{font-size:.54rem;font-weight:200;letter-spacing:.14em;color:var(--deep);opacity:.30;margin-bottom:18px;position:relative;z-index:1}
.burst-p{position:fixed;pointer-events:none;z-index:9000;mix-blend-mode:multiply}

/* ═══ FOOTER — LIGHT champagne (T03 inversion of T01/T02) ═══ */
.footer{
  background:linear-gradient(170deg,#F0E8D4 0%,#E8DFC8 100%);
  padding:70px 24px 48px;text-align:center;position:relative;overflow:hidden;
}
.footer::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse 55% 45% at 50% 0%,rgba(200,168,112,.08) 0%,transparent 60%);
  pointer-events:none;
}
.ft-lotus{margin:0 auto 18px;display:block;position:relative;z-index:1}
.ft-names{font-family:var(--ff-d);font-style:italic;font-weight:300;font-size:clamp(1.8rem,4vw,2.6rem);color:var(--deep);margin-bottom:14px;position:relative;z-index:1}
.ft-rule{width:48px;height:1px;background:linear-gradient(to right,transparent,var(--gold),transparent);margin:0 auto 18px;position:relative;z-index:1}
.ft-date{font-size:.58rem;font-weight:200;letter-spacing:.26em;text-transform:uppercase;color:rgba(42,36,32,.42);margin-bottom:28px;position:relative;z-index:1}
.ft-credit{font-size:.56rem;opacity:.28;letter-spacing:.08em;position:relative;z-index:1;color:var(--deep)}
.ft-credit a{color:var(--gold);opacity:1}

/* ═══ RESPONSIVE ═══ */
section{padding:80px 0}
.hero-wrap,.hero-pin{padding:0!important}
.container{max-width:1080px;margin:0 auto;padding:0 20px}
@media(min-width:640px){section{padding:100px 0}.container{padding:0 32px}.ev-float-stage{padding:20px 24px 40px}.tt-row{grid-template-columns:repeat(auto-fit,minmax(130px,175px));justify-content:center;gap:20px}}
@media(min-width:1024px){
  section{padding:120px 0}.container{padding:0 48px}
  .invite-card{max-width:620px;padding:68px 76px}.s-invite .container{padding-top:160px}
  .ev-float-stage{padding:40px 60px 60px}.ev-icon{width:100px!important;height:100px!important}.ev-node--hero .ev-icon{width:122px!important;height:122px!important}.ev-name{font-size:1.08rem}
  .st-stage{height:580px}.st-char{width:clamp(190px,22vw,300px)}.st-groom{width:clamp(130px,15vw,205px)}
  .st-groom .st-char-img{height:auto!important}
  .st-bride .st-char-img{height:auto!important}
  .tt-row{max-width:780px;gap:22px}.tt{padding:34px 18px}.tt-v{font-size:.96rem}
  .s-rsvp{padding:140px 0 120px}.rsvp-heading{font-size:clamp(2.8rem,4.8vw,4.2rem)}.rsvp-sub{font-size:1.02rem;max-width:520px}
  .sh-h{font-size:clamp(2.2rem,3.8vw,3.4rem)}.s-head{margin-bottom:64px}
}
@media(min-width:1400px){.container{max-width:1200px}.ev-float-stage{padding:40px 80px 80px}.st-stage{height:800px}.st-groom{width:clamp(115px,13vw,175px)}.st-bride{width:clamp(155px,19vw,250px)}}
@media(max-width:480px){
  section{padding:64px 0}.container{padding:0 16px}.s-head{margin-bottom:40px}.sh-h{font-size:clamp(1.7rem,7vw,2.4rem)}
  .invite-card{padding:28px 16px}.i-names{gap:6px}
  .tt-row{grid-template-columns:1fr 1fr;gap:10px}.tt{padding:20px 10px}
  .ev-float-stage{gap:48px;padding:12px 0 24px}.ev-node{padding:6px 8px 12px}.ev-name{font-size:.94rem}.ev-date{font-size:.48rem}.ev-desc{font-size:.70rem}
  .st-stage{height:336px}.st-char{width:clamp(155px,43vw,230px)}.st-groom{right:0;width:clamp(105px,29vw,140px)}.st-groom .st-char-img{height:auto!important;max-height:clamp(70px,16vh,92px)!important}.st-bride .st-char-img{height:auto!important;max-height:clamp(60px,13vh,80px)!important}
  .rsvp-heading{font-size:clamp(1.9rem,7vw,2.6rem)}.rsvp-sub{font-size:.84rem}.rsvp-wa-inner{padding:15px 22px;font-size:.58rem;letter-spacing:.18em}
  .ft-names{font-size:1.5rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01s!important;transition-duration:.01s!important}}

/* ══ MUSIC TOGGLE — compact circle ══ */
.music-btn{
  position:fixed;bottom:calc(20px + env(safe-area-inset-bottom));right:20px;z-index:9999;
  width:36px;height:36px;border-radius:50%;
  border:none;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:rgba(42,36,32,0.88);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  box-shadow:0 0 0 1px rgba(200,168,112,0.45),0 4px 16px rgba(0,0,0,.30);
  cursor:pointer;overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease;
;font-size:18px;line-height:1}
.music-btn:hover{transform:scale(1.08)}
.music-btn:active{transform:scale(0.92)}
.music-btn.playing{box-shadow:0 0 0 1.5px rgba(200,168,112,0.80),0 0 14px rgba(200,168,112,.30),0 4px 16px rgba(0,0,0,.30)}

@media(max-width:520px){.music-btn{width:32px;height:32px;right:12px;font-size:16px}}

/* ══ INVITE CARD — FAMILY ALIGNMENT ══ */
.i-fam{display:flex;align-items:flex-start;justify-content:center;gap:clamp(12px,4vw,30px);margin:14px 0 10px;text-align:center}
.fam-side{flex:1;max-width:190px;display:flex;flex-direction:column;align-items:center;gap:8px}
.fam-gp{font-family:var(--ff-s);font-style:italic;font-weight:300;font-size:.68rem;color:rgba(42,36,32,.65);line-height:1.6;padding-bottom:6px;border-bottom:1px solid rgba(200,168,112,.15);width:100%}
.fam-gp em{font-style:italic;font-size:.62rem;display:block;color:var(--rose);margin-bottom:2px}
.fam-parents{font-family:var(--ff-b);font-weight:300;font-size:.74rem;color:var(--deep);line-height:1.7}
.fam-parents em{font-family:var(--ff-s);font-style:italic;font-size:.78rem;display:block;color:rgba(42,36,32,.48)}
.fam-dot{flex-shrink:0;font-size:.85rem;color:var(--gold);margin-top:30px;opacity:.55}
@media(max-width:480px){.i-fam{flex-direction:column;align-items:center;gap:14px}.fam-dot{margin:0;transform:rotate(90deg)}.fam-side{max-width:100%}}
/* Music button: bottom-right with iOS safe-area handled in main .music-btn rule */
/* ═══ EVENTS FIX 1: hide timeline line on all screens ═══ */
.ev-journey-wrap{display:none!important}
/* ═══ EVENTS FIX 2: desktop grid — flat rows, z-index, detail height ═══ */
@media(min-width:681px){
  .ev-float-stage{row-gap:40px}
  .ev-row2,.ev-row2:nth-child(4),.ev-row2:nth-child(5),.ev-row2:nth-child(6){margin-top:0!important}
  .ev-node{position:relative;z-index:2}
  .ev-node:hover .ev-detail,.ev-node.ev-active .ev-detail{max-height:200px}
}
/* ═══ EVENTS FIX 3: font size +20% ═══ */
.ev-name{font-size:1.20rem}
.ev-date{font-size:0.60rem}
.ev-venue{font-size:0.65rem}
.ev-desc{font-size:0.89rem}
@media(min-width:1024px){.ev-name{font-size:1.30rem}}
@media(max-width:480px){.ev-name{font-size:1.13rem}.ev-date{font-size:0.58rem}.ev-desc{font-size:0.84rem}}