/* The portal and the typography form one visual sequence. */
:root{--display:Amiri,'Times New Roman',serif;--olive:#3c4831;--muted:#687256;--gold:#a38c54}
[hidden]{display:none!important}
.eyebrow{letter-spacing:0;font-size:12px;line-height:2}
.cover{perspective:1500px;transition:opacity .85s ease,visibility .85s;overflow:hidden;background:#f5ecd8}
.cover-art{animation:none;opacity:1!important;inset:0}
.cover-light{z-index:3;background:radial-gradient(ellipse at 50% 48%,#fff9e523,transparent 68%);pointer-events:none}
.portal-doors{position:absolute;inset:0;z-index:2;perspective:1500px;transform-style:preserve-3d}
.portal-door{position:absolute;top:0;bottom:0;width:50%;background-image:url('assets/ivory-portal.webp');background-size:200% 100%;backface-visibility:hidden;transition:transform 3.4s cubic-bezier(.25,.65,.2,1),filter 3.4s;will-change:transform}
.portal-door-right{right:0;background-position:right center;transform-origin:right center}
.portal-door-left{left:0;background-position:left center;transform-origin:left center}
.portal-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;z-index:3;pointer-events:none;transition:opacity .25s}
.cover-content{z-index:4;min-height:100%;padding:clamp(70px,15svh,160px) 34px clamp(65px,10svh,110px);justify-content:center;transition:opacity .5s ease,transform .9s ease;gap:0}
.cover-eyebrow{font-family:var(--serif);font-size:17px;color:#7b7257;margin-bottom:27px}
.cover-invitation{font-size:19px;color:#6e735a;line-height:1.8;margin-top:0}
.seal{width:114px;height:114px;margin-bottom:30px;background:radial-gradient(ellipse at 29% 20%,#e9dfbf,#c9b986 62%,#ad9b67);box-shadow:inset 0 0 0 1px #f3eacb,inset 0 0 0 5px #d2c396,inset 0 0 0 6px #e8d9ad,0 9px 30px #97845a26}
.seal-ring{inset:-8px;border-color:#bfa76f69}
.seal-letter.first{font-family:Ruqaa,serif;right:21px;top:10px;font-size:64px}
.seal-letter.second{font-family:Ruqaa,serif;left:27px;top:38px;font-size:49px}
.seal-spark{left:29px;top:19px}
.cover-names{font-family:var(--serif);font-size:clamp(49px,13.7vw,76px);line-height:1.7;font-weight:400;gap:18px;margin:14px 0 0;color:#3f4d34;text-shadow:0 1px 0 #fff5e6;white-space:nowrap;font-feature-settings:'rlig' 1,'calt' 1}
.cover-names i{font-size:24px;align-self:center;margin-top:9px}
.cover-line{font-size:23px;margin-top:-4px;margin-bottom:20px;line-height:1.8;color:#7d805e}
.cover-date{font-size:17px;letter-spacing:.16em;color:#8b7952}
.open-invitation{min-width:213px;min-height:52px;margin-top:31px;font-size:13px;background:linear-gradient(115deg,#7e8765,#4f5b3e);box-shadow:0 9px 24px #645b3725,inset 0 1px 0 #ffffff4a;border:1px solid #5f6841}
.cover-footnote{font-family:var(--serif);font-size:16px;margin-top:4px;color:#8c8269}
.portal-seam{position:absolute;z-index:4;top:0;bottom:0;left:50%;width:1px;background:linear-gradient(transparent,#f9e7b3,#fffdf0,#f3d8a0,transparent);box-shadow:0 0 18px 6px #fff7dc55;opacity:0;pointer-events:none}
.cinema-caption{position:absolute;z-index:5;top:43%;right:0;left:0;text-align:center;transform:translateY(-50%);color:#536042;opacity:0;pointer-events:none;text-shadow:0 2px 20px #fffce3cc}
.cinema-ornament{display:block;font-size:17px;color:#b3975b;margin-bottom:20px}
.cinema-vow{font-family:var(--serif);font-size:62px;line-height:1.6;font-weight:400}
.cinema-vow.second{font-size:45px;line-height:1.8;color:#78805f;margin-top:-6px}
.cinema-dedication{font-family:var(--serif);font-size:28px;line-height:2;margin-top:22px;color:#76815c}
.cinema-dedication i{font-size:18px;font-style:normal;color:#b49a61;margin:0 10px}
.cover.opening{visibility:visible;background:transparent;pointer-events:auto}
.cover.opening .cover-content{opacity:0;transform:translateY(-8px) scale(.96);pointer-events:none}
.cover.opening .cover-light{opacity:0}
.cover.opening .portal-seam{animation:seam-light 1.8s .1s both}
.cover.door-fallback .portal-door-right{transform:rotateY(-104deg);filter:brightness(.75)}
.cover.door-fallback .portal-door-left{transform:rotateY(104deg);filter:brightness(.75)}
.cover.door-fallback .cinema-caption{animation:cinema-caption-in 2.3s .8s both}
.cover.film-playing .portal-film{opacity:1}
.cover.film-playing .portal-doors{opacity:0;transition:opacity .3s .3s}
.cover.film-playing .cinema-caption{animation:cinema-caption-in 6s 3.5s both}
.cover.departing{opacity:0;pointer-events:none;visibility:hidden}
.site-shell{opacity:0;transition:opacity .6s}
.revealing .site-shell,.is-open .site-shell{opacity:1}
.hero-topline{font-size:24px;gap:20px}
.hero-intro{font-family:var(--serif);font-size:20px;line-height:1.9;margin-bottom:28px;color:#626d51}
.profession{font-size:12px;line-height:1.8;color:#6a7557}
.given-name,.groom .given-name{font-family:var(--serif);font-weight:400;font-size:103px;line-height:1.3;padding:0 0 4px;font-feature-settings:'rlig' 1,'calt' 1;text-shadow:0 2px 14px #fdf7e67d}
.family-name{font-family:var(--serif);font-size:28px;margin-top:-2px;line-height:1.2;color:#586548}
.union{height:27px;margin:9px 0 11px}
.hero-event{font-size:22px;margin-top:28px;line-height:1.6}
.hero-event b{font-size:12px;line-height:2;color:#72785f}
.is-open .hero-topline{animation:rise-in 1s .15s both}
.is-open .hero-intro{animation:rise-in 1.1s .3s both}
.is-open .hero-content{animation:none}
.is-open .groom{animation:rise-in 1.2s .45s both}
.is-open .union{animation:rise-in 1.1s .7s both}
.is-open .bride{animation:rise-in 1.2s .9s both}
.is-open .hero-event{animation:rise-in 1.1s 1.2s both}
.is-open .scroll-cue{animation:rise-in 1s 1.5s both}
.section-title{font-family:var(--serif);font-size:44px;font-weight:400;line-height:1.6}
.poem{font-family:var(--serif);font-size:43px;line-height:1.8}
.signature,.closing-names{font-family:var(--serif);font-size:41px;line-height:1.7}
.invitation-copy{font-size:19px;line-height:2.15}
.venue-name{font-family:var(--serif);font-size:44px;line-height:1.6}
.closing-title{font-family:var(--serif);font-size:45px;line-height:1.7}
.modal h2{font-family:var(--serif);font-size:40px;line-height:1.8;font-weight:400}
.floating-nav>button,.floating-nav>a{font-size:10px}
.date-side strong{font-size:24px}
@keyframes seam-light{0%{opacity:0;transform:scaleY(.05)}30%{opacity:.9}75%{opacity:1;transform:scaleY(1)}100%{opacity:0;transform:scaleY(1.1)}}
@keyframes cinema-caption-in{0%{opacity:0;filter:blur(8px);translate:0 14px}22%,88%{opacity:1;filter:blur(0);translate:0 0}100%{opacity:1;filter:blur(0);translate:0 -3px}}
@media(min-width:900px){.cover-content{padding-top:clamp(80px,14svh,150px);padding-bottom:clamp(60px,10svh,100px)}}
@media(max-width:560px){.cover-content{padding-inline:26px}.cover-names{font-size:57px;gap:14px}.cover-invitation{font-size:18px}.cover-eyebrow{font-size:16px}.cover-line{font-size:22px}.hero-content{padding-top:2px}.hero-intro{font-size:19px}.given-name,.groom .given-name{font-size:94px}.family-name{font-size:27px}.hero-event{font-size:21px}.section-title{font-size:42px}.cinema-vow{font-size:57px}.cinema-vow.second{font-size:41px}}
@media(max-width:375px){.cover-content{padding-inline:22px}.cover-names{font-size:49px;gap:11px}.cover-line{font-size:20px}.cover-eyebrow{font-size:14px}.seal{width:99px;height:99px;margin-bottom:24px}.seal-letter.first{font-size:58px;right:16px;top:5px}.seal-letter.second{font-size:44px;left:24px;top:33px}.given-name,.groom .given-name{font-size:84px}.hero-intro{font-size:18px}.hero-event{font-size:19px}.family-name{font-size:25px}.cinema-vow{font-size:50px}.cinema-vow.second{font-size:37px}}
@media(max-height:740px){.cover-content{padding-top:11svh;padding-bottom:8svh}.cover-eyebrow{margin-bottom:20px}.seal{width:90px;height:90px;margin-bottom:22px}.seal-letter.first{font-size:54px;right:15px;top:4px}.seal-letter.second{font-size:41px;left:21px;top:29px}.cover-names{font-size:50px}.cover-line{margin-bottom:14px}.open-invitation{margin-top:23px}}
@media(prefers-reduced-motion:reduce){.portal-film{display:none}.cover.opening .cinema-caption{display:none}.given-name{animation:none!important}.cover.departing{transition:none}}

/* Keep every line in document flow, including on short iPhone viewports. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.hero{display:block;height:auto;min-height:100svh;max-height:none;padding:150px 30px 145px}
.hero-content{padding:0;max-width:360px;margin:0 auto}
.hero-topline{position:static;inset:auto;display:flex;justify-content:center;align-items:center;font-size:23px;line-height:1.9;margin:0 auto 24px}
.hero-intro{font-family:var(--serif);font-size:19px;line-height:2.1;margin:0 0 30px}
.hero-intro>span{display:block}
.couple{gap:0}
.person{display:flex;flex-direction:column;align-items:center;min-width:0}
.profession{margin:0;font-size:12px;line-height:2.3}
.given-name,.groom .given-name{font-size:clamp(67px,21vw,94px);line-height:1.42;padding:14px 0 9px;margin:0;white-space:nowrap}
.family-name{font-size:27px;line-height:1.8;margin:0}
.union{height:auto;min-height:32px;margin:12px auto 15px;line-height:1.8}
.hero-event{font-size:21px;line-height:1.9;margin:29px 0 0;gap:3px}
.hero-event b{font-size:12px;line-height:2.1}
.scroll-cue{position:static;inset:auto;margin:35px auto 0;font-size:10px;line-height:2}
.song-modal{border-radius:22px;padding-top:64px}
.song-modal iframe{display:block;width:100%;height:190px;border:0;border-radius:10px;background:#f1eee1;margin:22px 0 16px}
@media(max-width:375px){.hero{padding-inline:23px;padding-top:137px}.hero-intro{font-size:18px}.hero-topline{font-size:22px;margin-bottom:22px}.family-name{font-size:26px}.hero-event{font-size:20px}}