/* Keep the photograph and its lighting in one gently moving coordinate system. */
.scene-world{position:absolute;inset:0;transform-origin:50% 45%;animation:coupleCamera 16s ease-in-out infinite;will-change:transform}
.scene-world .couple-scene-photo{animation:none;transform:none;will-change:auto}
.living-photo{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity 1s;pointer-events:none}
.scene-rendered .living-photo{opacity:1}
.candle-flames{position:absolute;inset:0;pointer-events:none}
.candle-flame{position:absolute;left:var(--cx);top:var(--cy);width:clamp(2px,.5vw,4px);height:clamp(6px,1.6vw,12px);margin-left:-2px;transform-origin:50% 100%;border-radius:65% 35% 48% 52% / 72% 72% 28% 28%;background:radial-gradient(ellipse at 50% 76%,#fffef5 10%,#fff7bf 30%,#ffd365 58%,#ed9c2780 78%,transparent 82%);box-shadow:0 0 5px 1px #fff6cb,0 0 13px 4px #ffb8487a;mix-blend-mode:screen;animation:livingFlame var(--flame-speed) ease-in-out var(--flame-delay) infinite;translate:0 -85%}
.candle-flame::after{content:'';position:absolute;inset:-12px -10px;background:radial-gradient(ellipse,#ffcd6b35,transparent 65%);border-radius:50%;animation:flameAura 2.7s ease-in-out var(--flame-delay) infinite}
.scene-world,.scene-world *{animation-play-state:paused}
.scene-active .scene-world,.scene-active .scene-world *{animation-play-state:running}
.sealed .scene-world,.sealed .scene-world *{animation-play-state:paused}
@keyframes livingFlame{0%,100%{transform:rotate(-5deg) scale(.92,1);opacity:.85}19%{transform:rotate(7deg) scale(1.05,.86);opacity:1}36%{transform:rotate(-3deg) scale(.86,1.12);opacity:.9}62%{transform:rotate(6deg) scale(1,.95);opacity:1}81%{transform:rotate(-8deg) scale(.9,1.07);opacity:.88}}
@keyframes flameAura{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.12)}}

/* Reveal whole words and lines so Arabic remains correctly joined. */
.motion-ready .cinema-reveal{opacity:0;transform:translateY(22px);filter:blur(3px);transition:opacity 1.3s ease var(--reveal-delay,0s),transform 1.3s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0s),filter 1.3s ease var(--reveal-delay,0s)}
.motion-ready .cinema-reveal.is-revealed{opacity:1;transform:none;filter:none}
.section .ornament i{transform-origin:right center;animation:lineBreath 6s ease-in-out infinite}
.section .ornament i:last-child{transform-origin:left center;animation-name:lineBreathReverse}
.hero--couple .hero-copy{top:3.5%}
.hero--couple .wedding-of{padding:.14em .1em;line-height:1.35;margin-bottom:1%}
.hero--couple h1{line-height:1.5;gap:2%;font-size:clamp(29px,8vw,64px)}
.hero-copy h1>span{display:inline-block;padding:.08em .14em;margin:0 -.09em;background:linear-gradient(110deg,#d6aa52 15%,#f3db9e 38%,#fff8df 49%,#e4be6c 58%,#d6aa52 80%);background-size:260% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none;animation:goldNameSweep 9s ease-in-out infinite;filter:drop-shadow(0 1px 2px #071733)}
@keyframes lineBreath{0%,100%{transform:scaleX(.75);opacity:.6}50%{transform:scaleX(1);opacity:1}}
@keyframes lineBreathReverse{0%,100%{transform:rotate(180deg) scaleX(.75);opacity:.6}50%{transform:rotate(180deg) scaleX(1);opacity:1}}

.thanks{background:radial-gradient(ellipse at 50% 55%,#182743 0,#0a1934 48%,#071733 85%)}
#closing-stars{position:absolute;inset:0;width:100%;height:100%;opacity:.88}
.closing-halo{position:absolute;left:50%;top:56%;width:400px;max-width:110%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,#d6ab5024,transparent 62%);filter:blur(15px);animation:closingAura 10s ease-in-out infinite}
.thanks .thanks-message{max-width:520px;margin-left:auto;margin-right:auto;text-shadow:0 0 24px #f7e5b31a}
.thanks .thanks-heart{width:112px;height:112px;margin-top:24px;margin-bottom:17px}
.heart-trace{position:absolute;inset:7px;width:98px;height:88px;fill:none;stroke:#e0b55d;stroke-width:.65;stroke-linecap:round;opacity:.55;filter:drop-shadow(0 0 5px #deb75d80)}
.heart-trace path{stroke-dasharray:280;stroke-dashoffset:280;animation:traceLove 8s ease-in-out infinite}
.thanks .heart-orbit{inset:4px;border-color:#d4aa5460}
.thanks .heart-orbit.second{inset:-5px;border-color:#d4aa5429}
.thanks .signature{font-size:clamp(38px,7vw,54px);line-height:1.7}
.thanks .closing-date{color:#efdfbb;animation:dateGlow 6s ease-in-out infinite}
.thanks .text-button{transition:color .3s,text-shadow .3s}
.thanks .text-button:hover{color:#ffebad;text-shadow:0 0 12px #e0b55d70}
.thanks-atmosphere *{animation-play-state:paused}
.closing-active .thanks-atmosphere *,.closing-active .heart-trace path{animation-play-state:running}
.thanks:not(.closing-active) .heart-trace path{animation-play-state:paused}
@keyframes traceLove{0%,8%{stroke-dashoffset:280;opacity:.1}45%,70%{stroke-dashoffset:0;opacity:.7}100%{stroke-dashoffset:-280;opacity:.1}}
@keyframes closingAura{0%,100%{transform:scale(.85);opacity:.4}50%{transform:scale(1.15);opacity:.9}}
@keyframes dateGlow{0%,100%{text-shadow:0 0 8px #e0b55d00}50%{text-shadow:0 0 14px #e0b55d70}}
@media(max-width:420px){.thanks .signature{font-size:38px}.thanks .thanks-message{font-size:24px}.thanks .thanks-arabic{font-size:23px}}
@media(prefers-reduced-motion:reduce){.scene-world{transform:none;will-change:auto}.motion-ready .cinema-reveal{opacity:1;transform:none;filter:none}.heart-trace path{stroke-dashoffset:0}.hero-copy h1>span{color:#e5c476;background:none}.candle-flame{opacity:.7}.closing-halo{opacity:.35}}

/* Two interlocking wedding bands frame the couple's Arabic names. */
.wedding-name-stage{position:relative;isolation:isolate;width:100%;max-width:560px;margin:12px auto 0;padding:21px 0 24px}
.wedding-name-stage .arabic-names{position:relative;z-index:1;margin:0;font-size:clamp(49px,8vw,66px);line-height:1.8;white-space:nowrap}
.union-rings{position:absolute;inset:0;z-index:-1;pointer-events:none;display:grid;place-items:center}
.union-ring{position:absolute;width:158px;height:116px;border:1px solid #bd91493b;border-radius:50%;box-shadow:inset 0 0 18px #ddbd7810,0 0 18px #ddbd7810;animation:unionSway 14s ease-in-out infinite}
.union-ring-one{margin-right:85px;--ring-angle:-27deg}
.union-ring-two{margin-left:85px;--ring-angle:27deg;animation-delay:-7s}
.union-ring::after{content:"";position:absolute;inset:-1px;border:1px solid transparent;border-top-color:#bb8e495c;border-radius:50%;animation:bandGlint 22s linear infinite}
.union-ring-two::after{animation-direction:reverse}
.union-glow{width:270px;height:140px;border-radius:50%;background:radial-gradient(ellipse,#dbb75b24,transparent 68%);animation:unionBreath 8s ease-in-out infinite}
.wedding-name-stage .arabic-names>.name-word{animation:goldNameSweep 8s ease-in-out infinite,nameFloat 7s ease-in-out infinite;text-shadow:0 4px 24px #b38b3420}
.wedding-name-stage .arabic-names>.bride-name{animation-delay:-4s,-3.5s}
.wedding-name-stage .arabic-names>.name-join{font-size:.66em;vertical-align:middle;background:none;color:#b28a40;animation:none;margin:0 .07em}
@keyframes unionSway{0%,100%{transform:translateY(3px) rotate(var(--ring-angle)) scale(1)}50%{transform:translateY(-5px) rotate(calc(var(--ring-angle) + 9deg)) scale(1.04)}}
@keyframes bandGlint{to{transform:rotate(360deg)}}
@keyframes unionBreath{0%,100%{opacity:.5;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}}
@keyframes nameFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@media(max-width:500px){.union-ring{width:133px;height:102px}.union-ring-one{margin-right:65px}.union-ring-two{margin-left:65px}.wedding-name-stage{padding:22px 0}}
@media(prefers-reduced-motion:reduce){.wedding-name-stage .arabic-names>.name-word{color:#b28a40;background:none}.union-ring{transform:rotate(var(--ring-angle))}.union-glow{opacity:.6}}

/* Preserve detail and anchor each flame to its wick. */
.scene-world{animation:detailCamera 24s ease-in-out infinite}
@keyframes detailCamera{0%,100%{transform:scale(1.005)}50%{transform:scale(1.018)}}
.couple-scene::after{background:linear-gradient(180deg,#07173326,transparent 30%,transparent 85%,#0717330a)}
.couple-scene-light{opacity:.35}.couple-scene-glow{opacity:.09;animation:none}
.candle-flame{width:clamp(2px,.42vw,3.5px);height:clamp(5px,1.25vw,10px);margin-left:0;translate:-50% -92%;box-shadow:0 0 3px #fff0baaa,0 0 8px 2px #ffb84845}
.candle-flame::after{inset:-7px -6px}
@keyframes livingFlame{0%,100%{transform:rotate(-2deg) scale(.96,1);opacity:.88}23%{transform:rotate(3deg) scale(1,.94);opacity:.98}47%{transform:rotate(-1deg) scale(.94,1.06);opacity:.92}71%{transform:rotate(2deg) scale(.98,.97);opacity:1}}
.arabic-sparkles>span{color:#b88a32;animation-name:invitationSparkle}
@keyframes invitationSparkle{0%,100%{opacity:.2;transform:translateY(3px) scale(.85) rotate(-8deg)}50%{opacity:.52;transform:translateY(-7px) scale(1.1) rotate(8deg)}}
@media(prefers-reduced-motion:reduce){.scene-world{transform:none}.arabic-sparkles>span{opacity:.3}}

/* A decorative night sky: glints, shooting meteors and softly falling stars. */
.section.dark{isolation:isolate;overflow:hidden;position:relative}
.magic-sky{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:paint}
.magic-star{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);background:#f5dca0;clip-path:polygon(50% 0,60% 39%,100% 50%,60% 61%,50% 100%,40% 61%,0 50%,40% 39%);animation:magicTwinkle var(--t) ease-in-out var(--d) infinite;opacity:.3}
.magic-meteor{position:absolute;left:var(--x);top:var(--y);width:95px;height:1px;background:linear-gradient(90deg,transparent,#fff2cf);transform:rotate(32deg);opacity:0;animation:magicMeteor var(--t) linear var(--d) infinite}
.magic-meteor::after{content:"";position:absolute;right:-2px;top:-1px;width:4px;height:4px;border-radius:50%;background:#fff4d6;box-shadow:0 0 7px #f6dda6}
.falling-magic{position:absolute;left:var(--x);top:-30px;color:#f6dda3;font:18px Georgia,serif;opacity:0;animation:magicFall var(--t) linear var(--d) infinite}
.falling-magic b{display:block;font-weight:400;text-shadow:0 0 8px #dcb77088;animation:magicTurn 6s ease-in-out infinite}
@keyframes magicTwinkle{0%,100%{opacity:.12;transform:scale(.65)}50%{opacity:.65;transform:scale(1.18)}}
@keyframes magicMeteor{0%,72%{opacity:0;transform:translate(-90px,-60px) rotate(32deg)}75%{opacity:.7}86%{opacity:0;transform:translate(230px,140px) rotate(32deg)}100%{opacity:0;transform:translate(230px,140px) rotate(32deg)}}
@keyframes magicFall{0%,12%{opacity:0;transform:translate(0,-20px)}19%{opacity:.45}65%{opacity:.3}85%,100%{opacity:0;transform:translate(35px,520px)}}
@keyframes magicTurn{0%,100%{transform:rotate(-12deg) scale(.8)}50%{transform:rotate(24deg) scale(1.15)}}
.sealed .magic-sky *{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.magic-meteor,.falling-magic{display:none}.magic-star{opacity:.3}}

.countdown-event-date{color:#efdfbb;font-size:21px;line-height:1.6;margin:18px auto 24px}.countdown-event-date small{font-size:15px;letter-spacing:.08em;color:#e0b55d}

/* Use the requested Andalus face wherever it is installed. */
@font-face{font-family:InvitationAndalus;src:url('assets/andalus.woff') format('woff');font-display:swap}
.arabic-invitation,.arabic-invitation .arabic-names{font-family:InvitationAndalus,Andalus,Amiri,serif}
.wedding-name-stage .arabic-names>.name-join{font-family:'Great Vibes',cursive;font-size:.76em;line-height:1.4;padding:0 .13em;vertical-align:baseline;color:#bd9144;direction:ltr;text-shadow:0 0 16px #d7b76c50;transform:rotate(-8deg);animation:ampersandGlow 6s ease-in-out infinite}
@keyframes ampersandGlow{0%,100%{text-shadow:0 0 8px #d7b76c20}50%{text-shadow:0 0 18px #d7b76c70}}
@media(prefers-reduced-motion:reduce){.wedding-name-stage .arabic-names>.name-join{animation:none}}

/* Airy, balanced Arabic calligraphy with a separate ornamental ampersand. */
.wedding-name-stage{max-width:580px;padding:25px 0 31px;margin-top:17px}
.wedding-name-stage .arabic-names{display:flex;direction:rtl;align-items:center;justify-content:center;gap:clamp(22px,5vw,48px);font-size:clamp(65px,12vw,96px);line-height:1.7;white-space:nowrap;font-family:InvitationAndalus,Andalus,Amiri,serif}
.wedding-name-stage .arabic-names>.name-word{flex:0 1 auto;min-width:0;padding:.05em 0}
.wedding-name-stage .arabic-names>.name-join{flex:0 0 auto;margin:0;padding:0 .06em;font-size:.55em}
.union-ring{width:190px;height:145px}.union-ring-one{margin-right:125px}.union-ring-two{margin-left:125px}
.arabic-invitation .families{line-height:2}
@media(max-width:500px){.wedding-name-stage .arabic-names{font-size:clamp(57px,15vw,75px);gap:clamp(15px,4.5vw,24px)}.union-ring{width:145px;height:122px}.union-ring-one{margin-right:92px}.union-ring-two{margin-left:92px}}

@font-face{font-family:WeddingRuqaa;src:url('assets/aref-ruqaa.woff') format('woff');font-display:swap;font-weight:400}
.wedding-name-stage .arabic-names{font-family:WeddingRuqaa,Amiri,serif;font-size:clamp(72px,13vw,104px);line-height:1.8;gap:clamp(26px,6vw,56px);font-weight:400}
.wedding-name-stage .arabic-names>.name-word{padding:.1em .05em;text-shadow:none;filter:drop-shadow(0 3px 10px #b38b341f)}
.wedding-name-stage .arabic-names>.name-join{font-size:.48em;align-self:center;transform:rotate(-9deg);padding:0 .05em}
.wedding-name-stage{padding:20px 0 30px}
@media(max-width:500px){.wedding-name-stage .arabic-names{font-size:clamp(58px,15.5vw,80px);gap:clamp(18px,5vw,28px)}}

/* Animated ornamental penwork around the names. */
.wedding-name-stage{padding-top:56px;padding-bottom:58px}
.name-crown,.name-base{position:absolute;left:6%;right:6%;color:#b98b36;pointer-events:none;opacity:.75}
.name-crown{top:0}.name-base{bottom:0;transform:rotate(180deg)}
.name-flourish{display:block;width:100%;height:58px;overflow:visible}
.name-flourish path[pathLength]{stroke-dasharray:100;stroke-dashoffset:100;animation:ornamentalInk 10s ease-in-out infinite}
.name-base path[pathLength]{animation-delay:-5s}
.name-jewels{position:absolute;inset:0;pointer-events:none}
.name-jewels i{position:absolute;left:var(--jx);top:var(--jy);font:19px Georgia,serif;color:#c49841;font-style:normal;text-shadow:0 0 9px #e3bf6f77;animation:jewelDance 6s ease-in-out var(--jd) infinite}
.union-ring::before{content:"";position:absolute;inset:-3px;border-radius:50%;border:1px dotted #c3993b55;animation:bandGlint 32s linear infinite}
@keyframes ornamentalInk{0%{stroke-dashoffset:100;opacity:.3}28%,75%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-100;opacity:.3}}
@keyframes jewelDance{0%,100%{opacity:.25;transform:translateY(3px) rotate(-12deg) scale(.7)}50%{opacity:.85;transform:translateY(-5px) rotate(20deg) scale(1.1)}}
@media(max-width:500px){.name-flourish{height:44px}.wedding-name-stage{padding-top:47px;padding-bottom:47px}.name-jewels i{font-size:15px}}
@media(prefers-reduced-motion:reduce){.name-flourish path[pathLength]{stroke-dashoffset:0}.name-jewels i{opacity:.45}}

/* Larger names with gently illuminated calligraphic strokes. */
.wedding-name-stage{max-width:620px}
.wedding-name-stage .arabic-names{font-size:clamp(90px,16vw,126px);gap:clamp(22px,5vw,44px)}
.wedding-name-stage .arabic-names>.name-word{animation:goldNameSweep 7s ease-in-out infinite,royalNameFloat 6s ease-in-out infinite;filter:drop-shadow(0 4px 12px #b38b342a)}
.wedding-name-stage .arabic-names>.bride-name{animation-delay:-3.5s,-3s}
.wedding-name-stage .arabic-names>.name-join{font-size:.44em;animation:ampersandGlow 4s ease-in-out infinite}
.name-crown,.name-base{opacity:.9}.name-flourish{filter:drop-shadow(0 0 4px #c69e4c25)}
.name-jewels i{font-size:22px}.name-jewels i:nth-child(even){font-size:13px}
@keyframes royalNameFloat{0%,100%{transform:translateY(2px) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1deg)}}
.hero--couple h1{font-size:clamp(36px,9vw,72px)}
@media(max-width:500px){.wedding-name-stage .arabic-names{font-size:clamp(70px,19vw,96px);gap:clamp(14px,4vw,22px)}.name-jewels i{font-size:18px}}
@media(prefers-reduced-motion:reduce){.wedding-name-stage .arabic-names>.name-word{animation:none;transform:none}}

/* A full first screen on phones; keep photo, shader and candles aligned. */
@media(max-width:600px){
.hero.hero--couple{height:100vh;height:100svh;min-height:100svh;aspect-ratio:auto}
.hero--couple .scene-world{inset:auto;left:50%;top:50%;width:max(100%,66.667svh);height:auto;aspect-ratio:2/3;translate:-50% -50%}
.hero--couple .hero-copy{top:max(3.5%,env(safe-area-inset-top));left:3%;right:3%}
.hero--couple .discover{bottom:max(3%,env(safe-area-inset-bottom))}
.arabic-invitation .families{font-size:clamp(14px,4.2vw,21px);line-height:2.2}
.arabic-invitation .arabic-invite-line,.arabic-invitation .arabic-time,.arabic-invitation .arabic-event-date{line-height:2}
}

/* One coordinated serif style, clear hierarchy and an uncropped portrait. */
body{font-size:22px}
.wedding-of,.hero--couple .wedding-of,.hero-date,.hero--couple .hero-date,.signature,.thanks .signature,.italic,.i-do{font-family:Cormorant,Georgia,serif}
.hero--couple .hero-copy{top:2%;left:3%;right:3%}
.hero--couple .wedding-of{font-size:clamp(25px,5.8vw,40px);line-height:1.15;margin-bottom:8px}
.hero--couple h1{font-family:Cormorant,Georgia,serif;font-size:clamp(29px,6.7vw,49px);line-height:1.2;gap:3%;letter-spacing:.025em}
.hero--couple h1 em{font-family:Cormorant,Georgia,serif;font-size:.7em}
.hero--couple .hero-date{font-size:clamp(23px,4.6vw,32px);line-height:1.2;margin-top:8px}
.arabic-invitation,.arabic-invitation .arabic-names,.location-arabic,.thanks-arabic{font-family:Amiri,serif}
.arabic-verse{font-size:36px}.families{font-size:29px}.arabic-invite-line{font-size:28px}.arabic-time,.arabic-closing{font-size:29px}.arabic-event-date{font-size:27px}.arabic-venue{font-size:31px}.arabic-venue span{font-size:27px}
.wedding-name-stage .arabic-names{font-family:Amiri,serif;font-size:clamp(82px,14vw,112px);gap:clamp(22px,4vw,36px)}
.scene-world{animation:none;transform:none}
@media(max-width:600px){
.hero.hero--couple{background:linear-gradient(180deg,#243c58,#324c65 40%,#071733);height:100svh;min-height:100svh}
.hero--couple .scene-world{inset:auto;left:50%;bottom:0;top:auto;width:min(100%,66.667svh);height:auto;aspect-ratio:2/3;translate:-50% 0;transform:none;animation:none}
.hero--couple .hero-copy{top:max(3%,env(safe-area-inset-top));left:3%;right:3%}
.hero--couple .wedding-of{font-size:clamp(25px,6.2vw,36px)}
.hero--couple h1{font-size:clamp(28px,6.8vw,40px)}
.arabic-verse{font-size:31px}.arabic-invitation .families{font-size:clamp(16px,4.6vw,24px);white-space:normal}.families p{white-space:normal}
.arabic-invitation .arabic-invite-line,.arabic-invitation .arabic-time,.arabic-closing{font-size:26px}.arabic-event-date{font-size:24px}.arabic-venue{font-size:28px}.arabic-venue span{font-size:25px}
.wedding-name-stage .arabic-names{font-size:clamp(65px,17.5vw,92px);gap:clamp(16px,4vw,25px)}
}
/* Emphasize both names while retaining the photo's floral clearance. */
.hero--couple h1{font-size:clamp(36px,8vw,60px);gap:2%;letter-spacing:0}
.wedding-name-stage .arabic-names{font-size:clamp(98px,17vw,138px);gap:clamp(18px,3vw,30px)}
@media(max-width:600px){.hero--couple h1{font-size:clamp(32px,8vw,48px)}.wedding-name-stage .arabic-names{font-size:clamp(80px,21vw,112px);gap:clamp(12px,3vw,20px)}}

/* Restore the reference's original calligraphy. */
.hero--couple .wedding-of,.hero--couple .hero-date,.hero--couple h1{font-family:'Great Vibes',cursive;font-weight:400;letter-spacing:0}
.hero--couple .wedding-of{font-size:clamp(32px,7vw,52px);line-height:1.25;margin-bottom:4px}
.hero--couple h1{font-size:clamp(42px,9.7vw,76px);line-height:1.4;gap:2%}
.hero--couple h1 em{font-family:Cormorant,Georgia,serif;font-size:.55em}
.hero--couple .hero-date{font-size:clamp(26px,5vw,36px);line-height:1.2;margin-top:3px}
.hero--couple .hero-copy{top:1.5%}
@media(max-width:600px){.hero--couple .hero-copy{top:max(2%,env(safe-area-inset-top))}.hero--couple .wedding-of{font-size:clamp(30px,7.5vw,45px)}.hero--couple h1{font-size:clamp(37px,9.5vw,57px)}.hero--couple .hero-date{font-size:clamp(25px,6vw,32px)}}
/* Larger Arabic couple names, with room for their calligraphic strokes. */
.wedding-name-stage .arabic-names{font-size:clamp(112px,19vw,158px);gap:clamp(16px,3vw,28px)}
@media(max-width:600px){.wedding-name-stage .arabic-names{font-size:clamp(92px,24vw,128px);gap:clamp(10px,2.8vw,18px)}}
/* Restore the original photo-led invitation composition for phones. */
.hero--couple .hero-copy{top:3.5%;left:4%;right:4%}
.hero--couple .wedding-of{font-family:'Great Vibes',cursive;font-size:clamp(30px,7vw,58px);line-height:1.35;margin-bottom:1%}
.hero--couple h1{font-family:'Great Vibes',cursive;font-size:clamp(34px,9vw,68px);line-height:1.5;gap:2%}
.hero--couple .hero-date{font-family:'Great Vibes',cursive;font-size:clamp(26px,5.5vw,42px);margin-top:3%;line-height:1.3}
@media(max-width:600px){
.hero.hero--couple{height:100svh;min-height:100svh;background:#071733;overflow:hidden}
.hero--couple .scene-world{inset:auto;left:50%;top:50%;bottom:auto;width:max(100%,66.667svh);height:auto;aspect-ratio:2/3;translate:-50% -50%;transform:none;animation:none}
.hero--couple .hero-copy{top:max(3.5%,env(safe-area-inset-top));left:4%;right:4%}
.hero--couple .wedding-of{font-size:7.5vw;line-height:1.35;margin-bottom:1.5%}
.hero--couple h1{font-size:9.5vw;line-height:1.5}
.hero--couple .hero-date{font-size:6.5vw;margin-top:3%}
}
/* Slightly larger family names, with an animated gold script in the hero. */
.arabic-invitation .families{font-size:32px;line-height:2}
.hero--couple .wedding-of{background:linear-gradient(110deg,#d6aa52 15%,#f3db9e 38%,#fff8df 49%,#e4be6c 58%,#d6aa52 80%);background-size:260% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 2px 3px #07173399);animation:goldNameSweep 8s ease-in-out infinite,heroScriptFloat 7s ease-in-out infinite}
.hero-copy h1>span{animation:goldNameSweep 8s ease-in-out infinite,heroScriptFloat 6s ease-in-out infinite}
.hero-copy h1>span:last-child{animation-delay:-4s,-3s}
.hero--couple h1 em{animation:ampersandGlow 5s ease-in-out infinite}
@keyframes heroScriptFloat{0%,100%{transform:translateY(1px)}50%{transform:translateY(-3px)}}
@media(max-width:600px){.arabic-invitation .families{font-size:clamp(19px,5.2vw,27px);gap:10px;line-height:2}.arabic-invitation .families p{white-space:normal}}
.sealed .hero--couple .wedding-of,.sealed .hero-copy h1>span,.sealed .hero--couple h1 em{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.hero--couple .wedding-of{color:#e5c476;background:none;animation:none}.hero-copy h1>span{animation:none;transform:none}}
