@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--ink:#233333;--paper:#f0e7d5;--gold:#d7b56f;--red:#883e36}*{box-sizing:border-box}body{margin:0;background:#182326;color:var(--paper);font-family:'DM Sans',sans-serif}body:before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse at 50% 36%,#3a4742 0,transparent 65%);pointer-events:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:6px}header{height:88px;position:relative;z-index:10;display:flex;align-items:center;padding:0 5%;gap:28px}.brand{font-family:'Cormorant Garamond',Georgia,serif;font-size:30px;color:var(--paper);text-decoration:none}.brand span{color:var(--gold);margin:0 5px}.edition,.eyebrow{font-size:12px;letter-spacing:2.7px;font-weight:500}.edition{color:#c2c7bc}.edition i{padding:0 12px;color:var(--gold)}.quiet{margin-left:auto;border:1px solid #8d9487;background:transparent;color:var(--paper);padding:8px 16px;border-radius:30px;font-size:14px}main{min-height:calc(100svh - 154px);position:relative}.scene{display:none;min-height:calc(100svh - 154px)}.scene.active{display:flex;animation:appear 1s both}.opening{align-items:center;flex-direction:column;justify-content:center;padding:12px 20px 24px;perspective:1600px}.intro{text-align:center}.eyebrow{color:var(--gold);line-height:1.7;margin:0 0 15px}h1,h2,p{margin-top:0}h1,h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;line-height:1.02;letter-spacing:-1.3px}h1{font-size:clamp(36px,4.4vw,62px);margin-bottom:35px}em{font-weight:400;color:var(--gold)}.envelope{display:block;position:relative;width:min(570px,84vw);height:290px;transform:rotate(-5deg);border:0;background:transparent;color:#33403b;filter:drop-shadow(0 24px 30px #0007);transition:transform .6s}.envelope:hover{transform:rotate(-2deg) translateY(-5px)}.envelope-back,.envelope-front,.flap{position:absolute;inset:0;background:#d9c6a1;border-radius:3px}.envelope-front{background:linear-gradient(28deg,#e4d5b4 49.8%,transparent 50%) left/51% 100% no-repeat,linear-gradient(-28deg,#e4d5b4 49.8%,transparent 50%) right/51% 100% no-repeat;box-shadow:inset 0 -1px 2px #98805d}.flap{background:#e9dab9;clip-path:polygon(0 0,100% 0,50% 58%);filter:drop-shadow(0 2px 0 #b49c76);transform-origin:top;transition:transform .8s;z-index:3}.letter-peek{position:absolute;inset:12px 20px;background:#f4ecd9;padding:20px;font-family:Georgia;transition:transform 1s;z-index:1}.address{position:absolute;left:38px;bottom:33px;text-align:left;display:flex;flex-direction:column;gap:5px;z-index:4}.address small{font:italic 18px Georgia}.address strong{font:26px 'Cormorant Garamond',Georgia}.address>span{font-size:12px;letter-spacing:1px}.stamp-mini{position:absolute;right:25px;bottom:30px;padding:7px 12px;border:3px dotted #b7aa8a;outline:1px solid #657263;color:#657263;font-size:10px;letter-spacing:1px;transform:rotate(7deg);z-index:4}.stamp-mini b{display:block;font:30px Georgia}.seal{position:absolute;width:66px;height:66px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#a65949,#672e29);border:5px double #b57159;box-shadow:2px 5px 9px #43281c66;left:calc(50% - 33px);top:135px;color:#e5b797;font:italic 36px Georgia;display:grid;place-items:center;z-index:5;transition:opacity .3s,transform .5s}.postmark{position:absolute;left:35px;top:20px;z-index:4;border:2px solid #72796488;border-radius:50%;padding:16px 10px;font-size:10px;line-height:1.6;letter-spacing:1.4px;transform:rotate(-14deg);opacity:.7}.envelope.opened .flap{transform:rotateX(180deg);z-index:0}.envelope.opened .seal{transform:scale(1.4);opacity:0}.envelope.opened .letter-peek{transform:translateY(-100px)}.envelope.opened{transform:rotate(0) translateY(40px);opacity:0;transition:transform 1.2s,opacity .6s .7s}.open-hint{font-size:12px;letter-spacing:2.4px;margin:39px 0 24px;color:#e2c790}.open-hint span{padding-left:12px}.bottom-note{font-family:'Cormorant Garamond',Georgia;font-size:19px;font-style:italic;color:#c2c7bc}footer{height:66px;padding:0 5%;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:10;font-size:11px;letter-spacing:1.6px;color:#bfc5b9}footer nav{display:flex;gap:12px}.dot{width:25px;height:25px;border:0;background:transparent;position:relative}.dot:after{content:'';width:5px;height:5px;position:absolute;left:10px;top:10px;border-radius:50%;background:#85908c}.dot.current:after{background:var(--gold);box-shadow:0 0 0 5px #d7b56f22}#invitation{align-items:center;justify-content:center;padding:25px 5% 40px}.postcard{width:min(1050px,100%);display:grid;grid-template-columns:1.03fr 1fr;background:var(--paper);color:var(--ink);padding:16px;box-shadow:0 25px 70px #0005;transform:rotate(-1deg)}.postcard-photo{position:relative;min-height:545px;overflow:hidden}.postcard-photo img{width:100%;height:100%;object-fit:cover;position:absolute;object-position:42% center}.postcard-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#0d1a23dd)}.photo-caption{position:absolute;left:28px;bottom:53px;font-family:'Cormorant Garamond',Georgia;font-size:36px;color:#fff2d5;z-index:1;line-height:1}.photo-caption em{font-size:70px;color:#f4d291}.photo-index{position:absolute;z-index:1;bottom:24px;left:30px;font-size:11px;letter-spacing:3px}.postcard-copy{padding:20px 32px 16px}.postal-top{height:65px;display:flex;justify-content:space-between;align-items:flex-start;font-family:Georgia;color:#7b806d;letter-spacing:2px;font-size:13px}.round-stamp{font-family:'DM Sans',sans-serif;font-size:9px;letter-spacing:1px;line-height:1.6;text-align:center;border:2px solid #8b5346;border-radius:50%;padding:10px;transform:rotate(13deg);color:#8b5346;margin-top:-8px}.postcard-copy .eyebrow{color:#8a7150;font-size:10px;letter-spacing:1.8px}.postcard-copy h2{font-size:65px;margin:0 0 13px}.postcard-copy h2 em{color:var(--red)}.invite-text{font-family:'Cormorant Garamond',Georgia;font-size:22px;line-height:1.25}.details{display:flex;gap:30px;padding:16px 0;border-top:1px solid #c9bea5;border-bottom:1px solid #c9bea5}.details>div+div{border-left:1px solid #c9bea5;padding-left:30px}small{display:block}.details small,.meeting small{font-size:10px;letter-spacing:1.8px;color:#766b55;margin-bottom:4px}.details strong{font-family:'Cormorant Garamond',Georgia;font-weight:500;font-size:41px;line-height:1}.details em{color:var(--ink);font-size:23px}.meeting{font-size:16px;margin:14px 0}.secret{width:100%;display:flex;justify-content:space-between;gap:10px;align-items:center;background:transparent;border:0;border-bottom:1px dashed #a7977c;padding:10px 0 16px;color:#65543e;font-size:12px}.secret b{font-size:10px;letter-spacing:1.2px;color:var(--red);transform:rotate(-3deg);border:1px solid #a87860;padding:5px}.primary{display:flex;justify-content:space-between;gap:18px;align-items:center;width:100%;border:0;background:#283e39;color:#f4ebd6;padding:16px 19px;font-size:13px;margin-top:17px}.primary:hover{background:#3d5345}.journey{position:relative;flex-direction:column;justify-content:space-between;overflow:hidden;padding:40px 8%}.street-photo{position:absolute;inset:-20%;background:url('assets/calle-hd.png') center 65%/cover;animation:droneStreet 16s linear forwards}.shade{position:absolute;inset:0;background:linear-gradient(180deg,#101a20c9,transparent 60%,#0e1c21a8)}.journey-heading{position:relative;z-index:1}.journey h2{font-size:clamp(44px,5.5vw,80px);margin-bottom:18px}.journey-heading>p:last-child{font:italic 23px 'Cormorant Garamond',Georgia}.route-card{position:relative;max-width:760px;background:#182b2ddb;border:1px solid #d9c49355;backdrop-filter:blur(12px);padding:24px 30px;margin:50px 0 10px;width:100%;align-self:center}.route-card svg{width:100%;overflow:visible}.route-base,.route-line{fill:none;stroke-width:2;stroke:#cad0bc33}.route-line{stroke:#e9c47d;stroke-dasharray:800;stroke-dashoffset:800}.route-points{fill:#e9c47d}.route-card text{font-family:'DM Sans',sans-serif;fill:#efe4cb;font-size:14px}.route-foot{display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:1.6;color:#d8d0bb}.sky{position:relative;overflow:hidden;align-items:center;justify-content:center;text-align:center;min-height:calc(100svh - 154px)}.sky-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:rise 12s ease-out both;object-position:50% 75%}.sky-shade{position:absolute;inset:0;background:linear-gradient(#09152166,#09152111 45%,#091521c9);transition:background 2s}.sky-title{position:relative;padding:50px 20px;align-self:flex-start;transition:opacity 1s,transform 1s}.sky h2{font-size:clamp(43px,6vw,88px);text-shadow:0 2px 30px #0007}.sky.finish .sky-title{opacity:0;transform:translateY(-30px)}.ending{position:absolute;opacity:0;transform:translateY(35px);transition:opacity 1.5s,transform 1.5s;padding:30px 20px;max-width:600px;width:100%;pointer-events:none}.sky.finish .ending{opacity:1;transform:none;pointer-events:auto}.sky.finish .sky-shade{background:#0b1921b8}.ending h2{margin-bottom:20px}.signature{font:italic 34px 'Cormorant Garamond',Georgia;color:#e9c995;margin-bottom:20px}.end-date{font-size:14px;letter-spacing:2px;line-height:1.9}.end-date span{padding:0 8px}.end-date small{font-size:14px;letter-spacing:.6px}.light{background:#efdfbf;color:#243b36;max-width:290px;margin:28px auto 0}.light:hover{background:#fff0d0}dialog{border:1px solid #b8a57d;background:var(--paper);color:var(--ink);max-width:450px;width:calc(100% - 32px);padding:38px;text-align:center;box-shadow:0 20px 100px #0008}dialog::backdrop{background:#071417bb;backdrop-filter:blur(7px)}dialog .eyebrow{color:#8b7150;font-size:10px}dialog h2{font-size:48px;margin-bottom:20px}dialog h2 em{color:var(--red)}dialog p{line-height:1.6}.close{position:absolute;right:12px;top:8px;border:0;background:none;color:var(--ink);font-size:30px}.secret-number{font:70px 'Cormorant Garamond',Georgia;letter-spacing:8px;color:#8b7150;filter:blur(2px);animation:shhh .25s 5}.classified{display:inline-block;color:var(--red);font-size:11px;letter-spacing:2px;border:2px solid var(--red);padding:9px;transform:rotate(-7deg);margin:5px 0 15px}.paused *{animation-play-state:paused!important}@keyframes appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes droneStreet{from{transform:scale(1.08) translateY(6%)}to{transform:scale(1.36) translateY(-6%)}}@keyframes rise{from{transform:scale(1.65) translateY(9%)}to{transform:scale(1) translateY(0)}}@keyframes shhh{50%{transform:translateX(4px)}}@media(max-width:700px){header{height:70px;padding:0 6%;gap:17px}.edition{font-size:9px;letter-spacing:1.6px}.edition i{padding:0 4px}.brand{font-size:26px}.quiet{font-size:12px;padding:7px 10px}.scene,main,.sky{min-height:calc(100svh - 128px)}.opening{padding:20px 16px 30px}h1{font-size:42px;margin-bottom:65px}.intro .eyebrow{font-size:9px;letter-spacing:2px}.envelope{height:215px;width:min(420px,85vw)}.seal{width:54px;height:54px;left:calc(50% - 27px);top:96px;font-size:28px}.address{left:23px;bottom:22px}.address strong{font-size:21px}.address small{font-size:15px}.stamp-mini{right:19px;bottom:24px;font-size:8px;padding:5px 9px}.stamp-mini b{font-size:22px}.postmark{font-size:8px;top:13px;left:20px;padding:9px}.open-hint{font-size:10px;margin-top:38px}.bottom-note{font-size:16px;text-align:center;max-width:280px}footer{height:58px;padding:0 6%;font-size:9px;letter-spacing:1px}footer>span:last-child{display:none}#invitation{padding:8px 18px 25px}.postcard{grid-template-columns:1fr;transform:rotate(0);padding:10px;max-width:440px}.postcard-photo{min-height:220px}.postcard-photo img{object-position:50% 49%}.photo-caption{font-size:23px;left:20px;bottom:25px}.photo-caption em{font-size:48px}.photo-index{left:auto;right:15px;bottom:17px;font-size:8px}.postcard-copy{padding:19px 19px 13px}.postal-top{height:45px;font-size:11px}.round-stamp{font-size:8px;padding:7px}.postcard-copy h2{font-size:52px}.postcard-copy h2 br{display:none}.postcard-copy h2 em{margin-left:8px}.invite-text{font-size:20px}.details{padding:13px 0}.details strong{font-size:36px}.journey{padding:35px 22px}.journey h2{font-size:47px}.journey .eyebrow{font-size:10px}.route-card{padding:19px 13px;margin-top:85px}.route-card .eyebrow{font-size:9px;letter-spacing:1.5px}.route-foot{font-size:10px;flex-direction:column;gap:5px}.route-card svg{margin:15px 0}.route-card text{font-size:18px}.sky-title{padding-top:40px}.sky-title .eyebrow{font-size:9px;letter-spacing:1.6px}.sky h2{font-size:51px}.sky-photo{object-position:43% center}.ending{padding:30px}.ending .eyebrow{font-size:10px}.ending h2{font-size:64px}.signature{font-size:32px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.envelope:hover{transform:rotate(-5deg)}}
/* Motion, guidance, and the celebration */
.scene.active{animation:sceneReveal .95s cubic-bezier(.16,1,.3,1) both}.postcard{animation:unfold 1.2s cubic-bezier(.16,1,.3,1) both;transform-origin:50% 15%}.primary,.secret,.journey-next{transition:transform .25s,box-shadow .25s,background .25s;min-height:48px}.primary:hover,.journey-next:hover{transform:translateY(-3px);box-shadow:0 9px 25px #0003}.primary:active,.journey-next:active{transform:scale(.97)}.tap-symbol{display:inline-block;font-size:22px;vertical-align:middle;animation:tapGuide 1.8s ease-in-out infinite}.open-hint{display:flex;align-items:center;gap:8px}.open-hint span{padding:0}.tap-ripple{position:absolute;inset:-10px;border:1px solid #e9bd81;border-radius:50%;animation:tapRing 2.3s ease-out infinite;pointer-events:none}.action-guide{font-size:13px;color:#786747;text-align:center;margin:13px 0 -5px}.action-guide .tap-symbol{font-size:20px;margin-right:5px}.guided>span,.journey-next>span{display:inline-block;animation:nudge 1.6s ease-in-out infinite}.secret:hover{background:#d7b56f22}.arrival-inline{display:block;font-size:13px;color:#894c3c;margin-top:8px;line-height:1.5}.journey-next{background:transparent;border:1px solid #d8c28b77;color:#f4e6c8;padding:12px 17px;margin:16px auto 0;display:flex;align-items:center;gap:22px;font-size:13px}.journey-next>span{font-size:24px}.street-photo{background-image:url('assets/calle-hd.png');inset:-8%;animation:droneStreetHD 16s ease-in-out forwards}.sky.active .sky-photo{animation:cinematicRise 3s cubic-bezier(.16,.65,.3,1) both}.sky{min-height:max(800px,calc(100svh - 154px))}.sky.finish .sky-photo{animation:cityFloat 22s ease-in-out infinite alternate}.sky.finish .sky-shade{background:linear-gradient(90deg,#06131ada,#06131a8c 50%,#06131aa8)}#celebration{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.sky-title,.ending{z-index:2}.ending{max-width:680px;position:absolute;padding:30px 40px}.ending h2{font-size:clamp(50px,5.5vw,78px);margin-bottom:12px}.ending .signature{margin-bottom:12px}.sky.finish .ending>h2{animation:finalWords 1.4s both}.sky.finish .ending>p,.sky.finish .end-date{animation:finalWords 1.6s .15s both}.arrival-note{line-height:1.65;font-size:14px;margin:20px 0 18px;color:#e9e2d5}.arrival-note strong{display:block;color:#f5d694;font-size:19px;margin-bottom:4px}.countdown-wrap{max-width:430px;margin:auto}.countdown-wrap .eyebrow{font-size:11px;letter-spacing:1.9px;margin-bottom:10px}.countdown{display:flex;align-items:center;justify-content:center;gap:12px}.countdown>div{flex:1;max-width:80px;padding:10px 4px;background:#f4dab60d;border-top:1px solid #e0bb764d;border-bottom:1px solid #e0bb764d}.countdown strong{display:block;font:42px 'Cormorant Garamond',Georgia;line-height:1;color:#ffe7b5;font-variant-numeric:tabular-nums}.countdown span{font-size:9px;letter-spacing:1.4px;display:block;margin-top:7px;color:#e2d7c6}.countdown i{font:25px Georgia;color:#beaa87;font-style:normal}.dot{width:44px;height:44px}.dot:after{top:20px;left:20px}footer nav{gap:3px}.end-date{font-size:13px}.ending .light{margin-top:20px}.secret-number{animation:shhh .25s 5}.postcard-copy{padding-bottom:20px}.postcard-photo img{object-position:45% center}.sky-title{pointer-events:none}
@keyframes sceneReveal{from{opacity:0;transform:translateY(35px) scale(.95);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}@keyframes unfold{from{transform:perspective(1300px) rotateX(20deg) rotate(-4deg) scale(.9);opacity:.1}to{transform:perspective(1300px) rotateX(0) rotate(-1deg) scale(1);opacity:1}}@keyframes tapGuide{0%,100%{transform:translateY(3px) rotate(-12deg)}50%{transform:translateY(-5px) rotate(-12deg)}}@keyframes tapRing{0%{transform:scale(.85);opacity:.8}90%,100%{transform:scale(1.65);opacity:0}}@keyframes nudge{50%{transform:translateX(5px)}}@keyframes droneStreetHD{from{transform:scale(1) translateY(5%)}to{transform:scale(1.2) translateY(-7%)}}@keyframes cinematicRise{0%{transform:scale(1.75) translateY(16%);filter:brightness(.55)}55%{filter:brightness(1.1)}100%{transform:scale(1.04) translateY(0);filter:brightness(1)}}@keyframes cityFloat{from{transform:scale(1.04) translateX(-.5%)}to{transform:scale(1.13) translateX(1%)}}@keyframes finalWords{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(max-width:700px){.sky{min-height:920px}.sky-photo{object-position:52% top;height:100%;object-fit:cover}.sky.finish .sky-photo{height:420px;object-fit:cover;object-position:52% center}.sky.finish .sky-shade{background:linear-gradient(transparent 0,#08172033 180px,#081720f5 410px,#081720 100%)}.sky.finish{background:#081720}.ending{top:230px;padding:35px 22px 25px}.ending h2{font-size:57px}.ending .signature{font-size:29px}.ending .eyebrow{font-size:10px;letter-spacing:1.6px}.countdown{gap:7px}.countdown strong{font-size:38px}.countdown span{font-size:8px;letter-spacing:1px}.arrival-note{font-size:14px}.postcard-photo{min-height:235px}.postcard-copy h2{font-size:48px}.secret{flex-wrap:wrap}.edition{max-width:160px;line-height:1.6}.quiet{margin-left:auto}.action-guide{font-size:12px}.journey .route-card{margin-top:55px}.sky-title{padding-top:65px}.sky-title h2{font-size:45px}.postcard{animation-name:sceneReveal}}@media(prefers-reduced-motion:reduce){.scene.active,.postcard,.sky.active .sky-photo,.sky.finish .sky-photo,.sky.finish .ending>*,.tap-symbol,.tap-ripple,.guided>span,.journey-next>span{animation:none!important;transition:none!important}#celebration{display:none}}

/* Bring the final invitation in promptly. */
.ending{transition:opacity .65s,transform .65s}.sky.finish .ending>h2{animation-duration:.65s}.sky.finish .ending>p,.sky.finish .end-date{animation-duration:.65s;animation-delay:.05s}
