:root{--ink:#090807;--gold:#d8b779;--gold2:#f0d9a9;--ivory:#f3ebde;--muted:#a99d8c;--line:rgba(216,183,121,.25)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--ink);color:var(--ivory);font-family:'Cairo',sans-serif;overflow-x:hidden}button,a{font:inherit}button{color:inherit}.grain{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E")}.progress{position:fixed;z-index:20;top:0;left:0;right:0;height:2px;background:transparent}.progress i{display:block;width:0;height:100%;background:var(--gold);box-shadow:0 0 12px var(--gold);transition:width .15s}.gate{height:100svh;min-height:650px;position:relative;overflow:hidden;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 75%,#382518 0,#16100d 25%,#090807 67%)}.gate:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2),transparent 50%,#090807)}.gate-glow{position:absolute;width:70vw;height:70vw;border-radius:50%;background:#a46d31;filter:blur(100px);opacity:.08;animation:glow 8s ease-in-out infinite alternate}.gate-copy{z-index:2;text-align:center;padding:28px;transition:opacity .8s,transform .8s}.gate-copy.out{opacity:0;transform:scale(1.06);pointer-events:none}.eyebrow{color:var(--gold);letter-spacing:.16em;font-size:.75rem;font-weight:500}.gate h1{font:400 clamp(2.7rem,8vw,6.2rem)/1.22 'Amiri',serif;margin:34px 0 16px}.gate h1 em,.hero h2 em{font-style:normal;color:var(--gold2)}.gate-sub{color:#c0b6a8;font-weight:300}.gold-button,.outline-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:14px 28px;text-decoration:none;border:1px solid var(--gold);color:var(--ink);background:linear-gradient(135deg,#f0d9a9,#c59a55);border-radius:2px;cursor:pointer;transition:transform .25s,box-shadow .25s}.gold-button:hover,.outline-button:hover{transform:translateY(-2px);box-shadow:0 8px 30px #c69e5833}.gate .gold-button{margin-top:24px;min-width:220px;animation:buttonGlow 2.4s infinite}.gold-button span{font-size:1.2em}.sound-note{font-size:.72rem;color:#8c8172;margin-top:14px}#sparks{position:absolute;inset:0;width:100%;height:100%;z-index:1}.entrance{position:absolute;inset:0;z-index:4;display:grid;place-items:center;visibility:hidden;opacity:0;background:radial-gradient(ellipse at center,#302015,#090807 63%)}.entrance.active{visibility:visible;animation:reveal .9s forwards}.spotlight{position:absolute;width:10vw;height:140vh;top:-20vh;left:50%;transform:translateX(-50%) rotate(4deg);background:linear-gradient(90deg,transparent,#e8bd6940,transparent);filter:blur(16px);animation:spot 3.6s ease-in-out infinite alternate}.curtain{position:absolute;top:0;bottom:0;width:50%;z-index:2;background:repeating-linear-gradient(90deg,#170e0c 0,#281810 5%,#130c0a 11%);box-shadow:inset 0 0 40px #000}.curtain-a{left:0;transform-origin:left;animation:curtainA 4s 1s cubic-bezier(.7,0,.2,1) forwards}.curtain-b{right:0;transform-origin:right;animation:curtainB 4s 1s cubic-bezier(.7,0,.2,1) forwards}.entrance-title{z-index:3;text-align:center;display:flex;flex-direction:column;gap:12px;opacity:0;animation:titleIn 1.2s 3.1s forwards}.entrance-title span{color:var(--gold);letter-spacing:.4em}.entrance-title strong{font:700 clamp(3rem,10vw,8rem)/1.2 'Amiri',serif;text-shadow:0 0 35px #e9c47755}.entrance-title small{letter-spacing:.4em;color:var(--gold2)}.floor-light{position:absolute;bottom:-10vh;height:30vh;width:90vw;background:radial-gradient(ellipse,#d4a35425,transparent 68%)}.enter-caption{position:absolute;bottom:5vh;color:#e0c58e;z-index:3;font-size:.8rem;opacity:0;animation:titleIn 1s 5s forwards}.confetti{position:absolute;inset:0;z-index:3;pointer-events:none}.confetti b{position:absolute;top:-10px;width:4px;height:10px;background:var(--gold);animation:fall 4s linear infinite}.hidden{display:none!important}.hero{min-height:100svh;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;background:#14100c url('assets/couple-02.jpeg') center 32%/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,#09080755,#09080782 45%,#090807 100%),linear-gradient(90deg,#09080770,transparent,#09080770)}.hero-content{position:relative;padding:30px;max-width:800px}.monogram{font:400 clamp(2.5rem,8vw,5.5rem) 'Amiri',serif;margin:22px 0}.monogram span{font-size:.38em;color:var(--gold);padding:0 15px}.hero h2{font:400 clamp(2.3rem,6vw,4.7rem)/1.35 'Amiri',serif}.hero-date{color:var(--gold2);letter-spacing:.1em}.scroll-cue{display:grid;gap:9px;color:#dfd1ba;text-decoration:none;margin-top:58px;font-size:.8rem}.scroll-cue b{font-size:1.4rem;font-weight:300}.hero-index{position:absolute;left:28px;bottom:28px;color:var(--gold);font-size:.7rem;letter-spacing:.15em}.section{padding:clamp(80px,13vw,160px) clamp(20px,7vw,100px)}.section-head{text-align:center;max-width:650px;margin:0 auto 60px}.section-head h2,.invite-card h2{font:400 clamp(2.2rem,5vw,4rem) 'Amiri',serif;margin:10px 0}.section-head>p:not(.eyebrow){color:#b4a99a;line-height:2}.ornament{color:var(--gold)}.gallery{max-width:1040px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.photo{margin:0;position:relative;overflow:hidden;background:#19140f;border:1px solid var(--line);padding:8px}.photo img{display:block;width:100%;height:100%;object-fit:cover;max-height:720px;transition:transform 1.1s cubic-bezier(.2,.7,.1,1);filter:saturate(.84)}.photo:hover img{transform:scale(1.025)}.photo-tall{grid-row:span 2;height:660px}.photo-wide{height:400px}.photo-mid{height:440px}.photo figcaption{position:absolute;bottom:8px;right:8px;left:8px;padding:38px 18px 15px;background:linear-gradient(transparent,#090807c9);font:1.2rem 'Amiri',serif}.story-note{text-align:center;color:var(--gold2);font:1.35rem/2 'Amiri',serif;margin:64px auto 0;max-width:760px}.invite{background:radial-gradient(ellipse at 50% 50%,#231a10,#090807 70%)}.invite-card{max-width:760px;margin:auto;border:1px solid var(--line);padding:clamp(32px,8vw,80px);text-align:center;background:linear-gradient(145deg,#16120d,#0c0a08);box-shadow:0 30px 100px #0008;position:relative}.invite-card:before{content:'✦';position:absolute;top:-14px;left:calc(50% - 14px);background:#100d09;color:var(--gold);padding:0 10px}.invite-text{color:#bfb4a4;line-height:2.1;max-width:510px;margin:16px auto 34px}.date-block{border-block:1px solid var(--line);padding:24px;display:grid;gap:4px;justify-items:center;color:var(--gold2)}.date-block strong{font:400 5rem 'Amiri',serif;color:var(--ivory);line-height:1}.time-place{display:flex;justify-content:center;gap:clamp(24px,7vw,90px);padding:28px 0}.time-place div{display:grid;gap:8px}.time-place small{color:var(--gold);font-size:.75rem}.time-place b{font-weight:500}.countdown{display:flex;justify-content:center;gap:clamp(12px,4vw,34px);margin:12px 0 32px}.countdown div{display:grid;gap:3px;min-width:60px}.countdown b{font:400 2rem 'Amiri',serif;color:var(--gold2)}.countdown span{font-size:.72rem;color:#a99e8d}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.outline-button{background:transparent;color:var(--gold2)}.gift{min-height:560px;text-align:center;background:radial-gradient(ellipse at 50% 70%,#332414,#090807 57%);overflow:hidden}.gift .section-head{margin-bottom:38px}.gift-box{position:relative;width:180px;height:140px;border:0;background:linear-gradient(135deg,#382717,#120e0b);border-bottom:5px solid #8e6b36;cursor:pointer;box-shadow:0 20px 50px #0009;transition:transform .4s}.gift-box:hover{transform:translateY(-5px)}.gift-box:before{content:'';position:absolute;top:-23px;left:-9px;width:198px;height:34px;background:linear-gradient(120deg,#d7b573,#8f6a32);border:1px solid #f0d9a988}.lid{position:absolute;top:-34px;left:-10px;width:200px;height:32px;background:linear-gradient(120deg,#dfc183,#a47d42);transform-origin:10% 100%;transition:transform .8s cubic-bezier(.2,.7,.2,1)}.ribbon{position:absolute;left:calc(50% - 10px);top:-33px;bottom:0;width:20px;background:linear-gradient(90deg,#a9803d,#f0d69c,#a9803d)}.box-mark{position:absolute;inset:40px 0 auto;color:var(--gold2);font-size:1.5rem}.open-label{position:absolute;top:160px;left:0;right:0;white-space:nowrap;color:#c9b89b;font-size:.8rem}.gift-box.open .lid{transform:rotate(-28deg) translate(-20px,-30px)}.gift-box.open{animation:boxGlow 1s}.gift-details{margin:72px auto 0;max-width:450px;padding:20px;border:1px solid var(--line);background:#110e0b;animation:rise .8s both}.gift-details p{color:var(--gold2)}.gift-details small{color:#a99e8d}.closing{min-height:580px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(ellipse at center,#21180f,#090807 65%);border-top:1px solid #ffffff08}.closing-star{color:var(--gold);font-size:1.5rem}.closing>p{font:1.4rem/2 'Amiri',serif;color:#e2d5c1}.signature{margin-top:36px;display:grid;gap:7px;direction:ltr}.signature small{color:#a99d8c;font-size:.7rem;letter-spacing:.08em}.signature strong{font-weight:500;color:var(--gold2);letter-spacing:.06em}footer{padding:22px clamp(18px,6vw,80px);border-top:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;color:#a99d8c;font-size:.78rem}footer>div{display:flex;gap:18px;align-items:center}footer button,footer a{border:0;background:none;color:#d5c5a8;text-decoration:none;cursor:pointer}#toTop{font-size:1.4rem}footer button span{font-size:.75rem}.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s,transform .9s}.reveal.visible{opacity:1;transform:none}@keyframes glow{to{transform:translate(12vw,-8vh) scale(1.2);opacity:.15}}@keyframes buttonGlow{50%{box-shadow:0 0 25px #d8b77944}}@keyframes reveal{to{opacity:1}}@keyframes spot{to{transform:translateX(-50%) rotate(-5deg);opacity:.45}}@keyframes curtainA{to{transform:scaleX(0)}}@keyframes curtainB{to{transform:scaleX(0)}}@keyframes titleIn{to{opacity:1;transform:translateY(0)}}@keyframes fall{to{transform:translateY(110vh) rotate(560deg)}}@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes boxGlow{50%{box-shadow:0 0 55px #d8b77977}}@media(max-width:680px){.gate{min-height:590px}.gate h1{margin-top:26px}.hero{background-position:52% center}.gallery{grid-template-columns:1fr;gap:16px}.photo-tall,.photo-wide,.photo-mid{height:auto;grid-row:auto}.photo img{height:auto;max-height:none;object-fit:contain}.photo-wide img{aspect-ratio:4/3}.photo-mid img{aspect-ratio:3/4}.photo-tall img{aspect-ratio:4/5}.photo figcaption{font-size:1.05rem}.section{padding:84px 20px}.section-head{margin-bottom:38px}.time-place{gap:20px}.time-place b{font-size:.85rem}.invite-card{padding:38px 18px}.countdown div{min-width:50px}.countdown b{font-size:1.6rem}footer{gap:12px;flex-direction:column}footer>div{gap:14px}.closing{min-height:500px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
 .wallet-number{display:block;margin:12px auto 20px;font:600 1.35rem/1.5 'Cairo',sans-serif;letter-spacing:.08em;color:var(--ivory)}.wallet-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-bottom:12px}.wallet-actions .outline-button{font-size:.85rem;padding:10px 18px}.gift-details strong{color:var(--ivory)}#copyStatus{display:block;min-height:1.5em;margin-top:10px;color:var(--gold2)}
.film-intro{position:absolute;inset:0;z-index:5;display:grid;place-items:center;overflow:hidden;visibility:hidden;opacity:0;background:radial-gradient(ellipse at 50% 58%,#322216,#0a0807 66%);transition:opacity .9s,visibility .9s;--intro-duration:12s}
.film-intro:before{content:'';position:absolute;z-index:1;inset:-4%;background:linear-gradient(180deg,#08070630,#08070688);filter:blur(3px);opacity:.35;transform:scale(1.05);animation:filmDrift 12s ease-in-out infinite alternate}
.film-intro:after{content:'';position:absolute;inset:20px;border:1px solid #d8b7793d;pointer-events:none}
.film-intro.active{visibility:visible;opacity:1}.film-beam{position:absolute;inset:-30% auto -30% 20%;width:30%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,#e4bb6e12,transparent);filter:blur(20px);animation:filmBeam 5s ease-in-out infinite alternate}
.film-grain{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff1 4px,transparent 5px);opacity:.11;mix-blend-mode:screen;pointer-events:none}
.film-copy{z-index:3;text-align:center;padding:28px;max-width:780px;transform:translateY(-3vh)}.film-copy .eyebrow{letter-spacing:.25em}.film-line{font:400 clamp(2.2rem,7vw,5.4rem)/1.35 'Amiri',serif;color:var(--ivory);text-shadow:0 8px 28px #000;min-height:1.5em;margin:20px 0 12px;opacity:1;transition:opacity .6s,transform .6s}.film-line.changing{opacity:0;transform:translateY(12px)}.film-subline{color:var(--gold2);letter-spacing:.1em;font-size:.83rem}
.film-bottom{position:absolute;z-index:4;left:clamp(28px,8vw,120px);right:clamp(28px,8vw,120px);bottom:clamp(42px,8vh,84px);display:grid;gap:13px;text-align:center;color:#d7c7a9;font-size:.78rem;letter-spacing:.07em}.film-progress{height:2px;background:#fff2;overflow:hidden}.film-progress i{display:block;width:0;height:100%;background:var(--gold2);box-shadow:0 0 14px var(--gold);transition:width .25s linear}
.film-door{position:absolute;z-index:2;top:0;bottom:0;width:51%;background:repeating-linear-gradient(90deg,rgba(17,11,9,.88) 0 7%,rgba(38,23,15,.88) 10%,rgba(20,12,9,.88) 18%);box-shadow:inset 0 0 70px #000;animation:none}.film-door-left{left:0;transform-origin:left}.film-door-right{right:0;transform-origin:right}.film-intro.active .film-door{animation:filmDoor var(--intro-duration) cubic-bezier(.64,0,.36,1) forwards}
.gate{transition:opacity 1.2s,transform 1.2s}.gate.gate-open{opacity:0;transform:scale(1.025);pointer-events:none}.invitation.site-opening{animation:siteReveal 1.2s both}
@keyframes filmDrift{to{transform:scale(1.12) translateY(-1.5%)}}@keyframes filmBeam{to{transform:translateX(45vw) rotate(18deg);opacity:.35}}@keyframes filmDoor{0%,28%{transform:scaleX(1)}100%{transform:scaleX(0)}}@keyframes siteReveal{from{opacity:0;filter:brightness(.55);transform:scale(1.015)}to{opacity:1;filter:brightness(1);transform:none}}
@media(prefers-reduced-motion:reduce){.film-intro:before,.film-beam,.film-door,.film-image{animation:none!important}.gate.gate-open,.invitation.site-opening{transition:none!important;animation:none!important}}
.film-image{position:absolute;z-index:1;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 38%;filter:saturate(.58) brightness(.68);opacity:.48;transform:scale(1.05);transition:opacity .8s,transform 8s}.film-image.changing{opacity:.08}.film-intro.active .film-image{animation:filmImagePush 9s ease-in-out infinite alternate}@keyframes filmImagePush{to{transform:scale(1.13) translateY(-1.2%)}}
.film-door{background:repeating-linear-gradient(90deg,rgba(17,11,9,.73) 0 7%,rgba(38,23,15,.73) 10%,rgba(20,12,9,.73) 18%)}
/* Names remain centralized in invitation-data.js; image files use short deploy-safe names. */
/* A quieter, more refined first impression before the cinematic entrance. */
.gate{background:linear-gradient(180deg,rgba(8,7,6,.46),rgba(8,7,6,.72) 48%,#090807 100%),url('assets/couple-03.jpeg') center 38%/cover no-repeat;}
.gate:after{background:linear-gradient(180deg,rgba(5,4,4,.12),rgba(7,6,5,.32) 42%,#090807 100%);}
.gate-glow{width:min(72vw,760px);height:min(72vw,760px);background:#d1a663;opacity:.12;filter:blur(120px);}
.gate-copy{width:min(680px,calc(100% - 40px));padding:clamp(32px,6vw,68px) clamp(22px,6vw,64px);border:1px solid rgba(230,199,143,.42);background:linear-gradient(145deg,rgba(20,16,12,.66),rgba(10,9,8,.56));backdrop-filter:blur(10px);box-shadow:0 24px 90px rgba(0,0,0,.35),inset 0 0 0 7px rgba(240,217,169,.045);position:relative;}
.gate-copy:before,.gate-copy:after{content:'✦';position:absolute;left:50%;transform:translateX(-50%);color:var(--gold);background:#15110d;padding:0 12px;font-size:.9rem;}
.gate-copy:before{top:-12px}.gate-copy:after{bottom:-12px}
.gate-copy .eyebrow{letter-spacing:.22em;color:#e0c48e;}
.gate h1{font-size:clamp(2.6rem,7vw,5.7rem);line-height:1.3;margin:28px 0 12px;text-shadow:0 3px 25px #000;}
.gate h1 em{color:#f0d9a9;}
.gate-sub{color:#e0d6c8;font-size:clamp(.9rem,2vw,1.08rem);}
.gate .gold-button{margin-top:30px;min-width:230px;border-radius:999px;box-shadow:0 7px 28px rgba(216,183,121,.16);}
.sound-note{color:#c2b6a4;margin-top:18px;}
@media(max-width:680px){.gate{background-position:center 34%;}.gate-copy{width:calc(100% - 32px);padding:38px 20px 34px;}.gate h1{margin:24px 0 12px;}}
/* Arrival vignette: a calm, legible sequence leading into the invitation card. */
.arrival-scene{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,rgba(5,5,5,.08) 0%,rgba(5,5,5,.1) 52%,rgba(5,5,5,.72) 100%);}
.arrival-horizon{position:absolute;left:0;right:0;bottom:14%;height:1px;background:linear-gradient(90deg,transparent,#ddbd7d66 35%,#ddbd7d66 65%,transparent);box-shadow:0 0 30px #d8b77933;}
.arrival-car{position:absolute;width:clamp(220px,34vw,390px);right:-40%;bottom:13%;filter:drop-shadow(0 14px 20px #000b);animation:carArrives 6.8s cubic-bezier(.22,.8,.25,1) both;}
.arrival-person{position:absolute;right:27%;bottom:14%;width:44px;height:165px;opacity:0;filter:drop-shadow(0 4px 8px #0009);animation:personArrives 6.8s ease-in-out both;}
.person-head{position:absolute;top:0;left:11px;width:24px;height:27px;border-radius:48% 48% 44% 44%;background:linear-gradient(120deg,#b99572,#493b30);}
.person-body{position:absolute;top:27px;left:5px;width:36px;height:74px;border-radius:16px 16px 6px 6px;background:linear-gradient(90deg,#101415,#333a3b 55%,#15191a);}
.person-arm{position:absolute;z-index:1;top:36px;left:32px;width:10px;height:57px;border-radius:8px;background:#55483b;transform:rotate(-27deg);transform-origin:top;animation:bagDrop 6.8s ease-in-out both;}
.person-leg{position:absolute;top:94px;left:10px;width:12px;height:65px;border-radius:8px;background:#131719;transform-origin:top;}
.leg-one{animation:walkOne 6.8s ease-in-out both}.leg-two{left:24px;animation:walkTwo 6.8s ease-in-out both}
.person-wink{position:absolute;z-index:2;top:13px;left:25px;width:5px;height:2px;background:#17130f;opacity:0;animation:wink 6.8s ease-in-out both;}
.arrival-suitcase{position:absolute;left:50%;bottom:13.5%;width:94px;height:60px;transform:translateX(-50%) scale(.7);opacity:0;border:1px solid #d4ae70;border-radius:8px 8px 12px 12px;background:linear-gradient(135deg,#5c4026,#20170f 70%);box-shadow:0 10px 25px #000b;animation:suitcaseAppears 6.8s ease-out both;}
.arrival-suitcase i{position:absolute;left:30px;top:-12px;width:32px;height:13px;border:2px solid #c8a367;border-bottom:0;border-radius:8px 8px 0 0;}
.arrival-suitcase b{position:absolute;inset:18px 0 auto;text-align:center;font-size:16px;color:#e3c58e;font-weight:400;}
.arrival-caption{position:absolute;left:0;right:0;bottom:5%;margin:0;text-align:center;color:#d8c7a9;font:1.1rem 'Amiri',serif;letter-spacing:.06em;opacity:0;animation:captionAppears 6.8s ease both;}
.gate-copy{z-index:3;opacity:0;transform:translateY(48px) scale(.92);animation:invitationFromCase 6.8s cubic-bezier(.18,.75,.25,1) both;}
@keyframes carArrives{0%{right:-40%;opacity:0}8%{opacity:1}34%{right:68%}72%{right:68%;opacity:1}84%{right:68%;opacity:0}100%{right:68%;opacity:0}}
@keyframes personArrives{0%,25%{opacity:0;right:27%;transform:translateX(85px)}34%{opacity:1;right:27%;transform:translateX(85px)}49%{opacity:1;right:48%;transform:translateX(0)}55%{opacity:1;right:48%;transform:translateX(0)}75%{opacity:1;right:64%;transform:translateX(-20px)}83%,100%{opacity:0;right:64%;transform:translateX(-55px)}}
@keyframes bagDrop{0%,44%{transform:rotate(-27deg)}49%{transform:rotate(34deg)}56%,100%{transform:rotate(0)}}
@keyframes walkOne{0%,34%,54%{transform:rotate(0)}42%,50%{transform:rotate(22deg)}64%,72%{transform:rotate(-19deg)}80%,100%{transform:rotate(0)}}
@keyframes walkTwo{0%,34%,54%{transform:rotate(0)}42%,50%{transform:rotate(-19deg)}64%,72%{transform:rotate(22deg)}80%,100%{transform:rotate(0)}}
@keyframes wink{0%,46%,49%,100%{opacity:0}47.5%{opacity:1}}
@keyframes suitcaseAppears{0%,42%{opacity:0;transform:translateX(-50%) scale(.7)}49%{opacity:1;transform:translateX(-50%) scale(1.04)}54%,78%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%) scale(.9)}}
@keyframes captionAppears{0%,52%{opacity:0;transform:translateY(8px)}61%,83%{opacity:1;transform:none}100%{opacity:0}}
@keyframes invitationFromCase{0%,54%{opacity:0;transform:translateY(48px) scale(.92)}70%{opacity:1;transform:translateY(-8px) scale(1.015)}82%,100%{opacity:1;transform:none}}
@media(max-width:680px){.arrival-car{width:250px;bottom:13%;}.arrival-person{right:15%;transform:scale(.83);transform-origin:bottom center;}.arrival-suitcase{bottom:13.5%;}.arrival-caption{bottom:5%;font-size:1rem}.gate-copy{width:calc(100% - 32px);}}
@media(prefers-reduced-motion:reduce){.arrival-scene{display:none}.gate-copy{opacity:1;transform:none;animation:none}}
/* Reveal the requested couple hero immediately when the spoken audio countdown ends. */
.gate{transition:opacity .45s,transform .45s;}
.invitation.site-opening{animation-duration:.45s;}
@media(prefers-reduced-motion:reduce){.gate.gate-open,.invitation.site-opening{transition:none!important;animation:none!important}}
.sound-note{display:flex;align-items:center;justify-content:center;gap:10px;color:#e0d2bb;font:1rem 'Amiri',serif;letter-spacing:.02em;}
.sound-note span{color:var(--gold);font:1rem 'Cairo',sans-serif;text-shadow:0 0 14px #d8b77988;}
.hero{isolation:isolate;}
.hero.curtains-open:before,.hero.curtains-open:after{content:'';position:absolute;z-index:4;top:0;bottom:0;width:51%;pointer-events:none;background:repeating-linear-gradient(90deg,#100b09 0 6%,#261811 9%,#140e0b 17%);box-shadow:inset 0 0 55px #000b;}
.hero.curtains-open:before{left:0;border-right:1px solid #d8b77966;animation:heroCurtainLeft .65s cubic-bezier(.65,0,.35,1) both;}
.hero.curtains-open:after{right:0;border-left:1px solid #d8b77966;animation:heroCurtainRight .65s cubic-bezier(.65,0,.35,1) both;}
@keyframes heroCurtainLeft{to{transform:translateX(-105%);opacity:.35}}
@keyframes heroCurtainRight{to{transform:translateX(105%);opacity:.35}}
@media(prefers-reduced-motion:reduce){.hero.curtains-open:before,.hero.curtains-open:after{display:none}}
/* A richer, dimensional keepsake box with a satin gold bow. */
.gift-box{width:190px;height:138px;border:1px solid #9e773e;border-bottom:7px solid #2a0d13;border-radius:4px 4px 9px 9px;background:linear-gradient(90deg,transparent 43%,#805628 43.5%,#f0d79e 48%,#b88c4f 52%,#774d25 56%,transparent 56.5%),linear-gradient(145deg,#7b2937 0%,#571824 42%,#351019 100%);box-shadow:inset 0 2px 5px #f3d8a333,inset 0 -15px 20px #19070b88,0 24px 32px #0009,0 5px 0 #17090b;transform:perspective(500px) rotateX(-3deg);}
.gift-box:before{top:-24px;left:-11px;width:210px;height:34px;border:1px solid #f1d69a;background:linear-gradient(180deg,#f1d79f 0%,#c49a5c 25%,#e8c982 50%,#9a7139 100%);box-shadow:0 4px 8px #0007,inset 0 1px 2px #fff8;}
.gift-box:after{content:'';position:absolute;inset:10px 8px 8px;border:1px solid #e7c77c55;border-radius:2px;pointer-events:none;}
.gift-box .lid{top:-36px;left:-11px;width:210px;height:32px;border:1px solid #f2dda8;border-radius:3px;background:linear-gradient(180deg,#6c2430,#4a141f 65%,#2d0d14);box-shadow:0 3px 8px #0008,inset 0 1px 2px #fff3;}
.gift-box .ribbon{z-index:1;left:calc(50% - 10px);top:-34px;bottom:0;width:20px;background:linear-gradient(90deg,#9d7138,#f4dba1 35%,#cfaa69 68%,#8c612e);box-shadow:0 0 8px #e2c27a33;}
.gift-box .ribbon:before,.gift-box .ribbon:after{content:'';position:absolute;top:-15px;width:31px;height:21px;border:4px solid #e4c47e;border-radius:70% 70% 18% 70%;background:linear-gradient(135deg,#f4dda5,#a77a3b);box-shadow:0 2px 4px #0007;}
.gift-box .ribbon:before{left:-23px;transform:rotate(28deg)}.gift-box .ribbon:after{right:-23px;transform:scaleX(-1) rotate(28deg)}
.gift-box .box-mark{z-index:2;inset:45px 0 auto;color:#f2d99f;text-shadow:0 1px 5px #2b0b10;font-size:1.15rem;}
.gift-box.open{transform:perspective(500px) rotateX(-3deg) translateY(-4px);}
.gift-box.open .lid{transform:rotate(-24deg) translate(-20px,-26px);}
/* The driver stays in the vehicle: a quick toss, departure, then the invitation rises from the case. */
.arrival-person{display:none!important}
.arrival-car{right:-40%;animation:carArrives 6.8s ease-in-out both;}
.arrival-driver .driver-arm{stroke-dasharray:66;stroke-dashoffset:66;transform-origin:203px 45px;animation:driverToss 6.8s ease-in-out both;}
.arrival-suitcase{left:72%;bottom:22%;transform:translateX(-50%) scale(.72) rotate(-16deg);animation:suitcaseToss 6.8s cubic-bezier(.22,.75,.35,1) both;}
.gate-copy{animation:invitationFromCase 6.8s cubic-bezier(.18,.75,.25,1) both;}
@keyframes carArrives{0%{right:-40%;opacity:0}8%{opacity:1}28%{right:36%;opacity:1}47%{right:36%;opacity:1}50%{right:36%;opacity:1}83%{right:-40%;opacity:1}94%,100%{right:-40%;opacity:0}}
@keyframes driverToss{0%,36%{stroke-dashoffset:66;transform:rotate(0)}42%{stroke-dashoffset:0;transform:rotate(-7deg)}48%,100%{stroke-dashoffset:0;transform:rotate(0)}}
@keyframes suitcaseToss{0%,36%{left:72%;bottom:22%;opacity:0;transform:translateX(-50%) scale(.72) rotate(-16deg)}41%{left:68%;bottom:27%;opacity:1;transform:translateX(-50%) scale(1.02) rotate(12deg)}47%{left:58%;bottom:20%;opacity:1;transform:translateX(-50%) scale(1) rotate(-7deg)}53%{left:51%;bottom:13.5%;opacity:1;transform:translateX(-50%) scale(.96) rotate(3deg)}58%,84%{left:50%;bottom:13.5%;opacity:1;transform:translateX(-50%) scale(1) rotate(0)}100%{left:50%;bottom:13.5%;opacity:0;transform:translateX(-50%) scale(.94) rotate(0)}}
@keyframes captionAppears{0%,54%{opacity:0;transform:translateY(8px)}62%,82%{opacity:1;transform:none}100%{opacity:0}}
@keyframes invitationFromCase{0%,78%{opacity:0;transform:translateY(58px) scale(.9)}92%{opacity:1;transform:translateY(-7px) scale(1.012)}100%{opacity:1;transform:none}}
@media(max-width:680px){.arrival-car{width:250px}.arrival-suitcase{bottom:13.5%}}
/* Keep the final reveal smooth on small screens: finish the overlay first and animate only the curtains. */
@media(max-width:680px){
  .invitation.site-opening{animation:mobileSiteReveal .35s ease-out both;filter:none;transform:none}
  .hero.curtains-open:before,.hero.curtains-open:after{width:50%;will-change:transform,opacity;backface-visibility:hidden;box-shadow:none}
  .hero.curtains-open:before{animation:mobileHeroCurtainLeft .75s cubic-bezier(.22,.7,.25,1) both}
  .hero.curtains-open:after{animation:mobileHeroCurtainRight .75s cubic-bezier(.22,.7,.25,1) both}
  .moment-reveal{height:100vh;height:100svh;height:100dvh}
}
@keyframes mobileHeroCurtainLeft{to{transform:translate3d(-102%,0,0);opacity:0;visibility:hidden}}
@keyframes mobileHeroCurtainRight{to{transform:translate3d(102%,0,0);opacity:0;visibility:hidden}}
@keyframes mobileSiteReveal{from{opacity:0}to{opacity:1}}
/* One brief celebratory reveal after the final spoken count. */
.moment-reveal{position:fixed;inset:0;z-index:30;display:grid;place-items:center;overflow:hidden;pointer-events:none;visibility:hidden;opacity:0;background:radial-gradient(ellipse at center,rgba(52,35,20,.72),rgba(7,6,5,.42) 62%,rgba(7,6,5,.18));}
.moment-reveal.active{visibility:visible;animation:momentScene 1.5s cubic-bezier(.18,.7,.25,1) both;}
.moment-burst{position:absolute;left:50%;top:50%;width:min(68vmin,520px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(.05);background:radial-gradient(circle,rgba(244,213,151,.38) 0,rgba(223,177,94,.18) 18%,rgba(223,177,94,.04) 43%,transparent 70%);box-shadow:0 0 80px rgba(220,179,105,.18);}
.moment-reveal.active .moment-burst{animation:burstBloom 1.35s cubic-bezier(.12,.72,.2,1) both;}
.moment-card{position:relative;display:grid;justify-items:center;gap:8px;padding:28px clamp(28px,7vw,70px);border:1px solid rgba(232,202,148,.65);background:linear-gradient(145deg,rgba(20,16,12,.76),rgba(11,9,7,.69));box-shadow:0 12px 70px #0008,inset 0 0 0 6px rgba(240,217,169,.04);text-align:center;opacity:0;transform:translateY(18px) scale(.86);}
.moment-reveal.active .moment-card{animation:momentCard .95s .12s cubic-bezier(.18,.75,.25,1) both;}
.moment-star{color:#f2d69f;font-size:1.2rem;text-shadow:0 0 24px #f1d69d;}
.moment-card p{margin:0;color:#e7d3ad;font:1rem 'Amiri',serif;letter-spacing:.08em;}
.moment-card strong{color:#fff1d2;font:400 clamp(2.6rem,8vw,5.2rem)/1.12 'Amiri',serif;text-shadow:0 0 36px #d7ad66aa;}
.moment-card small{color:#e3d7c4;font:1rem 'Cairo',sans-serif;}
.moment-particles{position:absolute;left:50%;top:50%;width:0;height:0;}
.moment-particles i{position:absolute;left:-5px;top:-5px;color:#f5dda6;font-style:normal;font-size:clamp(10px,1.5vw,17px);opacity:0;text-shadow:0 0 12px #f0ca78;}
.moment-particles i:before{content:'✦';}
.moment-reveal.active .moment-particles i{animation:scatterSpark .9s var(--delay) cubic-bezier(.12,.7,.25,1) both;}
@keyframes momentScene{0%{opacity:0}12%,66%{opacity:1}100%{opacity:0;visibility:hidden}}
@keyframes burstBloom{0%{transform:translate(-50%,-50%) scale(.05);opacity:.2}65%{transform:translate(-50%,-50%) scale(1.08);opacity:1}100%{transform:translate(-50%,-50%) scale(1.35);opacity:.1}}
@keyframes momentCard{0%{opacity:0;transform:translateY(18px) scale(.86)}28%,74%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-9px) scale(1.025)}}
@keyframes scatterSpark{0%{opacity:0;transform:rotate(var(--angle)) translateY(0) scale(.2)}24%{opacity:1}100%{opacity:0;transform:rotate(var(--angle)) translateY(-min(35vh,260px)) scale(1.1)}}
@media(max-width:680px){.moment-card{width:calc(100% - 36px);padding:25px 14px}.moment-card p,.moment-card small{font-size:.9rem}}
.gift .section-head>p:last-child{position:relative;top:-8px;margin-bottom:26px;}
.gift .gift-box{margin-top:8px;}
/* Refined invitation typography for the opening hero. */
.hero-content{max-width:900px;padding:30px 24px 36px}
.hero .eyebrow{color:#f0d9ae;letter-spacing:.04em;font-size:clamp(.95rem,2vw,1.15rem)}
.hero .monogram{margin:18px 0 5px;text-shadow:0 5px 30px #000a}
.hero-ornament{display:block;color:var(--gold);font-size:1rem;letter-spacing:.22em;margin:3px 0 18px;text-shadow:0 0 18px #d8b77966}
.hero h2{display:grid;justify-items:center;gap:6px;margin:0 auto;font-size:clamp(1.9rem,4.6vw,3.65rem);line-height:1.48;text-shadow:0 3px 24px #000c}
.hero-invitation-lead{font:400 clamp(1.05rem,2.4vw,1.55rem)/1.7 'Cairo',sans-serif;color:#f3eadb}
.hero h2 em{font-style:normal;color:#f4d9a4}
.hero .hero-date{margin-top:20px;font-size:1rem}
@media(max-width:600px){.hero-content{padding:24px 18px}.hero .monogram{margin:15px 0 4px}.hero-ornament{margin:0 0 11px}.hero h2{font-size:clamp(1.75rem,7.3vw,2.45rem)}.hero-invitation-lead{font-size:1rem}.hero .hero-date{margin-top:14px;font-size:.9rem}}
.share-card{max-width:760px;margin:0 auto;text-align:center;padding:clamp(28px,6vw,58px) clamp(20px,5vw,48px);border:1px solid #c5a56d55;background:linear-gradient(145deg,#17120eaa,#0c0a08dd);box-shadow:0 20px 65px #0005}
.share-card .closing-star{color:var(--gold);font-size:1.4rem}
.share-card .eyebrow{margin:12px 0;color:#d9bd8a}
.share-card h2{margin:0 0 12px;font:400 clamp(1.8rem,4vw,2.8rem) 'Amiri',serif;color:#f4e6c9}
.share-card>p:not(.eyebrow){max-width:570px;margin:0 auto;color:#e0d6c7;line-height:2}
.share-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:24px auto 10px}
.share-actions .outline-button{min-width:135px;cursor:pointer;font:500 .95rem 'Cairo',sans-serif}
#shareStatus{display:block;min-height:1.5em;color:#e5cc96}
@media(max-width:520px){.share-actions{display:grid;width:min(100%,320px)}.share-actions .outline-button{width:100%}}
/* Slow, legible arrival: stop, let the case land, then drive away. */
.arrival-driver .driver-arm{stroke-dasharray:30;stroke-dashoffset:30;transform-origin:203px 45px;animation:driverToss 6.8s ease-in-out both;}
@keyframes carArrives{0%{right:-40%;opacity:0}8%{opacity:1}28%,66%{right:36%;opacity:1}68%{right:36%;opacity:1}88%{right:-40%;opacity:1}96%,100%{right:-40%;opacity:0}}
@keyframes driverToss{0%,38%{stroke-dashoffset:30;transform:rotate(0)}43%{stroke-dashoffset:0;transform:rotate(-4deg)}48%,100%{stroke-dashoffset:0;transform:rotate(0)}}
@keyframes suitcaseToss{0%,39%{left:72%;bottom:22%;opacity:0;transform:translateX(-50%) scale(.72) rotate(-16deg)}45%{left:68%;bottom:27%;opacity:1;transform:translateX(-50%) scale(1.02) rotate(12deg)}52%{left:58%;bottom:20%;opacity:1;transform:translateX(-50%) scale(1) rotate(-7deg)}59%{left:51%;bottom:13.5%;opacity:1;transform:translateX(-50%) scale(.96) rotate(3deg)}64%,88%{left:50%;bottom:13.5%;opacity:1;transform:translateX(-50%) scale(1) rotate(0)}100%{left:50%;bottom:13.5%;opacity:0;transform:translateX(-50%) scale(.94) rotate(0)}}
/* Refined anticipation: slow one-way camera move, tactile gold timeline, and a brief name reveal just before the curtains. */
.film-intro.active .film-image{animation:filmImagePush var(--intro-duration,14s) cubic-bezier(.2,.6,.3,1) both;}
@keyframes filmImagePush{0%{transform:scale(1.015) translateY(0)}100%{transform:scale(1.13) translateY(-1.2%)}}
.film-progress{height:3px;border-radius:9px;background:linear-gradient(90deg,#fff2,#ffffff16);box-shadow:0 0 0 1px #d7b77920;overflow:visible;position:relative;margin-top:3px}
.film-progress:before{content:'';position:absolute;inset:-3px 0;background:linear-gradient(90deg,transparent 24.7%,#f3dfb055 25%,transparent 25.3%,transparent 49.7%,#f3dfb055 50%,transparent 50.3%,transparent 74.7%,#f3dfb055 75%,transparent 75.3%);pointer-events:none}
.film-progress i{position:relative;border-radius:9px;background:linear-gradient(90deg,#b38c4d,#f7e2ac 55%,#fff2ce);box-shadow:0 0 12px #e3bd72aa,0 0 26px #d5a85855}
.film-progress i:after{content:'';position:absolute;right:-3px;top:50%;width:8px;height:8px;border-radius:50%;transform:translateY(-50%);background:#fff0c2;box-shadow:0 0 13px 4px #f3d48b99}
/* Soft red hearts drift visibly across the photos and text without intercepting clicks. */
.invitation{position:relative;isolation:isolate}
.heart-background{position:fixed;inset:0;z-index:5;overflow:hidden;pointer-events:none;contain:strict}
.invitation>*:not(.heart-background){position:relative;z-index:1}
.floating-heart{position:absolute;left:var(--heart-left);bottom:-35px;color:#ed5363;font-size:var(--heart-size);line-height:1;opacity:0;filter:drop-shadow(0 0 7px #d92e4844);animation:heartDrift var(--heart-duration) var(--heart-delay) linear infinite;will-change:transform,opacity}
.floating-heart:nth-child(3n){color:#c92740}
.floating-heart:nth-child(4n){color:#ff7986}
@keyframes heartDrift{0%{transform:translate3d(0,0,0) rotate(-12deg) scale(.78);opacity:0}10%{opacity:var(--heart-alpha)}75%{opacity:var(--heart-alpha)}100%{transform:translate3d(var(--heart-drift),-115vh,0) rotate(18deg) scale(1.12);opacity:0}}
@media(prefers-reduced-motion:reduce){.floating-heart{animation:none!important;opacity:.08}}/* User-edited video joins the entrance visually while the original invitation mix stays the only soundtrack. */
.film-video{position:absolute;z-index:1;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.82) brightness(.64);opacity:.6;}
.film-image{opacity:.13!important;z-index:2;mix-blend-mode:screen;}
.film-beam,.film-grain,.film-copy,.film-bottom,.film-door{z-index:3}
.memory-film{background:linear-gradient(180deg,#090807,#14100d 48%,#090807);}
.memory-film-card{width:min(100%,900px);margin:auto;padding:clamp(20px,4vw,38px);border:1px solid #d8b77944;background:#0d0a08cc;text-align:center;box-shadow:0 22px 70px #0008;}
.memory-film-card h2{margin:0 0 22px;font:400 clamp(2rem,5vw,3.5rem) 'Amiri',serif;color:#f0d9a9;}
.memory-film-card>p:not(.eyebrow){color:#cfc2ad;margin:16px 0;}
.memory-video-frame{width:min(100%,800px);margin:auto;overflow:hidden;border:1px solid #d8b77966;background:#050403;box-shadow:0 12px 42px #000a;}
.memory-video-frame video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#050403;}
.memory-film-card .outline-button{margin:8px auto 0;min-width:210px;}
@media(max-width:680px){.film-video{object-position:center}.memory-film{padding:62px 15px}.memory-film-card{padding:22px 14px}}
.memory-video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#050403;}

/* A clear, celebratory Quran verse card in the story gallery. */
.story-verse-card{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,1.25fr);align-items:center;gap:clamp(24px,6vw,76px);max-width:980px;margin:clamp(56px,9vw,104px) auto 0;padding:clamp(28px,5vw,58px);overflow:hidden;border:1px solid rgba(216,183,121,.55);background:radial-gradient(ellipse at 78% 50%,rgba(216,183,121,.11),transparent 52%),linear-gradient(135deg,#17120d,#0c0a08 74%);box-shadow:0 24px 70px #0008,inset 0 0 0 5px rgba(216,183,121,.045);text-align:center}
.story-verse-card:before,.story-verse-card:after{content:'✦';position:absolute;z-index:-1;color:var(--gold);opacity:.45;font-size:1rem}
.story-verse-card:before{top:16px;right:18px}.story-verse-card:after{bottom:16px;left:18px}
.verse-couple{width:min(100%,250px);height:auto;justify-self:center;color:var(--gold2);filter:drop-shadow(0 0 12px #d8b77922)}
.verse-copy{max-width:580px;margin-inline:auto}
/* Keep the suitcase reveal and its call-to-action inside short phone viewports. */
@media(max-width:680px){
  .gate{height:100vh;height:100svh;min-height:0;padding:max(12px,env(safe-area-inset-top)) 0 max(14px,env(safe-area-inset-bottom));}
  .gate-copy{position:relative;left:auto;top:auto;width:min(calc(100% - 28px),520px);margin:auto;padding:24px 18px;text-align:center;}
  .gate h1{font-size:clamp(2.15rem,9vw,3.4rem);line-height:1.24;margin:20px 0 14px;}
  .gate-sub{max-width:32rem;margin-inline:auto;line-height:1.8;}
  .gate .gold-button{display:flex;width:min(100%,250px);margin:22px auto 0;min-width:0;}
  .arrival-car{width:min(250px,72vw);}
}
.verse-label{display:block;color:#d9bd86;font-size:.78rem;letter-spacing:.1em}
.verse-ornament{display:block;margin:10px 0;color:var(--gold);font-size:1.3rem}
.verse-copy p{margin:0;color:#fff8ec;font-family:'Amiri','Cairo',serif;font-size:clamp(1.5rem,3.5vw,2.35rem);font-weight:500;line-height:2.05;text-wrap:balance;text-shadow:0 2px 18px #000}
.verse-copy small{display:block;margin-top:14px;color:#d0bc98;font-size:.86rem}
@media(max-width:680px){.story-verse-card{grid-template-columns:1fr;gap:20px;margin-top:54px;padding:30px 20px}.verse-couple{width:150px;grid-row:2}.verse-copy{grid-row:1}.verse-copy p{font-size:clamp(1.55rem,7vw,2rem);line-height:1.9}}

/* Let the verse itself be the sole, luminous focal point. */
.story-verse-card{background:radial-gradient(ellipse at 70% 50%,rgba(226,190,119,.18),transparent 55%),linear-gradient(135deg,#17120d,#0c0a08 74%);border-color:rgba(236,204,145,.72);box-shadow:0 24px 70px #0008,inset 0 0 0 5px rgba(216,183,121,.055),0 0 34px rgba(214,177,106,.1)}
.verse-copy{max-width:640px}
.verse-copy p{font-size:clamp(1.85rem,4.25vw,2.9rem);font-weight:600;line-height:1.95;background:linear-gradient(105deg,#fff8e9 8%,#e9cd91 26%,#fffdf5 44%,#c99e58 61%,#fff3d7 78%,#e9cd91 94%);background-size:220% auto;background-clip:text;-webkit-background-clip:text;color:#f0d9a9;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 12px rgba(239,207,145,.25));animation:verseShimmer 6s ease-in-out infinite,verseGlow 3s ease-in-out infinite alternate}
@keyframes verseShimmer{to{background-position:220% center}}
@keyframes verseGlow{from{filter:drop-shadow(0 0 8px rgba(239,207,145,.18))}to{filter:drop-shadow(0 0 19px rgba(239,207,145,.48))}}
@media(max-width:680px){.verse-copy p{font-size:clamp(1.7rem,7.2vw,2.15rem);line-height:1.9}}
@media(prefers-reduced-motion:reduce){.verse-copy p{animation:none;background-position:center}}
@media(max-width:680px){
  .story-verse-card{width:100%;padding:clamp(24px,7vw,34px) clamp(16px,5vw,24px);gap:18px}
  .verse-copy{width:100%;max-width:100%}
  .verse-copy p{font-size:clamp(1.78rem,8.2vw,2.3rem);line-height:1.82;letter-spacing:0;text-wrap:pretty;overflow-wrap:normal}
  .verse-couple{width:clamp(125px,38vw,155px)}
}
.verse-copy p{background-image:linear-gradient(105deg,#fff8e9 4%,#e9cd91 24%,#fff 42%,#fff9e9 49%,#c99e58 58%,#fff6dc 72%,#e9cd91 94%);background-size:300% auto;animation:verseShimmer 3.2s ease-in-out infinite alternate,verseGlow 1.9s ease-in-out infinite alternate}
@keyframes verseShimmer{from{background-position:0% center}to{background-position:100% center}}
/* Keep animated decor inside the page so it cannot create sideways scrolling. */
main{overflow-x:clip}