@import url('https://fonts.googleapis.com/css2?family=Fascinate&family=Baloo+2:wght@400;500;600;700;800&family=Nunito:wght@400;600;700;800;900&display=swap');
:root{--lime:#ff78bc;--orange:#c91b4f;--turquoise:#65d3ff;--forest:#542143;--cream:#fffaf2;--ink:#542143;--display:'Baloo 2','Arial Rounded MT Bold',sans-serif;--body:'Nunito',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font:600 1.125rem/1.65 var(--body)}body.waiting{overflow:hidden}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--ink);outline-offset:5px}button{border:0}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:800;line-height:1.05}h2{font-size:clamp(2.8rem,5vw,4.8rem);letter-spacing:-.03em}h3{font-size:1.7rem}.tiny{font-size:.875rem;font-weight:900;letter-spacing:.16em;line-height:1.5}.grain{background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23164e3e' opacity='.045' filter='url(%23n)' d='M0 0h140v140H0z'/%3E%3C/svg%3E")}.button{display:inline-flex;justify-content:center;align-items:center;gap:14px;border-radius:100px;min-height:58px;padding:15px 30px;font-size:1.05rem;font-weight:900;text-decoration:none;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 8px 0 #54214325}.dark{background:var(--forest);color:var(--cream)}.quiet{background:none;color:var(--ink);padding:14px 24px;font-size:.95rem;text-decoration:underline;text-underline-offset:5px;font-weight:800}.wordmark{font-size:1.4rem;font-family:var(--display);font-weight:800;letter-spacing:-.06em}.wordmark span{color:#f26843}
.welcome{border:0;padding:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;background:var(--lime);color:var(--ink);overflow:auto}.welcome::backdrop{background:var(--forest)}.welcome-inner{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;padding:44px 20px 28px;overflow:hidden}.intro-tag{position:relative;z-index:2;margin-bottom:24px}.intro-heading{position:relative;z-index:2}.intro-heading>p{font-family:var(--display);font-weight:700;font-size:clamp(1.5rem,3vw,2rem)}.intro-heading h1{font-size:clamp(4.8rem,14vw,10.8rem);letter-spacing:-.035em;margin:0}.age-line{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:-10px;font:800 1.65rem var(--display)}.age-line strong{font-size:5rem;line-height:1.1;color:var(--forest)}.intro-art{position:relative;width:min(660px,95vw);height:230px;flex:none;margin:-15px 0 0}.theme-art{display:block;background-image:url('assets/theme-sprites.png');background-size:200% 200%;width:200px;height:200px;pointer-events:none;animation:sway 5s ease-in-out infinite;transform-origin:50% 90%}.figure-one{background-position:0 0}.figure-two{background-position:100% 0;animation-delay:-1.4s}.figure-three{background-position:0 100%;animation-delay:-2.8s}.figure-four{background-position:100% 100%;animation-delay:-.7s}.intro-art .theme-art{position:absolute;width:240px;height:240px;bottom:0}.intro-art .figure-one{left:6%;z-index:2}.intro-art .figure-two{right:5%;bottom:10px;z-index:1}.intro-art .figure-three{left:-14%;bottom:-30px;width:160px;height:160px;opacity:.95}.intro-art .figure-four{right:-12%;bottom:-20px;width:160px;height:160px}.welcome-actions{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;gap:0}.welcome-actions p{font-size:1rem;margin:5px 0 15px}.welcome .wordmark{margin-top:12px;z-index:2}.welcome.leaving{animation:fadeOut .7s forwards}
.music-toggle{position:fixed;bottom:20px;right:20px;z-index:20;background:var(--forest);color:var(--cream);border:1px solid #ffffff55;border-radius:100px;padding:11px 17px;box-shadow:0 4px 20px #0002;display:none;align-items:center;gap:9px;font-size:.875rem}.music-toggle span:first-child{font-size:1.35rem}.music-toggle.playing span:first-child{animation:sway 3s infinite}.photo-stage{height:min(78svh,850px);position:relative;overflow:hidden;background:#10281f}.photo{position:absolute;inset:0;background-image:url('assets/photos.jpg');background-size:300% 200%;background-repeat:no-repeat;opacity:0;transition:opacity 1.3s ease-in-out;transform:scale(1.025);animation:zoom 32s ease-in-out infinite alternate}.photo.active{opacity:1}.photo-1{background-position:0 0}.photo-2{background-position:50% 0}.photo-3{background-position:100% 0}.photo-4{background-position:0 100%}.photo-5{background-position:50% 100%}.photo-stage:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0000 65%,#0007);pointer-events:none}.hero-caption{background-color:var(--lime);position:relative;text-align:center;padding:60px 20px 50px}.hero-caption h2{font-size:clamp(5rem,12vw,10rem);letter-spacing:-.04em;margin:18px 0 0}.birthday{display:flex;justify-content:center;align-items:center;gap:16px;font:700 clamp(1.4rem,2.6vw,2rem) var(--display)}.birthday strong{color:#542143;font-size:6rem;line-height:1}.scroll-hint{font-size:.875rem;margin-top:30px}.scroll-hint span{display:block;font-size:2rem;line-height:1;animation:bob 2s infinite}.hero-art{position:absolute;width:190px;height:190px;right:max(10px,calc((100% - 1050px)/2));bottom:20px}.curve{position:absolute;left:0;right:0;top:-35px;height:65px;z-index:2;border-radius:50% 50% 0 0 / 70% 100% 0 0;background:inherit;background-image:none}.curve-lime{background:var(--lime)}.curve-orange{background:var(--orange)}.curve-turquoise{background:var(--turquoise)}.curve-cream{background:var(--cream)}section{position:relative}section .curve{transform:rotate(-1deg)}.story{background-color:var(--lime);padding:95px 25px 25px;text-align:center}.story .curve{top:-25px;transform:rotate(1deg)}.story-text{max-width:670px;margin:auto}.story h2{margin:18px 0 28px}.story em{color:#c91b4f;font-style:normal}.story-text>p:not(.tiny){max-width:530px;margin:0 auto 18px}.signature{font:700 1.8rem var(--display)}.art-parade{position:relative;display:flex;max-width:900px;margin:25px auto 0;align-items:end;justify-content:center;min-height:210px}.art-parade .theme-art{width:210px;height:210px}.art-parade .figure-two{transform:translateY(-15px)}.orbit-dot{position:absolute;background:var(--orange);width:13px;height:13px;border-radius:50%;left:38%;top:30%;animation:bob 4s infinite}.orbit-dot.small{left:auto;right:20%;top:5%;width:9px;height:9px;background:#008b83}.section-inner{max-width:870px;margin:auto;text-align:center;position:relative;z-index:3}.section-inner .tiny{margin-bottom:15px}.details{background-color:var(--orange);padding:100px 24px 95px}.date-layout{display:flex;text-align:left;align-items:center;justify-content:center;gap:55px;margin:40px 0 30px}.date-block{display:flex;align-items:center;flex-direction:column;min-width:175px;border-right:2px dashed #54214355;padding-right:55px}.date-block>span{font-size:.95rem;letter-spacing:.12em;font-weight:900}.date-block strong{font:800 7rem/.95 var(--display)}.date-block small{font-size:1rem}.time{font:800 2rem var(--display);margin-bottom:10px}.place-block p:not(.time){margin:8px 0 12px}.text-link{color:var(--ink);font-weight:900;font-size:1rem;text-underline-offset:6px}.calendar{margin-top:12px}.countdown-section{background-color:var(--turquoise);padding:95px 24px 105px;overflow:visible}.countdown{display:flex;align-items:center;justify-content:center;gap:28px;margin:35px 0 20px}.countdown div{min-width:105px}.countdown strong{font:800 clamp(3.5rem,6vw,5rem)/1 var(--display);display:block}.countdown div span{display:block;font-size:1rem;margin-top:10px}.countdown-dot{font:800 3rem var(--display)}.countdown-section #countdown-note{font-size:1rem}.countdown-art{position:absolute;right:max(0px,calc((100% - 1120px)/2));bottom:15px;width:190px;height:190px}.plan{background-color:var(--cream);padding:100px 24px 30px}.timeline{list-style:none;margin:45px auto 30px;padding:0;max-width:570px;text-align:left}.timeline li{display:flex;gap:28px;position:relative;padding-bottom:38px}.timeline time{font-size:1.05rem;font-weight:900;min-width:58px;color:#c91b4f;padding-top:4px}.timeline li>div{padding-left:26px;border-left:2px dashed #65d3ff;position:relative}.timeline li>div:before{content:'';position:absolute;width:10px;height:10px;border-radius:50%;background:var(--orange);left:-6px;top:10px}.timeline h3{font-size:1.55rem;margin-bottom:7px}.timeline p{font-size:1rem}.play-note{font-size:1rem;font-weight:800}.mini-art{display:flex;justify-content:center;gap:5px;margin:28px auto -5px;max-width:700px;position:relative;z-index:4}.mini-art .theme-art{width:160px;height:160px}.rsvp{background-color:var(--lime);padding:100px 24px 105px}.rsvp h2{margin-bottom:25px}.rsvp p:not(.tiny){margin-bottom:28px}.rsvp-kicker{display:block;font-size:.95rem;margin-top:22px}.rsvp-art{position:absolute;left:max(0px,calc((100% - 1090px)/2));bottom:25px;width:200px;height:200px}footer{padding:50px 24px 35px;text-align:center;background:var(--forest);color:var(--cream)}footer p{font:700 1.7rem var(--display);margin-bottom:20px}footer .wordmark{display:block;margin-bottom:22px}footer small{font-size:.8rem;opacity:.75}.reveal{opacity:1}.js-motion .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}.js-motion .reveal.visible{opacity:1;transform:none}
.rsvp-modal{width:min(480px,calc(100% - 30px));border:0;border-radius:28px;background:var(--cream);color:var(--ink);padding:44px 32px 28px;box-shadow:0 30px 80px #0004}.rsvp-modal::backdrop{background:#542143bb;backdrop-filter:blur(5px)}.rsvp-modal h2{font-size:3.2rem;margin:14px 0 25px}.close{position:absolute;right:14px;top:10px;background:transparent;color:var(--ink);font-size:2rem;padding:0 10px;line-height:1.3}form{display:flex;flex-direction:column;text-align:left}form label{font-size:.95rem;font-weight:900;margin:12px 0 8px}input,select{width:100%;padding:13px 15px;border:1px solid #54214344;border-radius:12px;background:white;color:var(--ink);font-size:1rem}form .button{margin-top:26px}.demo-note{font-size:.875rem;text-align:center;margin:15px 0 0;line-height:1.5;color:#542143}#rsvp-result{text-align:center}#rsvp-result .button{margin-top:25px}.result-star{font-size:3rem;color:#da5316}#result-message{font-size:1.125rem}
@keyframes sway{0%,100%{transform:rotate(-3deg) translateY(0)}50%{transform:rotate(3deg) translateY(-9px)}}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes zoom{from{transform:scale(1.025)}to{transform:scale(1.12)}}@keyframes fadeOut{to{opacity:0}}
@media(min-width:1000px){.photo-stage{height:78svh;max-height:850px;max-width:840px;margin:auto}.hero{background:#143f35}.photo{background-size:300% 200%}.intro-art{margin-top:-25px}.hero-caption{padding-top:50px}.photo-stage:before{content:'';position:absolute;inset:0;z-index:5;box-shadow:inset 0 0 70px #10281f22;pointer-events:none}}
@media(max-width:700px){body{font-size:1.05rem}.welcome-inner{padding-top:32px}.intro-tag{margin-bottom:18px;font-size:.75rem}.intro-heading h1{font-size:clamp(4.6rem,20vw,7rem)}.intro-heading>p{font-size:1.5rem}.age-line{font-size:1.35rem}.age-line strong{font-size:4.5rem}.intro-art{height:205px;margin-top:-5px;width:95vw}.intro-art .figure-one{width:210px;height:210px;left:-2%;bottom:0}.intro-art .figure-two{width:210px;height:210px;right:-2%}.intro-art .figure-three{left:-18%;width:130px;height:130px;bottom:5px}.intro-art .figure-four{right:-17%;width:130px;height:130px;bottom:8px}.welcome-actions p{font-size:.925rem;margin-bottom:12px}.welcome .wordmark{margin-top:4px}.photo-stage{height:68svh;max-height:600px;min-height:380px}.photo{background-size:300% 200%}.hero-caption{padding:47px 20px 68px}.hero-caption .tiny{font-size:.75rem;letter-spacing:.1em}.hero-caption h2{font-size:20vw;margin-top:16px}.birthday{font-size:1.4rem;gap:10px}.birthday strong{font-size:5rem}.hero-art{width:120px;height:120px;right:-5px;bottom:5px}.scroll-hint{margin-top:24px}.story{padding:65px 22px 28px}.story h2{font-size:2.8rem}.story .tiny{font-size:.75rem}.story-text>p:not(.tiny){max-width:350px}.art-parade{margin-top:20px;min-height:150px}.art-parade .theme-art{width:26vw;height:26vw;max-width:160px;max-height:160px}.details{padding:75px 22px 80px}.date-layout{gap:22px;margin:35px 0 24px}.date-block{min-width:120px;padding-right:22px}.date-block strong{font-size:6rem}.date-block>span{font-size:.8rem;letter-spacing:.08em}.place-block h3{font-size:1.4rem;max-width:190px}.time{font-size:1.45rem}.place-block p:not(.time){font-size:.95rem}.text-link{font-size:.875rem}.countdown-section{padding:75px 20px 120px}.countdown{gap:12px;margin-top:30px}.countdown div{min-width:70px}.countdown-dot{font-size:2rem}.countdown strong{font-size:3.6rem}.countdown-art{width:125px;height:125px;right:0;bottom:-1px}.plan{padding:70px 20px 35px}.plan h2{font-size:2.9rem}.timeline{margin-top:35px}.timeline li{gap:12px;padding-bottom:28px}.timeline li>div{padding-left:20px}.timeline h3{font-size:1.45rem}.timeline time{min-width:50px;font-size:.95rem}.mini-art{gap:0;margin:25px -10px -5px}.mini-art .theme-art{width:25vw;height:25vw;max-width:150px;max-height:150px}.rsvp{padding:75px 24px 125px}.rsvp-art{width:135px;height:135px;left:0;bottom:-2px}.rsvp .button{width:100%;max-width:330px}.music-toggle{right:12px;bottom:12px;padding:8px 13px}.music-label{font-size:.8rem}.rsvp-modal{padding:42px 23px 25px}.tiny{font-size:.75rem;letter-spacing:.12em}}
@media(max-height:720px){.welcome-inner{justify-content:flex-start;padding-top:22px}.intro-tag{margin-bottom:10px}.intro-heading h1{font-size:clamp(4.4rem,17vw,7rem)}.intro-heading>p{font-size:1.25rem}.age-line strong{font-size:3.5rem}.intro-art{height:170px}.intro-art .figure-one,.intro-art .figure-two{width:180px;height:180px}.welcome-actions p{margin:4px 0 10px}.welcome .button{min-height:50px;padding:12px 26px}.quiet{padding:10px 24px}.welcome .wordmark{margin-top:0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.js-motion .reveal{opacity:1;transform:none}}
.photo-stage{--photo-size:max(100vw,min(78svh,850px))}.photo{inset:auto;left:50%;top:50%;width:var(--photo-size);height:var(--photo-size);transform:translate(-50%,-50%) scale(1.025)}
@keyframes zoom{from{transform:translate(-50%,-50%) scale(1.025)}to{transform:translate(-50%,-50%) scale(1.12)}}
@media(max-width:700px){.photo-stage{--photo-size:max(100vw,min(68svh,600px),380px)}}
@media(min-width:1000px){.photo-stage{--photo-size:max(840px,min(78svh,850px))}}

/* Dulce fantasía */
body{overflow-x:clip}.wordmark span{color:#c91b4f}footer .wordmark span{color:#ff78bc}
.intro-heading h1,.hero-caption h2{font-family:'Fascinate',var(--display);font-weight:400;font-size:clamp(4rem,12vw,9rem);letter-spacing:-.035em;line-height:1.13;color:#542143}
.intro-heading h1{margin:4px 0 10px}.hero-caption h2{margin:18px 0 16px}.age-line{margin-top:-8px}.birthday{gap:12px}.birthday strong{color:#542143}.birthday span:last-child{max-width:175px;text-align:left;line-height:1.1}
.intro-art{height:220px;margin:0 0 5px}.intro-art .figure-one{left:12%;width:230px;height:230px}.intro-art .figure-two{right:12%;width:230px;height:230px}.intro-art .figure-three{left:-3%;bottom:0;width:150px;height:150px}.intro-art .figure-four{right:-3%;bottom:0;width:150px;height:150px}
.theme-art.figure-one{animation:floatOne 5.6s ease-in-out infinite}.theme-art.figure-two{animation:floatTwo 7s ease-in-out infinite}.theme-art.figure-three{animation:floatThree 4.5s ease-in-out infinite;animation-delay:-2s}.theme-art.figure-four{animation:floatFour 5s ease-in-out infinite}
.hero,.photo-stage{background:#542143}.photo-stage:after{background:none}.story{background-color:#fffaf2}.story .curve{background:#fffaf2}.art-parade{padding-top:10px}.orbit-dot{background:#ff78bc}.orbit-dot.small{background:#65d3ff}
.details{color:#fffaf2}.details .text-link{color:#fffaf2}.details .date-block{border-color:#fffaf277}.details .dark{background:#fffaf2;color:#542143}.details :focus-visible{outline-color:#fffaf2}
.timeline li>div{border-color:#65d3ff}.timeline li>div:before{background:#c91b4f}.rsvp-modal .result-star{color:#c91b4f}
@keyframes floatOne{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(2deg)}}
@keyframes floatTwo{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg) translateY(-5px)}}
@keyframes floatThree{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px) rotate(-4deg)}}
@keyframes floatFour{0%,100%{transform:rotate(3deg);filter:brightness(1)}50%{transform:rotate(-3deg) translateY(-8px);filter:brightness(1.07)}}
@media(max-width:700px){.intro-heading h1,.hero-caption h2{font-size:clamp(3.8rem,16vw,6.5rem)}.intro-heading h1{margin:8px 0 15px}.intro-heading>p{font-size:1.35rem}.intro-art{height:200px;width:95vw;margin-top:0}.intro-art .figure-one{left:3%;width:190px;height:190px}.intro-art .figure-two{right:3%;width:190px;height:190px}.intro-art .figure-three{left:-5%;bottom:-5px;width:105px;height:105px}.intro-art .figure-four{right:-5%;bottom:-5px;width:105px;height:105px}.birthday{font-size:1.3rem;gap:10px}.birthday span:last-child{max-width:130px}.rsvp h2{font-size:2.6rem}.story h2{font-size:2.65rem}.hero-art{width:105px;height:105px}}
@media(max-height:720px){.intro-heading h1{font-size:clamp(3.5rem,14vw,6.5rem)}.intro-art{height:165px}.intro-art .figure-one,.intro-art .figure-two{width:170px;height:170px}.intro-art .figure-three,.intro-art .figure-four{width:105px;height:105px}.welcome-actions p{font-size:.9rem}}

.welcome-inner:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(135deg,transparent 0 25px,#fffaf222 25px 29px);background-size:100% 100%}