@font-face{font-family:Ambroise;src:url('ambroise-std-francois.woff2') format('woff2');font-display:swap}@font-face{font-family:Sloop;src:url('sloop-script.woff2') format('woff2');font-display:swap}
:root{--wine:#651c2d;--paper:#fffafb;--ink:#561b29;--muted:#8a6c76;--line:#651c2d33;--motion:cubic-bezier(.22,1,.36,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Ambroise,Georgia,serif;font-size:21px;-webkit-font-smoothing:antialiased}body.sealed{overflow:hidden}button,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #c98fa3;outline-offset:5px}[hidden]{display:none!important}p{line-height:1.5;margin:0 0 24px}h1,h2,h3,figure{margin:0}h2{font-weight:400;font-size:clamp(44px,5.6vw,76px);line-height:1.03;letter-spacing:-.02em;margin-bottom:28px}h3{font-size:35px;font-weight:400;margin-bottom:12px;line-height:1.12}.script{font-family:Sloop,cursive;font-weight:400;letter-spacing:0}.eyebrow,.small,.text-link,.primary,.time,.menu-toggle,.clock span,.photo-number,label,legend{font-family:Georgia,serif}.eyebrow{font-size:10px;letter-spacing:.19em;line-height:1.7}.small{font-size:12px;line-height:1.7;color:var(--muted)}.opening{position:fixed;inset:0;background:#531224;z-index:20;display:grid;place-items:center;transition:opacity .9s var(--motion)}.opening video{height:100%;width:100%;object-fit:cover}.open-envelope{position:absolute;inset:0;width:100%;border:0;background:transparent;color:var(--paper);display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:9dvh 20px 8dvh;font:10px Georgia,serif;letter-spacing:.25em}.video-status{position:absolute;top:20px;font-size:16px;color:var(--paper);text-align:center}.masthead{max-width:1440px;margin:auto;padding:28px 6%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.masthead .eyebrow{margin:0}.monogram{font-size:34px;letter-spacing:-5px}.monogram span{font-family:Sloop;font-size:27px;margin:0 4px}.menu-toggle{background:none;border:0;font-size:10px;letter-spacing:.1em;min-height:44px}.menu-toggle span{font-size:21px;margin-left:13px}#menu{position:absolute;right:5%;top:93px;z-index:5;background:var(--paper);border:1px solid var(--line);padding:25px 35px;box-shadow:0 15px 50px #651c2d12}#menu a{display:block;padding:12px;font-size:24px}.hero{max-width:1280px;margin:auto;padding:80px 7% 95px;display:grid;grid-template-columns:1.1fr 1fr;gap:10%;align-items:center}.hero-photo{position:relative;padding:14px 14px 48px;border:1px solid var(--line);transform:rotate(2deg)}.photo-frame{padding:5px;background:#f6e3ea}.hero-photo img{width:100%;height:auto;display:block;aspect-ratio:2/3;object-fit:cover}.photo-number{position:absolute;right:-30px;top:30%;font-size:8px;letter-spacing:.15em;writing-mode:vertical-rl}.love-note{text-align:center;padding:90px 24px 105px;border-top:1px solid var(--line)}.love-note h2{font-size:clamp(42px,5vw,68px)}.love-note h2 em{font-size:1.4em}.love-note p:not(.eyebrow){font-size:22px}.ornament{font-size:51px;display:block;line-height:1.4}.countdown{background:var(--wine);color:var(--paper);padding:75px 20px;text-align:center}.countdown h2{font-size:45px}.countdown h2 .script{font-size:70px}.clock{display:flex;justify-content:center;gap:30px;margin:35px 0}.clock div{min-width:65px;display:flex;flex-direction:column;gap:12px}.clock b{font-size:65px;line-height:1;font-weight:400;font-variant-numeric:tabular-nums}.clock span{font-size:8px;letter-spacing:.15em}.clock i{font-style:normal;font-size:32px;opacity:.5}.countdown .small{color:#dfc9c8}.section-pad{max-width:1200px;margin:auto;padding:110px 7%}.celebration{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.section-heading h2 .script{font-size:1.25em}.venue-card{border:1px solid var(--line);outline:1px solid var(--line);outline-offset:-9px;padding:48px 30px 34px;text-align:center;background:#f7e1e840}.venue-card h3{font-size:35px}.venue-card p{font-size:20px}.venue-card .eyebrow{font-size:9px}.venue-card .ornament{margin-bottom:20px}.venue-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;align-items:center;flex-direction:column;gap:15px}.text-link{border:0;border-bottom:1px solid currentColor;background:none;padding:12px 0;font-size:9px;letter-spacing:.12em;display:inline-flex;align-items:center;gap:20px;min-height:44px}.text-link span{display:grid;place-items:center;width:24px;height:24px;border:1px solid var(--line);border-radius:50%;font-size:15px;transition:transform .4s var(--motion)}.text-link:hover span{transform:translate(2px,-2px)}.itinerary{padding-top:40px;text-align:center}.itinerary h2 .script{font-size:1.2em}.timeline{max-width:720px;margin:55px auto 24px;text-align:left}.timeline article{display:grid;grid-template-columns:48px 1fr auto;gap:22px;position:relative;align-items:center;padding:27px 0;border-bottom:1px solid var(--line)}.timeline article:first-child{border-top:1px solid var(--line)}.step{font-size:30px;color:#b98394}.timeline .eyebrow{font-size:8px}.timeline h3{margin:6px 0;font-size:33px}.timeline p{margin:0;font-size:19px}.time{font-size:10px;font-style:italic;color:var(--muted)}.wide-photo{height:580px;position:relative;background:#26241f}.wide-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;opacity:.83}.wide-photo figcaption{position:absolute;bottom:40px;left:0;right:0;color:var(--paper);text-align:center;font-family:Sloop;font-size:clamp(39px,6vw,85px);text-shadow:0 2px 15px #0006}.details{text-align:center}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;text-align:left;margin-top:60px}.detail-grid article{border-top:1px solid var(--line);padding-top:24px}.detail-grid p{font-size:22px;max-width:370px}.gifts{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.gifts h2 .script{font-size:1.25em}.gifts p{font-size:21px}.gifts .eyebrow{font-size:10px}.playlist{max-width:none;background:#f8e4eb;display:flex;justify-content:center;align-items:center;gap:100px}.playlist h2 .script{font-size:1.45em}.playlist .small{margin-top:15px}.rsvp{text-align:center;max-width:800px}.rsvp h2{font-size:65px}.rsvp h2 .script{font-size:1.28em}.rsvp form{max-width:460px;margin:45px auto 0;text-align:left}label,legend{display:block;font-size:11px;letter-spacing:.035em;margin-bottom:25px}input:not([type=radio]),textarea{display:block;width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:16px 0;font-family:Ambroise,serif;font-size:22px;color:var(--ink);outline-offset:3px}input::placeholder,textarea::placeholder{color:#a88590;opacity:1}textarea{resize:vertical}fieldset{border:0;padding:0;margin:30px 0 25px}legend{margin-bottom:17px}.radio-option{display:inline-flex;align-items:center;gap:8px;margin:0 20px 10px 0;font-size:12px;min-height:35px}.radio-option input{accent-color:var(--wine);width:17px;height:17px}.primary{border:1px solid var(--wine);border-radius:50px;background:var(--wine);color:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:30px;padding:12px 15px 12px 27px;font-size:10px;letter-spacing:.12em;min-height:54px;transition:transform .4s var(--motion)}.primary:active{transform:scale(.98)}.primary span{width:30px;height:30px;border:1px solid #fffafb55;border-radius:50%;display:grid;place-items:center;font-size:17px}.rsvp .primary{width:100%}#formStatus{font-size:19px;text-align:center;margin-top:20px}footer{padding:65px 20px 30px;background:var(--wine);color:var(--paper);text-align:center}footer .text-link{font-size:8px}footer .text-link span{border-color:#fffafb44}dialog{border:1px solid var(--line);background:var(--paper);color:var(--wine);padding:65px 35px 35px;max-width:460px;width:calc(100% - 32px)}dialog::backdrop{background:#290911aa;backdrop-filter:blur(6px)}dialog h2{font-size:43px}dialog p{font-size:21px}dialog .eyebrow{font-size:9px}.close-dialog{position:absolute;top:12px;right:12px;width:44px;height:44px;border:0;background:none;font-size:30px}.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--motion),transform 1s var(--motion)}.reveal.visible{opacity:1;transform:none}
@media(min-width:800px){.opening video{max-width:56.3dvh;object-fit:contain}.open-envelope{left:50%;transform:translateX(-50%);max-width:56.3dvh}.opening:before,.opening:after{content:'A';position:absolute;left:15%;top:40%;font-family:Sloop;font-size:140px;color:#fffafb12}.opening:after{content:'C';left:auto;right:15%}}
@media(max-width:767px){body{font-size:20px}.masthead{padding:14px 24px}.masthead>.eyebrow{font-size:7px;letter-spacing:.1em}.monogram{font-size:29px}.menu-toggle{font-size:8px}.menu-toggle span{margin-left:6px}.hero{padding:65px 25px 65px;display:flex;flex-direction:column;gap:55px}.hero-photo{width:88%;max-width:370px;transform:none;padding:10px 10px 42px}.photo-number{right:-20px;font-size:7px}.love-note{padding:80px 25px}.love-note .eyebrow{max-width:260px;margin:0 auto 25px;font-size:8px}.love-note h2{font-size:41px}.love-note p:not(.eyebrow){font-size:21px}.desktop-break{display:none}.countdown{padding:65px 22px}.countdown h2{font-size:35px}.countdown h2 .script{font-size:58px}.clock{gap:12px;margin:32px 0}.clock div{min-width:49px}.clock b{font-size:46px}.clock i{font-size:25px}.clock span{font-size:7px}.countdown .small{font-size:10px;max-width:270px;margin:auto}.section-pad{padding:75px 27px}.celebration{display:block}.section-heading{text-align:center}.section-heading h2{font-size:48px}.section-heading>p:last-child{max-width:270px;margin:0 auto 35px}.venue-card{padding:35px 25px 28px}.venue-card h3{font-size:32px}.venue-card p{font-size:20px}.venue-card .eyebrow{font-size:8px}.itinerary{padding-top:20px}.itinerary h2{font-size:43px}.itinerary>p:not(.eyebrow){font-size:20px}.timeline{margin-top:36px}.timeline article{grid-template-columns:25px 1fr;gap:17px;padding:25px 0}.timeline h3{font-size:32px}.timeline .eyebrow{font-size:7px}.timeline p{font-size:18px}.time{grid-column:2;font-size:9px;margin-top:-8px}.step{font-size:25px}.wide-photo{height:420px}.wide-photo img{object-position:57% center}.wide-photo figcaption{font-size:41px;bottom:28px;padding:0 15px}.details h2{font-size:47px}.detail-grid{display:block;margin-top:40px}.detail-grid article+article{margin-top:40px}.detail-grid p{font-size:21px}.detail-grid h3{font-size:35px}.gifts{display:flex;flex-direction:column;gap:48px;text-align:center}.gifts h2{font-size:51px}.gifts p{font-size:20px}.playlist{flex-direction:column;gap:40px;text-align:center}.playlist h2{font-size:55px}.playlist .eyebrow{font-size:8px}.playlist p{font-size:21px}.playlist .small{font-size:10px}.rsvp h2{font-size:49px}.rsvp .eyebrow{font-size:8px}.rsvp>p{font-size:21px}.rsvp form{margin-top:35px}.radio-option{margin-right:12px;font-size:11px}footer>.eyebrow{font-size:7px}#menu{top:80px;left:20px;right:20px}#menu a{font-size:25px;min-height:48px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.reveal{opacity:1;transform:none}}
/* The opened letter stays on screen; the rest of the invitation follows below. */
.opening.opened{position:relative;inset:auto;height:100dvh;min-height:100dvh;z-index:0;overflow:hidden}
.letter-names{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;padding:28px;color:var(--wine)}
.letter-names h1{margin:0;text-align:center;font-family:Ambroise,Georgia,serif;font-weight:400;font-size:clamp(58px,17vw,86px);line-height:1.08;letter-spacing:.025em}
.name-line{display:block;white-space:nowrap}
.name-line.name-connector{font-size:.42em;line-height:1.8;letter-spacing:0}
.name-line>span{display:inline-block;opacity:0;transform:translateY(14px);animation:letter-arrive 1.3s var(--motion) var(--letter-delay) forwards}
@keyframes letter-arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:800px){.letter-names h1{font-size:clamp(58px,8.5dvh,96px)}}
@media(prefers-reduced-motion:reduce){.name-line>span{opacity:1;transform:none}}
.letter-names{display:flex;flex-direction:column;justify-content:center;align-items:center}
.letter-announcement{font-size:clamp(43px,12vw,61px);line-height:1.2;margin:23px 0 20px;opacity:0;animation:letter-arrive 1.4s var(--motion) 1.85s forwards}
.letter-date{font-family:Georgia,serif;font-size:9px;letter-spacing:.2em;line-height:1.7;text-align:center;margin:0;opacity:0;animation:letter-arrive 1.4s var(--motion) 2.3s forwards}
@media(min-width:800px){.letter-announcement{font-size:clamp(43px,6dvh,67px)}}
@media(prefers-reduced-motion:reduce){.letter-announcement,.letter-date{opacity:1;transform:none}}

/* Prevent the blank frame iOS shows while replacing a video's native poster. */
.opening-poster{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;pointer-events:none}
.opening.video-ready .opening-poster,.opening.opened .opening-poster{opacity:0;visibility:hidden}
.opening-final{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;opacity:0;visibility:hidden;pointer-events:none}
.opening.video-finishing .opening-final,.opening.opened .opening-final{opacity:1;visibility:visible}
.letter-names{z-index:2}
.open-envelope{z-index:2}
@media(min-width:800px){.opening-poster,.opening-final{left:50%;max-width:56.3dvh;transform:translateX(-50%);object-fit:contain}}

/* Draw link arrows instead of using U+2197, which iOS renders as an emoji. */
.text-link>span{position:relative;font-size:0}
.text-link>span::before{content:"";position:absolute;left:6px;top:15px;width:12px;height:1px;background:currentColor;transform:rotate(-45deg);transform-origin:0 50%}
.text-link>span::after{content:"";position:absolute;right:5px;top:5px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor}

/* The names and date appear only on the opened letter. */
.hero{display:flex;justify-content:center}
.hero-photo{width:100%;max-width:430px}
@media(max-width:767px){.hero-photo{width:88%;max-width:370px}}
/* Botanical relief bridges the letter and the invitation's paper. */
.opening.opened{background:var(--paper)}
.opening.opened video,.opening.opened .opening-final{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 105px),transparent calc(100% - 8px));mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 105px),transparent calc(100% - 8px))}
#invitation{position:relative}
.letter-seam{position:absolute;top:0;left:0;width:100%;height:0;z-index:1;pointer-events:none;display:flex;justify-content:center}
.letter-seam img{display:block;width:min(92%,700px);height:auto;flex:none;align-self:flex-start;transform:translateY(-53%)}
#invitation .masthead{padding-top:95px}
@media(max-width:767px){.letter-seam img{width:108%;max-width:600px}.letter-seam{clip-path:inset(-150px 0 -150px)}#invitation .masthead{padding-top:63px}.opening.opened video,.opening.opened .opening-final{-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 80px),transparent calc(100% - 8px));mask-image:linear-gradient(to bottom,#000 0%,#000 calc(100% - 80px),transparent calc(100% - 8px))}}
@media(max-width:767px){.letter-seam img{width:100%;transform:translateY(-53%)}}
/* Reveal the connected calligraphy continuously, like ink crossing the paper. */
.letter-announcement{opacity:1;transform:none;clip-path:inset(0 100% 0 -8%);padding:0 .12em;animation:calligraphy-write 3.2s cubic-bezier(.35,.08,.25,1) 1.85s both}
.letter-date{animation-delay:4.8s}
@keyframes calligraphy-write{0%{clip-path:inset(0 100% 0 -8%)}100%{clip-path:inset(0 -8% 0 -8%)}}
@media(prefers-reduced-motion:reduce){.letter-announcement{clip-path:none;animation:none}.letter-date{opacity:1}}
/* A central bloom opens outward as the floral divider enters view. */
.letter-seam img{opacity:0;clip-path:inset(0 50% 0 50%);transform:translateY(-53%) scale(.94);transform-origin:50% 58%}
.letter-seam.in-bloom img{animation:floral-unfurl 2.6s cubic-bezier(.22,1,.36,1) both}
@keyframes floral-unfurl{0%{opacity:0;clip-path:inset(0 50% 0 50%);transform:translateY(-53%) scale(.94)}25%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0);transform:translateY(-53%) scale(1)}}
@media(prefers-reduced-motion:reduce){.letter-seam img{opacity:1;clip-path:none;transform:translateY(-53%)}.letter-seam.in-bloom img{animation:none}}
/* Match the first name letter's 240 ms delay after the video finishes. */
.letter-seam.in-bloom img{animation-delay:240ms}
/* Generated embossed stationery with real transparent rounded edges. */
.love-note{border-top:0;padding:35px 16px 90px}
.love-card{position:relative;max-width:580px;margin:auto;isolation:isolate;min-height:700px;display:grid;place-items:center;color:#fff}
.love-card-art{position:absolute;inset:0;width:100%;height:100%;z-index:-1;object-fit:fill}
.love-card-copy{width:65%;padding:135px 0 125px}
.love-note .eyebrow{font-size:9px;max-width:280px;margin:0 auto 28px;line-height:1.9}
.love-note h2{font-size:49px;line-height:1.1;margin-bottom:26px}
.love-note h2 em{display:block;font-size:1.45em;margin-top:9px}
.love-note p:not(.eyebrow){font-size:23px;line-height:1.55;margin-bottom:20px}
.love-note .desktop-break{display:none}
.love-note .ornament{font-size:32px;opacity:.8}
@media(max-width:767px){.love-card{min-height:570px;max-width:430px}.love-card-copy{width:64%;padding:100px 0 95px}.love-note .eyebrow{font-size:7px;letter-spacing:.12em;line-height:1.9;margin-bottom:24px}.love-note h2{font-size:36px}.love-note p:not(.eyebrow){font-size:21px;line-height:1.45}.love-note{padding:15px 12px 65px}}
/* Quiet capsule border: all copy stays safely inside the plain center. */
.love-card{max-width:540px;min-height:790px}
.love-card-copy{width:60%;padding:155px 0}
.love-note .ornament{display:none}
.love-note .eyebrow{max-width:240px}
@media(max-width:767px){.love-card{min-height:620px;max-width:430px}.love-card-copy{width:59%;padding:130px 0}.love-note h2{font-size:35px}.love-note p:not(.eyebrow){font-size:20px;line-height:1.5}.love-note .eyebrow{font-size:7px;line-height:1.9}}
/* Transparent rococo arch around the countdown. */
.countdown{background:var(--paper);color:var(--wine);padding:10px 18px 85px}
.countdown-frame{position:relative;isolation:isolate;display:grid;place-items:center;max-width:600px;min-height:780px;margin:auto}
.countdown-frame-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:-1;pointer-events:none}
.countdown-copy{width:69%;padding:150px 0}
.countdown h2{font-size:47px;line-height:1.12}
.countdown h2 .script{font-size:1.5em}
.countdown .small{color:var(--muted);max-width:280px;margin:0 auto 18px}
.countdown .clock{gap:13px;margin:35px 0}
.countdown .clock div{min-width:53px}
.countdown .clock b{font-size:57px}
.countdown .text-link{font-size:9px}
@media(max-width:767px){.countdown{padding:0 10px 65px}.countdown-frame{min-height:610px;max-width:430px}.countdown-copy{width:67%;padding:110px 0}.countdown .eyebrow{font-size:8px;margin-bottom:22px}.countdown h2{font-size:35px;margin-bottom:24px}.countdown .clock{gap:5px;margin:30px 0}.countdown .clock div{min-width:43px;gap:10px}.countdown .clock b{font-size:40px}.countdown .clock span{font-size:6px;letter-spacing:.09em}.countdown .clock i{font-size:20px}.countdown .small{font-size:10px;max-width:200px}.countdown .text-link{font-size:8px;letter-spacing:.08em;gap:10px}}
/* Caption above the unchanged square-edged photograph; capsule overlaps below. */
.hero{padding-bottom:0}

.hero-photo{margin-top:48px}
.love-note{position:relative;z-index:1;margin-top:-65px;padding-top:0}
@media(max-width:767px){.hero{padding-bottom:0}.hero-photo{margin-top:36px}.love-note{margin-top:-55px;padding-top:0}}
/* Let the calligraphic caption cross the upper photo edge like a signature. */

/* Overlap between the photograph and the cloud frame card. */
.love-note{margin-top:-95px}
@media(max-width:767px){.love-note{margin-top:-80px}}

/* The countdown unfolds from its upper crest, followed by its live content. */
.countdown.reveal{opacity:1;transform:none;transition:none}
.countdown .countdown-frame-art{opacity:0;clip-path:inset(0 0 100% 0)}
.countdown.visible .countdown-frame-art{animation:countdown-frame-reveal 2.4s cubic-bezier(.22,1,.36,1) both}
@keyframes countdown-frame-reveal{0%{opacity:0;clip-path:inset(0 0 100% 0)}18%{opacity:1}100%{opacity:1;clip-path:inset(0 0 0 0)}}
.countdown-copy> *{opacity:0;transform:translateY(12px)}
.countdown.visible .countdown-copy> *{animation:countdown-ink-arrive 1.4s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--countdown-delay,.5s)}
.countdown-copy>.eyebrow{--countdown-delay:.45s}
.countdown-copy>h2{--countdown-delay:.75s}
.countdown-copy>.clock{--countdown-delay:1.1s}
.countdown-copy>.small{--countdown-delay:1.4s}
.countdown-copy>.text-link{--countdown-delay:1.65s}
@keyframes countdown-ink-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.countdown .countdown-frame-art{opacity:1;clip-path:none}.countdown-copy> *{opacity:1;transform:none}.countdown.visible .countdown-frame-art,.countdown.visible .countdown-copy> *{animation:none}}
/* A slower, restrained reveal: frame first, then quiet fades of the text. */
.countdown.visible .countdown-frame-art{animation:countdown-frame-reveal 4.2s cubic-bezier(.45,0,.55,1) both}
.countdown-copy> *{transform:none}
.countdown.visible .countdown-copy> *{animation:countdown-soft-fade 2.5s cubic-bezier(.4,0,.6,1) both;animation-delay:var(--countdown-delay,1.5s)}
.countdown-copy>.eyebrow{--countdown-delay:1.5s}
.countdown-copy>h2{--countdown-delay:1.95s}
.countdown-copy>.clock{--countdown-delay:2.45s}
.countdown-copy>.small{--countdown-delay:2.85s}
.countdown-copy>.text-link{--countdown-delay:3.2s}
@keyframes countdown-soft-fade{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.countdown.visible .countdown-frame-art,.countdown.visible .countdown-copy> *{animation:none;opacity:1;clip-path:none;transform:none}}
/* Keep the full caption's layout stable while connected script is typed. */

/* Preserve all calligraphic joins; a feathered ink reveal avoids typing jumps. */

@keyframes signature-ink{from{-webkit-mask-position:100% 0;mask-position:100% 0}to{-webkit-mask-position:0% 0;mask-position:0% 0}}

/* A transparent curtain reveals the actual textured card, with no color seam. */
.curtain-line{display:block;clip-path:inset(-.25em -.45em -0.35em -.45em);white-space:pre}
.curtain-ink{display:block;opacity:0;transform:translateY(10px);clip-path:inset(0 -.45em 100% -.45em)}
.curtain-visible .curtain-ink{animation:card-line-curtain .9s cubic-bezier(.16,1,.3,1) var(--line-delay) both}
@keyframes card-line-curtain{from{opacity:0;transform:translateY(10px);clip-path:inset(-.25em -.45em 100% -.45em)}to{opacity:1;transform:translateY(0);clip-path:inset(-.25em -.45em -.35em -.45em)}}
.love-note h2 .curtain-line .script{display:inline;font-size:1.45em;margin:0}
@media(prefers-reduced-motion:reduce){.curtain-ink{opacity:1;transform:none;clip-path:none}.curtain-visible .curtain-ink{animation:none}}
/* Allow the card copy to settle into view before its slower curtain opens. */
.curtain-visible .curtain-ink{animation-duration:1.5s}
.countdown{padding-bottom:25px}
.celebration{padding-top:35px}
@media(max-width:767px){.countdown{padding-bottom:12px}.celebration{padding-top:20px}}

.celebration{display:block;max-width:1000px;text-align:center}
.celebration .section-heading{max-width:560px;margin:0 auto 20px}
.venue-card{border:0;outline:0;background:transparent;padding:0;max-width:740px;margin:auto}
.venue-watercolor{width:100%;margin:0 auto 30px}
.venue-watercolor img{display:block;width:100%;height:auto;opacity:0;mask-image:linear-gradient(135deg,#000 38%,transparent 52%);mask-size:300% 300%;mask-position:100% 100%;mask-repeat:no-repeat}
.venue-watercolor.painted img{animation:watercolor-paint 4.2s cubic-bezier(.35,0,.3,1) both}
@keyframes watercolor-paint{0%{opacity:0;mask-position:100% 100%}15%{opacity:.45}60%{opacity:.85}100%{opacity:1;mask-position:0% 0%}}
.venue-card h3{font-size:42px;line-height:1.12;letter-spacing:.015em}
.venue-card .venue-city{font-style:italic;font-size:23px;margin-bottom:12px}
.venue-card #venueText{font-family:Georgia,serif;font-size:12px;color:var(--muted)}
.venue-card .venue-bottom{border:0;flex-direction:row;justify-content:center;gap:28px;padding-top:0}
@media(max-width:767px){.venue-card{padding:0}.venue-watercolor{width:calc(100% + 30px);margin-left:-15px;margin-bottom:28px}.venue-card h3{font-size:32px}.venue-card .venue-city{font-size:21px}.venue-card .venue-bottom{gap:15px}.venue-card .text-link{font-size:7px;gap:9px}}
@media(prefers-reduced-motion:reduce){.venue-watercolor img{opacity:1;mask-image:none}.venue-watercolor.painted img{animation:none}}
.itinerary .itinerary-title{font-family:Ambroise,Georgia,serif;line-height:1.05}
.itinerary-title>span{display:block}
.itinerary .itinerary-title>.script{font-family:Sloop,cursive;font-size:1.2em;font-weight:400;margin-top:8px;line-height:1.2}
/* A continuous botanical spine with alternating moments, composed for phones. */
.floral-timeline{position:relative;isolation:isolate;max-width:780px;padding:35px 0;margin:30px auto 24px}
.timeline-vine{position:absolute;inset:0;pointer-events:none;z-index:-1;clip-path:inset(0 0 calc(100% - var(--vine-progress,0%)) 0);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1)}
.timeline-vine img{display:block;position:absolute;left:50%;transform:translateX(-50%);width:260px;height:100%;object-fit:fill}
.floral-timeline article,.floral-timeline article:first-child{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;text-align:right;width:38%;min-height:260px;gap:10px;padding:28px 0;border:0;opacity:0;transform:translateY(16px);transition:opacity 1.4s cubic-bezier(.16,1,.3,1),transform 1.4s cubic-bezier(.16,1,.3,1)}
.floral-timeline article:nth-of-type(even){margin-left:62%;text-align:left;align-items:flex-start}
.floral-timeline article.moment-visible{opacity:1;transform:none}
.floral-timeline .step{font-family:Sloop,cursive;font-size:40px;line-height:1;color:var(--wine)}
.floral-timeline .time{margin:5px 0 0;font-size:10px;color:var(--muted)}
.floral-timeline h3{font-size:36px;margin:10px 0}
.floral-timeline p{font-size:21px;line-height:1.4}
.vine-checkpoint{position:absolute;left:50%;height:1px;width:1px;pointer-events:none}
@media(max-width:767px){.itinerary{padding-left:20px;padding-right:20px}.floral-timeline{padding:25px 0}.timeline-vine img{width:155px}.floral-timeline article,.floral-timeline article:first-child{width:36%;min-height:245px;padding:18px 0;gap:8px}.floral-timeline article:nth-of-type(even){margin-left:64%}.floral-timeline h3{font-size:29px;line-height:1.1}.floral-timeline p{font-size:18px;line-height:1.4}.floral-timeline .eyebrow{font-size:6px;letter-spacing:.07em}.floral-timeline .step{font-size:34px}.floral-timeline .time{font-size:9px}}
@media(prefers-reduced-motion:reduce){.timeline-vine{clip-path:none}.floral-timeline article,.floral-timeline article:first-child{opacity:1;transform:none;transition:none}}
.itinerary .itinerary-title>span:not(.script){font-size:1.12em}
.itinerary .itinerary-title>.script{margin-top:-7px}
/* Fit the complete illustration without stretching its original proportions. */
.timeline-vine img{width:100%;height:100%;object-fit:contain}
.timeline-vine{transition:clip-path .65s cubic-bezier(.16,1,.3,1)}
@media(max-width:767px){.floral-timeline article,.floral-timeline article:first-child{width:31%}.floral-timeline article:nth-of-type(even){margin-left:69%}.floral-timeline h3{font-size:27px}.floral-timeline p{font-size:17px}}
.wide-photo.oval-photo{height:auto;background:var(--paper);padding:35px 20px 50px;text-align:center}
.oval-photo-card{position:relative;width:100%;max-width:520px;aspect-ratio:2/3;margin:0 auto}

.oval-photo-card .oval-couple{position:absolute;left:18%;top:15%;width:64%;height:70%;object-fit:cover;object-position:62% 50%;border-radius:50%;opacity:1}
.wide-photo.oval-photo figcaption{position:static;color:var(--wine);font-family:Sloop,cursive;font-size:clamp(34px,5vw,65px);line-height:1.3;text-shadow:none;padding:0;margin:28px auto 0;max-width:650px}
@media(max-width:767px){.wide-photo.oval-photo{padding:25px 15px 35px}.wide-photo.oval-photo figcaption{font-size:37px;margin-top:22px}}
.details-title>span{display:block;font-family:Ambroise,Georgia,serif;line-height:1.05}
.details-title>.script{font-family:Sloop,cursive;font-size:1.2em;line-height:1.2;margin-top:-7px}
/* Oval couple photo placement. */

.oval-photo-card .oval-couple{left:21.8%;top:16%;width:57.4%;height:66.6%;object-position:62% 50%}
/* Bring the framed photograph closer to the floral itinerary. */
.itinerary{padding-bottom:25px}
.floral-timeline{margin-bottom:0;padding-bottom:0}
.wide-photo.oval-photo{padding-top:0}
.details-title>span:not(.script){font-size:1.12em}
.details-title>.script{font-size:1.05em}
@media(max-width:767px){.itinerary{padding-bottom:12px}.wide-photo.oval-photo{padding-top:0}}
.stay-watercolor{display:block;width:100%;max-width:390px;height:auto;margin:30px auto}
.stay-detail h4{font-family:Ambroise,Georgia,serif;font-size:33px;font-weight:400;margin:0 0 8px}
.stay-detail .hotel-collection{font-family:Georgia,serif;font-size:10px;letter-spacing:.04em;margin-bottom:15px}
.stay-detail .hotel-address{font-size:20px;line-height:1.4}
@media(max-width:767px){.stay-watercolor{max-width:320px;margin:25px auto}}
/* Editorial stagger: letters drift up and right into their final position. */
.itinerary-title>span,.details-title>span{overflow:visible}
.title-character{display:inline-block;white-space:pre;opacity:0;transform:translate(-7px,24px);vertical-align:baseline}
.title-script-line{display:inline-block;white-space:pre;opacity:0;transform:translate(-7px,24px);padding:.2em .35em;margin:-.2em -.35em}
.characters-visible .title-character{animation:title-character-arrive 1.1s cubic-bezier(.16,1,.3,1) var(--character-delay) both}
.characters-visible .title-script-line{animation:title-character-arrive 1.25s cubic-bezier(.16,1,.3,1) var(--character-delay) both}
@keyframes title-character-arrive{from{opacity:0;transform:translate(-7px,24px)}to{opacity:1;transform:translate(0,0)}}
@media(prefers-reduced-motion:reduce){.title-character,.title-script-line{opacity:1;transform:none}.characters-visible .title-character,.characters-visible .title-script-line{animation:none}}
.stay-painting{margin:30px auto;max-width:430px}
.stay-painting .stay-watercolor{max-width:none;margin:0;opacity:0;mask-image:linear-gradient(135deg,#000 38%,transparent 52%);mask-size:300% 300%;mask-position:100% 100%;mask-repeat:no-repeat}
.stay-painting.painted .stay-watercolor{animation:watercolor-paint 4.2s cubic-bezier(.35,0,.3,1) both}
@media(prefers-reduced-motion:reduce){.stay-painting .stay-watercolor{opacity:1;mask-image:none}.stay-painting.painted .stay-watercolor{animation:none}}
@media(min-width:768px){.detail-grid{align-items:start}}
.detail-grid article{border-top:0}
.gifts{border-top:0}
.gift-present{position:relative;width:100%;max-width:440px;margin:auto;container-type:inline-size}
.gift-present>img{display:block;width:100%;height:auto}
.gift-tag{position:absolute;left:31.2%;top:71.8%;width:38.1%;height:15.5%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--wine);font-family:Ambroise,Georgia,serif;font-size:7cqw;line-height:.8;gap:3px}
.gift-tag .script{font-family:Sloop,cursive;font-size:9cqw;line-height:.9}
.gifts-title>span{display:block;font-family:Ambroise,Georgia,serif;line-height:1.05}
.gifts .gifts-title>.script{font-family:Sloop,cursive;font-size:1.2em;line-height:1.2;margin-top:-7px}
@media(max-width:767px){.gift-present{max-width:350px}.gifts{gap:42px}.gifts .gifts-title{font-size:48px}}
/* Six shades, arranged as three pairs on the invitation paper. */
.playlist{background:var(--paper);display:flex;flex-direction:column;gap:0;text-align:center}
.playlist-title>span{display:block;font-family:Ambroise,Georgia,serif;line-height:1.05}
.playlist .playlist-title>.script{font-family:Sloop,cursive;font-size:1.2em;line-height:1.2;margin-top:-7px}
.playlist>p{margin-bottom:25px}
/* Shared square coordinates keep all three original layers aligned at every size. */
.turntable{position:relative;width:100%;max-width:540px;aspect-ratio:1;margin:0 auto 15px}
/* Bottom layer: stationary original base. */

/* Centered at the base spindle: (44.8%, 46.9%). Placement never rotates. */
.vinyl-position{position:absolute;left:10.8%;top:12.9%;width:68%;aspect-ratio:1}
/* Middle layer: only the vinyl rotates, around its exact central spindle. */
.turntable-vinyl{display:block;width:100%;height:auto;transform-origin:50% 50%;animation:vinyl-spin 2.25s linear infinite;animation-play-state:paused}
.turntable.is-playing .turntable-vinyl{animation-play-state:running}
/* Top layer: stationary tonearm, pivot aligned with the base mounting point. */
.turntable-arm{position:absolute;left:44.2%;top:18.9%;width:42%;height:auto;pointer-events:none}
@keyframes vinyl-spin{to{transform:rotate(360deg)}}
.music-controls{width:100%;max-width:420px;margin:0 auto 15px}
.song-choice{width:100%;display:flex;align-items:center;gap:15px;text-align:left;background:transparent;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;color:var(--wine)}
.song-choice strong{display:block;font-size:28px;font-weight:400}.song-choice small{display:block;font-family:Georgia,serif;font-size:11px;margin-top:5px}.song-symbol{font-size:30px}.song-indicator{margin-left:auto;font-family:Georgia,serif;font-size:8px;letter-spacing:.08em}.song-choice[aria-current=true]{background:#651c2d06}
.music-toggle{margin:22px auto 15px;min-width:190px}.playlist #musicStatus{font-size:11px;min-height:20px}
@media(max-width:767px){.playlist .playlist-title{font-size:50px}.turntable{width:calc(100% + 24px);max-width:430px}.song-choice strong{font-size:26px}}
/* Handwritten tag, preserving the exact font shapes and joins. */
.gift-tag>span{mask-image:linear-gradient(to right,#000 42%,transparent 50%);mask-size:240% 100%;mask-position:100% 0;mask-repeat:no-repeat}
.gift-tag.written>span{animation:signature-ink 2.1s cubic-bezier(.4,0,.35,1) both}
.gift-tag.written>.script{animation-delay:1.2s;animation-duration:2.8s}
/* Pressed lettering above the RSVP cloud frame. */
.rsvp .rsvp-embossed{font-family:Ambroise,Georgia,serif;font-size:clamp(90px,15vw,150px);letter-spacing:.08em;font-weight:400;line-height:1;color:#efd3dd;text-shadow:1px 2px 1px #ffffff,-1px -1px 1px #c793a5,0 1px 0 #ddb5c3;margin:0 0 35px}
.rsvp{max-width:850px}
.rsvp-card{position:relative;isolation:isolate;max-width:650px;margin:0 auto;color:#fff}

.rsvp-card-content{width:64%;margin:auto;padding:150px 0}
.rsvp-card-content>p{font-size:22px;text-align:center;line-height:1.4}
.rsvp-card form{width:100%;margin:30px auto 0}
.rsvp-card label,.rsvp-card legend{color:#fff;font-size:11px;line-height:1.6}
.rsvp-card input:not([type=radio]),.rsvp-card textarea{color:#fff;border-color:#fff6;font-size:21px}
.rsvp-card input::placeholder,.rsvp-card textarea::placeholder{color:#e7d4d6;opacity:1}
.rsvp-card input[type=radio]{accent-color:#fffafb}
.rsvp-card .radio-option{display:flex;margin:6px 0;font-size:11px}
.rsvp-card .primary{background:var(--paper);color:var(--wine);border-color:var(--paper);padding-left:18px;font-size:9px;letter-spacing:.05em}
.rsvp-card .primary span{border-color:var(--line)}
.rsvp #formStatus{font-size:18px;color:white}
.rsvp .rsvp-signoff{font-family:Sloop,cursive;font-size:clamp(43px,6vw,72px);line-height:1.3;margin:30px 0 0}
@media(max-width:767px){.rsvp{padding-left:8px;padding-right:8px}.rsvp-card-content{width:60%;padding:115px 0}.rsvp-card-content>p{font-size:21px}.rsvp-card input:not([type=radio]),.rsvp-card textarea{font-size:19px}.rsvp-card .primary{gap:8px;padding-left:12px;padding-right:10px;font-size:8px}.rsvp-card label,.rsvp-card legend{font-size:10px}}
@media(prefers-reduced-motion:reduce){.gift-tag>span{mask-image:none}.gift-tag.written>span{animation:none}}
.rsvp .rsvp-embossed{margin-bottom:4px}
.rsvp .rsvp-signoff{margin:0 0 30px}
.rsvp{padding-bottom:0}
/* RSVP submit button base styles. */
.rsvp-card .primary{background:transparent;border:0;border-radius:0;box-shadow:none;color:#f3dce0;text-shadow:0 1px 0 #2f0714,0 -1px 0 #ffffff38;justify-content:center;padding:15px 0;font-family:Ambroise,Georgia,serif;font-size:22px;letter-spacing:.04em;gap:12px}
.rsvp-card .primary span{border:0;border-radius:0;font-size:25px;width:auto;height:auto}
.rsvp-card .primary:hover{color:#fff4f4}
footer.closing{position:relative;z-index:1;background:var(--paper);color:var(--wine);padding:0 8px 45px;margin:-95px auto 0;max-width:850px;background:transparent}
.closing-card{position:relative;isolation:isolate;max-width:650px;min-height:600px;margin:auto;display:grid;place-items:center}

.closing-copy{width:59%;padding:110px 0;text-align:center}
.closing-copy .closing-thanks{font-family:Sloop,cursive;font-size:72px;line-height:1.2;margin:0 0 25px}
.closing-copy>p{font-size:23px;line-height:1.45;margin-bottom:20px}
.closing-copy .closing-signature{font-family:Ambroise,Georgia,serif;font-size:30px;margin:25px 0 0}
@media(max-width:767px){.rsvp{padding-bottom:0}footer.closing{margin-top:-85px}.closing-card{min-height:480px}.closing-copy{padding:95px 0;width:58%}.closing-copy .closing-thanks{font-size:56px}.closing-copy>p{font-size:20px}.closing-copy .closing-signature{font-size:27px}.rsvp-card .primary{font-size:19px}}
/* Optical alignment accounts for Sloop's asymmetrical flourishes. */
.gifts-title>.script,.playlist-title>.script,.rsvp-signoff>.script,.closing-thanks>.script{transform:translateX(var(--optical-shift,0px))}
.rsvp-signoff>.script,.closing-thanks>.script{display:block}
.playlist{padding-bottom:35px}
.rsvp{padding-top:35px}
@media(max-width:767px){.playlist{padding-bottom:20px}.rsvp{padding-top:25px}}

/* On phones, scale the whole desktop composition as one system: illustration,
   type and vertical rhythm. This preserves the vine's natural proportions and
   the generous negative space of the narrow desktop reference. */
@media(max-width:767px){
  .floral-timeline{width:90vw;padding:12px 0;margin-top:18px;overflow:visible}
  .timeline-vine{left:0;right:0;bottom:-18px}
  .timeline-vine img{left:48%;width:100%;height:100%;object-fit:contain}
  .floral-timeline article,.floral-timeline article:first-child{width:32%;min-height:108px;padding:8px 0;gap:3px}
  .floral-timeline article:nth-of-type(even){margin-left:68%}
  .floral-timeline .step{font-size:18px}
  .floral-timeline .eyebrow{font-size:5px;letter-spacing:.09em;line-height:1.5}
  .floral-timeline h3{font-size:15px;line-height:1.08;margin:4px 0}
  .floral-timeline p{font-size:10px;line-height:1.35}
  .floral-timeline .time{font-size:7px;margin-top:3px}
  .wide-photo.oval-photo{position:relative;z-index:1}
}

/* Small optical corrections for the script capitals and their flourishes. */
.rsvp-signoff>.script{transform:translateX(calc(var(--optical-shift,0px) - .12em))}
.itinerary-title>.script,.details-title>.script{transform:translateX(-.12em)}

/* Paleta rosa nube: blanco con degradados suaves y manchas rosadas tipo nube. */
:root{--blush:#fcf0f3;--cloud:#f6dfe7;--cloud-deep:#efcfdb}
main{background:
  radial-gradient(70% 5% at 8% 9%,#f6dfe7d9,transparent 72%),
  radial-gradient(75% 6% at 96% 24%,#f4d9e3c7,transparent 72%),
  radial-gradient(70% 5% at 4% 41%,#f6dfe7d9,transparent 72%),
  radial-gradient(80% 6% at 94% 58%,#f4d9e3c7,transparent 72%),
  radial-gradient(70% 5% at 10% 76%,#f6dfe7d9,transparent 72%),
  radial-gradient(80% 6% at 90% 92%,#f4d9e3c7,transparent 72%),
  linear-gradient(180deg,var(--paper) 0%,var(--blush) 14%,#fff 28%,var(--blush) 45%,#fff 60%,var(--blush) 78%,var(--cloud) 100%)}
.countdown,.wide-photo.oval-photo,.playlist{background:transparent}
.playlist{background:linear-gradient(180deg,transparent 0%,#f7e2e9b3 22%,#f5dce5cc 50%,#f7e2e9b3 78%,transparent 100%)}
#menu,dialog{background:linear-gradient(160deg,#fff 0%,var(--blush) 100%)}

/* Tarjeta rosa nube: el texto vive dentro del panel interior del marco y escala
   con la imagen, así nunca toca el marco ni sus adornos. Medidas tomadas sobre
   la imagen de 1024×1536; se recortan 110px de cortina a cada lado. */
.love-note{overflow-x:clip}
@media(max-width:767px){.love-note{padding-left:0;padding-right:0}}
.love-note .love-card{width:min(100%,520px);max-width:none;min-height:0;aspect-ratio:804/1536;margin:0 auto;display:block;container-type:inline-size;color:#6a2439}
.love-note .love-card-art{inset:auto;top:0;left:-13.68%;width:127.36%;height:100%;object-fit:fill}
.love-note .love-card-copy{position:absolute;inset:32% 24.5% 30.5% 24.5%;width:auto;padding:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;mix-blend-mode:multiply}
.love-note .love-card-copy .eyebrow{max-width:none;font-size:2.15cqw;letter-spacing:.14em;line-height:1.8;margin:0 0 5cqw;color:#8d4a62}
.love-note .love-card-copy h2{font-size:8.1cqw;line-height:1.08;margin:0 0 4.6cqw;color:#6a2439}
.love-note .love-card-copy p:not(.eyebrow){font-size:4.3cqw;line-height:1.5;margin:0;color:#5c2536}

/* Foto de la pareja: mismo marco que la foto ovalada de "De tu mano". */
.hero .hero-photo{border:0;padding:0 0 100px;width:min(72vw,360px);max-width:none}
@media(min-width:768px){.hero .hero-photo{padding-bottom:118px}}
.hero .photo-frame{padding:0;border-radius:0;background:none;box-shadow:none}
.hero .hero-photo img{aspect-ratio:5/8;object-fit:cover;border-radius:50%;border:8px solid #fff;box-shadow:0 26px 50px -26px #c46f93a6,0 2px 12px #f3cddb66}

/* Cielo de nubes con parallax detrás de todo el contenido de la invitación.
   Capa exterior: desplazamiento por scroll (JS). Capa media: deriva lenta (CSS). */
main{position:relative;isolation:isolate}
.cloud-sky{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.sky-cloud{position:absolute;top:var(--top);left:var(--left);width:clamp(170px,var(--w),var(--max,560px));will-change:transform;transform:translate3d(0,0,0)}
.sky-drift{animation:cloud-drift var(--dur,26s) ease-in-out var(--delay,0s) infinite alternate}
.sky-cloud img{display:block;width:100%;height:auto;opacity:var(--o,.8);filter:blur(var(--blur,0px));transform:scaleX(var(--flip,1))}
@keyframes cloud-drift{0%{transform:translate3d(calc(var(--drift,40px)*-1),6px,0) scale(1)}50%{transform:translate3d(0,-12px,0) scale(1.035)}100%{transform:translate3d(var(--drift,40px),4px,0) scale(1)}}

/* Foto "De tu mano": óvalo con marco blanco, sin tarjeta de fondo. */
.oval-photo .oval-photo-card{aspect-ratio:auto;width:auto;max-width:none}
.oval-photo .oval-photo-card .oval-couple{position:relative;left:auto;top:auto;display:block;margin:0 auto;width:min(72vw,360px);height:auto;aspect-ratio:5/8;object-fit:cover;object-position:62% 50%;border-radius:50%;border:8px solid #fff;box-shadow:0 26px 50px -26px #c46f93a6,0 2px 12px #f3cddb66}

/* Mensaje final directamente sobre el fondo, con un halo blanco de nube. */
main footer.closing{margin:0 auto;padding:70px 24px 90px;overflow-x:clip}
footer.closing .closing-card{min-height:0;display:block;max-width:520px}
footer.closing .closing-card::before{content:'';position:absolute;inset:-60px -8%;background:radial-gradient(closest-side,#ffffffe0 30%,#ffffff00);z-index:-1}
footer.closing .closing-card .closing-copy{width:auto;max-width:440px;margin:0 auto;padding:0}

/* Tocadiscos sin base: el disco flota y el brazo se apoya en sus surcos.
   Posiciones en % de la caja cuadrada (pivote del brazo fuera del disco). */
.playlist{overflow-x:clip}
.playlist .turntable{width:min(100%,420px);max-width:none;margin:10px auto 0}
.playlist .vinyl-position{left:1%;top:10%;width:78%;border-radius:50%;box-shadow:0 22px 40px -22px #b7607f99,0 4px 14px #e7b6c655}
.playlist .turntable-arm{left:44%;top:3.7%;width:68.4%;filter:drop-shadow(0 8px 10px #a0506c40)}

/* Botón de reproducir dentro del marco de columnas (boton.webp, 900×301). */
.playlist .music-toggle{width:min(100%,330px);min-width:0;aspect-ratio:900/301;height:auto;min-height:0;margin:18px auto 12px;padding:7.3% 18% 0;border:0;border-radius:0;background:url(assets/boton.webp) center/100% 100% no-repeat;color:#6a2439;justify-content:center;gap:12px;font-size:11px;letter-spacing:.2em;filter:drop-shadow(0 10px 16px #d08aa44d)}
.playlist .music-toggle span{width:26px;height:26px;border:1px solid #6a243966;font-size:11px;letter-spacing:0}

/* RSVP: el marco de nubes se compone en tres piezas para que crezca en alto sin
   deformar arco ni nubes; solo se estira la franja lisa central (y 560–780 de
   la imagen de 1024×1536, recortando 140px de cortina a cada lado). */
@media(max-width:767px){.rsvp{padding-left:0;padding-right:0}}
.rsvp .rsvp-card{width:min(100%,540px);max-width:none;margin:0 auto;container-type:inline-size;color:#5c2536}
.rsvp-frame{position:absolute;inset:0;z-index:-1;display:flex;flex-direction:column;pointer-events:none}
.rsvp-frame>span{display:block;background:url(assets/cloud-frame.webp) no-repeat;background-size:137.63cqw auto}
.rsvp-frame .rsvp-frame-top{height:75.27cqw;background-position:-18.82cqw 0}
.rsvp-frame .rsvp-frame-mid{flex:1;margin-top:-1px;background-size:137.63cqw 698.18%;background-position:-18.82cqw 42.553%}
.rsvp-frame .rsvp-frame-bottom{height:101.61cqw;margin-top:-1px;background-position:-18.82cqw 100%}
.rsvp .rsvp-card-content{width:auto;margin:0;padding:76cqw 21.4cqw 75cqw 22.2cqw;min-height:176.9cqw;display:flex;flex-direction:column;justify-content:center}
.rsvp .rsvp-card-content>p{font-size:18px;line-height:1.4;color:#5c2536;margin-bottom:0}
.rsvp .rsvp-card form{margin:20px 0 0}
.rsvp .rsvp-card label,.rsvp .rsvp-card legend{color:#7a3a50;font-size:10px;letter-spacing:.04em;line-height:1.6;margin-bottom:16px}
.rsvp .rsvp-card input:not([type=radio]),.rsvp .rsvp-card textarea{color:#4a1c2b;border-color:#6a243959;font-size:17px;padding:8px 0}
.rsvp .rsvp-card input::placeholder,.rsvp .rsvp-card textarea::placeholder{color:#a57a8a}
.rsvp .rsvp-card input[type=radio]{accent-color:var(--wine)}
.rsvp .rsvp-card .radio-option{color:#5c2536;margin:4px 0}
.rsvp .rsvp-card fieldset{margin:10px 0 14px}
.rsvp .rsvp-card .primary{width:100%;min-height:46px;margin-top:4px;padding:12px 16px;border-radius:40px;background:linear-gradient(135deg,#8c3350,#651c2d);color:#fff;text-shadow:none;font-family:Georgia,serif;font-size:9px;letter-spacing:.16em;box-shadow:0 10px 20px -12px #651c2d99}
.rsvp .rsvp-card .primary:hover{color:#fff}
.rsvp #formStatus{color:#5c2536;font-size:15px;margin:12px 0 0}

/* Brazo del tocadiscos: en reposo mira hacia abajo, fuera del disco; al pulsar
   play gira sobre su pivote (69% 23% de la imagen) hasta apoyar la aguja. */
.playlist .turntable-arm{transform-origin:69% 23%;transform:rotate(-32deg);transition:transform 1.1s cubic-bezier(.45,0,.2,1)}
.playlist .turntable.arm-on .turntable-arm{transform:rotate(0deg)}

/* Botón del RSVP: transparente con borde blanco. */
.rsvp .rsvp-card .primary{background:transparent;border:1.5px solid #fff;color:#6a2439;box-shadow:0 0 0 1px #ffffff40,0 8px 18px -12px #b7607f80;transition:background .3s,transform .4s var(--motion)}
.rsvp .rsvp-card .primary:hover{background:#ffffff4d;color:#6a2439}

/* Números romanos del itinerario en una serif clásica y legible. */
.floral-timeline .step{font-family:Georgia,'Times New Roman',serif;font-size:26px;font-weight:400;letter-spacing:.08em;line-height:1.1}
@media(max-width:767px){.floral-timeline .step{font-size:16px}}

/* Arco de la cuenta atrás: proporción fija (900×1200) y contenido dentro de la
   abertura interior medida en la imagen (x 196–702, curva desde y≈400, basas
   en y 950–1180). Todo escala con el ancho del arco (cqw) y --fit lo reduce
   si algún navegador dibuja el texto más grande de lo previsto. */
.countdown{padding-left:0;padding-right:0}
.countdown .countdown-frame{display:block;width:min(100%,460px);max-width:none;min-height:0;aspect-ratio:900/1200;margin:0 auto;container-type:inline-size}
.countdown .countdown-copy{--fit:1;position:absolute;inset:44.5cqw 25.5cqw 5.5cqw;width:auto;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.countdown .countdown-copy .eyebrow{font-size:calc(2.2cqw*var(--fit));letter-spacing:.16em;line-height:1.6;margin:0 0 calc(3.5cqw*var(--fit))}
.countdown .countdown-copy h2{font-size:calc(8.2cqw*var(--fit));line-height:1.08;margin:0 0 calc(4cqw*var(--fit))}
.countdown .countdown-copy .clock{gap:calc(1.1cqw*var(--fit));margin:0 0 calc(4cqw*var(--fit))}
.countdown .countdown-copy .clock div{min-width:calc(10.5cqw*var(--fit));gap:calc(2cqw*var(--fit))}
.countdown .countdown-copy .clock b{font-size:calc(7.4cqw*var(--fit))}
.countdown .countdown-copy .clock span{font-size:calc(1.65cqw*var(--fit));letter-spacing:.06em}
.countdown .countdown-copy .clock i{font-size:calc(4cqw*var(--fit))}
.countdown .countdown-copy .small{font-size:calc(2.7cqw*var(--fit));line-height:1.6;max-width:38cqw;margin:0 auto calc(2.5cqw*var(--fit))}
.countdown .countdown-copy .text-link{font-size:calc(2.1cqw*var(--fit));min-height:calc(10cqw*var(--fit));gap:calc(2.5cqw*var(--fit));padding:calc(1.5cqw*var(--fit)) 0;letter-spacing:.1em}
.countdown .countdown-copy h2 .script{display:block;margin-top:.05em;line-height:1.05}