:root{--navy:#081a3b;--deep:#04112b;--gold:#c8ad66;--white:#fffef8;--pink:#ec79a3;--sans:'DM Sans',Arial,sans-serif;--sport:'Barlow Condensed',Impact,sans-serif;--cute:'Fredoka',sans-serif;--hand:'La Belle Aurore',cursive}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;font:16px/1.6 var(--sans);background:var(--navy);color:var(--white)}body.sealed{overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--pink);outline-offset:7px}h1:focus{outline:none}::selection{background:var(--gold);color:var(--navy)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* El inicio es su pequeño regalo rosa. */
.intro{position:fixed;inset:0;z-index:100;background:#ffe8ef;color:#c34d7f;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:45px 24px 65px;overflow:auto;isolation:isolate;transition:opacity .8s,visibility .8s}.intro::before{content:'';position:absolute;width:540px;height:540px;max-width:94vw;max-height:94vw;border-radius:50%;background:#fff8fb;z-index:-1;box-shadow:0 0 0 35px #fff4f850}.intro h1{font:500 clamp(48px,6.5vw,80px)/1.1 var(--cute);letter-spacing:-.035em;margin:0}.intro h1 em{font-style:normal;color:#e76e9d}.intro-note{font:400 22px var(--cute);margin:24px 0 45px;transform:rotate(-4deg)}.intro-hearts{position:absolute;inset:0;pointer-events:none;z-index:-1;color:#f08eaf}.intro-hearts span{position:absolute;font:50px var(--cute);animation:bob 4s ease-in-out infinite}.intro-hearts span:nth-child(1){left:18%;top:25%;transform:rotate(-15deg)}.intro-hearts span:nth-child(2){right:20%;top:18%;font-size:24px;animation-delay:1s}.intro-hearts span:nth-child(3){right:15%;bottom:24%;font-size:60px;animation-delay:2s}.intro-hearts span:nth-child(4){left:25%;bottom:18%;font-size:22px;animation-delay:.5s}.envelope{position:relative;width:242px;height:155px;background:#fff;border:1px solid #f7bed3;border-radius:9px;box-shadow:0 13px 0 #f4b7cd44,0 18px 38px #d952861c;transform:rotate(-6deg);transition:transform .4s;flex-shrink:0}.envelope:hover{transform:rotate(0) translateY(-7px)}.envelope:focus-visible{outline-color:#e580a7}.envelope-fold{position:absolute;inset:0;overflow:hidden;border-radius:8px}.envelope-fold::before{content:'';position:absolute;width:171px;height:171px;top:-93px;left:34px;transform:rotate(45deg);background:#fffafd;border-right:1px solid #f3c0d3;border-bottom:1px solid #f3c0d3;border-radius:0 0 6px 0}.seal{position:absolute;top:60px;left:calc(50% - 28px);width:56px;height:56px;background:#ed8aaf;border:5px solid #f39abc;box-shadow:0 3px 8px #ad447a22;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:26px;line-height:1}.intro.is-open{opacity:0;visibility:hidden;pointer-events:none}@keyframes bob{50%{translate:0 -12px}}
/* Adentro: azul, oro y una tribuna para dos. */
.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:5%;padding:65px 7% 100px;max-width:1650px;margin:auto;min-height:760px}.hero::before{content:'';position:absolute;left:0;top:0;bottom:0;width:14px;background:var(--gold)}.hero-watermark{position:absolute;left:-115px;top:90px;width:680px;opacity:.04;pointer-events:none}.hero-copy{position:relative;z-index:2;min-width:0}.pumas-lockup{display:flex;align-items:center;gap:20px;margin-bottom:27px}.pumas-lockup img{width:69px;height:69px}.pumas-lockup>span{font:600 18px/1.05 var(--sport);letter-spacing:.13em;color:var(--gold)}.pumas-lockup b{font-weight:600;color:#fff}.hero h1{font:800 clamp(58px,6.8vw,110px)/.92 var(--sport);letter-spacing:-.015em;margin:0 0 30px}.hero h1 em{font-style:normal;color:var(--gold)}.hero-description{font-size:18px;line-height:1.6;color:#d4dcea;margin:0 0 25px}.text-link{display:inline-flex;align-items:center;gap:34px;border-bottom:1px solid var(--gold);padding-bottom:8px;font-size:14px}.text-link span{font-size:25px;color:var(--gold)}.hero-visual{position:relative;padding:20px 6px 35px;min-width:0}.hero-visual::before{content:'';position:absolute;inset:28px 0 28px 0;border:3px solid var(--gold);transform:rotate(4deg);pointer-events:none}.hero-photo{border:0;padding:0;background:var(--deep);width:100%;display:block;aspect-ratio:1.095;position:relative;transform:rotate(-3deg);overflow:hidden;box-shadow:0 24px 65px #0005;touch-action:pan-y;user-select:none;-webkit-user-select:none;isolation:isolate}.hero-photo img{width:100%;height:100%;display:block;object-fit:cover;object-position:center;transition:filter .5s,transform .6s;pointer-events:none}.hero-photo:hover img{transform:scale(1.025)}.photo-patch{position:absolute;bottom:9px;right:-15px;background:var(--gold);color:var(--navy);padding:15px 24px;transform:rotate(6deg);font:800 23px/.98 var(--sport);letter-spacing:.025em;box-shadow:4px 4px 0 var(--deep);pointer-events:none}.photo-patch span{position:absolute;right:15px;top:12px;font-size:13px}.photo-patch{padding-right:40px}.photo-secret{position:absolute;inset:0;background:#061630d9;color:var(--white);display:flex;align-items:center;justify-content:center;text-align:center;padding:35px;font:32px/1.25 var(--cute);opacity:0;transition:opacity .4s}.holding .photo-secret{opacity:1}.holding img{filter:blur(3px);transform:scale(1.04)}.pumas-band{overflow:hidden;display:flex;align-items:center;justify-content:center;gap:40px;background:var(--gold);color:var(--navy);padding:14px 0;font:800 39px/1 var(--sport);white-space:nowrap;border-top:5px solid var(--deep);border-bottom:5px solid var(--deep)}.pumas-band b{font:23px var(--sans)}
.date-section{padding:62px 9%;display:flex;align-items:center;justify-content:space-between;gap:35px;max-width:1440px;margin:auto}.date-copy h2{font:700 52px/1 var(--sport);text-transform:uppercase;margin:0}.date-copy em{color:var(--gold);font-style:normal}.date-copy p{margin:12px 0 0;color:#b7c1d3;font-size:14px}.anniversary-date{display:flex;align-items:center;gap:15px;font:600 58px var(--sport);letter-spacing:.025em}.anniversary-date i{color:var(--gold);font-style:normal}
.letter-section{background:#fffef8;color:var(--navy);padding:92px 9%;display:grid;grid-template-columns:.85fr 1.15fr;gap:10%;position:relative;border-top:10px solid var(--gold)}.letter-heading{align-self:start;position:sticky;top:40px}.letter-heading>img{width:90px;height:90px;margin-bottom:20px}.letter-heading h2{font:800 70px/.94 var(--sport);margin:0;text-transform:uppercase}.letter-heading h2 em{font-style:normal;color:#ad8737}.letter-heading>p{font:25px var(--hand);margin-top:24px;color:#6c664f}.letter-wrap{max-width:620px;align-self:center;width:100%;padding:30px 0}.letter-paper{position:relative;background:#fff;border:2px solid var(--navy);border-top:12px solid var(--gold);padding:37px 40px;box-shadow:9px 9px 0 var(--navy);transform:rotate(2deg);transition:transform .5s}.letter-paper.open{transform:rotate(0)}.letter-salutation{font:34px var(--hand);margin:0 0 20px}.letter-teaser{font:600 36px/1.08 var(--sport);margin:0 0 25px}.letter-button{display:flex;justify-content:space-between;align-items:center;gap:18px;width:100%;background:var(--navy);color:var(--white);border:0;padding:12px 17px;font-size:16px}.letter-button span{color:var(--gold);font-size:23px}.letter-expand{display:grid;grid-template-rows:0fr;transition:grid-template-rows .65s}.letter-expand>div{overflow:hidden;opacity:0;transition:opacity .5s}.letter-paper.open .letter-expand{grid-template-rows:1fr}.letter-paper.open .letter-expand>div{opacity:1;transition-delay:.15s}#letter-paragraphs{padding-top:12px}#letter-paragraphs p{font-size:16px;line-height:1.9;color:#34435a;margin:25px 0}.letter-signature{font:27px var(--hand);margin:25px 0 0}.letter-kiss{font-size:32px;color:#b58f42}.letter-paper.open #letter-paragraphs p{animation:appear .7s both}.letter-paper.open #letter-paragraphs p:nth-child(2){animation-delay:.15s}.letter-paper.open #letter-paragraphs p:nth-child(3){animation-delay:.3s}.letter-paper.open #letter-paragraphs p:nth-child(4){animation-delay:.45s}
.reasons-section{position:relative;overflow:hidden;background:var(--deep);padding:90px 6% 70px;isolation:isolate}.reasons-watermark{position:absolute;width:630px;height:630px;left:calc(50% - 315px);bottom:50px;opacity:.025;z-index:-1}.reasons-heading{text-align:center}.reasons-heading h2{font:800 82px/.95 var(--sport);margin:0}.reasons-heading h2 em{color:var(--gold);font-style:normal}.reasons-heading p{font-size:16px;color:#b5c3d6;margin:25px 0}.constellation{position:relative;height:420px;max-width:1000px;margin:55px auto 25px}.constellation-lines{position:absolute;inset:0;width:100%;height:100%;color:#c8ad6666;pointer-events:none}.reason-star{position:absolute;transform:translate(-50%,-50%);min-width:52px;min-height:66px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;background:none;color:var(--gold);padding:5px;z-index:2}.reason-star>span{font-size:43px;line-height:1;transition:transform .25s}.reason-star:nth-child(even)>span{font-size:54px}.reason-star small{font-size:12px;color:#9daec4;margin-top:5px}.reason-star:hover>span,.reason-star[aria-pressed=true]>span{transform:scale(1.22) rotate(8deg)}.reason-star.found{color:#ffe4a0;filter:drop-shadow(0 0 12px #bba04f88)}.reason-star.found small{color:var(--gold)}.reason-output{position:absolute;left:50%;top:47%;width:57%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.reason-small{font-size:12px;letter-spacing:.08em;color:#bdcae0}.reason-output p{font:500 31px/1.25 var(--cute);margin:20px 0}.reason-ornament{font-size:23px;color:var(--gold)}.reasons-progress{display:flex;justify-content:center;align-items:center;gap:18px;font-size:14px;color:#b7c4d8}.reason-dots{display:flex;gap:8px}.reason-dot{width:6px;height:6px;border-radius:50%;background:#465c7d}.reason-dot.found{background:var(--gold)}.all-reasons{text-align:center;max-width:650px;margin:28px auto 0;color:var(--gold);font:28px/1.3 var(--hand);animation:appear .6s both}
.closing-section{position:relative;text-align:center;padding:75px 6% 25px;border-top:9px solid var(--gold);background:var(--navy)}.closing-badge img{width:108px;height:108px}.closing-section h2{font:800 clamp(55px,6.8vw,94px)/.95 var(--sport);margin:32px 0;text-transform:uppercase}.closing-section h2 em{color:var(--gold);font-style:normal}.goya-button{display:flex;align-items:center;justify-content:center;gap:28px;margin:33px auto;background:var(--gold);color:var(--navy);border:2px solid var(--gold);padding:12px 48px;font:800 43px var(--sport);box-shadow:5px 5px 0 #fff;transform:rotate(-3deg);transition:transform .25s,box-shadow .25s}.goya-button:hover{transform:rotate(0) translateY(-3px);box-shadow:7px 8px 0 #fff}.goya-button span{font:24px var(--sans)}.secret-button{display:flex;align-items:center;gap:18px;margin:45px auto 0;border:0;border-bottom:1px solid #bdab7766;background:none;padding:0 0 7px;font-size:14px;color:#d5dce8}.secret-button span{color:var(--gold);font-size:23px}.secret-text{font:24px/1.3 var(--cute);max-width:570px;margin:24px auto 0;color:#e5cf94;animation:appear .5s both}.page-footer{text-align:center;padding:10px 20px 92px}.page-footer button{background:none;border:0;min-width:44px;min-height:44px;font-size:25px;color:var(--gold)}.page-footer button:hover{color:var(--pink)}
.sound-toggle{position:fixed;z-index:20;bottom:20px;right:24px;display:flex;gap:12px;align-items:center;border:1px solid #c8ad6680;background:var(--navy);color:#fff;border-radius:99px;padding:11px 16px;box-shadow:0 4px 18px #0002;font-size:14px}.sound-bars{height:16px;display:flex;align-items:center;gap:3px}.sound-bars i{background:var(--gold);width:2px;height:8px}.sound-bars i:nth-child(2){height:15px}.sound-bars i:nth-child(3){height:11px}.sound-toggle[aria-pressed=true] i{animation:sound .8s infinite alternate}.sound-toggle[aria-pressed=true] i:nth-child(2){animation-delay:.25s}.sound-toggle[aria-pressed=true] i:nth-child(3){animation-delay:.5s}@keyframes sound{to{height:3px}}.toast{position:fixed;bottom:82px;left:50%;transform:translate(-50%,12px);background:var(--white);color:var(--navy);border:2px solid var(--gold);padding:13px 22px;max-width:calc(100vw - 32px);text-align:center;font-size:15px;opacity:0;pointer-events:none;transition:.3s;z-index:120}.toast.visible{opacity:1;transform:translate(-50%,0)}.goya-celebration{position:fixed;inset:0;z-index:105;pointer-events:none;background:#04112bf5;display:flex;align-items:center;justify-content:center;flex-direction:column;color:var(--gold);opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}.goya-celebration.show{opacity:1;visibility:visible}.goya-celebration img{width:140px;height:140px}.goya-celebration strong{font:800 clamp(110px,23vw,270px)/1 var(--sport);transform:scale(.8);transition:transform .4s}.goya-celebration.show strong{transform:scale(1)}.goya-celebration>span{font:25px var(--cute);color:#fff;text-align:center;padding:20px}.photo-dialog{padding:0;border:3px solid var(--gold);background:var(--navy);color:var(--white);max-width:min(94vw,950px);max-height:94dvh;overflow:auto}.photo-dialog::backdrop{background:#04112bee;backdrop-filter:blur(6px)}.photo-dialog img{display:block;width:100%;max-height:78dvh;object-fit:contain}.photo-dialog p{text-align:center;padding:17px 20px;margin:0;font:25px var(--hand)}.dialog-close{position:absolute;top:10px;right:10px;z-index:1;width:44px;height:44px;border:0;background:transparent;color:#fff;font-size:32px;line-height:1;text-shadow:0 2px 5px #081a3b,0 0 2px #081a3b;cursor:pointer}.photo-unavailable::after{content:'Nuestro recuerdo favorito ♡';position:absolute;inset:0;display:grid;place-content:center;background:var(--navy);color:var(--gold);font:32px var(--cute);padding:25px}.reveal{opacity:0;transform:translateY(20px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:translateY(0)}.entered .hero-copy{animation:appear .8s .15s both}.entered .hero-visual{animation:appear 1s .3s both}@keyframes appear{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.hero h1{text-transform:uppercase}.relationship-clock{display:flex;align-items:baseline;justify-content:center;gap:36px;margin:42px auto 0;padding-top:26px;border-top:1px solid #c8ad6670;max-width:400px;font-variant-numeric:tabular-nums}.clock-part{display:flex;flex-direction:column;align-items:center;min-width:65px}.clock-part b{font:700 66px/1 var(--sport);color:var(--white)}.clock-part>span{font-size:15px;color:#c7d2e3;margin-top:7px}.date-copy h2{font-size:52px;letter-spacing:.02em}.date-detail{align-self:center}
@media(max-width:1000px){.hero{padding:45px 6% 70px;min-height:620px;gap:4%}.hero h1{font-size:68px}.hero-description{font-size:17px}.pumas-lockup{margin-bottom:22px}.letter-section{padding:70px 7%;gap:8%}.letter-heading h2{font-size:60px}.letter-paper{padding:30px}.photo-patch{font-size:20px}.reasons-heading h2{font-size:73px}}
@media(max-width:700px){.intro{padding:45px 20px 65px}.intro h1{font-size:58px}.intro-note{font-size:21px;margin:20px 0 36px}.intro::before{width:360px;height:420px;max-height:none;max-width:none}.intro-hearts span:nth-child(1){left:7%;top:14%;font-size:35px}.intro-hearts span:nth-child(2){right:9%;top:21%}.intro-hearts span:nth-child(3){right:10%;bottom:15%;font-size:44px}.intro-hearts span:nth-child(4){left:13%;bottom:21%}.envelope{width:218px;height:145px}.envelope-fold::before{width:154px;height:154px;top:-83px;left:31px}.seal{top:54px}.hero{padding:38px 8% 70px;grid-template-columns:1fr;gap:22px;min-height:0}.hero::before{width:7px}.hero-watermark{width:490px;left:30%;top:-50px}.pumas-lockup{gap:14px;margin-bottom:22px}.pumas-lockup img{width:54px;height:54px}.pumas-lockup>span{font-size:15px;letter-spacing:.1em}.hero h1{font-size:clamp(53px,12vw,83px);line-height:.94;margin-bottom:22px}.hero-description{font-size:17px;margin-bottom:17px}.hero-description br{display:none}.text-link{font-size:14px}.hero-visual{margin-top:14px;padding:15px 0 25px}.photo-patch{right:-5px;bottom:0;font-size:21px;padding:13px 38px 13px 19px}.pumas-band{gap:24px;font-size:29px;padding:12px 0;justify-content:flex-start}.pumas-band>span:first-child{margin-left:22px}.pumas-band b{font-size:18px}.date-section{padding:40px 8%;gap:20px;flex-wrap:wrap}.date-copy h2{font-size:43px}.date-copy p{font-size:14px}.anniversary-date{font-size:45px;gap:12px}.letter-section{padding:58px 8% 68px;grid-template-columns:1fr;gap:12px;border-top-width:7px}.letter-heading{position:relative;top:0}.letter-heading>img{width:66px;height:66px;position:absolute;right:0;top:0;margin:0}.letter-heading h2{font-size:57px}.letter-heading p{font-size:25px;margin:22px 0 0}.letter-wrap{padding-top:20px}.letter-paper{padding:28px 27px;box-shadow:6px 6px 0 var(--navy)}.letter-teaser{font-size:35px}.letter-salutation{font-size:32px}.reasons-section{padding:63px 4% 50px}.reasons-heading h2{font-size:58px}.reasons-heading p{font-size:15px;max-width:280px;margin:22px auto 0}.constellation{height:410px;margin-top:42px}.reason-output{width:65%;top:48%}.reason-output p{font-size:23px;line-height:1.25}.reason-small{font-size:12px;letter-spacing:.02em}.reason-star>span{font-size:34px}.reason-star:nth-child(even)>span{font-size:45px}.reasons-progress{font-size:12px;gap:12px}.all-reasons{font-size:25px;max-width:300px}.closing-section{padding-top:56px;border-top-width:7px}.closing-badge img{width:90px;height:90px}.closing-section h2{font-size:clamp(44px,10vw,68px)}.secret-button{margin-top:40px;font-size:14px;gap:10px}.secret-text{font-size:22px}.goya-button{font-size:39px;padding:10px 45px}.sound-toggle{right:15px;bottom:15px;font-size:12px}.photo-secret{font-size:26px;padding:28px}.photo-dialog p{font-size:22px}.toast{font-size:14px}.page-footer{padding-bottom:87px}}
@media(max-width:370px){.hero h1{font-size:54px}.hero{padding-left:7%;padding-right:7%}.letter-heading h2{font-size:50px}.letter-heading>img{width:55px;height:55px}.letter-paper{padding:25px 22px}.reasons-heading h2{font-size:52px}.reason-output p{font-size:21px}.intro h1{font-size:53px}.intro-note{font-size:20px}}
@media(max-height:560px){.intro{justify-content:flex-start;padding-top:28px;padding-bottom:35px}.intro h1{font-size:44px}.intro-note{font-size:18px;margin:12px 0 24px}.envelope{width:190px;height:120px}.envelope-fold::before{width:134px;height:134px;top:-78px;left:27px}.seal{top:40px;width:48px;height:48px;left:calc(50% - 24px)}}
@media(max-width:700px){.letter-heading>img{position:static;display:block;margin:0 0 20px}.hero-description br{display:block}.relationship-clock{gap:26px;margin-top:33px;padding-top:24px}.clock-part b{font-size:56px}.date-copy h2{font-size:43px}}
.letter-salutation{line-height:1.25}.letter-button{justify-content:center}.reasons-heading p{line-height:1.7}.reasons-heading p strong{color:var(--gold);font-weight:700}.reason-output.has-reason{width:64%}.reason-output.has-reason p{font:500 clamp(19px,2.2vw,26px)/1.24 var(--cute);margin:12px 0}.reasons-finale{text-align:center;animation:appear .6s both}.reasons-finale[hidden]{display:none}.reasons-finale .all-reasons{margin:30px auto 25px}.love-video-frame{width:min(300px,80vw);margin:0 auto;border:3px solid var(--gold);padding:7px;background:var(--navy);box-shadow:8px 8px 0 #c8ad6633;transform:rotate(-2deg)}.love-video-frame video{display:block;width:100%;height:auto;aspect-ratio:auto;background:#040a16}.love-video-frame:focus-within{outline:2px solid var(--white);outline-offset:6px}
@media(max-width:700px){.reason-output.has-reason{width:72%}.reason-output.has-reason p{font-size:clamp(16px,4.4vw,21px);line-height:1.18}.reasons-finale .all-reasons{max-width:330px}.letter-salutation{font-size:29px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}