*{box-sizing:border-box}
:root{--paper:#f7f3ec;--ink:#171717}
html,body{margin:0;padding:0;width:100%;min-height:100%;background:var(--paper);-webkit-font-smoothing:antialiased}
body{overflow:hidden}
button,a{font:inherit}
.gate,.video-stage{position:fixed;inset:0;width:100vw;height:100dvh;background:var(--paper);z-index:1000}
.gate{display:flex;align-items:center;justify-content:center;overflow:hidden;transition:opacity 1s ease,visibility 1s ease}
.gate.hide{opacity:0;visibility:hidden;pointer-events:none}
.gate-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.gate-button{position:absolute;inset:0;border:0;background:transparent;z-index:30;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.tap-hand{position:absolute;z-index:31;left:50%;top:61%;transform:translate(-50%,-50%);pointer-events:none;text-align:center;animation:handTap 1.7s ease-in-out infinite}
.hand{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif;font-size:clamp(54px,14vw,100px);line-height:1;filter:drop-shadow(0 6px 8px rgba(0,0,0,.2))}
.tap-ring{position:absolute;left:50%;top:64%;width:34px;height:34px;border:2px solid rgba(255,255,255,.9);border-radius:50%;transform:translate(-50%,-50%);animation:ring 1.7s ease-out infinite}
.tap-label{position:absolute;z-index:31;bottom:9%;left:50%;transform:translateX(-50%);font:500 11px Montserrat,sans-serif;letter-spacing:4px;text-transform:uppercase;color:#fff;text-shadow:0 2px 6px rgba(0,0,0,.45);white-space:nowrap;pointer-events:none;animation:labelPulse 1.7s ease-in-out infinite}
.video-stage{display:none;place-items:center;overflow:hidden}
.video-stage.show{display:grid}
.video-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;display:block}
.video-stage.fade{opacity:0;transition:opacity .8s ease}
.video-loading{position:absolute;z-index:3;bottom:8%;left:50%;transform:translateX(-50%);font:500 11px Montserrat,sans-serif;letter-spacing:3px;text-transform:uppercase;color:#fff;text-shadow:0 2px 7px rgba(0,0,0,.55);pointer-events:none;white-space:nowrap}
.video-stage.video-playing .video-loading{opacity:0}
.continue-button{display:none;position:absolute;z-index:10;bottom:9%;left:50%;transform:translateX(-50%);border:1px solid rgba(255,255,255,.65);background:rgba(0,0,0,.28);color:#fff;padding:10px 18px;border-radius:30px;font:500 11px Montserrat,sans-serif;letter-spacing:3px;text-transform:uppercase}
.video-stage.needs-tap .continue-button{display:block}

/* One continuous invitation canvas. No snap/jump between artwork panels. */
.card{position:fixed;inset:0;width:100%;height:100dvh;overflow-y:auto;overflow-x:hidden;background:var(--paper);opacity:0;pointer-events:none;transition:opacity 1s ease;-webkit-overflow-scrolling:touch;overscroll-behavior-y:auto;scroll-behavior:smooth}
.card.ready{opacity:1;pointer-events:auto}
.card-section{position:relative;width:100%;margin:0;padding:0;overflow:hidden;background:var(--paper);isolation:isolate}
.card-section>img{display:block;width:100%;height:auto;max-width:none;opacity:0;transform:translate3d(0,42px,0) scale(1.015);filter:blur(1.5px);transition:opacity 1.25s cubic-bezier(.22,.61,.36,1),transform 1.7s cubic-bezier(.16,.84,.28,1),filter 1.35s ease}
.card-section.active>img{opacity:1;transform:none;filter:none}
.reveal{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 25%,rgba(255,255,255,.3) 50%,transparent 75%);transform:translateX(-120%);opacity:0}
.card-section.active .reveal{animation:shimmer 1.8s ease .25s forwards}

/* Cover ONLY the printed/dummy timer digits. The "Until 18 September 2026" heading remains visible. */
.section-4:before{content:"";position:absolute;z-index:3;left:50%;top:20.05%;width:58%;height:8.2%;transform:translateX(-50%);background:rgba(249,248,244,.992);border-radius:4px;box-shadow:0 0 18px rgba(249,248,244,.2);pointer-events:none}
.live-countdown{position:absolute;z-index:6;left:50%;top:20.45%;transform:translateX(-50%);display:flex;align-items:flex-start;gap:6px;white-space:nowrap;opacity:0;pointer-events:none}
.section-4.active .live-countdown{animation:countIn .95s cubic-bezier(.2,.8,.2,1) .35s forwards}
.live-countdown div{display:flex;flex-direction:column;align-items:center}
.live-countdown b{font:500 clamp(18px,5vw,39px)/1 Montserrat,sans-serif;color:#fff;background:#242424;padding:5px 7px;min-width:clamp(45px,11.8vw,76px);text-shadow:0 1px 1px #000;border:1px solid rgba(255,255,255,.12)}
.live-countdown small{font:600 clamp(7px,1.5vw,11px)/1 Montserrat,sans-serif;letter-spacing:1px;margin-top:5px;color:#242424}
.live-countdown>span{font:500 clamp(20px,4vw,34px)/1 Montserrat,sans-serif;color:#333;margin-top:3px}
.map-hotspot{position:absolute;z-index:8;left:50%;top:91.7%;width:38%;height:5%;transform:translateX(-50%);border-radius:30px;background:transparent}
.map-hotspot:focus-visible{outline:2px solid rgba(100,80,40,.65);outline-offset:4px}

/* Curtain motion: derived from the supplied Page 4/5 artwork, with a gentle fabric-like sway. */
.curtain{position:absolute;z-index:7;top:0;width:22%;height:45%;pointer-events:none;opacity:0;overflow:hidden;background-repeat:no-repeat;background-size:454% auto;filter:saturate(.96);will-change:transform;mix-blend-mode:normal}
.section-4 .curtain,.section-5 .curtain{background-image:url('assets/4.jpg')}
.section-5 .curtain{background-image:url('assets/5.jpg')}
.curtain-left{left:0;background-position:left top;transform-origin:top left;clip-path:polygon(0 0,100% 0,92% 15%,96% 34%,90% 53%,95% 72%,88% 100%,0 100%)}
.curtain-right{right:0;background-position:right top;transform-origin:top right;clip-path:polygon(0 0,100% 0,100% 100%,12% 100%,5% 72%,10% 53%,4% 34%,8% 15%)}
.card-section.active .curtain{opacity:.94;animation:curtainWave 6.5s ease-in-out infinite}
.card-section.active .curtain-right{animation-delay:-3.25s}

.petals{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.petals i{position:absolute;top:-40px;width:9px;height:14px;border-radius:80% 20% 80% 20%;background:rgba(213,194,162,.24);opacity:0}
.petals i:nth-child(1){left:23%;animation:petalFall 8s ease-in-out .5s infinite}
.petals i:nth-child(2){left:48%;animation:petalFall 8.5s ease-in-out 1.4s infinite}
.petals i:nth-child(3){left:69%;animation:petalFall 7.8s ease-in-out 2.1s infinite}
.petals i:nth-child(4){left:84%;animation:petalFall 8.2s ease-in-out .9s infinite}

@keyframes handTap{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.95}45%{transform:translate(-50%,-43%) scale(.93);opacity:1}65%{transform:translate(-50%,-50%) scale(1)}}
@keyframes ring{0%{transform:translate(-50%,-50%) scale(.45);opacity:0}40%{opacity:.85}100%{transform:translate(-50%,-50%) scale(1.8);opacity:0}}
@keyframes labelPulse{50%{opacity:.45;letter-spacing:5px}}
@keyframes shimmer{0%{transform:translateX(-120%);opacity:0}20%{opacity:.55}100%{transform:translateX(120%);opacity:0}}
@keyframes petalFall{0%{opacity:0;transform:translate3d(0,-30px,0) rotate(20deg)}15%{opacity:.28}100%{opacity:0;transform:translate3d(70px,110vh,0) rotate(170deg)}}
@keyframes countIn{from{opacity:0;transform:translateX(-50%) translateY(-10px) scale(.96)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}
@keyframes curtainWave{0%,100%{transform:skewX(0deg) scaleX(1) translateX(0)}18%{transform:skewX(-1.4deg) scaleX(1.015) translateX(-2px)}38%{transform:skewX(1.7deg) scaleX(1.028) translateX(1px)}58%{transform:skewX(-1deg) scaleX(1.018) translateX(-1px)}78%{transform:skewX(.8deg) scaleX(1.012) translateX(1px)}}

@media(min-width:900px){.card-section>img{width:100%;height:auto}.live-countdown b{font-size:30px}}
@media(max-width:600px){
 .tap-hand{top:60%}.tap-label{bottom:8%}
 .section-4:before{top:20.05%;width:76%;height:9.0%}
 .live-countdown{top:20.35%;gap:3px}
 .live-countdown b{padding:4px;min-width:43px}
 .live-countdown>span{font-size:20px;margin-top:2px}
 .curtain{width:24%;height:45%}
 .map-hotspot{top:91.2%;width:52%;height:5.5%}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
