@font-face{font-family:Great Vibes;src:url('assets/great-vibes.ttf') format('truetype');font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant.ttf') format('truetype');font-display:swap}
@font-face{font-family:Cormorant;src:url('assets/cormorant-italic.ttf') format('truetype');font-style:italic;font-display:swap}
@font-face{font-family:Amiri;src:url('assets/amiri.ttf') format('truetype');font-display:swap}
:root{--navy:#071733;--cream:#f5ecdd;--gold:#c39532;--pale-gold:#e0b55d;--ink:#172957;--serif:Cormorant,Georgia,serif;--script:'Great Vibes',cursive}
*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:#f7f2ea}body{margin:0;color:var(--ink);font-family:var(--serif);font-size:19px}body.sealed{overflow:hidden;height:100dvh}button,input,textarea{font:inherit}button,a,input,textarea{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:6px}button:disabled{cursor:wait}svg{display:block}button svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.3}p{margin:0}h1,h2{font-weight:400;margin:0}button{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}
.envelope{position:fixed;inset:0;z-index:100;background:#112b48;overflow:hidden;transition:opacity .8s ease,visibility .8s ease}.envelope video{width:100%;height:100%;display:block;object-fit:cover}.envelope.finished{opacity:0;visibility:hidden;pointer-events:none}.open-invitation{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;color:#fff;display:flex;align-items:center;justify-content:center;padding:0}.open-invitation span{position:absolute;top:64%;font-family:Georgia,serif;font-size:15px;letter-spacing:.08em;text-shadow:0 1px 6px #071733;animation:breathe 2.5s ease-in-out infinite}.envelope.opening .open-invitation{opacity:0;pointer-events:none}
main{width:min(100%,720px);margin:0 auto;background:var(--cream);box-shadow:0 12px 55px #6d5a3a0d;overflow:hidden}.hero{position:relative;aspect-ratio:1 / 1.7949;background:#fff;isolation:isolate}.palace{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}.hero-copy{position:absolute;left:5%;right:5%;top:5.5%;text-align:center;color:var(--gold)}.wedding-of{font:clamp(36px,7.7vw,64px)/1.4 var(--script);margin-bottom:9%}h1{display:flex;align-items:center;justify-content:center;gap:4%;font:clamp(37px,8.7vw,72px)/1.5 var(--script);white-space:nowrap}h1 em{font:400 .7em var(--serif);margin:0 -.5%}.hero-date{font:clamp(30px,6.5vw,49px)/1.4 var(--script);margin-top:7%}.hero-time{font-size:clamp(11px,2.2vw,16px);letter-spacing:.16em;margin-top:1.5%}.discover{position:absolute;left:calc(50% - 15px);bottom:3%;padding:10px;color:var(--gold)}.discover svg{width:15px;height:30px;stroke:currentColor;stroke-width:1;fill:none}
.section{text-align:center;padding:72px 28px;position:relative}.dark{background:var(--navy);color:var(--cream)}.light{background:var(--cream);color:var(--ink)}.section-label{font-size:17px;letter-spacing:.29em;font-weight:500;line-height:1.4}.dark .section-label{color:var(--pale-gold)}.ornament{width:175px;display:flex;justify-content:center;align-items:center;gap:10px;margin:20px auto 32px;color:var(--gold)}.ornament i{height:1px;flex:1;background:linear-gradient(90deg,transparent,currentColor)}.ornament i:last-child{transform:rotate(180deg)}.ornament b{width:7px;height:7px;transform:rotate(45deg);border:1px solid currentColor;font-weight:400}.ornament.small{width:100px;gap:8px;margin:28px auto 0}.ornament.small b{width:5px;height:5px}.italic{font-style:italic}.story h2{font-size:42px;color:var(--pale-gold);margin:0 0 28px}.story p:not(.section-label){font-size:20px;line-height:1.7;max-width:380px;margin:10px auto}.date-stack{display:flex;flex-direction:column;align-items:center}.day{font-size:108px;color:var(--gold);line-height:1.06}.month{font-size:31px;letter-spacing:.22em;margin:12px 0 5px;padding-left:.22em}.date-star{font-size:26px;color:var(--gold);line-height:1.5}.year{font-size:33px;letter-spacing:.17em;padding-left:.17em}.date-note{font-size:21px;color:#43506d;margin-top:21px}.button{display:inline-flex;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:13px 24px;border:1px solid #ab8140;border-radius:2px;background:transparent;font:500 14px/1.4 var(--serif);letter-spacing:.13em;color:var(--ink);text-decoration:none;transition:background .2s,color .2s}.button:hover{background:#e9ddc6}.calendar{margin-top:34px}.countdown-lead{display:block;font-size:29px;font-style:italic;line-height:1.3}.i-do{display:block;font-size:62px;letter-spacing:.1em;color:var(--pale-gold);margin:6px 0 26px}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:430px;margin:0 auto 30px}.countdown>div{min-width:0;min-height:112px;border:1px solid #d7ae5bb8;border-radius:4px;background:linear-gradient(145deg,#26364e33,#071733);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 5px}.countdown span{font-size:43px;color:#f0d797;line-height:1.1;font-variant-numeric:tabular-nums}.countdown small{font-size:11px;letter-spacing:.14em;color:#eee1c5;margin-top:10px}.countdown-section>p.italic{font-size:19px}.rings{width:92px;height:70px;margin:0 auto 26px;fill:none;stroke:#b78332;stroke-width:1}.event-time{font-size:52px;color:#b78332}.event-date{font-size:24px;letter-spacing:.06em;margin:10px 0 26px}.celebration>.italic{font-size:20px;color:#6d5a3a}.pin{fill:none;stroke:var(--pale-gold);stroke-width:1;width:34px;height:43px;margin:0 auto 26px}.location h2{font-size:38px;color:#f1d28b;margin-bottom:14px}.location p:not(.section-label){font-size:20px;line-height:1.6}.location .ornament.small{margin:25px auto}.rsvp-section{padding:62px 25px}.rsvp-card{position:relative;margin:auto;max-width:365px;background:#fffdf8;border:1.5px solid var(--ink);border-radius:20px;overflow:hidden;padding:80px 25px 25px;box-shadow:0 13px 32px #07173314}.rsvp-top{position:absolute;top:0;left:0;right:0;height:53px;background:var(--navy)}.rsvp-top .ornament{width:110px;margin:24px auto}.rsvp-card h2{font-size:34px;letter-spacing:.14em;padding-left:.14em}.rsvp-note{font-size:17px;line-height:1.4;color:#6a6c76;max-width:250px;margin:15px auto 28px}form{text-align:left}form>label,legend{display:block;font-size:13px;letter-spacing:.08em;margin-bottom:10px}input[type=text],textarea{width:100%;border:1.5px solid #1729577a;border-radius:12px;outline:none;background:var(--cream);color:var(--navy);padding:12px;font-size:19px;line-height:1.4}input[type=text]:focus,textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px #17295714}textarea{resize:vertical}fieldset{border:0;padding:0;margin:25px 0}legend{padding:0;margin-bottom:14px}.choice{display:flex;align-items:center;gap:10px;border:1px solid #1729576b;border-radius:30px;padding:12px 15px;font-size:13px;letter-spacing:.04em;margin-bottom:10px;cursor:pointer}.choice:has(input:checked){background:var(--cream);border-color:var(--ink)}.choice input{accent-color:var(--ink);margin:0;width:15px;height:15px;flex-shrink:0}.solid{background:var(--ink);color:#fffdf8;border-color:var(--ink);border-radius:30px;width:100%;margin-top:22px}.solid:hover{background:#071733}.thanks-message{font-size:25px;line-height:1.5;margin-top:30px}.heart{width:20px;height:20px;fill:#d4aa54;margin:23px auto}.signature{font:40px/1.6 var(--script);color:#e0b55d}.closing-date{font-size:17px;letter-spacing:.2em;margin-top:12px}.text-button{border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:4px;font:16px/1.5 var(--serif);padding:9px}.thanks .text-button{margin-top:32px;font-size:15px;color:#c5ba9e}.reply-result{font-size:18px;line-height:1.5}.reply-ready{font-size:26px;color:var(--ink);margin-bottom:15px}#reply-preview{white-space:pre-line;padding:17px 13px;text-align:left;border:1px solid #d9c7a4;background:var(--cream);border-radius:10px;overflow-wrap:anywhere}.reply-help{font-size:16px;color:#636778;margin-top:15px}.reply-result .button{width:100%;margin-top:13px}.reply-result .text-button{margin-top:8px}#reply-status{font-size:16px;min-height:24px;margin-top:10px}.floating-controls{position:fixed;z-index:20;left:18px;right:18px;bottom:max(20px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;pointer-events:none}.round-button{display:grid;place-items:center;width:44px;height:44px;border:1px solid #d7c4a5;border-radius:50%;background:#fffdf8ed;color:#b9924c;box-shadow:0 3px 15px #07173308;pointer-events:auto}.round-button svg{width:20px;height:20px}.round-button[aria-pressed=true]{background:var(--cream)}#auto-scroll svg{fill:currentColor;stroke:none;width:18px;height:18px}.toast{position:fixed;bottom:80px;left:50%;max-width:calc(100% - 36px);transform:translate(-50%,15px);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;background:var(--navy);color:var(--cream);border:1px solid #c3953280;border-radius:4px;font-size:17px;padding:12px 20px;z-index:200;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes breathe{0%,100%{opacity:.65}50%{opacity:1}}
#couple-names:focus{outline:none}
.timeline-section{padding:58px 14px 64px}.timeline-section .section-label{font-size:16px;font-weight:400;letter-spacing:.3em}.timeline-section>.ornament{margin:30px auto 42px}.timeline-track{position:relative;max-width:390px;margin:0 auto}.timeline-line{position:absolute;left:50%;top:7px;bottom:7px;width:1px;transform:translateX(-50%);background:linear-gradient(180deg,#c4933f80,#c4933f,#c4933f80)}.timeline-row{position:relative;display:grid;grid-template-columns:1fr 42px 1fr;align-items:center;min-height:116px}.timeline-row>time{grid-column:1;grid-row:1;display:block;color:#b78332;font-size:16px;line-height:1.25;letter-spacing:.07em;padding-right:30px;white-space:nowrap}.timeline-row>i{grid-column:2;grid-row:1;margin:auto;width:9px;height:9px;border:1px solid #c4933f;background:var(--cream);transform:rotate(45deg)}.timeline-row>p{grid-column:3;grid-row:1;padding-left:30px;color:var(--ink);font-size:19px;line-height:1.2}.timeline-endpoint{position:absolute;left:50%;width:8px;height:8px;margin-left:-4px;border:1px solid #c4933f;background:var(--cream);transform:rotate(45deg)}.timeline-endpoint.start{top:3px}.timeline-endpoint.end{bottom:3px}.timeline-star{position:absolute;top:7px;left:50%;z-index:3;width:24px;height:24px;margin-top:-12px;will-change:transform;transform:translate(-50%,0);filter:drop-shadow(0 0 5px #d2a54a8c);pointer-events:none}.timeline-star svg{width:100%;height:100%;fill:#fff2c5;stroke:#b78332;stroke-width:1;stroke-linejoin:round}.timeline-star .star-shine{fill:#e8bb60;stroke:none;opacity:.6}.timeline-message{font-size:17px;line-height:1.5;color:#8b7554;max-width:360px;margin:41px auto 0;padding:0 14px}
@media(max-width:390px){.timeline-row{grid-template-columns:1fr 38px 1fr;min-height:108px}.timeline-row>time{padding-right:24px;font-size:15px}.timeline-row>p{padding-left:24px;font-size:18px}.timeline-section{padding:52px 14px 58px}}
.arabic-invitation{font-family:Amiri,'Times New Roman',serif;padding-top:65px;padding-bottom:65px}.arabic-verse{font-size:32px;line-height:1.9;color:#b28a40}.arabic-invitation .ornament{margin-top:27px;margin-bottom:29px}.families{display:flex;align-items:center;justify-content:center;gap:22px;font-size:26px;line-height:1.8}.families p{flex:1}.family-divider{height:55px;width:1px;background:linear-gradient(transparent,#b28a40,transparent);flex-shrink:0}.arabic-invite-line{font-size:24px;line-height:1.8;margin-top:30px}.arabic-names{font:52px/1.7 Amiri,serif;color:#b28a40;margin-top:12px}.arabic-time{font-size:25px;line-height:1.8;margin-top:30px}.arabic-event-date{font-size:23px;margin-top:14px;line-height:1.7}.arabic-venue{font-size:27px;line-height:1.8;margin-top:20px}.arabic-venue span{font-size:23px}.arabic-closing{font-size:25px;line-height:1.8}.timezone-note{font-size:12px;letter-spacing:.16em;color:#7c694a;margin:-11px 0 25px}.location-button{color:#fff9ee;border-color:#d7ae5b;margin-top:25px}.location-button:hover{background:#26364e}.location p.location-arabic{font-family:Amiri,serif;font-size:27px;margin:3px 0 18px;color:#f1d28b}.location p.location-district{font-size:21px;margin:6px 0 0;color:var(--cream)}.thanks-arabic{font:24px/1.9 Amiri,serif;color:var(--pale-gold);margin-top:18px}
.arabic-invitation{isolation:isolate;overflow:hidden}.arabic-verse>span{display:block}.arabic-sparkles{position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 54%,#e7c58320,transparent 55%)}.arabic-sparkles>span{position:absolute;left:var(--spark-x);top:var(--spark-y);font-family:Georgia,serif;font-size:var(--spark-size);line-height:1;color:#c39532;opacity:.15;animation:goldTwinkle 5.5s ease-in-out var(--spark-delay) infinite;will-change:transform,opacity}.arabic-names>span{display:inline-block;position:relative;text-shadow:0 3px 16px #c3953210}.arabic-invitation .ornament b{animation:ornamentGlimmer 4.5s ease-in-out infinite}.arabic-reveal{position:relative}.motion-ready .arabic-reveal{opacity:0;transform:translateY(20px);filter:blur(2px);transition:opacity 1.1s ease var(--reveal-delay,0s),transform 1.1s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0s),filter 1.1s ease var(--reveal-delay,0s)}.motion-ready .arabic-reveal.is-revealed{opacity:1;transform:translateY(0);filter:blur(0)}
@supports(background-clip:text){.arabic-names>span{color:transparent;background:linear-gradient(110deg,#aa8035 15%,#c79e4b 38%,#eed59b 47%,#f8e7bd 50%,#c79e4b 56%,#aa8035 77%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;animation:goldNameSweep 8s ease-in-out infinite}}
@keyframes goldTwinkle{0%,100%{opacity:.1;transform:translateY(7px) scale(.7) rotate(0)}45%{opacity:.6;transform:translateY(-6px) scale(1.2) rotate(12deg)}70%{opacity:.25;transform:translateY(-12px) scale(.85) rotate(25deg)}}
@keyframes ornamentGlimmer{0%,100%{box-shadow:0 0 0 #c3953200;opacity:.6}50%{box-shadow:0 0 10px #c3953259;opacity:1}}
@keyframes goldNameSweep{0%,25%{background-position:100% 0}75%,100%{background-position:0 0}}
.thanks{isolation:isolate;overflow:hidden}.thanks>:not(.thanks-atmosphere){position:relative;z-index:1}.thanks-atmosphere{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 50% 60%,#a97b2514,transparent 55%)}.thanks-atmosphere>i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);background:#f4d991;clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);opacity:.2;animation:thanksStarlight var(--duration) ease-in-out var(--delay) infinite}.thanks-comet{position:absolute;top:13%;left:-20%;width:100px;height:1px;background:linear-gradient(90deg,transparent,#dfb865b3);transform:rotate(25deg);opacity:0;animation:thanksComet 16s ease-in-out 3s infinite}.thanks-heart{display:grid;place-items:center;width:88px;height:88px;margin:17px auto 14px}.thanks-heart .heart{margin:0;width:23px;height:23px;filter:drop-shadow(0 0 10px #e0b55d4d);animation:lovePulse 3.2s ease-in-out infinite}.heart-orbit{position:absolute;inset:10px;border:1px solid #d4aa5438;border-radius:50%;transform:rotate(-24deg) scaleY(.6);animation:loveOrbit 18s linear infinite}.heart-orbit::after{content:'';position:absolute;width:5px;height:5px;left:50%;top:-3px;background:#e5c77d;border-radius:50%;box-shadow:0 0 8px #e0b55d80}.heart-orbit.second{inset:5px;border-color:#d4aa541a;animation-duration:25s;animation-direction:reverse}.thanks .ornament b{animation:ornamentGlimmer 4.5s ease-in-out infinite}.motion-ready .thanks-reveal{opacity:0;transform:translateY(20px);transition:opacity 1.2s ease,transform 1.2s cubic-bezier(.2,.7,.2,1)}.motion-ready .thanks-reveal.is-revealed{opacity:1;transform:translateY(0)}.thanks .signature>span{display:inline-block;background:linear-gradient(110deg,#c2953f 15%,#e6be67 38%,#fff0ba 49%,#e6be67 58%,#c2953f 78%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:goldNameSweep 8s ease-in-out infinite}
@keyframes thanksStarlight{0%,100%{opacity:.12;transform:translateY(9px) scale(.65) rotate(0)}40%{opacity:.7;transform:translateY(-8px) scale(1.25) rotate(15deg)}75%{opacity:.2;transform:translateY(-18px) scale(.8) rotate(30deg)}}
@keyframes thanksComet{0%,75%{opacity:0;left:-20%;top:13%}79%{opacity:.65}94%{opacity:0;left:120%;top:35%}100%{opacity:0;left:120%;top:35%}}
@keyframes lovePulse{0%,100%{transform:scale(1);filter:drop-shadow(0 0 7px #e0b55d33)}50%{transform:scale(1.13);filter:drop-shadow(0 0 14px #e0b55d80)}}
@keyframes loveOrbit{from{transform:rotate(0) scaleY(.6)}to{transform:rotate(360deg) scaleY(.6)}}
@media(prefers-reduced-motion:reduce){.motion-ready .thanks-reveal{opacity:1;transform:none}.thanks .signature>span{color:#e0b55d;background:none}}
@media(prefers-reduced-motion:reduce){.motion-ready .arabic-reveal{opacity:1;transform:none;filter:none}.arabic-sparkles>span{opacity:.25}.arabic-names>span{color:#b28a40;background:none}}
@media(max-width:500px){.arabic-verse{font-size:27px}.families{display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1.4fr);align-items:center;gap:10px;font-size:clamp(15px,4.6vw,21px);line-height:1.8}.families p{min-width:0;white-space:nowrap}.family-divider{height:38px;width:1px;background:linear-gradient(transparent,#b28a40,transparent);margin:0}.arabic-invite-line{font-size:23px}.arabic-names{font-size:47px}.arabic-time{font-size:23px}.arabic-event-date{font-size:21px}.arabic-venue{font-size:25px}.arabic-closing{font-size:24px}.location h2{font-size:32px}}
@media(min-width:721px){.hero-copy{top:6%}.wedding-of{font-size:64px}h1{font-size:72px}.hero-date{font-size:49px}.hero-time{font-size:16px}.section{padding:80px 55px}.rsvp-section{padding:65px 25px}.envelope video{object-position:center}}
@media(max-width:400px){.section{padding:56px 22px}.hero-copy{left:3%;right:3%}h1{font-size:9.7vw;gap:3%}.wedding-of{font-size:10vw;margin-bottom:9%}.hero-date{margin-top:6%;font-size:8.5vw}.hero-time{font-size:10px;letter-spacing:.12em}.story h2{font-size:35px}.story p:not(.section-label){font-size:19px}.section-label{font-size:15px}.countdown{gap:7px}.countdown>div{min-height:99px}.countdown span{font-size:35px}.countdown small{font-size:9px;letter-spacing:.08em}.signature{font-size:36px}.rsvp-section{padding:50px 22px}.rsvp-card{padding-left:20px;padding-right:20px}.floating-controls{left:12px;right:12px}.round-button{width:40px;height:40px}.open-invitation span{top:65%;font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.discover{display:none}}

.hero.hero--couple{aspect-ratio:2/3;background:var(--navy);overflow:hidden}.couple-scene{position:absolute;inset:0;z-index:-1;overflow:hidden}.couple-scene-photo{display:block;width:100%;height:100%;object-fit:cover;transform-origin:50% 45%;animation:coupleCamera 12s ease-in-out infinite;will-change:transform}.couple-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0717334d,transparent 38%,transparent 75%,#0717331f);pointer-events:none}.couple-scene-light{position:absolute;inset:0;background:linear-gradient(135deg,#f2c97824,transparent 55%,#d9a66010);mix-blend-mode:screen;animation:coupleLight 6s ease-in-out infinite}.couple-scene-glow{position:absolute;inset:0;background:radial-gradient(circle at 7% 64%,#fff2bdb3,transparent 4%),radial-gradient(circle at 93% 58%,#ffe7a699,transparent 3%),radial-gradient(circle at 11% 83%,#ffe7a699,transparent 4%),radial-gradient(circle at 90% 88%,#ffe7a666,transparent 4%);mix-blend-mode:screen;filter:blur(7px);opacity:.2;animation:coupleGlow 6s ease-in-out infinite}.sealed .couple-scene-photo,.sealed .couple-scene-light,.sealed .couple-scene-glow{animation-play-state:paused}.hero--couple .hero-copy{top:3%;left:4%;right:4%;text-shadow:0 2px 9px #071733b3;color:#e5c476}.hero--couple .wedding-of{font-size:clamp(30px,7vw,58px);line-height:1.3;margin-bottom:3%}.hero--couple h1{font-size:clamp(30px,8.5vw,68px);line-height:1.3}.hero--couple .hero-date{font-size:clamp(26px,5.5vw,42px);margin-top:3%;line-height:1.3}.hero--couple .hero-time{margin-top:1%;font-size:clamp(10px,1.8vw,14px)}
@keyframes coupleCamera{0%,100%{transform:scale(1.015) translate3d(.35%,.2%,0)}50%{transform:scale(1.085) translate3d(-.65%,-.45%,0)}}
@keyframes coupleLight{0%,100%{opacity:.15}50%{opacity:.7}}
@keyframes coupleGlow{0%,100%{opacity:.12}50%{opacity:.5}}
.hero--couple .hero-copy{text-shadow:0 1px 3px #071733,0 2px 10px #07173399}.hero--couple .hero-time{color:#fff6df;font-weight:600;text-shadow:0 1px 4px #071733,0 2px 9px #071733}
@media(prefers-reduced-motion:reduce){.couple-scene-photo{transform:none;will-change:auto}.couple-scene-light{opacity:.2}.couple-scene-glow{opacity:.12}}