@font-face{font-family:Wedding;src:url('fonts/roman.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Wedding;src:url('fonts/italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}:root{--ivory:#fbf5e9;--peach:#f4e5da;--coral:#cc7262;--ochre:#af822d;--olive:#5e6345;--ink:#614f43;--muted:#796557;--line:#d5bea5;--serif:Wedding,Baskerville,Georgia,serif}*{box-sizing:border-box}body{margin:0;background:var(--ivory);color:var(--ink);font:16px/1.5 Arial,sans-serif}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--olive);outline-offset:5px}[hidden]{display:none!important}.envelope-gate{min-height:100svh;display:flex;align-items:center;justify-content:center;background:var(--peach);padding:30px 0;transition:opacity .45s ease}.envelope-wrap{width:min(820px,100%);text-align:center}.envelope-button{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;cursor:pointer;transition:transform .5s ease;isolation:isolate}.envelope-image{display:block;width:100%;height:auto;transition:opacity .65s ease,transform 1.1s ease}.envelope-image.opened{position:absolute;inset:0;opacity:0;pointer-events:none}.envelope-message{position:absolute;top:27%;left:9%;width:82%;font:italic clamp(23px,4.3vw,39px)/1.3 var(--serif);color:var(--ink);transition:opacity .25s ease;pointer-events:none}.envelope-button:hover{transform:translateY(-4px)}.opening-hint{font-size:14px;letter-spacing:1.5px;color:var(--muted);margin:7px 0 0}.is-opening .closed,.is-opening .envelope-message{opacity:0}.is-opening .opened{opacity:1;transform:translateY(-10px)}.is-opening .envelope-button{transform:scale(1.035)}.gate-fading{opacity:0;pointer-events:none}.invitation{min-height:100svh;padding:clamp(32px,5vh,62px) 5% 20px;position:relative;animation:reveal .65s ease both;border-top:7px solid var(--coral)}.invitation-inner{max-width:1150px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;min-height:calc(100svh - 160px)}.copy{text-align:center;padding:10px 0}.eyebrow{font-family:var(--serif);font-size:23px;letter-spacing:4px;color:var(--olive);margin:0 0 22px}h1{font:clamp(58px,6.5vw,87px)/.91 var(--serif);font-weight:400;letter-spacing:-2px;margin:0;outline:none}h1 em{display:block;font-weight:400}h1 .amp{display:block;font-size:35px;line-height:1.25;font-style:italic;color:var(--ochre);margin:3px 0}.announcement{font:italic 24px/1.3 var(--serif);margin:20px 0 12px}.wedding-date{font:34px/1.2 var(--serif);margin:0 0 8px;color:var(--olive)}.destination{font:20px/1.3 var(--serif);margin:0 0 28px}.actions{display:flex;justify-content:center;gap:10px;align-items:flex-start;position:relative;z-index:5}.action{padding:13px 16px;display:flex;gap:17px;align-items:center;justify-content:center;border:1px solid var(--olive);font-size:14px;text-decoration:none;cursor:pointer;white-space:nowrap;border-radius:3px;line-height:1.5}.action:hover{filter:brightness(.95)}.primary{background:var(--olive);color:var(--ivory)}.secondary{background:transparent;color:var(--olive);list-style:none}.secondary::-webkit-details-marker{display:none}.secondary::marker{content:''}.calendar{position:relative}.calendar-options{position:absolute;right:0;top:calc(100% + 8px);width:265px;padding:7px;background:var(--ivory);border:1px solid var(--line);box-shadow:0 10px 24px #614f4320;border-radius:4px;text-align:left}.calendar-options a{display:block;font-size:14px;padding:13px 10px;text-decoration:none}.calendar-options a:hover{background:var(--peach)}.countdown{display:flex;justify-content:center;align-items:center;gap:17px;margin:26px auto 0;color:var(--muted)}.countdown>div{min-width:40px}.countdown div>span{font:28px/1 var(--serif);display:block;font-variant-numeric:tabular-nums}.countdown small{font-size:12px;display:block;margin-top:4px;letter-spacing:.3px}.separator{color:var(--ochre);padding-bottom:16px}.count-message{font-size:14px;margin:10px 0 0}.postcard{padding-top:25px;min-width:0;text-align:center}.scene-surround{padding:10px;background:var(--peach);border:1px solid var(--line);outline:1px solid var(--ochre);outline-offset:6px;transform:rotate(1.5deg)}.scene{display:block;width:100%;aspect-ratio:3/2;padding:0;border:0;position:relative;isolation:isolate;overflow:hidden;background:#80bdda;cursor:pointer}.scene-background{display:block;width:100%;height:100%;object-fit:cover}.scene-car{position:absolute;left:6%;bottom:5%;width:42%;height:auto;pointer-events:none;filter:drop-shadow(0 3px 2px #24496a20)}.is-driving .scene-car{animation:drive 7s linear both}.scene:disabled{cursor:default}.drive-hint{font-size:12px;letter-spacing:.5px;color:var(--muted);margin:24px 0 0}.stay{margin-top:36px}.stay-title{font:italic 37px/1.1 var(--serif);color:var(--coral);margin:0 0 12px}.stay>p:last-child{font:18px/1.5 var(--serif);margin:0;color:var(--muted)}footer{max-width:1150px;margin:30px auto 0;display:flex;justify-content:space-between;gap:20px;align-items:center;color:var(--muted);font:italic 16px var(--serif)}footer button{background:transparent;border:0;padding:8px 0;text-decoration:underline;text-underline-offset:4px;font:12px Arial,sans-serif;cursor:pointer}.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}@keyframes reveal{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes drive{0%{left:6%}62%{left:105%}62.01%{left:-48%}100%{left:6%}}@media(max-width:900px){.invitation{padding:32px 5% 16px}.invitation-inner{gap:5%}h1{font-size:65px}.actions{flex-direction:column;align-items:stretch;max-width:260px;margin:auto}.action{font-size:14px}.calendar-options{width:260px;left:0}.postcard{padding:0}.stay{margin-top:30px}}@media(max-width:650px){.envelope-message{font-size:clamp(22px,6.2vw,34px);top:26%}.opening-hint{font-size:12px;letter-spacing:1px;margin:20px 0 0}.envelope-wrap{transform:translateY(-20px)}.invitation{padding:28px 6% 15px}.invitation-inner{display:flex;flex-direction:column;gap:28px;min-height:0}.copy{width:100%;padding:0}.eyebrow{font-size:20px;letter-spacing:3px;margin-bottom:19px}h1{font-size:clamp(57px,16vw,78px);line-height:.9;letter-spacing:-1.7px}h1 .amp{font-size:26px;line-height:1.15;margin:2px 0}.announcement{font-size:22px;margin:17px 0 10px}.wedding-date{font-size:31px}.destination{font-size:19px;margin-bottom:22px}.actions{flex-direction:row;gap:8px;max-width:none}.actions>*{flex:1}.action{font-size:13px;padding:12px 10px;gap:9px}.calendar-options{left:auto;right:0;width:250px}.countdown{margin-top:22px;gap:16px}.countdown div>span{font-size:26px}.count-message{margin:0}.postcard{width:100%;max-width:480px;padding:0 5px}.scene-surround{padding:7px;outline-offset:4px}.drive-hint{margin:16px 0 0;font-size:12px}.stay{margin-top:23px}.stay-title{font-size:32px;margin-bottom:8px}.stay>p:last-child{font-size:17px}footer{margin-top:26px;gap:12px;font-size:14px}footer button{font-size:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.envelope-button:hover{transform:none}.is-driving .scene-car{animation:none!important;left:52%}}
@media(max-width:400px){.actions{flex-direction:column;max-width:280px;margin-inline:auto}.action{font-size:14px}.calendar-options{width:100%}.eyebrow{font-size:19px}}
/* A short announcement first; the moving postcard follows below. */
.invitation-inner{display:flex;flex-direction:column;gap:46px;min-height:0}.copy{width:100%;max-width:1000px;margin:auto}.copy h1{font-size:clamp(55px,6.9vw,88px);line-height:1.1;letter-spacing:-2.5px}.copy h1 em,.copy h1 .amp{display:inline}.copy h1 .amp{font-size:.6em;margin:0 .18em}.actions{flex-direction:row;max-width:none;align-items:flex-start}.actions>*{flex:0 1 auto}.stay{margin-top:25px}.stay-title{font-size:29px;margin-bottom:8px}.stay>p:last-child{font-size:18px;line-height:1.4}.stay br{display:none}.stay br::after{content:' '}.postcard{width:100%;max-width:760px;padding:0 6px 15px}.scene{cursor:default}.is-driving .scene-car{animation:drive 9s linear infinite}.scene-surround{transform:rotate(1deg)}footer{max-width:760px;margin-top:25px}.calendar-options{left:auto;right:0}@media(max-width:650px){.invitation-inner{gap:34px}.copy h1{font-size:clamp(57px,16vw,78px);line-height:.9;letter-spacing:-1.7px}.copy h1 em,.copy h1 .amp{display:block}.copy h1 .amp{font-size:26px;line-height:1.15;margin:2px 0}.actions>*{flex:1}.stay{margin-top:21px}.stay-title{font-size:27px}.stay>p:last-child{font-size:17px;max-width:320px;margin:auto}.postcard{padding-bottom:5px}.calendar-options{width:250px}}@media(max-width:400px){.actions{flex-direction:column;align-items:stretch;max-width:280px}.calendar-options{width:100%}}@media(prefers-reduced-motion:reduce){.is-driving .scene-car{animation:none!important;left:6%}}
/* Sun-warmed apricot, orange and terracotta from the wedding palette. */
:root{--ivory:#fff4e3;--peach:#f5d1b4;--coral:#c75c3e;--ochre:#b87c24;--olive:#a54727;--ink:#71442f;--muted:#82543f;--line:#dba77b}.invitation{border-top-color:#df7c39;background:linear-gradient(180deg,#fff5e5 0%,#fff1dd 55%,#f8d9b9 100%)}.primary{background:#ad4325;border-color:#ad4325}.eyebrow{color:#ad4325}.announcement{color:#a34428}.destination{margin-bottom:16px}.celebration{font:22px/1.45 var(--serif);max-width:630px;margin:0 auto 25px;text-wrap:pretty}.celebration em{color:#a34428;white-space:nowrap}.countdown-wrap{margin:29px auto 0;max-width:540px}.waiting-line{font:italic 26px/1.3 var(--serif);color:#9c472a;margin:0 0 13px}.countdown-lead{font-size:14px;letter-spacing:1.5px;color:var(--muted);margin:0 0 12px}.countdown{margin:0 auto;gap:22px}.countdown div>span{font-size:39px;color:#a74727}.countdown small{font-size:13px}.countdown>div{min-width:49px}.separator{color:var(--ochre)}.stay-title{color:#a34428}.scene-surround{background:#f2ba85;outline-color:#bd7e37}.envelope-image.closed{color:var(--ink)}@media(max-width:650px){.announcement{font-size:22px}.celebration{font-size:20px;max-width:360px;margin-bottom:22px}.waiting-line{font-size:24px}.countdown-wrap{margin-top:26px}.countdown{gap:14px}.countdown div>span{font-size:35px}.countdown>div{min-width:43px}.countdown small{font-size:12px}.countdown-lead{font-size:14px}.stay{margin-top:23px}}
/* The printed flap lifts slowly before the open envelope reveals the page. */
.scene-surround{transform:none}.envelope-button{perspective:1100px}.envelope-flap{position:absolute;inset:0;display:block;width:100%;height:auto;clip-path:polygon(4.7% 10.5%,95.3% 10.5%,50% 61%);transform-origin:50% 10.5%;backface-visibility:hidden;pointer-events:none;z-index:2;transition:none}.envelope-image.closed{transition:none}.envelope-image.opened{transition:none}.envelope-gate{transition:opacity 1.1s ease}.is-opening .envelope-flap{transform:rotateX(165deg);opacity:0;transition:transform 5s cubic-bezier(.35,0,.3,1),opacity 1.5s 2.8s}.is-opening .closed{opacity:0;transition:opacity 2.5s 1.3s}.is-opening .opened{opacity:1;transform:translateY(-12px);transition:opacity 3.6s 1.3s,transform 5.5s .9s}.is-opening .envelope-button{transform:scale(1.035);transition:transform 5.5s ease}@media(prefers-reduced-motion:reduce){.is-opening .envelope-flap{transition:none;transform:none;opacity:0}}
/* Independent paper and wax layers: split, lift, then reveal the printed card. */
.envelope-button{perspective:1400px;transform:none!important;overflow:visible}.envelope-stage{position:relative;width:100%;aspect-ratio:3/2;isolation:isolate;transform-style:preserve-3d}.envelope-body{position:absolute;inset:0;width:100%;height:100%;z-index:0}.envelope-pocket{position:absolute;inset:0;width:100%;height:100%;z-index:3;clip-path:polygon(0 21%,4.7% 23.8%,50% 61.4%,95.3% 23.8%,100% 21%,100% 100%,0 100%)}.paper-flap{position:absolute;inset:0;z-index:5;transform-origin:50% 10.5%;transform-style:preserve-3d}.paper-flap img{position:absolute;inset:0;width:100%;height:100%;clip-path:polygon(4.7% 10.5%,95.3% 10.5%,50% 65.8%)}.flap-front{opacity:1}.flap-back{opacity:0}.wax-piece{position:absolute;inset:0;z-index:6;pointer-events:none;clip-path:ellipse(7.15% 10.45% at 49.8% 58%)}.wax-piece img{display:block;width:100%;height:100%}.wax-left img{clip-path:polygon(0 0,50% 0,50% 48%,49% 51%,51% 54%,49% 58%,50.5% 62%,49% 65%,50% 100%,0 100%)}.wax-right img{clip-path:polygon(50% 0,100% 0,100% 100%,50% 100%,49% 65%,50.5% 62%,49% 58%,51% 54%,49% 51%,50% 48%)}.letter-peek{position:absolute;left:16%;top:19%;width:68%;height:62%;padding:4% 3%;background:var(--ivory);border:1px solid #e1c6a3;box-shadow:0 3px 18px #61402b22;z-index:2;opacity:0;color:var(--ink);font-family:var(--serif);transform:translateY(18%);pointer-events:none}.letter-kicker{font-size:clamp(10px,1.8vw,17px);letter-spacing:3px;margin:0 0 4%}.letter-names{font-size:clamp(26px,5vw,48px);line-height:1.05;margin:0 0 5%}.letter-names em{font-weight:400}.letter-date{font-size:clamp(18px,3vw,29px);margin:0 0 1%}.letter-place{font-size:clamp(13px,2vw,20px);margin:0}.is-opening .wax-left{animation:wax-break-left 5s ease-in-out forwards}.is-opening .wax-right{animation:wax-break-right 5s ease-in-out forwards}.is-opening .paper-flap{animation:paper-open 5.4s .55s cubic-bezier(.35,0,.25,1) forwards}.is-opening .flap-front{animation:flap-turn-front 5.4s .55s linear forwards}.is-opening .flap-back{animation:flap-turn-back 5.4s .55s linear forwards}.is-opening .letter-peek{animation:letter-emerge 4.6s 2.1s cubic-bezier(.25,.1,.2,1) forwards}.drive-start-marker{position:absolute;bottom:12%;left:0;width:100%;height:2px;pointer-events:none}@keyframes wax-break-left{0%{transform:translate(0,0) rotate(0)}15%{transform:translate(-.5%,-.3%) rotate(-1deg)}32%{transform:translate(-1%,-1%) rotate(-3deg);opacity:1}70%,100%{transform:translate(-1.3%,-10%) rotate(-7deg);opacity:0}}@keyframes wax-break-right{0%{transform:translate(0,0)}15%{transform:translate(.5%,.3%) rotate(1deg)}35%,100%{transform:translate(.9%,.8%) rotate(3deg)}}@keyframes paper-open{0%{transform:rotateX(0deg);z-index:5}50%{transform:rotateX(88deg);z-index:5}51%{transform:rotateX(92deg);z-index:1}100%{transform:rotateX(175deg);z-index:1}}@keyframes flap-turn-front{0%,48%{opacity:1}52%,100%{opacity:0}}@keyframes flap-turn-back{0%,48%{opacity:0}52%,100%{opacity:1}}@keyframes letter-emerge{0%{opacity:0;transform:translateY(18%) scale(.97)}15%{opacity:1}75%{opacity:1;transform:translateY(-26%) scale(1)}100%{opacity:1;transform:translateY(-32%) scale(1.035)}}@media(max-width:650px){.envelope-wrap{transform:translateY(15px)}.letter-kicker{letter-spacing:1.5px}.letter-peek{padding-top:4%}}@media(prefers-reduced-motion:reduce){.is-opening .paper-flap,.is-opening .wax-piece,.is-opening .letter-peek,.is-opening .flap-front,.is-opening .flap-back{animation:none!important}.is-opening .paper-flap,.is-opening .wax-piece{opacity:0}.is-opening .letter-peek{opacity:1;transform:none}}
.music-toggle{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:100;padding:10px 15px;min-height:44px;border:1px solid #c98558;border-radius:30px;background:#fff4e6;color:#873b24;box-shadow:0 3px 15px #61402b18;font:inherit;font-size:14px;cursor:pointer;display:flex;align-items:center;gap:8px}.music-toggle[hidden]{display:none}.music-toggle:focus-visible{outline:3px solid #873b24;outline-offset:3px}
