/* Champagne opening: the supplied responsive SVG is the actual background. */
/* Explicitly requested touch-zoom restriction. One-finger scrolling remains. */
html,body{touch-action:pan-x pan-y}
@media(pointer:coarse){input,textarea,select{font-size:16px!important}}
/* A document screen, not a fixed opaque overlay: Safari can extend the page
   background behind its translucent controls instead of sampling a flat tint. */
html:has(body.is-gated){background:#ead7bb url('assets/champagne-landscape.svg') center / cover no-repeat;min-height:100%;overflow-x:clip}
body.is-gated{background:transparent;overflow:visible;min-height:100vh;min-height:100dvh}
body.is-gated:not(.is-entering) .site-shell{display:none}
.invitation-gate{position:relative;inset:auto;height:100vh;height:100dvh;min-height:0!important;background:transparent!important}
body.is-entering .invitation-gate{position:absolute;inset:0}
@media(max-width:700px){html:has(body.is-gated){background-image:url('assets/champagne-portrait.svg')}}
@media(display-mode:standalone){
  .gate-motto{top:calc(env(safe-area-inset-top,0px) + 24px)!important}
  .gate-open,.gate-progress{bottom:calc(env(safe-area-inset-bottom,0px) + 28px)!important}
  .hero{padding-top:env(safe-area-inset-top,0px)}
  .finale{padding-bottom:calc(55px + env(safe-area-inset-bottom,0px))}
  body{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
}
.name-amp{font-family:Arial,sans-serif;font-style:normal;font-weight:400;font-size:.43em;letter-spacing:0;vertical-align:.14em}
.invitation-gate{color:#514334;background:#ead7bb;min-height:100svh}
.gate-art{position:absolute;inset:0;pointer-events:none}
.gate-art img{width:100%;height:100%;object-fit:cover}
.gate-motto{z-index:1;top:max(30px,6svh);font-size:10px;line-height:1.8;letter-spacing:.25em;color:#665642;text-shadow:0 1px 14px #fff8ed}
.gate-center{padding:75px 20px 100px;width:100%;max-width:1100px}
.gate-logo{position:relative;width:180px;height:148px;margin:0 auto 22px}
.gate-monogram{position:absolute;inset:0;width:100%;height:100%;margin:0;object-fit:contain;mix-blend-mode:multiply;animation:none;transition:opacity .45s ease}
.logo-static{opacity:0}.gate-logo.is-static .logo-static{opacity:1}.gate-logo.is-static .logo-reveal{opacity:0}
.gate-center h1{font-size:clamp(48px,5.5vw,86px);letter-spacing:-.045em;text-shadow:0 2px 25px #fff9eb}
.gate-center .name-amp{color:#947c5c;margin:0 .15em}
.gate-date{color:#756147;font-size:25px;margin-top:22px}
.gate-progress{bottom:max(32px,7svh);width:min(280px,65vw);color:#756147;font-size:8px;letter-spacing:.15em}
.progress-track{position:relative;height:3px;background:#6a53351f;border-radius:10px;margin:15px 0 9px;overflow:hidden;box-shadow:0 1px 0 #fff8}
.progress-track span{height:100%;border-radius:inherit;background:linear-gradient(90deg,#8a6c45,#caa477,#94724b);transition:transform .3s ease}
.gate-open{bottom:max(30px,6svh);min-width:276px;padding:13px 15px 13px 26px;background:#66533e;color:#fff8ed;border-color:#856c4b;box-shadow:0 8px 32px #69503320,inset 0 1px 0 #fff2;font-size:11px;letter-spacing:.04em;animation:soft-in .5s ease both}
.gate-open:hover{background:#51412f;box-shadow:0 12px 40px #69503335}
.gate-open .button-mark{border-color:#d9c7ac85}.gate-open{animation-name:button-enter}
@keyframes button-enter{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}
#loading-retry{border:0;border-bottom:1px solid #9d8463;background:transparent;color:inherit;margin-top:12px;padding:6px;font-size:11px;cursor:pointer}
.place{grid-template-columns:1.2fr .8fr;gap:6%}
.venue-image{grid-column:1;grid-row:1;position:relative;overflow:hidden;border-radius:80px 20px 20px 20px;aspect-ratio:3/2;background:#e7ded0}
.venue-image picture,.venue-image picture img{display:block;width:100%;height:100%;object-fit:cover;object-position:48% center}
.venue-image:after{content:'';position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#2a2c2366);pointer-events:none}
.venue-image .primary-button{position:absolute;bottom:24px;left:24px;right:24px;z-index:1;width:fit-content;max-width:calc(100% - 48px);background:#f8f4eb;color:var(--ink);border-color:#ffffff70}
.venue-image .button-mark{border-color:#69745e50}
.venue-logo-badge{position:absolute;top:18px;right:18px;z-index:2;width:112px;padding:12px 14px;background:#fcfaf5ed;border:1px solid #fff8;border-radius:12px;box-shadow:0 3px 16px #30251b12;pointer-events:none}
.venue-logo-badge .venue-logo{display:block;width:100%;height:auto;margin:0;object-fit:contain;opacity:.85;mix-blend-mode:multiply}
.attendance-panel>legend{font:400 40px/1.1 var(--serif);letter-spacing:-.02em;margin-bottom:12px}
.attendance-help{font-size:12px;color:var(--muted)}
.attendance-options{display:grid;gap:10px;margin-top:23px}
.attendance-options label{display:flex;align-items:center;gap:14px;padding:17px;border:1px solid var(--line);border-radius:14px;background:#fffdf8;font-size:13px;cursor:pointer;transition:border-color .2s,background .2s}
.attendance-options small{display:block;margin-top:4px;font-size:10px;color:var(--muted)}
.attendance-options label:has(input:checked){border-color:#97a383;background:#ecf0e4}
.attendance-options label:focus-within{outline:2px solid var(--sage);outline-offset:3px}
#attendance-details{border-top:1px solid var(--line);margin-top:30px;padding-top:22px}
.success-declined h3{font-size:clamp(29px,3vw,41px);line-height:1.2}
.couple-contacts{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;margin:32px auto 30px}
.couple-contacts a{display:flex;flex-direction:column;gap:4px;min-width:190px;padding:13px 22px;border:1px solid #ffffff30;border-radius:14px;text-decoration:none;font-size:12px;transition:background .25s,border-color .25s}
.couple-contacts a:hover{background:#ffffff0d;border-color:#ffffff70}.couple-contacts small{color:#c8d0bf;font-size:10px}
@media(max-width:700px){
  .gate-motto{top:max(27px,6svh);font-size:9px}
  .gate-center{padding:60px 20px 100px}
  .gate-logo{width:148px;height:122px;margin-bottom:22px}
  .gate-center h1{max-width:340px;font-size:clamp(49px,12vw,64px);line-height:1}
  .gate-center .name-amp{display:block;margin:10px 0;font-size:23px}
  .gate-date{font-size:22px;margin-top:23px}
  .gate-open{bottom:max(30px,6svh);min-width:264px}
  .place{gap:32px}
  .venue-image{order:2;aspect-ratio:2/3;border-radius:65px 16px 16px 16px}
  .venue-logo-badge{top:14px;right:14px;width:92px;padding:10px 12px;border-radius:10px}
  .attendance-panel>legend{font-size:34px}.attendance-options label{padding:15px 12px;font-size:12px}
  .couple-contacts{gap:10px}.couple-contacts a{width:100%;max-width:270px}
}
@media(max-height:640px){.gate-motto{top:17px}.gate-center{padding:50px 20px 85px}.gate-logo{width:100px;height:82px;margin-bottom:12px}.gate-center h1{font-size:43px}.gate-center .name-amp{display:inline;font-size:22px;margin:0 5px}.gate-date{font-size:20px;margin-top:15px}.gate-open,.gate-progress{bottom:20px}}
@media(prefers-reduced-motion:reduce){.logo-reveal{display:none}.logo-static{opacity:1}.gate-art{animation:none}}

/* Supplied sunset artwork: separate compositions for desktop and phone. */
.plant-art img{mix-blend-mode:normal;border-radius:0;width:100%;height:auto;object-fit:contain}
.finale{isolation:isolate;min-height:660px;display:grid;place-items:center;padding:74px 28px 64px;background:#473b32;color:#fff8ec}
.finale-art{position:absolute;inset:0;z-index:-2;pointer-events:none}
.finale .finale-art img{display:block;width:100%;height:100%;margin:0;object-fit:cover;object-position:65% center;filter:none;opacity:1}
.finale-landscape{z-index:-1;background:linear-gradient(180deg,#28292158,#29241e80 45%,#211f1bc9);animation:none}
.finale-copy{width:100%;text-shadow:0 2px 18px #17150e55}
.finale .section-note{color:#f3dfbf}
.finale h2{max-width:740px;margin-bottom:20px}
.finale-copy>p:not(.section-note,.final-names,.final-date){color:#fff0d7}
.finale-copy>img{opacity:.9;margin:24px auto 16px}
.couple-contacts a{flex-direction:row;align-items:center;justify-content:center;gap:13px;min-width:218px;padding:15px 20px;background:#29282075;border-color:#f1dfc450;color:#fff3dc;text-align:left;text-shadow:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .25s,border-color .25s,transform .25s}
.couple-contacts a:hover{background:#403627bb;border-color:#f3dfbca6;transform:translateY(-2px)}
.couple-contacts a:focus-visible{outline:2px solid #fff0cf;outline-offset:4px}
.contact-label{display:flex;flex-direction:column;gap:5px}
.couple-contacts small{color:#ead6b7}
.telegram-icon{flex:none;width:22px;height:22px;color:#ecd4aa}
.finale .to-top{background:#29282075;color:#fff3dc}
@media(max-width:700px){
  .finale{min-height:760px;min-height:92svh;padding:64px 22px 76px}
  .finale .finale-art img{object-position:center}
  .finale h2{font-size:clamp(39px,11vw,49px)}
  .finale-landscape{background:linear-gradient(180deg,#28292152,#29241e75 42%,#211f1bcc)}
  .couple-contacts a{min-width:0;max-width:270px}
}
@media(prefers-reduced-motion:reduce){.couple-contacts a{transition:none}.couple-contacts a:hover{transform:none}}

/* User-supplied frame, split by CSS clipping; no motion or scroll attachment. */
:root{--frame-gutter:clamp(72px,12vw,240px);--frame-feather:14px}
.site-shell{margin-inline:var(--frame-gutter)}
.stationary-frame{position:fixed;inset:0;z-index:2;pointer-events:none;visibility:hidden;overflow:clip}
body.is-entered .stationary-frame{visibility:visible}
.frame-side{position:absolute;top:0;bottom:0;width:var(--frame-gutter);overflow:hidden;pointer-events:none}
.frame-left{left:0;mask-image:linear-gradient(to right,#000 calc(100% - var(--frame-feather)),transparent)}.frame-right{right:0;mask-image:linear-gradient(to left,#000 calc(100% - var(--frame-feather)),transparent)}
.frame-side img{position:absolute;top:0;display:block;height:100%;width:auto;max-width:none;animation:none;transform:none}
.frame-left img{left:0}.frame-right img{right:0}
@supports(height:100lvh){.stationary-frame{bottom:auto;height:100lvh}}
@media(max-width:1100px){:root{--frame-gutter:clamp(32px,6vw,66px)}}
@media(max-width:700px){:root{--frame-gutter:22px}.site-shell .hero{padding-left:8px;padding-right:8px}.site-shell .hero-copy{padding-left:8px;padding-right:8px}.site-shell .section{padding-left:18px;padding-right:18px}.site-shell .flowers{padding-left:18px;padding-right:18px}.site-shell .finale{margin-left:8px;margin-right:8px;padding-left:18px;padding-right:18px}.site-shell .finale h2{font-size:clamp(34px,10vw,46px)}}
@media(max-width:700px){:root{--frame-feather:4px}}
@media(max-width:360px){:root{--frame-gutter:16px}.site-shell .form-area{padding-left:14px;padding-right:14px}}