:root{--cream:#fff8e8;--gold:#c99a42;--gold2:#e7c878;--maroon:#651f25;--green:#123f34;--ink:#38251f;--serif:'Cormorant Garamond',Georgia,serif;--display:'Cinzel',Georgia,serif;--tamil:'Noto Serif Tamil',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--serif)}button,a{font:inherit}.wedding{overflow:hidden}.cover{height:100svh;min-height:680px;position:relative;display:grid;place-items:center;color:#fff8e8;text-align:center;background:#142f28;isolation:isolate}.coverbg{position:absolute;inset:0;background:#173e35;z-index:2}.coverbg:before,.coverbg:after{content:'';position:absolute;top:0;bottom:0;width:50%;background-image:url('https://poornesh-manvitha-wedding.netlify.app/temple-wedding-doors-maroon-v4.webp');background-size:200% 100%;background-repeat:no-repeat;z-index:5;transition:transform 1.15s cubic-bezier(.77,0,.18,1)}.coverbg:before{left:0;background-position:left center}.coverbg:after{right:0;background-position:right center}.cover.opening .coverbg:before{transform:translateX(-100%)}.cover.opening .coverbg:after{transform:translateX(100%)}.cover.opening .covercontent,.cover.opening .coverbottom{opacity:0;transition:opacity .35s ease}.cover.opening .coverbg{animation:none}.cover.opening .coverveil{opacity:.15;transition:opacity .8s ease}.coverveil{position:absolute;inset:0;background:linear-gradient(90deg,#2b170c33,#062f2870 50%,#2b170c33),linear-gradient(#120b0840,#120b0899);z-index:-1}.covercontent{position:relative;z-index:2;margin-top:-2vh}.covermantra{font-family:var(--tamil);font-size:14px;color:#f1d58b;margin-bottom:18px}.coverrule{color:#e6c46f;font-size:22px;margin:10px}.covercontent small,.coverbottom{font:10px var(--display);letter-spacing:.28em;color:#f0d897}.covercontent h1{font:500 clamp(64px,8vw,112px)/.95 var(--serif);margin:22px 0 12px}.covercontent p{font-size:22px;margin:0 0 20px}.coverdate{font:12px var(--display);letter-spacing:.35em;margin:16px}.covercontent button{margin-top:22px;border:1px solid #f0d897;background:#f8e5ad;color:#49301e;border-radius:40px;padding:16px 34px;min-width:230px;letter-spacing:.16em;font:11px var(--display);box-shadow:0 8px 30px #0004;cursor:pointer;transition:.35s}.covercontent button:hover{transform:translateY(-3px);background:#fff2c9}.covercontent button span{margin-left:14px;color:var(--maroon)}.coverbottom{position:absolute;bottom:24px;left:0;right:0;font-size:8px;color:#ead9ad}.invitation{background:var(--cream)}nav{position:fixed;z-index:30;top:0;width:100%;height:70px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#fff8e8ee,transparent);font-family:var(--display);font-size:9px;letter-spacing:.14em;color:var(--maroon);backdrop-filter:blur(5px)}nav b{font-family:var(--tamil);font-size:15px;color:var(--gold)}nav div{display:flex;gap:30px}nav a{color:inherit;text-decoration:none}.navbtn{border:1px solid #b7863f88;padding:10px 14px}.welcome{min-height:100svh;position:relative;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;padding:100px 7vw 70px;background:linear-gradient(90deg,#fff9e9f0 0%,#fff8e8bb 48%,#fff8e800 75%),url('https://poornesh-manvitha-wedding.netlify.app/hero-open-temple-emerald-desktop-v1.webp') center/cover}.thoranam{position:absolute;top:0;left:0;right:0;height:115px;background:linear-gradient(180deg,#fff8e8,#fff8e800);border-top:5px solid #caa25a55}.thoranam:after{content:'❀  ❧  ❀  ❧  ❀  ❧  ❀  ❧  ❀';position:absolute;top:12px;left:0;right:0;text-align:center;color:#6e8a35;font-size:32px;letter-spacing:12px}.welcome-copy{max-width:560px;position:relative;z-index:2}.tamil{display:block;font-family:var(--tamil);color:var(--maroon);font-size:16px;margin-bottom:12px}.welcome-copy small,.sectionhead small,.person small,.ceremonycard small,.reception small,.memories>small{font:9px var(--display);letter-spacing:.23em;color:var(--gold)}.welcome-copy h2{font:500 clamp(56px,7vw,104px)/.78 var(--serif);color:var(--maroon);margin:25px 0}.welcome-copy h2 i,.sectionhead h2 i,.reception h2 i,.memories h2 i{font-family:'Great Vibes',cursive;font-weight:400;color:#b47a35}.welcome-copy p{font-size:22px;line-height:1.35;color:#725d4e;max-width:520px}.datebox{display:flex;align-items:center;gap:18px;margin-top:32px;color:var(--maroon)}.datebox strong{font:500 72px/.8 var(--serif)}.datebox span{font:10px var(--display);letter-spacing:.16em;line-height:1.5}.welcome-temple{height:600px}.couple{padding:125px 7vw;background:#fffdf5}.sectionhead{text-align:center;max-width:760px;margin:0 auto 60px}.sectionhead h2{font:500 clamp(52px,6vw,82px)/.88 var(--serif);color:var(--maroon);margin:15px 0}.couplegrid{max-width:1180px;margin:auto;display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;gap:22px}.person{background:#fff;border:1px solid #b8874035;box-shadow:0 15px 50px #6c472016}.person img{width:100%;height:520px;object-fit:cover;display:block}.person div{padding:28px 30px 32px;text-align:center}.person h3{font:500 47px var(--serif);color:var(--maroon);margin:9px 0}.person p{margin:4px;color:#765f51;font-size:18px}.amp{font:500 64px var(--serif);color:var(--gold);text-align:center}.ceremony{min-height:900px;display:grid;place-items:center;position:relative;padding:110px 20px;background:linear-gradient(180deg,#123f34c9,#123f34e8),url('https://poornesh-manvitha-wedding.netlify.app/hero-open-temple-emerald-desktop-v1.webp') center/cover}.ceremony:before{content:'';position:absolute;inset:25px;border:1px solid #e7c87855}.lamp{position:absolute;top:90px;color:#e7c878;font-size:28px}.ceremonycard{width:min(720px,92vw);padding:70px 45px;text-align:center;background:#fff9eaf7;border:1px solid #d3aa5b;box-shadow:0 30px 80px #071d1770}.ceremonycard .tamil{font-size:18px}.ceremonycard h2{font:500 50px var(--serif);color:var(--maroon);margin:16px 0}.time{display:flex;justify-content:center;align-items:center;color:var(--maroon);margin:30px 0}.time strong{font:500 clamp(28px,3vw,40px)/1 var(--serif);letter-spacing:.01em}.time em{font:inherit;font-style:normal;margin:0 .12em}.goldline{width:110px;border-top:1px solid var(--gold);margin:30px auto}.ceremonycard h3{font:500 29px var(--serif);color:var(--maroon);margin:13px}.ceremonycard p{font-size:19px;color:#765f51}.ceremonycard a,footer a{display:inline-block;background:var(--maroon);color:#fff9ea;padding:13px 23px;text-decoration:none;font:9px var(--display);letter-spacing:.16em;margin-top:18px}.reception{display:grid;grid-template-columns:1fr 1fr;min-height:780px;background:#6a2026;color:#fff7e8}.reception img{width:100%;height:780px;object-fit:cover;object-position:center 45%}.reception>div{padding:80px;align-self:center}.reception .tamil{color:#e7c878}.reception small{color:#e7c878}.reception h2{font:500 clamp(60px,7vw,95px)/.78 var(--serif);margin:22px 0;color:#fff5df}.reception h3{font:11px var(--display);letter-spacing:.14em;color:#edd9b0}.reception strong{font:38px var(--serif);color:#e7c878}.reception p{font-size:23px;line-height:1.35;color:#edd9b0}.memories{padding:125px 7vw;background:#fff8e8;text-align:center}.memories h2{font:500 clamp(55px,6vw,80px)/.82 var(--serif);color:var(--maroon);margin:15px 0 55px}.grid{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.grid img{width:100%;height:320px;object-fit:cover;transition:.6s;filter:saturate(.9)}.grid img:hover{transform:scale(1.025);filter:saturate(1.05)}footer{padding:135px 20px 110px;text-align:center;color:#fff5df;background:linear-gradient(#173e35e8,#173e35e8),url('https://poornesh-manvitha-wedding.netlify.app/hero-open-temple-emerald-desktop-v1.webp') center/cover}footer .tamil{color:#e7c878;font-size:18px;margin:25px auto}footer h2{font:500 clamp(52px,6vw,86px)/.84 var(--serif);margin:25px auto;max-width:850px}footer p{font-size:24px;color:#e6d5b2}@keyframes slowzoom{from{transform:scale(1)}to{transform:scale(1.07)}}@media(max-width:800px){nav{height:62px}nav div{display:none}.covercontent h1{font-size:62px}.welcome{grid-template-columns:1fr;min-height:900px;padding:120px 24px 60px;background:linear-gradient(180deg,#fff9e9ef 0%,#fff8e880 55%,#fff8e800 100%),url('https://poornesh-manvitha-wedding.netlify.app/hero-open-temple-emerald-mobile-v1.webp') bottom/cover}.welcome-copy{text-align:center;margin:auto}.welcome-copy h2{font-size:62px}.welcome-copy p{font-size:19px}.datebox{justify-content:center}.welcome-temple{display:none}.couple{padding:90px 18px}.couplegrid{grid-template-columns:1fr}.amp{padding:0;font-size:44px}.person img{height:430px}.ceremony{min-height:760px;padding:80px 14px}.ceremonycard{padding:55px 22px}.ceremonycard h2{font-size:38px}.time strong{font-size:30px}.reception{grid-template-columns:1fr}.reception img{height:470px}.reception>div{padding:65px 25px}.grid{grid-template-columns:repeat(2,1fr);gap:9px}.grid img{height:190px}.memories{padding:90px 16px}footer{padding:100px 18px}.coverbottom{font-size:7px}}
.couple-single{padding:125px 7vw;background:#fffdf5}.single-photo{max-width:720px;margin:0 auto;border:1px solid #b8874035;padding:14px;background:#fff;box-shadow:0 25px 80px #6c472022}.single-photo img{display:block;width:100%;height:auto;object-fit:contain}.couple-single .sectionhead h2{margin-bottom:45px}.couple-details{max-width:1050px;margin:48px auto 0;display:grid;grid-template-columns:1fr 70px 1fr;align-items:center;gap:22px}.couple-details .person{background:#fff;border:1px solid #b8874035;box-shadow:0 15px 50px #6c472016}.couple-details .person div{padding:28px 30px 32px;text-align:center}.couple-details .person h3{font:500 42px var(--serif);color:var(--maroon);margin:9px 0}.couple-details .person p{margin:4px;color:#765f51;font-size:18px}.couple-details .person small{font:9px var(--display);letter-spacing:.23em;color:var(--gold)}.couple-details .amp{font:500 58px var(--serif);color:var(--gold);text-align:center}@media(max-width:800px){.couple-single{padding:90px 18px}.single-photo{padding:8px}.couple-details{grid-template-columns:1fr;gap:14px;margin-top:35px}.couple-details .amp{padding:0;font-size:44px}.couple-details .person h3{font-size:36px}}
.coverbg{background:transparent}.cover{overflow:hidden}.reveal-page{position:absolute;inset:0;z-index:1;background:var(--cream);opacity:1;pointer-events:none}.cover.opening .covercontent,.cover.opening .coverbottom{opacity:0;transition:opacity .3s ease}.cover.opening .coverbg:before,.cover.opening .coverbg:after{z-index:5}.cover.opening .coverveil{opacity:0}.cover.opening .reveal-page{opacity:1;transition:opacity .2s ease}.reveal-page .welcome{min-height:100%;height:100%;padding-top:100px}.reveal-page .welcome-copy{z-index:2}.reveal-page .welcome-temple{height:100%}
.countdown{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:28px;color:var(--maroon);font-family:var(--serif)}
.countdown>div{min-width:72px;text-align:center}
.countdown strong{display:block;font-size:30px;line-height:1;font-weight:500;letter-spacing:.04em}
.countdown span{display:block;margin-top:7px;font:600 9px/1 var(--sans);letter-spacing:.16em;color:#7b604b}
.countdown i{font-style:normal;font-size:25px;color:var(--gold);margin-top:-12px}
.countdown.complete{opacity:.9}
@media(max-width:640px){.countdown{gap:4px;margin-top:22px}.countdown>div{min-width:58px}.countdown strong{font-size:23px}.countdown span{font-size:7px;letter-spacing:.11em}.countdown i{font-size:19px}}

/* Wedding date + countdown refinement */
.reveal-page .datebox{display:flex;align-items:baseline;justify-content:center;gap:10px;margin-top:24px}
.reveal-page .datebox strong{font-size:clamp(28px,3vw,40px);line-height:1;font-family:var(--serif);font-weight:500;color:var(--maroon)}
.reveal-page .datebox span{font:500 clamp(28px,3vw,40px)/1 var(--serif);letter-spacing:.01em;color:var(--maroon);text-align:left}
.reveal-page .countdown{margin-top:12px}
@media(max-width:640px){.reveal-page .datebox{gap:8px;margin-top:18px}.reveal-page .datebox strong,.reveal-page .datebox span{font-size:30px}.reveal-page .countdown{margin-top:9px}}

.reveal-page .datebox span{font-size:clamp(22px,2.35vw,32px);white-space:nowrap}
@media(max-width:640px){.reveal-page .datebox span{font-size:24px}}

.ceremonycard .venue-photo{width:100%;height:240px;object-fit:cover;display:block;margin:-20px auto 30px;border:1px solid #c99a4266;box-shadow:0 12px 30px #38251f20}
@media(max-width:640px){.ceremonycard .venue-photo{height:190px;margin:-18px auto 24px}}

.ceremonycard .maplink{position:relative;z-index:5;cursor:pointer;pointer-events:auto}

.reception-map{display:inline-block;margin-top:20px;padding:13px 23px;background:#e7c878;color:#651f25;text-decoration:none;font:9px var(--display);letter-spacing:.16em}

/* Mobile readability for the welcome page */
@media(max-width:640px){
  .reveal-page .welcome{
    padding:110px 18px 42px;
    min-height:100%;
    background:linear-gradient(180deg,rgba(255,248,232,.94) 0%,rgba(255,248,232,.90) 52%,rgba(255,248,232,.82) 100%),url('https://poornesh-manvitha-wedding.netlify.app/hero-open-temple-emerald-mobile-v1.webp') center/cover;
  }
  .reveal-page .welcome-copy{width:min(100%,390px);max-width:390px;padding:18px 14px 20px;margin:auto;text-align:center}
  .reveal-page .welcome-copy small{font-size:8px;letter-spacing:.20em;color:#9b7130}
  .reveal-page .welcome-copy h2{font-size:50px;line-height:.9;margin:18px 0 20px;color:#651f25;text-shadow:0 1px 0 rgba(255,255,255,.7)}
  .reveal-page .welcome-copy p{font-size:16px;line-height:1.35;max-width:340px;margin:0 auto;color:#4f3029;text-shadow:0 1px 0 rgba(255,255,255,.7)}
  .reveal-page .countdown{margin-top:24px;gap:3px}
  .reveal-page .countdown>div{min-width:55px}
  .reveal-page .countdown strong{font-size:21px;color:#651f25}
  .reveal-page .countdown span{font-size:6.5px;color:#6e5546}
  .reveal-page .countdown i{font-size:17px}
  .reveal-page .datebox{margin-top:16px;gap:6px}
  .reveal-page .datebox strong,.reveal-page .datebox span{font-size:23px}
}

/* New invitation cover: uploaded temple door artwork + full-page left slide */
.cover{overflow:hidden}
.coverbg{inset:0!important;background:#173e35 url('./assets/first-page-door.jpg') center center/cover no-repeat!important;z-index:2!important;transition:transform 1.15s cubic-bezier(.77,0,.18,1)!important}
.coverbg:before,.coverbg:after{display:none!important}
.covercontent{position:absolute!important;left:50%!important;top:50%!important;margin:0!important;transform:translate(-50%,-50%)!important;z-index:6!important;width:min(92vw,700px)!important}
.covercontent button{margin-top:24px}
.cover.opening .coverbg{transform:translateX(-100%)!important}
.cover.opening .covercontent{transform:translate(calc(-50% - 100vw),-50%)!important;opacity:0!important;transition:transform 1.05s cubic-bezier(.77,0,.18,1),opacity .3s ease!important}
.cover.opening .coverbottom{transform:translateX(-100%)!important;opacity:0!important;transition:transform 1.05s cubic-bezier(.77,0,.18,1),opacity .3s ease!important}
.reveal-page{opacity:1!important;background:var(--cream)!important;z-index:1!important}
.reveal-page .welcome{height:100%;min-height:100%;overflow:hidden}
@media(max-width:800px){
  .cover{min-height:100svh}
  .covercontent{width:min(92vw,520px)!important}
  .covercontent h1{font-size:clamp(48px,15vw,70px)}
}

/* Minimal first page: only a centered traditional invitation button */
.covercontent{display:flex!important;align-items:center!important;justify-content:center!important}
.covercontent .traditional-open{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-width:250px;padding:17px 30px;background:linear-gradient(180deg,#f5dc94,#d6aa50);color:#5c2025;border:1px solid #fff0bd;box-shadow:0 0 0 2px #9b6b2b88,0 10px 28px #3a170c55,inset 0 1px #fff9d6;border-radius:2px;font:600 11px var(--display);letter-spacing:.2em;cursor:pointer}
.covercontent .traditional-open:before,.covercontent .traditional-open:after{content:'✦';font-size:12px;color:#7b4d1f}
.covercontent .traditional-open:hover{transform:translateY(-1px);filter:brightness(1.04)}
.covercontent .traditional-open .ornament{font-size:19px;line-height:1;color:#7b4d1f}
.covercontent .traditional-open .flip{transform:scaleX(-1)}
@media(max-width:800px){.covercontent .traditional-open{min-width:230px;padding:16px 24px;font-size:10px;gap:14px}}

/* Premium traditional invitation seal */
.covercontent .traditional-open{
  min-width:300px!important;
  padding:20px 34px!important;
  background:linear-gradient(180deg,#fff5d6 0%,#e8c878 100%)!important;
  color:#651f25!important;
  border:2px solid #c99a42!important;
  border-radius:999px!important;
  box-shadow:0 0 0 4px #fff5d6,0 0 0 6px #9b6b2b,0 12px 34px rgba(38,18,8,.38),inset 0 2px 0 #fffdf0!important;
  font:600 15px/1 var(--display)!important;
  letter-spacing:.18em!important;
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
.covercontent .traditional-open:before,.covercontent .traditional-open:after{content:'✦'!important;font-size:15px!important;color:#8a5b22!important}
.covercontent .traditional-open .ornament{font-size:23px!important;color:#7a4b1c!important}
.covercontent .traditional-open:hover{transform:scale(1.02)!important;filter:brightness(1.03)}
@media(max-width:800px){
  .covercontent .traditional-open{min-width:270px!important;padding:18px 28px!important;font-size:13px!important;gap:15px!important}
  .covercontent .traditional-open .ornament{font-size:21px!important}
}


/* Two-door opening using the new temple doorway artwork */
.coverbg{background:#173e35!important;overflow:hidden!important}
.coverbg:before,.coverbg:after{display:block!important;content:''!important;position:absolute!important;top:0!important;bottom:0!important;width:50%!important;background-image:url('./assets/first-page-door.jpg')!important;background-size:200% 100%!important;background-repeat:no-repeat!important;z-index:5!important;transition:transform 1.25s cubic-bezier(.77,0,.18,1)!important;will-change:transform!important}
.coverbg:before{left:0!important;background-position:left center!important}
.coverbg:after{right:0!important;background-position:right center!important}
.cover.opening .coverbg:before{transform:translateX(-100%)!important}
.cover.opening .coverbg:after{transform:translateX(100%)!important}
.cover.opening .coverbg{transform:none!important}
.cover.opening .covercontent{transform:translate(calc(-50% - 25px),-50%)!important;opacity:0!important;transition:transform .7s ease,opacity .35s ease!important}

/* Fix: reveal page must sit directly behind the two opening doors, never a green layer */
.cover{background:var(--cream)!important}
.coverbg{background:transparent!important}
.coverveil{display:none!important}
.cover.opening .coverbg{background:transparent!important}


/* Page 2: user-provided couple temple image + falling flower-petal reveal */
.reveal-page .welcome{
  background:linear-gradient(180deg,rgba(25,18,10,.12),rgba(25,18,10,.18)),url('./assets/second-page-only.jpg') center/cover no-repeat!important;
  color:#fff8e8;
}
.reveal-page .welcome:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,10,5,.08),rgba(15,10,5,.20));pointer-events:none}
.reveal-page .welcome-copy{position:relative;z-index:4}
.reveal-page .welcome-copy .tamil,.reveal-page .welcome-copy h2,.reveal-page .welcome-copy p,.reveal-page .welcome-copy small,.reveal-page .datebox,.reveal-page .countdown{display:none}
.petal-transition{position:absolute;inset:0;z-index:20;overflow:hidden;pointer-events:none;opacity:0}
.cover.opening .petal-transition{opacity:1}
.petal-transition i:nth-child(1){--i:0;}
.petal-transition i:nth-child(2){--i:1;}
.petal-transition i:nth-child(3){--i:2;}
.petal-transition i:nth-child(4){--i:3;}
.petal-transition i:nth-child(5){--i:4;}
.petal-transition i:nth-child(6){--i:5;}
.petal-transition i:nth-child(7){--i:6;}
.petal-transition i:nth-child(8){--i:7;}
.petal-transition i:nth-child(9){--i:8;}
.petal-transition i:nth-child(10){--i:9;}
.petal-transition i:nth-child(11){--i:10;}
.petal-transition i:nth-child(12){--i:11;}
.petal-transition i:nth-child(13){--i:12;}
.petal-transition i:nth-child(14){--i:13;}
.petal-transition i:nth-child(15){--i:14;}
.petal-transition i:nth-child(16){--i:15;}
.petal-transition i:nth-child(17){--i:16;}
.petal-transition i:nth-child(18){--i:17;}
.petal-transition i:nth-child(19){--i:18;}
.petal-transition i:nth-child(20){--i:19;}
.petal-transition i:nth-child(21){--i:20;}
.petal-transition i:nth-child(22){--i:21;}
.petal-transition i:nth-child(23){--i:22;}
.petal-transition i:nth-child(24){--i:23;}
.petal-transition i{position:absolute;top:-30px;left:calc(var(--i) * 4.1667%);width:8px;height:5px;border-radius:70% 25% 70% 25%;background:linear-gradient(135deg,#f6a0a9,#c92f48);box-shadow:0 1px 3px rgba(70,20,20,.28);transform:rotate(calc(var(--i) * 37deg));animation:petalFall 1.55s cubic-bezier(.2,.7,.25,1) calc(var(--i) * .025s) both}
@keyframes petalFall{0%{transform:translate3d(0,-30px,0) rotate(0deg) scale(.65);opacity:0}12%{opacity:.95}100%{transform:translate3d(calc((var(--i) - 12) * 12px),105vh,0) rotate(560deg) scale(1);opacity:0}}
@media(max-width:800px){.reveal-page .welcome{background-position:center top!important}.petal-transition i{width:7px;height:4px}}

/* Page 2 final presentation: full couple image + existing invitation text/timer */
.reveal-page .welcome{position:relative!important;display:grid!important;grid-template-columns:1fr!important;align-items:center!important;justify-items:center!important;min-height:100svh!important;height:100%!important;padding:90px 22px 50px!important;background:linear-gradient(180deg,rgba(20,10,5,.18),rgba(20,10,5,.28)),url('./assets/second-page-only.jpg') center/cover no-repeat!important}
.reveal-page .welcome:after{background:linear-gradient(180deg,rgba(20,10,5,.08),rgba(20,10,5,.22))!important;z-index:1!important}
.reveal-page .welcome-copy{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;width:min(92vw,720px)!important;max-width:720px!important;padding:24px 20px 28px!important;text-align:center!important;z-index:4!important;background:linear-gradient(180deg,rgba(255,248,232,.90),rgba(255,248,232,.76))!important;border:1px solid rgba(201,154,66,.6)!important;box-shadow:0 16px 50px rgba(20,10,5,.22)!important}
.reveal-page .welcome-copy .tamil,.reveal-page .welcome-copy small,.reveal-page .welcome-copy h2,.reveal-page .welcome-copy p,.reveal-page .welcome-copy .countdown,.reveal-page .welcome-copy .datebox{display:block!important}
.reveal-page .welcome-copy .tamil{font-family:var(--tamil)!important;color:var(--maroon)!important;font-size:18px!important;margin-bottom:8px!important}
.reveal-page .welcome-copy small{font:9px var(--display)!important;letter-spacing:.23em!important;color:#9b7130!important}
.reveal-page .welcome-copy h2{font:500 clamp(48px,6vw,82px)/.82 var(--serif)!important;color:var(--maroon)!important;margin:18px 0!important}
.reveal-page .welcome-copy p{font-size:19px!important;line-height:1.35!important;color:#55372d!important;max-width:600px!important;margin:0 auto!important}
.reveal-page .countdown{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;margin-top:22px!important;color:var(--maroon)!important}
.reveal-page .countdown>div{min-width:68px!important;text-align:center!important}.reveal-page .countdown strong{display:block!important;font-size:27px!important;color:var(--maroon)!important}.reveal-page .countdown span{display:block!important;margin-top:5px!important;font:600 8px/1 var(--sans)!important;letter-spacing:.13em!important;color:#735747!important}.reveal-page .countdown i{font-style:normal!important;font-size:22px!important;color:var(--gold)!important;margin-top:-9px!important}
.reveal-page .datebox{display:flex!important;align-items:baseline!important;justify-content:center!important;gap:9px!important;margin-top:18px!important}.reveal-page .datebox strong{font-size:31px!important;line-height:1!important;color:var(--maroon)!important}.reveal-page .datebox span{font:500 25px/1 var(--serif)!important;letter-spacing:.01em!important;color:var(--maroon)!important}
.petal-transition{z-index:50!important;position:absolute!important;inset:0!important;opacity:0!important;pointer-events:none!important}.cover.opening .petal-transition{opacity:1!important}.petal-transition i{animation-duration:2.4s!important;animation-delay:calc(var(--i) * .06s)!important;width:9px!important;height:6px!important}
@media(max-width:640px){.reveal-page .welcome{padding:75px 14px 30px!important}.reveal-page .welcome-copy{width:94vw!important;padding:18px 12px 22px!important}.reveal-page .welcome-copy h2{font-size:48px!important;margin:15px 0 18px!important}.reveal-page .welcome-copy p{font-size:15px!important}.reveal-page .countdown{gap:2px!important}.reveal-page .countdown>div{min-width:54px!important}.reveal-page .countdown strong{font-size:21px!important}.reveal-page .countdown span{font-size:6px!important}.reveal-page .countdown i{font-size:16px!important}.reveal-page .datebox span{font-size:22px!important}.reveal-page .datebox strong{font-size:25px!important}}


/* Page 2 typography refinement */
.reveal-page .welcome-copy .tamil{font-size:24px!important;line-height:1.25!important;margin-bottom:12px!important}
.reveal-page .welcome-copy small{font-size:11px!important;letter-spacing:.24em!important}
.reveal-page .datebox{margin-top:28px!important}
.reveal-page .datebox strong{font-size:34px!important}
.reveal-page .datebox span{font-size:29px!important}
@media(max-width:640px){
  .reveal-page .welcome-copy .tamil{font-size:23px!important}
  .reveal-page .welcome-copy small{font-size:9px!important;letter-spacing:.20em!important}
  .reveal-page .datebox strong{font-size:27px!important}
  .reveal-page .datebox span{font-size:24px!important}
}

/* Elegant invitation-card treatment: no solid rectangle */
.reveal-page .welcome-copy{
  position:relative!important;
  width:min(92vw,820px)!important;
  max-width:820px!important;
  padding:46px 44px 42px!important;
  background:rgba(255,248,232,.08)!important;
  border:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.reveal-page .welcome-copy:before{
  content:'';
  position:absolute;
  inset:10px;
  pointer-events:none;
  background:
    linear-gradient(var(--gold),var(--gold)) left top/82px 1px no-repeat,
    linear-gradient(var(--gold),var(--gold)) left top/1px 58px no-repeat,
    linear-gradient(var(--gold),var(--gold)) right top/82px 1px no-repeat,
    linear-gradient(var(--gold),var(--gold)) right top/1px 58px no-repeat,
    linear-gradient(var(--gold),var(--gold)) left bottom/82px 1px no-repeat,
    linear-gradient(var(--gold),var(--gold)) left bottom/1px 58px no-repeat,
    linear-gradient(var(--gold),var(--gold)) right bottom/82px 1px no-repeat,
    linear-gradient(var(--gold),var(--gold)) right bottom/1px 58px no-repeat;
  opacity:.95;
}
.reveal-page .welcome-copy:after{
  content:'✦';
  position:absolute;
  top:1px;
  left:50%;
  transform:translateX(-50%);
  color:var(--gold);
  font-size:22px;
  line-height:1;
  text-shadow:0 1px 2px rgba(80,35,10,.3);
}
.reveal-page .welcome-copy .tamil{font-size:28px!important;margin-bottom:14px!important;text-shadow:0 1px 3px rgba(255,248,232,.85)!important}
.reveal-page .welcome-copy small{font-size:12px!important;letter-spacing:.26em!important}
.reveal-page .welcome-copy h2{text-shadow:0 1px 4px rgba(255,248,232,.85)!important}
.reveal-page .welcome-copy p{text-shadow:0 1px 3px rgba(255,248,232,.85)!important}
.reveal-page .datebox{margin-top:30px!important;gap:11px!important}
.reveal-page .datebox strong{font-family:var(--display)!important;font-size:28px!important;font-weight:500!important;letter-spacing:.06em!important}
.reveal-page .datebox span{font-family:var(--display)!important;font-size:27px!important;font-weight:500!important;letter-spacing:.10em!important}
@media(max-width:640px){
  .reveal-page .welcome-copy{width:96vw!important;padding:40px 22px 34px!important}
  .reveal-page .welcome-copy:before{inset:7px;background-size:62px 1px,1px 45px,62px 1px,1px 45px,62px 1px,1px 45px,62px 1px,1px 45px}
  .reveal-page .welcome-copy .tamil{font-size:24px!important}
  .reveal-page .welcome-copy small{font-size:9px!important;letter-spacing:.21em!important}
  .reveal-page .datebox strong{font-size:24px!important}
  .reveal-page .datebox span{font-size:22px!important;letter-spacing:.07em!important}
}

/* New page-two invitation background */
.reveal-page .welcome{background:linear-gradient(180deg,rgba(255,248,232,.04),rgba(255,248,232,.04)),url('/second-page-bg.jpg') center/cover no-repeat!important}

/* Replace page two background with latest uploaded temple invitation artwork */
.reveal-page .welcome{background:url('/second-page-bg.jpg') center/cover no-repeat!important}

/* Page two: light invitation panel, positioned higher */
.reveal-page .welcome{align-items:start!important;padding-top:clamp(70px,10vh,105px)!important;padding-bottom:30px!important}
.reveal-page .welcome-copy{width:min(90vw,780px)!important;max-width:780px!important;padding:34px 42px 32px!important;background:rgba(255,248,232,.84)!important;border:1px solid rgba(201,154,66,.58)!important;box-shadow:0 10px 36px rgba(50,25,10,.16)!important;backdrop-filter:blur(1.5px)!important}
.reveal-page .welcome-copy:before{inset:8px!important;opacity:.85!important}
.reveal-page .welcome-copy:after{top:0!important}
.reveal-page .welcome-copy .tamil{font-size:27px!important;margin-bottom:9px!important}
.reveal-page .welcome-copy small{font-size:11px!important}
.reveal-page .welcome-copy h2{font-size:clamp(48px,5.2vw,70px)!important;margin:15px 0 17px!important}
.reveal-page .welcome-copy p{font-size:17px!important;line-height:1.32!important;max-width:640px!important}
.reveal-page .datebox{margin-top:20px!important}
@media(max-width:640px){
 .reveal-page .welcome{padding-top:58px!important;padding-left:10px!important;padding-right:10px!important}
 .reveal-page .welcome-copy{width:95vw!important;padding:27px 18px 25px!important}
 .reveal-page .welcome-copy .tamil{font-size:23px!important}
 .reveal-page .welcome-copy small{font-size:8.5px!important}
 .reveal-page .welcome-copy h2{font-size:42px!important;line-height:.9!important;margin:13px 0 15px!important}
 .reveal-page .welcome-copy p{font-size:14px!important;line-height:1.3!important}
 .reveal-page .datebox{margin-top:17px!important}
 .reveal-page .datebox strong{font-size:24px!important}.reveal-page .datebox span{font-size:21px!important}
}


/* Page 2 zoom-in reveal */
.reveal-page{transform:scale(.92)!important;transform-origin:center center!important;transition:transform 1.15s cubic-bezier(.22,.8,.2,1)!important}
.cover.opening .reveal-page{transform:scale(1)!important}

/* Remove centre content rectangle — keep text directly on the artwork */
.reveal-page .welcome-copy{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important}

/* Page 2: image only */
.reveal-page .welcome{padding:0!important;background:#fff8e8!important}
.reveal-page .welcome-copy,.reveal-page .petal-transition{display:none!important}
.reveal-page .welcome:after{display:none!important}
.reveal-page .welcome:before{content:'';position:absolute;inset:0;background:url('./assets/second-page-only.jpg') center/cover no-repeat}

/* Slow cinematic zoom as page 2 reveals */
.reveal-page .welcome:before{transform:scale(1.02);transform-origin:center center;will-change:transform}
.cover.opening .reveal-page .welcome:before{animation:pageTwoSlowZoom 5.5s cubic-bezier(.2,.55,.2,1) .15s forwards}
@keyframes pageTwoSlowZoom{from{transform:scale(1.02)}to{transform:scale(1.11)}}

/* Falling flower-petal overlay during page-two reveal */
.petal-transition{display:block!important;position:absolute!important;inset:0!important;z-index:60!important;overflow:hidden!important;pointer-events:none!important;opacity:0!important}
.cover.opening .petal-transition{opacity:1!important}
.petal-transition i{display:block!important;position:absolute!important;top:-28px!important;left:calc(var(--i) * 4.1667%)!important;width:10px!important;height:7px!important;border-radius:70% 25% 70% 25%!important;background:linear-gradient(135deg,#ff9eaa 0%,#e43f5b 58%,#b81f3d 100%)!important;box-shadow:0 2px 5px rgba(70,10,20,.28)!important;opacity:0!important;animation:flowerPetalFall 3.2s cubic-bezier(.15,.55,.25,1) calc(var(--i) * .055s) forwards!important}
.petal-transition i:nth-child(3n){width:8px!important;height:6px!important}.petal-transition i:nth-child(4n){width:12px!important;height:8px!important}.petal-transition i:nth-child(5n){background:linear-gradient(135deg,#ffd1d5,#ef6b7d 60%,#c42b48)!important}
@keyframes flowerPetalFall{0%{transform:translate3d(0,-35px,0) rotate(0deg) scale(.55);opacity:0}10%{opacity:.95}45%{transform:translate3d(18px,45vh,0) rotate(240deg) scale(1);opacity:.9}75%{transform:translate3d(-16px,78vh,0) rotate(470deg) scale(.92);opacity:.72}100%{transform:translate3d(12px,108vh,0) rotate(680deg) scale(.75);opacity:0}}


/* Third page: user-provided invitation artwork only */
.third-page-image{width:100%;height:100svh;min-height:680px;position:relative;overflow:hidden;background:#123f34}
.third-page-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
@media(max-width:640px){.third-page-image{min-height:100svh}.third-page-image img{object-position:center center}}


/* Elegant reveal from page two into page three */
.third-page-image{opacity:0;transform:translateY(55px) scale(.965);filter:blur(3px);transition:opacity 1.1s ease,transform 1.25s cubic-bezier(.2,.75,.2,1),filter 1.1s ease;will-change:transform,opacity,filter}
.third-page-image.third-visible{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}

/* Fourth page — new parchment invitation artwork with existing reception content aligned inside it */
.reception{position:relative!important;display:block!important;min-height:100svh!important;height:100svh!important;background:#8f1e24!important;overflow:hidden!important;color:#651f25!important}
.reception>img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center center!important}
.reception>div{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:min(54%,620px)!important;padding:55px 38px!important;align-self:auto!important;text-align:center!important;color:#651f25!important}
.reception>div:before{content:'';position:absolute;inset:20px 14px;background:rgba(255,248,232,.16);border:1px solid rgba(153,102,35,.34);border-radius:2px;z-index:-1}
.reception .tamil{display:block!important;font-size:27px!important;margin-bottom:10px!important;color:#651f25!important}
.reception small{display:block!important;color:#8b642d!important;font:10px var(--display)!important;letter-spacing:.22em!important;margin-bottom:12px!important}
.reception h2{font:500 clamp(42px,5vw,68px)/.88 var(--serif)!important;color:#651f25!important;margin:10px 0 22px!important}
.reception h2 i{font-style:italic!important}
.reception h3{font:500 23px/1.2 var(--serif)!important;color:#651f25!important;margin:0 0 8px!important}
.reception>div>strong{display:block!important;font:500 21px var(--serif)!important;color:#8a5b22!important;margin-bottom:14px!important}
.reception p{font:500 18px/1.35 var(--serif)!important;color:#5b3b2e!important;margin:0!important}
.reception-map{margin-top:20px!important;background:#e7c878!important;color:#651f25!important;border:1px solid #b98935!important}
@media(max-width:800px){
 .reception{min-height:100svh!important;height:100svh!important}
 .reception>div{width:74%!important;padding:34px 18px!important;top:47%!important}
 .reception>div:before{inset:12px 8px}
 .reception .tamil{font-size:22px!important}
 .reception h2{font-size:42px!important;margin:8px 0 16px!important}
 .reception h3{font-size:19px!important}
 .reception>div>strong{font-size:17px!important}
 .reception p{font-size:15px!important}
}


/* Clean wedding-event timeline inspired by the reference layout */
.events-page{min-height:100svh;background:linear-gradient(180deg,#fffdf6 0%,#f8f1df 100%);color:#38251f;display:flex;align-items:center;justify-content:center;padding:90px 22px;position:relative;overflow:hidden}
.events-page:before,.events-page:after{content:'✦';position:absolute;color:#c99a42;font-size:24px;opacity:.45}.events-page:before{top:40px;left:50%;transform:translateX(-50%)}.events-page:after{bottom:35px;left:50%;transform:translateX(-50%)}
.events-inner{width:min(100%,760px);text-align:center}.events-heading .tamil{display:block;color:#7a4a2a;font-size:25px;margin-bottom:10px}.events-heading h2{font:500 clamp(48px,6vw,72px)/1 var(--serif);color:#38251f;margin:0 0 12px}.events-heading p{font:17px/1.5 var(--serif);max-width:500px;margin:0 auto 24px;color:#70594b}.events-heading>small{display:block;font:9px var(--display);letter-spacing:.3em;color:#9b7130;margin-bottom:4px}.events-heading h3{font:500 30px var(--serif);margin:0 0 36px;color:#38251f}
.event-list{display:flex;flex-direction:column;gap:18px;text-align:left}.event-card{display:grid;grid-template-columns:125px 1fr;background:rgba(255,255,255,.62);border:1px solid rgba(201,154,66,.26);box-shadow:0 10px 30px rgba(80,50,20,.08);min-height:155px;transition:transform .3s ease,box-shadow .3s ease}.event-card:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(80,50,20,.12)}.event-date{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid rgba(201,154,66,.22);background:rgba(255,248,232,.55);color:#38251f}.event-date strong{font:500 48px/1 var(--serif)}.event-date span{font:600 13px var(--display);letter-spacing:.18em;color:#8b642d;margin-top:5px}.event-date small{font:8px var(--display);letter-spacing:.18em;color:#9b8a7b;margin-top:8px}.event-detail{display:flex;align-items:center;gap:22px;padding:26px 30px}.event-icon{font-size:25px;color:#b2832e;width:30px;text-align:center}.event-detail h3{font:500 30px/1.1 var(--serif);margin:0 0 7px;color:#38251f}.event-detail p{font:500 18px var(--serif);margin:0 0 8px;color:#8a5b22}.event-detail small{font:14px/1.45 var(--serif);color:#6d574b}.event-detail a{display:inline-block;margin-top:12px;color:#8a5b22;font:8px var(--display);letter-spacing:.18em;text-decoration:none;border-bottom:1px solid #c99a42;padding-bottom:4px}
@media(max-width:640px){.events-page{padding:75px 14px}.events-heading .tamil{font-size:22px}.events-heading h2{font-size:48px}.events-heading p{font-size:15px}.events-heading h3{font-size:26px;margin-bottom:25px}.event-card{grid-template-columns:82px 1fr;min-height:145px}.event-date strong{font-size:38px}.event-date span{font-size:11px}.event-detail{gap:10px;padding:20px 14px}.event-icon{font-size:19px;width:22px}.event-detail h3{font-size:24px}.event-detail p{font-size:16px}.event-detail small{font-size:12px}}

/* Fourth page — use the full parchment area more effectively */
.reception>div{width:min(61%,700px)!important;top:49%!important;padding:42px 44px!important}
.reception>div:before{inset:5px 0!important;background:rgba(255,248,232,.08)!important;border:0!important;box-shadow:none!important}
.reception .tamil{font-size:32px!important;margin-bottom:13px!important}
.reception small{font-size:12px!important;letter-spacing:.25em!important;margin-bottom:14px!important}
.reception h2{font-size:clamp(52px,5.8vw,76px)!important;line-height:.9!important;margin:12px 0 24px!important}
.reception h3{font-size:27px!important;margin-bottom:10px!important}
.reception>div>strong{font-size:24px!important;margin-bottom:16px!important}
.reception p{font-size:21px!important;line-height:1.4!important}
.reception-map{font-size:10px!important;padding:14px 25px!important;margin-top:24px!important}
@media(max-width:800px){
 .reception>div{width:78%!important;top:47%!important;padding:30px 18px!important}
 .reception .tamil{font-size:25px!important}.reception small{font-size:9px!important}
 .reception h2{font-size:47px!important}.reception h3{font-size:21px!important}
 .reception>div>strong{font-size:19px!important}.reception p{font-size:16px!important}
}

/* Fourth page artwork: parchment invitation background */
.events-page{min-height:100svh!important;padding:100px 22px!important;background:linear-gradient(rgba(255,248,232,.08),rgba(255,248,232,.08)),url('./assets/reception-invitation.jpg') center/cover no-repeat!important}
.events-inner{width:min(100%,900px)!important}
.events-heading{background:rgba(255,248,232,.72);padding:24px 34px 20px;max-width:760px;margin:0 auto 22px;border:1px solid rgba(150,100,40,.18);backdrop-filter:blur(1px)}
.events-heading .tamil{font-size:30px!important}.events-heading h2{font-size:clamp(58px,7vw,84px)!important;margin:4px 0 12px!important}.events-heading p{font-size:20px!important;max-width:680px!important}.events-heading h3{font-size:36px!important;margin-bottom:8px!important}
.event-list{gap:14px!important}.event-card{background:rgba(255,248,232,.86)!important;min-height:165px!important;border-color:rgba(150,100,40,.28)!important}.event-date strong{font-size:54px!important}.event-detail h3{font-size:34px!important}.event-detail p{font-size:21px!important}.event-detail small{font-size:15px!important}
@media(max-width:640px){.events-page{padding:75px 12px!important}.events-heading{padding:20px 14px 16px;margin-bottom:14px}.events-heading .tamil{font-size:24px!important}.events-heading h2{font-size:52px!important}.events-heading p{font-size:16px!important}.events-heading h3{font-size:30px!important}.event-card{min-height:150px!important}.event-date strong{font-size:42px!important}.event-detail h3{font-size:25px!important}.event-detail p{font-size:17px!important}.event-detail small{font-size:12px!important}}

/* Fourth page: keep all event content directly on the centre parchment */
.events-page{padding:90px 20px!important;background:url('./assets/reception-invitation.jpg') center/cover no-repeat!important}
.events-inner{width:min(100%,720px)!important}
.events-heading{background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;padding:24px 20px 18px!important;margin:0 auto 8px!important}
.event-list{gap:10px!important}
.event-card{background:transparent!important;border:0!important;box-shadow:none!important;min-height:145px!important;grid-template-columns:105px 1fr!important}
.event-date{background:transparent!important;border-right:1px solid rgba(120,78,32,.24)!important}
.event-detail{padding:22px 18px!important}
.event-detail h3,.event-detail p,.event-detail small,.events-heading h2,.events-heading p,.events-heading h3,.events-heading .tamil{color:#38251f!important}
.event-detail a{color:#8a5b22!important}
@media(max-width:640px){
 .events-inner{width:min(100%,680px)!important}
 .events-heading{padding:18px 10px 12px!important}
 .event-card{grid-template-columns:78px 1fr!important}
 .event-detail{padding:18px 10px!important}
}

/* Fourth page: keep date blocks safely inside the parchment */
.events-inner{width:min(100%,680px)!important}
.event-card{grid-template-columns:125px minmax(0,1fr)!important;width:100%!important}
.event-date{min-width:0!important;padding:0 8px!important}
.event-detail{min-width:0!important;padding-left:26px!important}
@media(max-width:640px){
 .events-inner{width:min(100%,620px)!important}
 .event-card{grid-template-columns:92px minmax(0,1fr)!important}
 .event-date{padding:0 4px!important}
 .event-detail{padding-left:16px!important}
}

/* Fourth page: use the uploaded finished invitation artwork only */
.events-page{min-height:100svh!important;height:100svh!important;padding:0!important;background:url('./assets/reception-invitation.jpg') center/cover no-repeat!important;display:block!important}
.events-inner{display:none!important}


/* Invisible map hotspots over the venue areas in the final invitation artwork */
.events-page{position:relative!important;overflow:hidden!important}
.page4-map{position:absolute;display:block;z-index:10;background:transparent;cursor:pointer;border-radius:8px}
.page4-map-wedding{left:35.5%;top:34.5%;width:31%;height:18%}
.page4-map-reception{left:35.5%;top:63%;width:31%;height:18%}
@media(max-width:700px){.page4-map-wedding{left:34%;top:34%;width:34%;height:19%}.page4-map-reception{left:34%;top:62.5%;width:34%;height:19%}}


/* Page 5 — full-screen wedding photo carousel, one photo every 3 seconds */
.photo-page{height:100svh;min-height:680px;position:relative;overflow:hidden;background:#160f0b}
.photo-slider{width:100%;height:100%;overflow:hidden}.photo-track{display:flex;width:300%;height:100%;animation:photoSlide 9s infinite cubic-bezier(.77,0,.18,1);will-change:transform}.photo-track img{width:33.333333%;height:100%;flex:0 0 33.333333%;object-fit:cover;object-position:center;display:block}@keyframes photoSlide{0%,30%{transform:translateX(0)}33.333%,63.333%{transform:translateX(-33.333333%)}66.666%,96.666%{transform:translateX(-66.666666%)}100%{transform:translateX(0)}}
@media(max-width:640px){.photo-page{min-height:100svh}.photo-track img{object-position:center center}}


/* Distinct scroll transitions for pages 3, 4 and 5 */
.third-page-image{opacity:0;transform:scale(1.10);filter:saturate(.75);transition:opacity .9s ease,transform 1.35s cubic-bezier(.2,.75,.2,1),filter 1s ease;will-change:transform,opacity}.third-page-image.page-visible{opacity:1;transform:scale(1);filter:saturate(1)}
.events-page{opacity:0;transform:translateY(70px);transition:opacity .75s ease,transform 1s cubic-bezier(.16,1,.3,1);will-change:transform,opacity}.events-page.page-visible{opacity:1;transform:translateY(0)}.events-page.page-visible .events-heading{animation:eventHeadingIn .9s .12s both cubic-bezier(.16,1,.3,1)}.events-page.page-visible .event-card:first-child{animation:eventCardLeft .9s .25s both cubic-bezier(.16,1,.3,1)}.events-page.page-visible .event-card:last-child{animation:eventCardRight .9s .42s both cubic-bezier(.16,1,.3,1)}
.photo-page{opacity:0;clip-path:inset(0 0 100% 0);transform:scale(1.035);transition:opacity .55s ease,clip-path 1.15s cubic-bezier(.77,0,.18,1),transform 1.35s cubic-bezier(.16,1,.3,1);will-change:clip-path,transform,opacity}.photo-page.page-visible{opacity:1;clip-path:inset(0 0 0 0);transform:scale(1)}
@keyframes eventHeadingIn{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:translateY(0)}}@keyframes eventCardLeft{from{opacity:0;transform:translateX(-70px) rotate(-1deg)}to{opacity:1;transform:translateX(0) rotate(0)}}@keyframes eventCardRight{from{opacity:0;transform:translateX(70px) rotate(1deg)}to{opacity:1;transform:translateX(0) rotate(0)}}
@media(prefers-reduced-motion:reduce){.third-page-image,.events-page,.photo-page{opacity:1;transform:none;filter:none;clip-path:none;transition:none}.events-page.page-visible .events-heading,.events-page.page-visible .event-card:first-child,.events-page.page-visible .event-card:last-child{animation:none}}


/* Page 2 — live wedding countdown */
.reveal-page .welcome-copy .countdown{display:flex!important;align-items:center;justify-content:center;gap:8px;margin:22px auto 0!important;color:var(--maroon)!important}
.reveal-page .welcome-copy .countdown>div{min-width:62px;text-align:center}.reveal-page .welcome-copy .countdown strong{display:block;font-size:25px;line-height:1;font-weight:500}.reveal-page .welcome-copy .countdown span{display:block;margin-top:5px;font:600 7px/1 var(--sans);letter-spacing:.14em;color:#735747}.reveal-page .welcome-copy .countdown i{font-style:normal;font-size:20px;color:var(--gold);margin-top:-8px}
@media(max-width:640px){.reveal-page .welcome-copy .countdown{gap:3px;margin-top:16px!important}.reveal-page .welcome-copy .countdown>div{min-width:54px}.reveal-page .welcome-copy .countdown strong{font-size:21px}.reveal-page .welcome-copy .countdown span{font-size:6px}.reveal-page .welcome-copy .countdown i{font-size:16px}}

/* Page 4 — camera-charge / shutter transition before the location artwork appears */
.camera-transition{position:absolute;inset:0;z-index:30;pointer-events:none;opacity:0;background:rgba(255,250,238,.98)}
.events-page.page-visible .camera-transition{animation:cameraFlash 1.15s cubic-bezier(.2,.7,.2,1) both}
.camera-transition:before,.camera-transition:after{content:'';position:absolute;left:50%;top:50%;width:28vmin;height:28vmin;transform:translate(-50%,-50%) scale(.35);opacity:0;border:2px solid rgba(255,255,255,.9);box-shadow:0 0 0 999vmax rgba(15,8,4,.08)}
.events-page.page-visible .camera-transition:before{animation:focusLock .9s .02s ease-out both}
.camera-transition:after{width:14vmin;height:14vmin;border-color:rgba(255,255,255,.55);box-shadow:none}
.events-page.page-visible .camera-transition:after{animation:focusLockSmall .7s .08s ease-out both}
@keyframes cameraFlash{0%{opacity:1;background:rgba(255,250,238,.98)}18%{opacity:.92;background:rgba(255,250,238,.92)}42%{opacity:.35;background:rgba(255,250,238,.32)}100%{opacity:0;background:rgba(255,250,238,0)}}
@keyframes focusLock{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}35%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}60%{opacity:.8;transform:translate(-50%,-50%) scale(.96)}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
@keyframes focusLockSmall{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}45%{opacity:.8;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.25)}}
@media(prefers-reduced-motion:reduce){.events-page.page-visible .camera-transition{animation:none;opacity:0}.events-page.page-visible .camera-transition:before,.events-page.page-visible .camera-transition:after{animation:none}}

/* Page 2: keep the artwork clean, but show date + live countdown on top */
.reveal-page .welcome-copy{display:flex!important;position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;width:100%!important;max-width:none!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;z-index:10!important}
.reveal-page .welcome-copy>*{display:none!important}
.reveal-page .welcome-copy .datebox{display:flex!important;order:1!important;align-items:baseline!important;justify-content:center!important;margin:0!important;gap:10px!important;text-shadow:0 2px 8px rgba(255,248,232,.9)!important}
.reveal-page .welcome-copy .datebox strong{font-family:var(--display)!important;font-size:32px!important;color:var(--maroon)!important}
.reveal-page .welcome-copy .datebox span{font-family:var(--display)!important;font-size:28px!important;color:var(--maroon)!important;white-space:nowrap!important}
.reveal-page .welcome-copy .countdown{display:flex!important;order:2!important;align-items:center!important;justify-content:center!important;gap:8px!important;margin:18px 0 0!important;color:var(--maroon)!important;text-shadow:0 2px 7px rgba(255,248,232,.9)!important}
.reveal-page .welcome-copy .countdown>div{display:block!important;min-width:62px!important;text-align:center!important}
.reveal-page .welcome-copy .countdown strong{display:block!important;font:500 27px/1 var(--serif)!important;color:var(--maroon)!important}
.reveal-page .welcome-copy .countdown span{display:block!important;margin-top:5px!important;font:600 7px/1 var(--sans)!important;letter-spacing:.14em!important;color:#735747!important}
.reveal-page .welcome-copy .countdown i{display:block!important;font:normal 20px/1 var(--serif)!important;color:var(--gold)!important;margin-top:-8px!important}
@media(max-width:640px){
 .reveal-page .welcome-copy .datebox strong{font-size:27px!important}.reveal-page .welcome-copy .datebox span{font-size:23px!important}
 .reveal-page .welcome-copy .countdown{gap:3px!important;margin-top:14px!important}.reveal-page .welcome-copy .countdown>div{min-width:53px!important}.reveal-page .welcome-copy .countdown strong{font-size:21px!important}.reveal-page .welcome-copy .countdown span{font-size:6px!important}.reveal-page .welcome-copy .countdown i{font-size:16px!important}
}
/* Page 2: countdown placed just below the "23 October 2026" line of the artwork */
.reveal-page{container-type:size}
.reveal-page .welcome-copy{--s:max(100cqw/780,100cqh/1536);display:block!important;left:0!important;top:0!important;transform:none!important;width:100%!important;height:100%!important;scale:1.02;pointer-events:none}
.reveal-page .welcome-copy .datebox{display:none!important}
.reveal-page .welcome-copy .countdown{display:flex!important;position:absolute!important;left:0!important;right:0!important;top:calc(50% + (880 - 768) * var(--s))!important;transform:translateY(-50%)!important;margin:0!important;justify-content:center!important;align-items:flex-start!important;gap:calc(4 * var(--s))!important;color:#651f25!important;text-shadow:none!important}
.reveal-page .welcome-copy .countdown>div{display:block!important;min-width:calc(54 * var(--s))!important;text-align:center!important}
.reveal-page .welcome-copy .countdown strong{display:block!important;font:500 max(15px,calc(26 * var(--s)))/1 var(--serif)!important;color:#651f25!important}
.reveal-page .welcome-copy .countdown span{display:block!important;margin-top:calc(4 * var(--s))!important;font:600 max(6px,calc(7 * var(--s)))/1 var(--serif)!important;letter-spacing:.14em!important;color:#7a4a3a!important}
.reveal-page .welcome-copy .countdown i{display:block!important;font:normal max(13px,calc(20 * var(--s)))/1 var(--serif)!important;color:#b47a35!important;margin-top:calc(-1 * var(--s))!important}
.cover.opening .reveal-page .welcome-copy{animation:pageTwoCopyZoom 5.5s cubic-bezier(.2,.55,.2,1) .15s forwards}
@keyframes pageTwoCopyZoom{from{scale:1.02}to{scale:1.11}}


/* ===== Scroll transitions + falling flower petals between pages ===== */
@media (prefers-reduced-motion:no-preference){
.js .third-page-image:not(.page-visible),.js .events-page:not(.page-visible),.js .photo-page:not(.page-visible),.js footer:not(.page-visible){opacity:0}
.third-page-image.page-visible{animation:fxZoomIn 1.4s cubic-bezier(.2,.75,.2,1) both}
.events-page.page-visible{animation:fxRiseIn 1.1s cubic-bezier(.16,1,.3,1) both}
.photo-page.page-visible{animation:fxCurtain 1.3s cubic-bezier(.77,0,.18,1) both}
footer.page-visible>*{animation:fxFadeUp .9s cubic-bezier(.16,1,.3,1) both}
footer.page-visible>*:nth-child(2){animation-delay:.15s}
footer.page-visible>*:nth-child(3){animation-delay:.3s}
footer.page-visible>*:nth-child(4){animation-delay:.45s}
footer.page-visible>*:nth-child(5){animation-delay:.6s}
}
@keyframes fxZoomIn{from{opacity:0;transform:scale(1.1);filter:blur(5px) saturate(.7)}to{opacity:1;transform:scale(1);filter:blur(0) saturate(1)}}
@keyframes fxRiseIn{from{opacity:0;transform:translateY(80px)}to{opacity:1;transform:translateY(0)}}
@keyframes fxCurtain{from{opacity:1;clip-path:inset(0 0 100% 0);transform:scale(1.05)}to{opacity:1;clip-path:inset(0 0 0 0);transform:scale(1)}}
@keyframes fxFadeUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
.fx-petals{position:fixed;inset:0;z-index:90;pointer-events:none;overflow:hidden}
.fx-petals i{position:absolute;top:0;left:0;display:block;will-change:transform,opacity;border-radius:70% 25% 70% 25%;box-shadow:0 2px 4px rgba(70,20,20,.25)}

/* Page 2: remove green flower/leaf symbols at top */
.reveal-page .thoranam,.reveal-page .thoranam:before,.reveal-page .thoranam:after{display:none!important;content:none!important}

.fx-petals.fx-off{opacity:0;transition:opacity 1.2s ease-out .35s}


/* Page 4 — "View Map" buttons pinned to the artwork.
   .map-layer mimics background-size:cover so % positions always match the image. */
.map-layer{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:max(100vw,calc(100svh * .5625));aspect-ratio:864/1536;container-type:inline-size;z-index:10;pointer-events:none}
.map-layer a{pointer-events:auto;position:absolute;text-decoration:none;-webkit-tap-highlight-color:transparent}
.map-hotspot{left:41%;width:38.5%;height:14%;border-radius:2cqw}
.hs-wedding{top:35%}.hs-reception{top:63.2%}
.map-pill{left:60.3%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:1.4cqw;padding:1.4cqw 3cqw;border-radius:99px;background:linear-gradient(180deg,#8a2630,#651f25);color:#f6dd9a;border:.35cqw solid #e7c878;font:600 2.2cqw/1 var(--display,Georgia,serif);letter-spacing:.14em;white-space:nowrap;box-shadow:0 .8cqw 2.2cqw rgba(60,15,10,.45);animation:mapPulse 2.2s ease-out infinite;transition:transform .2s ease,filter .2s ease}
.map-pill svg{width:3cqw;height:3cqw;fill:#e7c878;flex:none}
.map-pill:hover,.map-pill:focus-visible{transform:translate(-50%,-50%) scale(1.07);filter:brightness(1.12)}
.map-pill:active{transform:translate(-50%,-50%) scale(.96)}
.pill-wedding{top:50.5%}.pill-reception{top:79%}
@keyframes mapPulse{0%{box-shadow:0 .8cqw 2.2cqw rgba(60,15,10,.45),0 0 0 0 rgba(231,200,120,.75)}70%,100%{box-shadow:0 .8cqw 2.2cqw rgba(60,15,10,.45),0 0 0 3cqw rgba(231,200,120,0)}}
@media(prefers-reduced-motion:reduce){.map-pill{animation:none}}

.music-btn{position:fixed;z-index:50;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:48px;height:48px;border-radius:50%;border:1px solid #c99a42;background:#fff8e8ee;color:#651f25;box-shadow:0 6px 20px #0003;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px);padding:0}
.music-btn[hidden]{display:none}
.music-btn .music-icon{font-size:22px;line-height:1}
.music-btn .music-bars{display:none;gap:3px;align-items:flex-end;height:16px}
.music-btn .music-bars i{width:3px;background:#651f25;border-radius:2px;animation:musicbar 1s ease-in-out infinite}
.music-btn .music-bars i:nth-child(2){animation-delay:.2s}.music-btn .music-bars i:nth-child(3){animation-delay:.4s}
.music-btn.playing .music-icon{display:none}.music-btn.playing .music-bars{display:flex}
.music-btn:not(.playing):after{content:'';position:absolute;width:30px;height:2px;background:#651f25;transform:rotate(-45deg);border-radius:2px}
@keyframes musicbar{0%,100%{height:4px}50%{height:16px}}

/* photo page: reliable height + layout on all devices */
.photo-page{height:100vh;height:100svh;min-height:560px;background:#160f0b}
@media(max-width:640px){.photo-page{min-height:100vh;min-height:100svh}}
.photo-slider{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:hidden;background:#160f0b}
.photo-track{height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.photo-track img{min-height:100%;background:#160f0b}