:root{color-scheme:dark;--wine:#260e16;--gold:#d8b76e;--cream:#fff6e3;--ink:#381924;--muted:#dfcbaa}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 35%,#532436 0%,var(--wine) 65%);color:var(--cream);font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}button{font:inherit}button:focus-visible{outline:3px solid var(--gold);outline-offset:7px}button{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}.arrival{min-height:100svh;max-width:1200px;margin:auto;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:42px 24px 24px;overflow:hidden}.arrival-heading{text-align:center;z-index:1}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.78rem;line-height:1.8;color:var(--gold);margin:0 0 18px}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(3rem,6.6vw,5.5rem);line-height:1.16;letter-spacing:-.04em;margin-bottom:13px}h1 span,h2 span{font-style:italic;color:var(--gold);font-size:.8em}h1 span{padding:0 .16em}.occasion{font-size:.9rem;letter-spacing:.27em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}.envelope{position:relative;display:block;width:min(690px,100%);aspect-ratio:3/2;margin:12px auto 0;padding:0;border:0;background:transparent;cursor:pointer;perspective:1000px;filter:drop-shadow(0 24px 34px #10060ab3);transition:transform .4s,opacity .65s}.envelope:hover{transform:translateY(-5px)}.envelope-base,.envelope-flap{width:100%;height:100%;object-fit:cover;display:block;border-radius:4px}.envelope-flap{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,100% 8%,50% 58%,0 8%);transform-origin:50% 4%;transition:transform 1s cubic-bezier(.2,.7,.2,1),filter 1s;backface-visibility:hidden}.seal{position:absolute;top:57%;left:50%;transform:translate(-50%,-50%);width:19%;aspect-ratio:1;border:1px solid #b99a56;border-radius:50%;background:radial-gradient(circle,#fff6d9,#d4b273);box-shadow:0 5px 14px #170b09a1,inset 0 0 0 4px #f7dfac;display:grid;place-items:center;transition:opacity .25s,transform .45s}.seal img{display:block;width:89%;height:auto}.open-hint{font-size:.875rem;letter-spacing:.025em;color:#edd9b8;text-align:center;margin:18px 0 30px}.heritage-footer{margin:auto 0 0;padding-top:8px;text-align:center;text-transform:uppercase;font-size:.75rem;letter-spacing:.16em;color:#c5a689}.heritage-footer span{padding:0 12px;color:var(--gold)}.opening .seal{opacity:0;transform:translate(-50%,-50%) scale(1.25)}.opening .envelope-flap{transform:rotateX(170deg);filter:brightness(.75)}.opening .envelope-base{opacity:.55;transition:opacity 1s}.opening .open-hint{opacity:0}.invitation-toolbar{max-width:940px;display:flex;justify-content:space-between;align-items:center;margin:auto;padding:22px 10px;color:var(--gold);gap:15px}.invitation-toolbar>span{font-family:Georgia,serif;font-size:1.2rem}.invitation-toolbar button{font-size:.875rem;color:#ecd9b7;background:none;border:0;border-bottom:1px solid #876946;cursor:pointer;padding:6px 0}main{padding:0 24px 28px;animation:reveal 1.1s ease both}.letter{max-width:920px;margin:auto;background:var(--cream);color:var(--ink);position:relative;box-shadow:0 24px 90px #07020480;border:1px solid #be9358}.letter:before,.letter:after{content:'';position:absolute;top:30px;bottom:30px;width:1px;background:#b88a4973;pointer-events:none}.letter:before{left:20px}.letter:after{right:20px}.woven-border{height:28px;background:url('assets/raffia-envelope.png') center 90%/100% auto;border-bottom:3px solid #9e763d}.woven-border.bottom{border-bottom:0;border-top:3px solid #9e763d}.letter-content{padding:34px 11% 54px;text-align:center}.letter-logo{display:block;width:155px;height:auto;margin:0 auto 24px}.letter .eyebrow{color:#876027}.letter h2{font-size:clamp(3rem,7vw,6rem);margin:22px 0}.letter h2 span{color:#a77b37}.fine-rule{width:85px;height:1px;background:#bd975b;margin:32px auto}.lead{font-family:Georgia,serif;font-size:clamp(1.55rem,3vw,2.1rem);line-height:1.5;margin-bottom:24px}.welcome{max-width:490px;margin:0 auto;color:#674a4c;line-height:1.85}.date-block{margin:46px 0;padding:30px 12px;border-top:1px solid #c8a66d88;border-bottom:1px solid #c8a66d88}.date-block .eyebrow{margin-bottom:8px}.wedding-date{font-family:Georgia,serif;font-size:clamp(1.7rem,4vw,2.8rem);margin-bottom:3px}.venue{margin:0;font-size:1rem;color:#71534d}.roots{background:#381623;color:#f7ead5;margin:0 -5%;padding:38px 9%}.roots .eyebrow{color:var(--gold)}h3{font-family:Georgia,serif;font-weight:400;font-size:clamp(1.7rem,3.5vw,2.5rem);line-height:1.25;margin-bottom:24px}.roots p:not(.eyebrow){color:#e4cdbc;line-height:1.9;max-width:490px;margin:0 auto 16px}.countries{display:flex;justify-content:center;align-items:center;gap:22px;font-size:.875rem;letter-spacing:.04em;border-top:1px solid #b8925055;padding-top:22px;margin-top:26px}.country-join{font-family:Georgia,serif;font-size:2rem;font-style:italic;color:var(--gold)}.countries small{display:block;color:#c6a476;font-size:.75rem}.celebration{padding-top:48px}.schedule{text-align:left;margin:28px auto;max-width:500px}.schedule>div{display:grid;grid-template-columns:105px 1fr;gap:22px;border-bottom:1px solid #c1a16e55;padding:17px 0}.schedule dt{color:#846032}.schedule dd{margin:0}.draft-note{font-size:.875rem;color:#745957}.letter-footer{margin-top:44px;padding-top:36px;border-top:1px solid #c8a66d88}.letter-footer>p:first-child{color:#674a4c;margin-bottom:8px}.signature{font-family:Georgia,serif;font-style:italic;font-size:2.35rem;margin-bottom:18px}.letter-footer .eyebrow{font-size:.75rem}.page-note{font-size:.75rem;text-align:center;color:#c4a68a;margin:22px 0 0}@keyframes reveal{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}@media(min-width:900px) and (max-height:820px){.arrival{padding-top:24px}.envelope{width:min(530px,75vh)}h1{font-size:4rem}.open-hint{margin:10px 0 20px}}@media(max-width:520px){.arrival{padding:40px 15px 25px;justify-content:center}.arrival-heading{margin-top:auto}.arrival .eyebrow{font-size:.75rem;letter-spacing:.11em}.envelope{margin-top:25px}.open-hint{max-width:230px;font-size:.875rem;line-height:1.6;margin:24px 0 auto}.heritage-footer{font-size:.75rem;letter-spacing:.055em;padding-top:35px}.heritage-footer span{padding:0 5px}main{padding:0 12px 24px}.invitation-toolbar{padding:17px 2px}.invitation-toolbar>span{font-size:1rem}.invitation-toolbar button{font-size:.8rem}.letter-content{padding:28px 9% 38px}.letter:before{left:10px}.letter:after{right:10px}.letter-logo{width:126px}.letter .eyebrow{letter-spacing:.13em}.letter h2{font-size:2.9rem}.roots{padding:30px 8%;margin:0 -3%}.countries{gap:14px}.schedule>div{grid-template-columns:82px 1fr;gap:10px}.schedule{font-size:1rem}.woven-border{height:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.envelope-flap{clip-path:polygon(2% 4%,98% 4%,98% 13%,50% 79%,2% 13%)}.seal{top:75%}
.language-nav{display:flex;justify-content:center;gap:20px;padding:14px 20px 0;font-size:.875rem;color:var(--gold)}.language-nav a{color:var(--cream);text-underline-offset:5px}.language-nav a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}.language-nav + .arrival{min-height:calc(100svh - 38px)}
.toolbar-actions{display:flex;align-items:center;gap:14px}.invitation-toolbar .music-toggle{width:44px;height:44px;flex-shrink:0;padding:0;display:grid;place-items:center;border:1px solid #b8925077;border-radius:50%;color:var(--gold);font-size:1.15rem;background:#321420}.music-toggle:hover{background:#512335}.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}.letter{isolation:isolate;overflow:hidden}.letter-content{position:relative;z-index:1}.letter-silhouette{position:absolute;left:50%;top:200px;transform:translateX(-50%);width:80%;max-width:680px;height:auto;opacity:.13;pointer-events:none;user-select:none;z-index:0;mask-image:linear-gradient(to bottom,#000 72%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 72%,transparent 100%)}@media(max-width:520px){.toolbar-actions{gap:8px}.letter-silhouette{width:96%;top:220px}}
.letter-silhouette{filter:grayscale(1) brightness(.85) contrast(5) sepia(1) brightness(1.1);mix-blend-mode:multiply;opacity:.16}

/* Guest details follow the invitation's burgundy, gold and raffia palette. */
.guest-dialog{color-scheme:light;width:min(540px,calc(100% - 28px));max-height:90svh;margin:auto;padding:34px 36px;border:1px solid #b89352;background:var(--cream);color:var(--ink);box-shadow:0 25px 90px #12050bc0;text-align:center;overflow:auto}
.guest-dialog::backdrop{background:#1a0614cc;backdrop-filter:blur(5px)}
.guest-dialog .guest-seal{display:block;width:86px;height:auto;margin:0 auto 18px}
.guest-dialog .eyebrow{color:#78531f;letter-spacing:.13em;font-size:.875rem}
.guest-dialog h2{font-size:2.15rem;letter-spacing:-.025em;line-height:1.2;margin:0 0 16px}
.guest-intro{font-size:1rem;color:#674a4c;margin-bottom:24px}
.name-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left}
.name-fields label{min-width:0;font-size:.875rem;font-weight:600;color:#442335;line-height:1.5}
.name-fields input{display:block;width:100%;min-width:0;border:1px solid #ad8857;border-radius:3px;background:#fffdf6;color:#381924;margin-top:7px;padding:12px;font:inherit;font-size:1rem;font-weight:400;line-height:1.5}
.name-fields input:focus{outline:2px solid #794737;outline-offset:2px}
.guest-dialog .form-note,.guest-response .form-note{font-size:.875rem;line-height:1.65;color:#705357;margin:16px 0}
.royal-button{border:1px solid #6c3546;border-radius:3px;background:#381623;color:#fff2d8;min-height:48px;padding:13px 22px;font-size:1rem;font-weight:600;cursor:pointer;width:100%;line-height:1.5}
.royal-button:hover{background:#572437}
.royal-button:disabled{opacity:.65;cursor:default}
.text-button{color:#704332;font-size:.875rem;background:none;border:0;border-bottom:1px solid #ba965e;padding:6px 0;cursor:pointer;line-height:1.5;min-height:38px}
.text-button:hover{color:#36131f}
.personal-greeting{display:inline-block;max-width:100%;overflow-wrap:anywhere;margin:0 auto 20px;padding:5px 16px;border-block:1px solid #b08a5070;font:italic 1.15rem/1.7 Georgia,serif;color:#784735}
.guest-response{margin-top:48px;padding-top:40px;border-top:1px solid #c8a66d88;color:var(--ink);text-align:left}
.guest-response>h3,.guest-response>p{text-align:center}
.guest-response>p:not(.eyebrow){color:#674a4c}
.guest-response h3{margin-bottom:14px}
.rsvp-fields{margin:26px 0 0;padding:0;border:0;min-width:0}
.guest-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#ecd7b74d;border:1px solid #b18b544d;padding:17px 18px;margin:0 0 24px}
.guest-summary>div{min-width:0}
.guest-summary strong{display:block;font:1.2rem/1.5 Georgia,serif;overflow-wrap:anywhere}
.guest-summary .text-button{flex-shrink:0}
.form-caption{display:block;font-size:.875rem;color:#705357;margin-bottom:3px}
.companion-row{border:1px solid #b18b5470;min-width:0;margin:0 0 20px;padding:16px}
.companion-row legend{font-family:Georgia,serif;font-size:1.12rem;padding:0 8px;color:#5b2739}
.remove-companion{display:block;margin:12px 0 0 auto}
.outline-button{background:transparent;border:1px solid #9d733b;border-radius:3px;color:#633546;min-height:46px;padding:10px 16px;font-size:.95rem;line-height:1.5;cursor:pointer}
.outline-button:hover{background:#ecd7b74d}
.outline-button:disabled{opacity:.5;cursor:default}
.guest-total{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;border-block:1px solid #b18b5455;margin:25px 0}
.guest-total strong{font:2rem/1 Georgia,serif;color:#6d3e2c}
.guest-response .privacy-note{margin:24px 0;line-height:1.7}
.privacy-note a{color:#643340;text-underline-offset:3px}
.rsvp-status{margin:20px 0 0;font-size:1rem;color:#3c4930;line-height:1.7}
.rsvp-status:empty{display:none}
.rsvp-status.is-error{color:#922d30}
.form-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.guest-response button:focus-visible,.guest-dialog button:focus-visible{outline:2px solid #875225;outline-offset:4px}
body:has(.guest-dialog[open]){overflow:hidden}
@media(max-width:520px){.guest-dialog{padding:24px 22px}.name-fields{grid-template-columns:1fr;gap:16px}.guest-dialog h2{font-size:1.8rem}.guest-summary{align-items:flex-start;flex-direction:column;gap:8px;padding:15px}.guest-response{margin-top:36px;padding-top:30px}.companion-row{padding:12px}.outline-button{width:100%}.guest-total{align-items:flex-start}.guest-response .royal-button{padding-inline:12px}}
