@font-face{font-family:Poiret;src:url('fonts/PoiretOne-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Cormorant;src:url('fonts/CormorantGaramond.ttf') format('truetype');font-weight:300 700;font-display:swap}
:root{color-scheme:light;--ink:#303221;--ivory:#faf5e8;--gold:#dec894;--green:#30391e}
*{box-sizing:border-box}
body{margin:0;background:#151b0e;color:var(--ivory);font:16px/1.5 system-ui,sans-serif;min-height:100svh}
button,input,textarea{font:inherit}button{cursor:pointer}button,input,textarea,summary{touch-action:manipulation}
button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #bd863d;outline-offset:4px}
[hidden]{display:none!important}
.patio{position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,#111908dd,#19200dde 35%,#19200dde 65%,#111908dd),url('patio-source.png') center/cover no-repeat,#1e2615}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 50% 15%,#e5c77c12,transparent 60%),repeating-linear-gradient(120deg,#fff5 0 .3px,transparent .3px 3px);opacity:.12}
.deco-frame{position:fixed;inset:14px;border:1px solid #c7ad70;outline:1px solid #c7ad7066;outline-offset:-7px;pointer-events:none;z-index:5}
.deco-frame:before,.deco-frame:after{content:"";position:absolute;width:68px;height:68px;border:3px double var(--gold);background:linear-gradient(135deg,transparent 46%,#c7ad7066 47% 48%,transparent 49%)}
.deco-frame:before{top:9px;left:9px;border-right:0;border-bottom:0}
.deco-frame:after{bottom:9px;right:9px;border-left:0;border-top:0}
.top{display:flex;justify-content:space-between;align-items:center;max-width:1080px;margin:auto;padding:30px 44px 10px;font:500 13px Cormorant,Georgia,serif;letter-spacing:.25em}
.monogram{display:block;border-radius:50%;object-fit:cover;flex-shrink:0}
#entrance{text-align:center;min-height:calc(100svh - 174px);position:relative;padding:10px 0 30px}
.intro{position:relative;z-index:3;padding:0 18px;pointer-events:none}
.sunburst{width:132px;height:74px;margin:0 auto 15px;background:url("sunburst.svg") center/contain no-repeat}
.eyebrow{font:500 13px Cormorant,Georgia,serif;letter-spacing:.22em;color:var(--gold)}
h1{margin:0;color:var(--gold)}
h1 span{display:block;font:400 19px/1.4 Cormorant,Georgia,serif;letter-spacing:.35em;text-transform:uppercase;margin-bottom:8px}
h1 strong{display:block;font:400 clamp(70px,8vw,106px)/1.05 Poiret,sans-serif;letter-spacing:.14em;padding-left:.14em;color:#f5e2b4;text-shadow:0 0 18px #edce7933}
.divider{display:flex;align-items:center;justify-content:center;gap:12px;margin:16px auto 24px;width:220px;color:var(--gold);font-size:16px}
.divider:before,.divider:after{content:"";height:1px;width:95px;background:linear-gradient(90deg,transparent,var(--gold))}.divider:after{transform:rotate(180deg)}
.doorway{position:absolute;inset:0}
#enter{position:absolute;inset:0;border:0;width:100%;background:none;text-shadow:0 2px 12px #160e08;color:#fff0cc;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:22px 8px;gap:8px;font:500 14px/1.4 Cormorant,Georgia,serif;letter-spacing:.08em}
.touch{font-size:25px}.opening #enter{opacity:0;pointer-events:none}
.link{display:block;background:none;border:0;color:#fff1d5;text-decoration:underline;text-underline-offset:5px;min-height:48px;padding:12px 20px;margin:20px auto;font-size:13px}
.card{width:min(100% - 64px,600px);margin:22px auto 0;padding:38px 44px;background:repeating-linear-gradient(35deg,#b4996405 0 1px,transparent 1px 4px),var(--ivory);color:var(--ink);border:1px solid var(--gold);box-shadow:0 0 0 5px #1e2615,0 0 0 6px #dec89477,0 24px 90px #090d0670;border-radius:100px 100px 0 0}
.card>.eyebrow{text-align:center;color:#796241;margin-top:12px}
h2{font:400 39px/1.12 Cormorant,Georgia,serif;text-align:center;margin:18px 0}h2:focus,h3:focus{outline:none}
.lede{text-align:center;font-size:14px;color:#646356;margin-bottom:24px}
.notice{background:#ede5d5;border:1px solid #d8c9ad;border-radius:2px;padding:10px 12px;font-size:12px;line-height:1.5}
label,legend{font-size:14px;font-weight:600}form>label,fieldset>label{display:block;margin:20px 0 7px}
input:not([type=radio]),textarea{display:block;width:100%;min-height:48px;padding:11px 12px;border:1px solid #b9b4a4;border-radius:2px;color:var(--ink);background:#fffdf7}
textarea{resize:vertical}fieldset{padding:0;margin:22px 0;border:0;min-width:0}legend{margin-bottom:10px}
.choices{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.choices label{position:relative;cursor:pointer}.choices input{position:absolute;top:16px;left:10px;width:16px;height:16px;accent-color:var(--green)}
.choices span{display:flex;align-items:center;justify-content:center;min-height:52px;padding:8px 8px 8px 32px;border:1px solid #bbb4a2;border-radius:2px;font-size:13px}
.choices input:checked+span{background:var(--green);color:white;border-color:var(--green)}.choices input:focus-visible+span{outline:3px solid #bd863d;outline-offset:3px}
.counts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.counts input{margin-top:8px}.counts small{display:block;font-size:11px;font-weight:400;white-space:nowrap}
small{font-weight:400;color:#6a675b;font-size:12px}.hint{font-size:12px;color:#6a675b;margin:5px 0 12px}.error{font-size:13px;color:#9a3024}.error:empty{display:none}
.primary{width:100%;min-height:52px;border:1px solid #79744c;border-radius:2px;background:var(--green);color:#fff8e7;padding:13px 18px;margin-top:12px;font-weight:600}.primary:hover{background:#242b16}.primary span{float:right}
.footnote{text-align:center;margin-top:12px}
footer{display:flex;justify-content:center;align-items:center;gap:16px;font:500 11px Cormorant,Georgia,serif;letter-spacing:.2em;padding:20px 30px 30px;color:var(--gold)}footer span{font-size:14px}
#result{text-align:center}h3{font:400 34px Cormorant,Georgia,serif}.seal{margin:25px auto 0}
details{text-align:left;margin:24px 0;font-size:13px}summary{cursor:pointer;min-height:44px;padding:10px 0}pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;background:#eee7da;padding:12px}
/* The film owns the camera movement; only the invitation card is transformed. */
body.traveling{overflow:hidden}
#journey{position:fixed;inset:0;z-index:0;pointer-events:none;background:#25291c}
#journey:before{content:"";position:absolute;inset:0;background:url('video-start.jpg') center/cover;filter:blur(24px) brightness(.55)}
#travel-film{position:absolute;width:100%;height:100%;object-fit:contain}
#journey:after{content:"";position:absolute;inset:0;background:linear-gradient(#111908aa,transparent 45%,#11190877);transition:opacity .5s;opacity:1}
.traveling:not(.entered) #journey:after{opacity:0}
.entered #journey:before{background-image:url('video-end.jpg');background-size:contain;background-repeat:no-repeat;filter:none}
.entered #journey{background:#25291c url('video-end.jpg') center/contain no-repeat}
.entered #journey:after{background:#11190866}
.top,#entrance,footer{position:relative;z-index:2}
#entrance{min-height:calc(100svh - 174px)}
.top,.intro,footer,.deco-frame{transition:opacity .5s ease}
.traveling .top,.traveling .intro,.traveling footer,.traveling .deco-frame{opacity:0;pointer-events:none}
body.entered #main{position:relative;z-index:3}
body.entered .top{display:none}
body.entered .card{margin-top:7svh}
.card{position:relative}
body.traveling.entered .card:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 25%,#fff9 45%,transparent 65%);animation:card-light 1.4s ease both}
@keyframes card-light{from{opacity:0}40%{opacity:.5}to{opacity:0}}
.card{transform-origin:50% 28%;backface-visibility:hidden}
.traveling.entered .card{will-change:transform,opacity}
.traveling #replay{visibility:hidden}
body.entered .deco-frame{z-index:-1}
@media(max-width:600px){.deco-frame{inset:10px;outline-offset:-5px}.deco-frame:before,.deco-frame:after{width:36px;height:36px}.top{padding:26px 30px 12px;letter-spacing:.12em;font-size:11px}.top .monogram{width:48px;height:48px}#entrance{min-height:calc(100svh - 147px);padding-top:18px;padding-bottom:24px}.sunburst{width:106px;height:53px;margin-bottom:14px}h1 strong{font-size:74px}h1 span{font-size:17px}.divider{margin:14px auto 24px}#travel-film{object-fit:cover}.card{padding:28px 18px 22px;border-radius:65px 65px 0 0;margin-top:18px}h2{font-size:32px}.choices{gap:5px}.choices span{font-size:12px;padding-left:27px}.choices input{left:6px}.counts{gap:9px}.counts small{font-size:10px}footer{font-size:10px;gap:12px;padding-bottom:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
