:root{--red:#ed1c24;--pink:#edc9e0;--ink:#161616}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,sans-serif;color:var(--red)}img{display:block;max-width:100%}section{position:relative;overflow:hidden;width:100%}
.hero,.zones,.rsvp{min-height:100svh}
.hero{height:max(100svh,65.51vw);background:url('assets/festival-sky.webp') center/cover}
.topbar{position:absolute;inset:5.6% 3.6% auto;display:flex;justify-content:flex-end;z-index:3}.topbar p{display:none}.henkel-logo{width:16%;display:block}.henkel-logo img{width:100%}
.hero-copy{position:absolute;top:11.5%;left:4.6%;width:48.6%;z-index:2}.hero-title{margin:0 0 0 11.5%;width:67.5%}.hero-title img{width:100%}.hero-deck{margin:5% 0 3%;width:79%;text-align:center;font-size:clamp(14px,1.82vw,32px);line-height:1.13;font-weight:600;letter-spacing:.02em}.event-facts{width:100%}.event-facts img{width:100%}.future-stamp{position:absolute;left:9.8%;bottom:4.5%;width:34%;z-index:2}.hero-art{position:absolute;top:29.4%;bottom:0;right:0;width:44.8%}.hero-art img{width:100%;height:100%;object-fit:fill}
.zones{height:max(100svh,65.51vw);background:#ed1c24 url('assets/reference-zones.png') center/100% 100% no-repeat}.zones-copy,.map-art{visibility:hidden}.zones-copy h2{margin:0}.map-art img{width:100%}
.rsvp{display:grid;grid-template-columns:56.7% 43.3%;min-height:max(100svh,65.51vw);background:var(--pink)}.rsvp-panel{padding:11.2% 12.2% 9% 8.3%;min-width:0}.rsvp-panel h2{margin:0 0 7%;width:65%}.rsvp-panel h2 img{width:100%}.rsvp-subtitle{margin:0 0 10%;width:90%}.rsvp-subtitle img{width:100%}#rsvp-form{display:grid;gap:1vw}#rsvp-form>label:not(.consent){margin:0 0 0 4.5%;padding-top:1vw}#rsvp-form>label:not(.consent) img{height:1.55vw;width:auto}#rsvp-form>input{width:100%;height:5vw;min-height:45px;border:0;border-radius:999px;padding:0 5%;font:inherit;font-size:clamp(10px,.85vw,15px);color:var(--ink);background:#fff}#rsvp-form>input:focus{outline:2px solid var(--red);outline-offset:3px}.consent{display:grid;grid-template-columns:2.3vw 1fr;gap:.5vw;color:var(--ink);font-size:clamp(8px,.86vw,14px);line-height:1.18;margin:1.5vw 2% 4.8vw}.consent input{width:2.3vw;height:2.3vw;margin:0;accent-color:var(--red)}.consent span{overflow-wrap:anywhere}.submit-button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:95%;margin:0 auto;min-height:5vw;border:0;border-radius:999px;background:var(--red);color:#fff;padding:1vw 4%;cursor:pointer}.submit-button span img{width:25vw}.submit-button b{font-size:3vw;line-height:1}.submit-button:hover{filter:brightness(.95)}.rsvp-art{position:relative;min-width:0}.rsvp-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}.form-error{color:#8e0713;font-size:14px}.success-card{color:var(--ink);padding:20px;background:#ffffff80;border-radius:20px}.ticket-number{display:block;margin:20px 0;font-size:24px}
@media(min-width:651px){.hero-copy,.future-stamp,.rsvp-panel{animation:enter .8s ease both}.hero-art{animation:enter 1s ease both}}
@keyframes enter{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:650px){.hero{height:auto;min-height:100svh;display:flex;flex-direction:column;padding-top:70px}.topbar{inset:18px 5% auto}.henkel-logo{width:90px}.hero-copy{position:relative;inset:auto;width:90%;margin:0 auto}.hero-title{width:70%;max-width:300px;margin:0}.hero-deck{text-align:left;width:100%;font-size:clamp(13px,3.5vw,19px);margin:20px 0}.event-facts{width:100%;margin:0 0 12px}.future-stamp{position:relative;inset:auto;width:64%;max-width:290px;margin:8px 0 20px 5%}.hero-art{position:relative;inset:auto;width:76%;max-width:400px;align-self:flex-end;margin-top:auto}.hero-art img{height:auto}.zones{height:auto;min-height:100svh;background:#ed1c24;display:flex;flex-direction:column;padding:35px 5% 20px}.zones-copy,.map-art{visibility:visible}.zones-copy h2{width:65%;max-width:280px}.shaping{width:45%;margin:25px 0 15px}.map-art{width:100%;margin:auto 0}.map-art img{width:100%;height:auto}.rsvp{grid-template-columns:1fr;min-height:100svh}.rsvp-panel{padding:35px 5%}.rsvp-panel h2{width:58%;max-width:250px;margin-bottom:22px}.rsvp-subtitle{width:95%;max-width:360px;margin-bottom:30px}#rsvp-form{gap:10px}#rsvp-form>label:not(.consent){padding-top:10px}#rsvp-form>label:not(.consent) img{height:20px}#rsvp-form>input{height:50px;font-size:16px}.consent{grid-template-columns:20px 1fr;gap:9px;font-size:11px;line-height:1.35;margin:18px 0 28px}.consent input{width:20px;height:20px}.submit-button{min-height:50px;padding:12px 20px}.submit-button span img{width:235px;max-width:100%}.submit-button b{font-size:28px}.rsvp-art{aspect-ratio:712.79/1076.7;width:100%}.hero-copy,.future-stamp,.zones-copy,.rsvp-panel{animation:enter .7s ease both}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Supplied complete left-side SVG replaces the anniversary, copy, facts and stamp. */
.hero-copy.hero-left-svg{top:7%;left:2%;width:51%;height:88%;}
.hero-left-svg h1{margin:0;width:100%;height:100%;}
.hero-left-svg h1 img{width:100%;height:100%;object-fit:contain;object-position:center;}
@media(max-width:650px){.hero-copy.hero-left-svg{position:relative;inset:auto;width:96%;height:auto;margin:0 auto 16px;}.hero-left-svg h1,.hero-left-svg h1 img{height:auto;width:100%;}.hero-left-svg h1{max-width:none;}}

/* Submission confirmation artwork. Native dialog provides Escape and focus trapping. */
.confirmation-dialog { border:0; padding:0; background:transparent; width:min(900px, calc(100vw - 32px), calc((100dvh - 32px) * 1.29785)); max-width:none; max-height:calc(100dvh - 32px); overflow:hidden; border-radius:10%; }
.confirmation-dialog::backdrop { background:rgba(0,0,0,.65); }
.confirmation-art { position:relative; width:100%; }
.confirmation-art > img { display:block; width:100%; height:auto; }
.confirmation-close { position:absolute; left:90.4%; top:5.1%; width:7%; height:7%; padding:0; border:0; background:transparent; cursor:pointer; border-radius:50%; }
.confirmation-close:focus-visible { outline:3px solid #ec1c24; outline-offset:2px; }

.submit-button span { font-family:Arial,sans-serif; font-weight:800; font-size:clamp(14px,1.8vw,28px); text-align:left; }
@media(max-width:650px){.submit-button span { font-size:clamp(14px,4.5vw,20px); }}

/* Keep adjacent artwork flush, including fractional pixels on mobile screens. */
.hero-art { overflow:hidden; }
.hero-art img { max-width:none; width:calc(100% + 2px); height:calc(100% + 2px); margin:-1px; }
.zones { margin-top:-1px; }
@media(max-width:650px) {
  .hero-art { flex-shrink:0; aspect-ratio:1254 / 1296; }
  .hero-art img { position:absolute; inset:0; height:calc(100% + 2px); }
  .zones { min-height:0; gap:20px; padding-bottom:24px; }
  .map-art { margin:0; }
}