@font-face{font-family:WeddingSerif;src:local('Baskerville'),local('Baskerville Old Face'),local('Palatino Linotype');font-display:swap}
:root{color-scheme:light;--paper:#f8efe8;--ink:#402f28;--wine:#862e43;--muted:#927c6c}
*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:WeddingSerif,Baskerville,'Palatino Linotype','Book Antiqua',Georgia,serif;background:radial-gradient(ellipse at 50% 20%,#fdf8ef 0,transparent 63%),var(--paper);overflow-x:hidden}
main{overflow:hidden;min-height:100svh}.invitation{width:min(100%,740px);margin:0 auto;padding-top:26px}.artwork{width:100%;aspect-ratio:1122/1402;position:relative;isolation:isolate}.artwork img,.artwork canvas{display:block;width:100%;height:100%;object-fit:contain}.artwork canvas{position:absolute;inset:0;opacity:0;transition:opacity .25s ease}.artwork.ready canvas{opacity:1}
.controls{min-height:58px;display:flex;align-items:center;justify-content:center;gap:23px;margin-top:12px;padding:0 12px}.control{border:0;background:transparent;font:400 12px/1.2 Arial,sans-serif;letter-spacing:.025em;color:var(--ink);padding:12px 2px;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;min-height:44px;transition:color .2s}.control:hover{color:var(--wine)}.control:disabled{opacity:.58;cursor:default}.control:focus-visible{outline:1px solid var(--wine);outline-offset:5px;border-radius:2px}.control svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.mail-section{position:relative;text-align:center;padding:45px 20px 0}.tiny-heart{color:var(--wine);font-size:15px;margin-bottom:20px}.mail-message{font-size:clamp(29px,4.5vw,42px);font-weight:400;font-style:italic;letter-spacing:-.035em;line-height:1.27;margin:0 auto;color:#50372d}.mail-message span{font-style:normal;font-size:.91em;letter-spacing:-.045em}.mail-runway{height:188px;position:relative;max-width:600px;margin:18px auto 0}.letter{width:126px;position:absolute;left:calc(50% - 63px);top:34px;transform:rotate(-8deg);filter:drop-shadow(0 8px 8px #573c2820);will-change:transform,opacity}.letter svg{width:100%;display:block}.postmark-trail{position:absolute;width:230px;height:70px;top:45px;left:calc(50% - 208px);fill:none;stroke:#9d7563;stroke-width:.8;opacity:0;stroke-dasharray:400;stroke-dashoffset:400}.mail-runway.depart .letter{animation:send-letter 8s cubic-bezier(.4,0,.2,1) infinite}.mail-runway.depart .postmark-trail{animation:post-trail 8s ease infinite}.signoff{font-size:14px;font-style:italic;letter-spacing:.035em;color:#92705e;margin:0 0 62px}.signoff span{display:block;font-size:21px;color:var(--ink);margin-top:8px;letter-spacing:0}footer{display:flex;justify-content:center;align-items:center;gap:18px;padding:0 20px 32px;font:9px/1.4 Arial,sans-serif;letter-spacing:.2em;color:#9e8271}.footer-star{font-size:17px;color:#a58269}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}
@keyframes send-letter{0%,35%,95%,100%{transform:translate(0,0) rotate(-8deg);opacity:1}45%{transform:translate(-19px,-9px) rotate(-14deg);opacity:1}60%{transform:translate(25px,-18px) rotate(4deg);opacity:1}80%{transform:translate(max(85vw,700px),-78px) rotate(13deg);opacity:0}81%{transform:translate(0,0) rotate(-8deg);opacity:0}}
@keyframes post-trail{0%,45%{opacity:0;stroke-dashoffset:400}60%{opacity:.5}75%{stroke-dashoffset:0;opacity:.3}80%,100%{stroke-dashoffset:0;opacity:0}}
@media(min-width:1100px){.invitation{width:min(740px,calc(80svh - 96px));padding-top:27px}.mail-section{padding-top:48px}}
@media(max-width:600px){.invitation{padding:12px 8px 0}.controls{gap:16px;margin-top:8px}.control{font-size:11px}.mail-section{padding-top:33px}.mail-runway{height:160px}.mail-message{font-size:31px}.signoff{margin-bottom:50px}footer{gap:12px;font-size:8px;letter-spacing:.14em}.letter{width:116px;left:calc(50% - 58px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.artwork canvas{transition:none}.letter,.postmark-trail{animation:none!important}.letter{opacity:1!important}.postmark-trail{display:none}}

/* The villa, doorway crops and camera share a single painted coordinate space. */
body.doors-visible{overflow:hidden}
.villa-intro{position:fixed;inset:0;z-index:50;overflow:clip;isolation:isolate}
.villa-intro[hidden]{display:none}
.villa-camera{position:absolute;inset:0;perspective:1400px;perspective-origin:50% 50%;transform-style:preserve-3d}
.villa-facade{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible}
.villa-door{position:absolute;background-color:#d9d5ba;background-image:url('assets/villa-approach-v6.png');background-repeat:no-repeat;backface-visibility:hidden}
.villa-door-detail{position:absolute;inset:0;opacity:0;background-image:url('assets/villa-doors-detail-v6.png');background-size:200% 100%;background-repeat:no-repeat}.villa-door-right .villa-door-detail{background-position:right center}
.villa-door-left{transform-origin:left center}.villa-door-right{transform-origin:right center}
.villa-controls{position:absolute;bottom:max(26px,env(safe-area-inset-bottom));left:16px;right:16px;display:flex;justify-content:center;flex-wrap:wrap;gap:10px 18px}
.villa-controls button{border:1px solid #a5997c70;border-radius:50%;background:#fffaf0ed;color:#514c3b;min-height:44px;width:44px;height:44px;padding:12px;cursor:pointer;backdrop-filter:blur(6px);box-shadow:0 3px 15px #4f4a3220}
.villa-controls svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.intro-play-mark{display:none}#intro-pause[data-playing="false"] .intro-pause-mark{display:none}#intro-pause[data-playing="false"] .intro-play-mark{display:block}
.villa-controls button:hover{background:#fffdf6}.villa-controls button:focus-visible{outline:2px solid #5e6a4c;outline-offset:3px}.villa-controls button:disabled{opacity:.7;cursor:default}

@media(max-width:600px){.villa-controls{bottom:24px;gap:8px}}
@media(prefers-reduced-motion:reduce){.villa-intro{display:none}}
