:root{--night:#446f72;--ink:#3b5c5d;--light:#f0e6cf;--gold:#d1ad78}.hero{height:1000px;min-height:900px;max-height:none;color:#304f50;background:#e7d6b7}.hero-art::after{background:linear-gradient(#dfe8d933,transparent)}.hero .city-art{width:100%;height:100%;left:0;object-fit:cover}.hero-copy{padding:170px 30px 100px;text-align:center;width:100%;max-width:1000px;margin:auto}.hero h1{font-size:clamp(5rem,8vw,8rem);letter-spacing:-.055em}.hero-title{max-width:600px;margin:auto;font-size:2.3rem}.guest-label{color:#3d6663}.hero-date{font-size:14px}.hero .open-button{background:#456f70;color:#fff1d4}.open-note{color:#577572}.topline{color:#f3ead5}.topline span{color:#e8d6b3}.scene-caption{color:#6b745b}.sand-date{position:absolute;bottom:140px;width:100%;text-align:center;font:italic 3.8rem Georgia;color:#967d5e;text-shadow:1px 2px #fff2cd;z-index:1}.tide{transform:translateY(-50px)}.opening .hero .tide{animation:wave-wash 3.6s ease-in-out both}.opening .sand-date{animation:rewrite 3.6s linear both}.opening .hero-art{animation:none}.entered .hero .tide{transform:translateY(-50px)}@keyframes wave-wash{0%{transform:translateY(-50px)}45%{transform:translateY(420px)}65%{transform:translateY(400px)}100%{transform:translateY(-50px)}}@keyframes rewrite{0%,25%{opacity:1;clip-path:inset(0)}35%,65%{opacity:0;clip-path:inset(0 100% 0 0)}70%{opacity:1;clip-path:inset(0 100% 0 0)}100%{opacity:1;clip-path:inset(0)}}.invitation{background:#f2e8d3}.river-line{opacity:.5}.river-line path{stroke:#6f9c9c}.shore-section{height:190svh;overflow:visible;background:#8fb3ac}.shore-stage{position:sticky;top:0;height:100svh;overflow:hidden}.shore-art{position:absolute;inset:0}.shore-art svg{width:100%;height:100%}.shore-art .tide{transform:translateY(calc(var(--tide,0)*390px - 60px))}.shore-copy{position:absolute;bottom:80px;left:9%;max-width:650px;background:#f4e8cae8;padding:35px;color:#426465}.shore-copy p{margin-top:25px}.portrait-section{background:#e1dfc8}.portrait-frame{padding:10px;border:1px solid #9aa492;border-radius:45% 45% 2px 2px;transform:rotate(calc(-3deg + var(--p,1)*3deg))}.portrait-inner{background:#afc3b6}.frame-shutter{background:#e9dcc0;border-color:#c8b794}.photo-caption{color:#718575}.countdown-section{background:#487a7c;color:#f4e9d1}.clock-orbit{border-color:#c7d2ba77}.clock-orbit span{background:#487a7c;color:#ead5aa}.clock-orbit::after{border-color:#dfd3ae66}.countdown strong{color:#f0dcb7}.event-day{color:#dbe3ce}.place-section{background:#e8dabb}.route-art svg{stroke:#84a7a0}.route-art .route{stroke:#4a7876}.programme-section{background:#eee8d4}.programme-section ol{border-color:#9fae91}.programme-section li::before{color:#769a90}.programme-section time{color:#69857b}.dress-section{background:#cfdbce}.dress-art i{color:#759a90}.rsvp-section{background:#f1e5ca}.rsvp-panel input:not([type=radio]):not([type=checkbox]),.rsvp-panel textarea{background:#fff6df;border-color:#a0ad94;color:#395e5d}.guests-section{background:#487372}.notes-section{background:#dce2cd}#guest-total,#guest-list small{color:#dfd8b6}footer{background:#345f61;color:#ebdebf}.music{background:#e5d6ae;color:#3b6c6c}
@media(max-width:700px){.hero{height:970px;min-height:970px}.hero-copy{padding:150px 25px 0}.hero h1{font-size:4.5rem;line-height:1.08;max-width:300px;margin:20px auto}.hero-title{font-size:1.9rem;max-width:300px}.hero-art .city-art{width:180%;left:-40%;opacity:1}.topline{font-size:11px;padding:24px 20px}.topline span{margin-left:4px}.sand-date{font-size:2.3rem;bottom:120px}.hero-date{margin-top:25px}.shore-copy{left:24px;right:24px;bottom:65px;padding:25px}.shore-copy h2{font-size:2.7rem}.shore-copy p{font-size:14px}.shore-art .city-art{width:200%;max-width:none;position:absolute;left:-50%}.portrait-frame{padding:9px}.photo-caption{font-size:1.1rem}.scene-caption{font-size:1rem;bottom:28px}@keyframes wave-wash{0%{transform:translateY(-50px)}45%{transform:translateY(500px)}65%{transform:translateY(480px)}100%{transform:translateY(-50px)}}}
@media(prefers-reduced-motion:reduce){.shore-section{height:100svh}.shore-stage{position:relative}.shore-art .tide{transform:translateY(120px)}.sand-date{opacity:1;clip-path:none}.frame-shutter{display:none}.hero .tide{transform:translateY(-50px)}}

@media(max-width:700px){.sand-date{bottom:205px}}