:root{--ivory:#F8F3EA;--paper:#F3EBDD;--warm-beige:#E7D8C5;--champagne:#D8C39A;--antique-gold:#B69A63;--soft-brown:#6B5742;--deep-espresso:#2F2923;--dusty-rose:#B98F8F;--line:rgba(182,154,99,.35);--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#302c27;background-image:radial-gradient(ellipse at 30% 20%,#5b5144,transparent 65%),repeating-linear-gradient(45deg,transparent 0 2px,#ffffff02 2px 3px);color:var(--soft-brown);font-family:'Tajawal',sans-serif;font-size:17px;line-height:1.9}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--deep-espresso);outline-offset:6px}[hidden]{display:none!important}main,.opening{width:100%;max-width:460px;margin:auto;background-color:var(--ivory);background-image:url('images/paper.svg');overflow:hidden}main{box-shadow:0 0 100px #0003}h1,h2,h3,p{margin:0}h2{font-family:'Amiri',serif;font-size:35px;font-weight:400;line-height:1.6;color:var(--deep-espresso)}h3{font-family:'Amiri',serif;font-size:28px;font-weight:400}.eyebrow{font-size:13px;letter-spacing:.06em;color:var(--soft-brown)}.ornament{display:flex;align-items:center;justify-content:center;gap:15px;color:var(--antique-gold);font-family:Georgia,serif;font-size:30px;margin:20px 0}.ornament span{height:1px;width:47px;background:linear-gradient(90deg,transparent,var(--antique-gold),transparent)}
.opening{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px 35px;isolation:isolate}.opening:before,.closing:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 100% 0%,#d8c39a26,transparent 45%),radial-gradient(ellipse at 0% 100%,#b98f8f15,transparent 50%);pointer-events:none}.opening-border{position:absolute;inset:19px;border:1px solid var(--line);pointer-events:none}.opening-border:after{content:'';position:absolute;inset:5px;border:1px solid #b69a631a}.opening-top{text-align:center}.opening-top .eyebrow{font-family:Georgia,serif;font-size:10px;letter-spacing:3px}.opening-top .ornament{margin:12px 0 9px}.opening h1{font-family:'Amiri',serif;font-size:43px;font-weight:400;color:var(--deep-espresso)}.opening-top p{font-family:'Amiri',serif;font-size:15px;margin-top:9px}.envelope{display:block;position:relative;width:310px;max-width:90%;height:200px;margin:56px 0 34px;border:1px solid #b49c724f;background:#e9ddc7;box-shadow:0 18px 35px #6b574225,0 2px 4px #6b574211;isolation:isolate;perspective:1000px;animation:float 5s ease-in-out infinite}.envelope-letter{position:absolute;inset:14px 15px;background:var(--ivory);padding:18px;font-family:'Amiri';font-size:15px;border:1px solid var(--line);transition:transform 1s var(--ease)}.letter-names{display:block;font-size:29px}.envelope-pocket{position:absolute;inset:0;background:linear-gradient(145deg,#f0e7d7,#e8dcc6);clip-path:polygon(0 0,50% 54%,100% 0,100% 100%,0 100%);z-index:3}.envelope-pocket:after{content:'';position:absolute;inset:8px;border:1px solid #b69a6338}.envelope-flap{position:absolute;inset:0;background:linear-gradient(165deg,#f5eddf,#e8dcc4);clip-path:polygon(0 0,100% 0,50% 57%);z-index:4;transform-origin:top;filter:drop-shadow(0 2px 1px #79614333);transition:transform .85s var(--ease)}.seal{position:absolute;width:55px;height:55px;left:calc(50% - 27px);top:85px;z-index:5;border-radius:50%;background:radial-gradient(circle at 35% 25%,#ddc591,#ae8c4d 75%);border:4px double #d9bf85;color:#725529;font-family:'Aref Ruqaa',serif;font-size:26px;line-height:40px;box-shadow:0 3px 6px #69532e40;transition:opacity .3s}.seal span{font-size:17px;margin-right:1px}.opening-names{display:flex;gap:18px;align-items:center;justify-content:center;font-family:'Aref Ruqaa',serif;font-size:35px;color:var(--deep-espresso)}.opening-names em{font-family:Georgia,serif;font-size:21px;color:var(--antique-gold)}.opening-bottom{text-align:center}.open-hint{font-size:15px;margin:22px 0 12px}.open-hint span{margin-right:9px;color:var(--antique-gold)}.mini-date{font-family:Georgia,serif;font-size:12px;letter-spacing:4px}.brand{font-family:Georgia,serif;letter-spacing:5px;font-size:10px;margin-top:48px;color:#8d7858}.is-opening{animation:openingOut 1.2s var(--ease) forwards}.is-opening .envelope{animation:none;transform:scale(1.025)}.is-opening .envelope-flap{transform:rotateX(180deg);z-index:1}.is-opening .seal{opacity:0}.is-opening .envelope-letter{transform:translateY(-50px)}
.hero{height:850px;max-height:1050px;min-height:740px;position:relative;text-align:center;isolation:isolate}.hero-image{position:absolute;inset:0;background:var(--warm-beige);z-index:-2}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;filter:saturate(.6)}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#f8f3ea2b 0%,#f8f3ea00 30%,#f8f3eaaa 55%,#f8f3ea 90%);z-index:-1}.hero-frame{position:absolute;inset:20px 20px 44px;border:1px solid #fff7e080;border-radius:210px 210px 0 0;pointer-events:none}.hero-kicker{position:absolute;top:48px;right:0;left:0;color:white;font-family:'Amiri';font-size:17px;text-shadow:0 1px 8px #0009}.hero-content{position:absolute;bottom:22px;left:20px;right:20px}.hero-names{display:flex;flex-direction:column;align-items:center;font-family:'Aref Ruqaa',serif;color:var(--deep-espresso);font-size:82px;line-height:1.45}.hero-names em{font-family:Georgia,serif;font-size:30px;color:#957844;display:flex;align-items:center;gap:18px;line-height:1}.hero-names em:before,.hero-names em:after{content:'';width:47px;height:1px;background:var(--line)}.hero-content p{font-family:'Amiri';font-size:19px;margin-top:27px}.hero-date{font-family:Georgia;font-size:15px;letter-spacing:4px;margin-top:17px}.scroll-cue{text-decoration:none;display:block;width:44px;margin:14px auto 0;color:var(--antique-gold);font-size:26px}
section{text-align:center;padding:40px 29px}.message-section{padding-top:22px;padding-bottom:65px}.message-card{padding:32px 15px;border:1px solid var(--line);outline:1px solid #b69a6318;outline-offset:6px;box-shadow:0 8px 28px #6b574206}.message-card .ornament{margin:12px 0 21px}.message-card h2{margin:12px 0 18px}.message-card p{font-family:'Amiri';font-size:20px;line-height:2.1}.message-card .ornament:last-child{margin:26px 0 7px}.count-section{padding-top:4px;padding-bottom:66px}.count-section h2{margin:10px 0 26px;font-size:32px}.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.countdown>div{border:1px solid var(--line);padding:13px 0 10px;background:#fffaf24d}.countdown b{font-family:Georgia,serif;font-size:32px;font-weight:400;display:block;color:var(--soft-brown);line-height:1.5}.countdown span{font-size:14px}.wedding-today{grid-column:1/-1;font-family:'Amiri';font-size:28px}.event-section{background:#e7d8c532;padding-top:45px;padding-bottom:60px}.event-section h2{margin:5px 0 27px}.event-card{border:1px solid var(--line);padding:6px 26px 31px;background:#f8f3ea88;position:relative}.event-card:before,.event-card:after{content:'✧';position:absolute;top:-16px;color:var(--antique-gold);background:var(--paper);font-size:21px;line-height:28px}.event-card:before{right:20px}.event-card:after{left:20px}.detail{padding:26px 0;border-bottom:1px solid var(--line)}.detail:last-of-type{border:0}.detail svg,.location-card>svg{display:block;width:26px;height:26px;margin:0 auto 9px;color:#9d8050}.detail>span{font-size:14px;display:block}.detail strong{display:block;font-family:'Amiri';font-size:26px;font-weight:400;color:var(--deep-espresso);line-height:1.7}.detail p{font-size:17px}.gold-button{display:flex;align-items:center;justify-content:center;gap:27px;width:100%;min-height:50px;border:1px solid var(--antique-gold);border-radius:30px;text-decoration:none;background:#b69a63;color:#231e17;font-size:16px;transition:background .3s,transform .3s}.gold-button:hover{background:var(--champagne)}.gold-button:active{transform:scale(.98)}.gallery-section{padding-top:65px;padding-bottom:50px}.gallery-section h2{margin-top:4px}.gallery-section .ornament{margin:12px 0 27px}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:stretch;direction:ltr}.photo-frame{padding:6px;border:1px solid #a98c56;background:linear-gradient(135deg,#d8c39a,#f8efda 35%,#b49a67 70%,#e2ce9f);box-shadow:0 7px 15px #6b57421c;min-width:0;overflow:hidden;position:relative}.photo-frame:after{content:'';position:absolute;inset:4px;border:1px solid #fff9e8b3;pointer-events:none}.photo-frame img{display:block;object-fit:cover;width:100%;height:100%;min-height:145px;filter:saturate(.65);transition:transform 1.2s var(--ease)}.photo-frame:hover img{transform:scale(1.035)}.photo-0{grid-row:span 2;transform:rotate(-1deg)}.photo-1,.photo-2{height:158px}.photo-3{grid-column:span 2;height:215px}.photo-4{grid-column:span 2;width:75%;height:330px;margin:10px auto 0;transform:rotate(1deg)}.empty-gallery{grid-column:1/-1}.location-section{padding-top:20px;padding-bottom:40px}.location-card{border:1px solid var(--line);padding:32px 24px;background:linear-gradient(145deg,#eee3d14d,#fffaf34d)}.location-card>svg{width:32px;height:32px;margin-bottom:20px}.location-card h2{margin-top:7px}.location-card h3{margin-top:13px}.location-card p{font-size:16px}.location-card .ornament{margin:14px 0}.qr-card{border:1px solid var(--line);padding:20px;max-width:240px;margin:auto}.qr-card img{width:140px;max-width:100%}.qr-card p{font-size:15px}.closing{position:relative;padding:50px 24px 28px}.closing h2{font-size:32px}.closing p{font-family:'Amiri';font-size:22px}.closing-names{font-family:'Aref Ruqaa';font-size:43px;display:flex;justify-content:center;gap:17px;align-items:center;margin:27px 0 37px}.closing-names em{font-family:Georgia;font-size:22px;color:var(--antique-gold)}.footer-line{width:35px;height:1px;background:var(--line);margin:0 auto 18px}footer{font-family:Georgia;font-size:10px;letter-spacing:1.7px;color:#8b785f}.music-button{position:fixed;bottom:23px;left:max(20px,calc(50% - 207px));width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#f8f3eaf0;border:1px solid var(--antique-gold);box-shadow:0 4px 20px #30291e1c;color:#8a6c37;z-index:5}.music-button svg{width:21px;height:21px}.music-state{position:absolute;bottom:9px;right:10px;width:6px;height:6px;border-radius:50%;background:#9b8d76}.playing .music-state{background:var(--antique-gold);box-shadow:0 0 0 3px #b69a6326}.music-hint{position:fixed;bottom:80px;left:max(20px,calc(50% - 207px));background:var(--ivory);border:1px solid var(--line);padding:7px 15px;border-radius:20px;font-size:14px;z-index:5}dialog{border:0;padding:45px 16px 20px;background:transparent;color:white;width:min(95vw,800px);max-height:94svh;text-align:center}dialog::backdrop{background:#191511eb;backdrop-filter:blur(6px)}dialog img{display:block;max-width:100%;max-height:77svh;object-fit:contain;margin:auto}dialog p{font-family:Georgia;font-size:14px;margin-top:8px}#close-lightbox{position:absolute;top:0;left:8px;width:44px;height:44px;border:0;color:white;background:transparent;font-size:35px}.image-unavailable{background:var(--warm-beige);font-size:15px;color:var(--soft-brown)}@keyframes float{50%{transform:translateY(-7px)}}@keyframes openingOut{0%,55%{opacity:1}100%{opacity:0;transform:scale(1.025)}}@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@media(min-width:600px){body{padding:30px 0}.opening{min-height:calc(100svh - 60px);box-shadow:0 20px 90px #0004}.hero{height:860px}.opening-border{inset:22px}}@media(max-width:375px){section{padding-left:23px;padding-right:23px}.opening{padding-left:20px;padding-right:20px}.envelope{margin-top:42px;height:185px}.seal{top:78px}.opening-top p{font-size:14px}.hero-names{font-size:76px}.countdown{gap:7px}.countdown b{font-size:28px}.closing h2{font-size:29px}}@media(prefers-reduced-motion:reduce){html:not([data-motion="on"]){scroll-behavior:auto}html:not([data-motion="on"]) *,html:not([data-motion="on"]) *:before,html:not([data-motion="on"]) *:after{animation:none!important;transition:none!important}}

.opening{background-image:linear-gradient(#f8f3ea3d,#f8f3ea3d),url('images/floral.png');background-size:cover;background-position:center}.message-card{background-image:linear-gradient(#f8f3eadb,#f8f3eadb),url('images/floral.png');background-size:cover}.closing{background-image:linear-gradient(#f8f3ead4,#f8f3ead4),url('images/floral.png');background-size:cover;background-position:center}.hero-frame{z-index:1}

/* Eight supplied frames form the premium envelope-opening sequence. */
.envelope.envelope-sequence{width:min(360px,96vw);height:300px;margin:30px 0 14px;border:0;background:transparent;box-shadow:none;overflow:visible;padding:0}
.envelope-sequence img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 20px rgba(75,57,32,.18))}
.is-opening .envelope-sequence{animation:none;transform:scale(1.025);transition:transform 1.25s var(--ease)}
@media(max-height:740px){.envelope.envelope-sequence{height:250px;margin:15px 0 5px}.brand{margin-top:24px}}
