@import url('https://fonts.googleapis.com/css2?family=Noto+Nastaliq+Urdu:wght@400;500;600&family=Dancing+Script:wght@400;500;600;700&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Cinzel:wght@400;500&display=swap');
:root{color-scheme:light;--ink:#3b4432;--olive:#6b7d55;--paper:#d6c5ac;--script:'Dancing Script',cursive;--serif:'Cormorant Garamond',Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:20px/1.6 var(--serif)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--olive);outline-offset:6px}button:disabled{cursor:wait}h1,h2,h3,p{margin:0}h2{font:500 clamp(38px,5vw,56px)/1.2 var(--script);margin:8px 0 22px}h3{font-weight:500}.hero{height:100svh;min-height:620px;position:relative;overflow:hidden;display:grid;place-items:center;background:#d8c8b1}.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.open{position:absolute;inset:0;width:100%;border:0;background:transparent;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:24px;z-index:3;transition:opacity .6s}.seal{display:grid;place-content:center;width:92px;height:92px;border-radius:50%;border:1px solid #aa956a;background:linear-gradient(135deg,#eee0bd,#c2aa75);box-shadow:0 4px 22px #483b3533,inset 0 0 0 5px #dfcfaa,inset 0 0 0 6px #bfa471;font:24px var(--script)}.seal i{font-size:17px}.open-label{font:11px 'Cinzel',serif;letter-spacing:.2em;background:#f8f1e1dd;padding:12px 20px;border-radius:30px}.open.opened{opacity:0;pointer-events:none}.couple{position:relative;z-index:2;text-align:center;transform:translateY(-50px);opacity:0;pointer-events:none;text-shadow:0 2px 14px #ffffff99;transition:opacity 1.6s,transform 1.6s}.couple.visible{opacity:1;transform:translateY(-80px)}.couple>p{font:400 clamp(24px,3vw,36px) var(--script);margin-top:14px}.couple h1{font:400 clamp(64px,9vw,128px)/1 var(--script)}.couple h1>span{display:block}.couple h1 small{display:block;font-size:36px;margin:12px}.heart{font-size:28px}.divider{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--olive);font-size:12px;margin:30px auto;width:200px;max-width:100%}.divider:before,.divider:after{content:'';height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--olive))}.divider:after{transform:rotate(180deg)}.couple .divider{width:160px;margin:20px auto}.scroll{position:absolute;bottom:65px;left:50%;transform:translateX(-50%);text-align:center;text-decoration:none;font:11px Georgia,serif;letter-spacing:3px;z-index:2}.scroll span{display:block;font-size:26px;line-height:1.5;animation:bob 2s infinite}.music{position:fixed;right:20px;top:20px;z-index:20;width:44px;height:44px;border:1px solid #6b7d5560;border-radius:50%;background:#f8efdbd9;backdrop-filter:blur(8px);font-size:23px;box-shadow:0 2px 12px #3b443215}.music[aria-pressed=true]{box-shadow:0 0 0 5px #6b7d5520}.paper{background-image:url('assets/welcome.jpg'),url('assets/paper.jpg');background-position:top center,center 140.4888vw;background-repeat:no-repeat,repeat-y;background-size:100% auto,100% auto}.welcome{padding:100px 12% 68px;text-align:center}.welcome p{font-size:clamp(24px,3vw,32px);font-style:italic;line-height:1.7;max-width:670px;margin:auto}.section{padding:54px max(12%,24px);text-align:center}.section>.divider:last-child{margin-top:64px;margin-bottom:0}.eyebrow{font:10px/1.7 'Cinzel',serif;letter-spacing:.23em;text-transform:uppercase;color:#65714f}.hint{font-size:18px;font-style:italic}.scratch{position:relative;max-width:340px;height:210px;margin:30px auto 24px;border:1px solid #94a17b;border-radius:12px;overflow:hidden;box-shadow:0 8px 26px #4b513020;background:#f2ead6}.date{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.date>span{font:12px 'Cinzel',serif;letter-spacing:.18em}.date strong{font:64px/1.1 var(--serif);margin:6px}.date small{margin-top:10px;font-size:17px}.scratch canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;transition:opacity .65s}.scratch-label{position:absolute;inset:0;width:100%;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:34px;pointer-events:none}.scratch-label span{font:28px var(--script)}.scratch-label small{font:13px var(--serif);margin-top:10px}.scratch-label:focus-visible{outline-offset:-8px}.scratch.revealed canvas,.scratch.revealed .scratch-label{opacity:0;pointer-events:none}.outline{display:inline-block;border:1px solid #6b7d5580;border-radius:5px;padding:10px 24px;background:#f5ecd340;text-decoration:none;font:15px var(--serif);transition:background .2s}.outline:hover{background:#f5ecd3b0}.countdown{display:flex;align-items:center;justify-content:center;gap:20px;margin:32px 0 20px}.countdown div{min-width:62px}.countdown strong{display:block;font:48px/1.2 var(--serif)}.countdown span{font:9px 'Cinzel',serif;letter-spacing:.14em}.countdown b{font-size:24px;font-weight:400;opacity:.4;align-self:flex-start;margin-top:8px}.people{display:flex;justify-content:center;align-items:center;gap:50px;margin:35px auto}.people h3{font:48px var(--script)}.people p{font-size:16px;margin-top:12px}.amp{font:40px var(--script);color:var(--olive)}.verse{font-style:italic;font-size:22px;margin-top:30px}.venue{max-width:560px;margin:28px auto}.venue-icon{font-size:40px;color:var(--olive)}.venue h3{font:30px var(--serif);margin:14px 0}.venue p{font-size:18px;margin:14px 0 20px}.schedule{display:flex;justify-content:center;gap:80px;margin:35px auto}.schedule>div{flex:0 1 230px}.schedule span{font:12px 'Cinzel',serif;letter-spacing:.15em}.schedule h3{font:28px var(--script);margin:14px 0 8px}.schedule p{font-size:17px}.ending{min-height:680px;background:url('assets/ending.jpg') center bottom/cover no-repeat;text-align:center;padding:100px 15% 180px;display:grid;place-items:center}.signature{font:44px var(--script);margin:24px 0}.ending small{font:11px var(--serif);opacity:.65}.reveal{opacity:0;transform:translateY(22px);transition:opacity .9s,transform .9s}.reveal.in{opacity:1;transform:none}.status{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:#f6edda;box-shadow:0 2px 20px #0002;border-radius:8px;padding:10px 20px;z-index:25;font-size:16px}.status:empty{display:none}@keyframes bob{50%{transform:translateY(8px)}}@media(max-width:600px){.hero{min-height:560px}.couple.visible{transform:translateY(-64px)}.couple h1{font-size:64px}.welcome{padding:96px 13% 35px}.welcome p{font-size:24px}.section{padding:44px 14%}.eyebrow{font-size:9px}.countdown{gap:9px}.countdown div{min-width:40px}.countdown strong{font-size:34px}.countdown span{font-size:8px;letter-spacing:.05em}.countdown b{font-size:18px}.people{flex-direction:column;gap:22px}.schedule{flex-direction:column;gap:32px}.schedule>div{flex:auto}.ending{min-height:600px;padding:75px 15% 190px;background-size:100% 100%}.signature{font-size:36px}.scratch{height:195px}.music{right:14px;top:14px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}@media print{.music,.open,.scroll,.outline,canvas,.scratch-label{display:none!important}.couple,.reveal{opacity:1!important}.hero{height:600px}.section{break-inside:avoid}}

/* Refined invitation details and encoding-independent icons. */
.icon{display:inline-block;width:22px;height:22px;flex-shrink:0;vertical-align:middle}
.divider .icon{width:14px;height:14px;fill:currentColor;stroke-width:0}
.heart>.icon{width:27px;height:27px;fill:currentColor;stroke-width:0}
.music{display:grid;place-items:center;box-shadow:0 4px 16px #3b44321a}
.music .icon{width:20px;height:20px}
.scroll .icon{width:22px;height:22px}
.outline{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:12px 22px;border-radius:24px;background:#fbf6e9a6;font-size:17px;box-shadow:0 3px 10px #3b443209}
.outline .icon{width:18px;height:18px}
.outline:hover{background:#fff9ed;transform:translateY(-1px)}
.venue-icon .icon{width:44px;height:44px}
.date-section{padding-top:28px;padding-bottom:32px}
.date-panel{max-width:540px;margin:auto;padding:42px 40px 34px;border:1px solid #9caa8270;border-radius:140px 140px 24px 24px;background:linear-gradient(155deg,#fffaf0e8,#eee6d5df);box-shadow:0 16px 45px #4b513014,inset 0 0 0 7px #fffdf333}
.date-panel .eyebrow{font-size:9px;letter-spacing:.19em;margin-top:8px}
.date-panel h2{margin:12px 0;font-size:48px}
.date-panel .hint{font-size:18px;color:#60664f}
.scratch{margin:25px auto 22px;max-width:350px;height:222px;border-color:#97a57b;border-radius:14px;box-shadow:0 5px 18px #4b513013}
.scratch-label>.icon{width:32px;height:32px;margin-bottom:15px;stroke-width:1.2}
.scratch-label span{font-size:30px}
.scratch-label small{font-size:14px;margin-top:9px}
.section{max-width:1200px;margin:auto}
.people{gap:20px;max-width:900px;margin:0 auto 16px;align-items:center}
.people .person{flex:1;min-width:0}
.people h3{font-size:52px}
.people p{max-width:170px;margin:12px auto 0;line-height:1.45;color:#667052}
.couple-art{flex:0 1 330px;margin:0;width:330px;max-width:100%;position:relative}
.couple-art:before{content:'';position:absolute;inset:18% 0 5%;border-radius:50% 50% 42% 42%;background:radial-gradient(ellipse,#f9f0d990,transparent 70%);z-index:0}
.couple-art img{position:relative;display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 12px 10px #53493212)}
.countdown{gap:12px}.countdown>div{min-width:72px;padding:14px 10px 12px;background:#fff8e85c;border:1px solid #9aa67b45;border-radius:12px}.countdown b{align-self:center;margin:0}.countdown strong{font-size:42px}.countdown span{font-size:9px}
.venue{padding:26px 24px 30px;border:1px solid #9caa8260;border-radius:20px;background:#fff8e850}
.welcome{padding-bottom:42px}
.ending .reveal>p:not(.signature){font-size:19px}
@media(min-width:900px){.section{padding-left:100px;padding-right:100px}.welcome{padding-top:90px}.people{gap:30px}.couple-art{flex-basis:350px}}
@media(max-width:600px){.section{padding-left:11%;padding-right:11%}.date-panel{padding:34px 18px 26px;border-radius:100px 100px 20px 20px}.date-panel h2{font-size:40px}.date-panel .eyebrow{font-size:8px}.date-panel .hint{font-size:17px}.scratch{height:204px}.scratch-label span{font-size:27px}.date-panel .outline{font-size:15px}.people{display:grid;grid-template-columns:1fr 1fr;gap:16px}.couple-art{grid-row:1;grid-column:1/-1;width:270px;justify-self:center}.people .person{grid-row:2}.people h3{font-size:39px}.people p{font-size:15px}.countdown{gap:5px}.countdown>div{min-width:0;flex:1;padding:12px 3px 10px}.countdown strong{font-size:30px}.countdown span{font-size:7px}.countdown b{font-size:16px}.venue{padding:24px 16px}}

/* Urdu host invitation: generous leading keeps Nastaliq marks unclipped. */
.urdu-message{max-width:720px;margin:0 auto;padding:25px 36px 38px;border:1px solid #9caa8245;border-radius:22px;background:#fff8ea70;font-family:'Noto Nastaliq Urdu','Urdu Typesetting','Noto Naskh Arabic',serif;text-align:center;direction:rtl}
.welcome .urdu-message p{font-family:inherit;font-style:normal;font-size:23px;line-height:2.65;margin:18px auto;max-width:620px;overflow-wrap:break-word}
.urdu-message h2{font-family:inherit;font-size:42px;line-height:2.5;margin:12px 0 18px;font-weight:500}
.welcome .urdu-message .urdu-greeting{font-size:23px;color:#5b694a;margin-top:0}
.welcome .urdu-message .urdu-salutation{text-align:right;margin-bottom:0}
.welcome .urdu-message .urdu-honor{color:#465639;font-weight:500;margin-top:25px}
.urdu-signature{margin-top:28px;padding-top:12px}
.welcome .urdu-signature p{font-size:18px;margin:0}
.welcome .urdu-signature .host-name{font-size:29px;font-weight:600;margin-top:6px}
@media(max-width:600px){.welcome{padding-left:11%;padding-right:11%;padding-top:62px}.urdu-message{padding:24px 20px 32px;border-radius:18px}.welcome .urdu-message p{font-size:18px;line-height:2.75;margin:16px auto}.welcome .urdu-message .urdu-greeting{font-size:18px;line-height:2.7}.urdu-message h2{font-size:33px;margin:10px 0}.welcome .urdu-signature p{font-size:17px;margin:0}.welcome .urdu-signature .host-name{font-size:24px;line-height:2.7}}

.couple>.bismillah{font-family:'Noto Nastaliq Urdu','Traditional Arabic',serif;font-size:clamp(19px,2.3vw,29px);line-height:2.6;margin:0 0 14px}
.couple .heart{display:none}.couple h1{font-size:clamp(64px,8vw,112px)}
.people .person h3{font-size:clamp(30px,3.5vw,46px);line-height:1.35}
.thanks-arabic{font-family:'Noto Nastaliq Urdu','Traditional Arabic',serif;font-size:34px;line-height:2.7;margin:0 0 10px}
.compliments{max-width:590px;margin:36px auto 0;padding-top:24px;border-top:1px solid #6b7d5560}
.compliments>p:last-child{font-size:17px;line-height:1.9;margin-top:16px}.ending{min-height:900px}
@media(max-width:600px){.couple h1{font-size:64px}.couple>.bismillah{font-size:18px;line-height:2.7;max-width:310px;margin:0 auto 15px}.people .person h3{font-size:31px}.compliments>p:last-child{font-size:16px}.thanks-arabic{font-size:28px}.ending{padding-left:13%;padding-right:13%;min-height:860px}.ending .signature{font-size:39px}}

/* Bilingual host letters: readable type and separate language direction. */
.urdu-message,.english-message{max-width:760px;margin:0 auto;padding:38px 42px 42px;border:1px solid #9caa8245;border-radius:22px;background:#fff8ea85}
.english-message{margin-top:32px;text-align:left}
.welcome .urdu-message p{font-size:26px;line-height:2.7;margin:24px auto}
.welcome .urdu-message .urdu-greeting{font-size:26px;line-height:2.7}
.welcome .urdu-message .urdu-salutation{margin-top:30px}
.welcome .urdu-signature p{font-size:23px;margin:0}
.welcome .urdu-signature .host-name{font-size:32px}
.welcome .english-message p{max-width:none;font-family:var(--serif);font-style:normal;font-size:25px;line-height:1.75;margin:0 0 24px}
.welcome .english-message .english-greeting{text-align:center;color:#5b694a;font-size:24px;line-height:1.65;margin-bottom:34px}
.english-honor,.urdu-honor{padding:20px 0;border-top:1px solid #9caa8245;border-bottom:1px solid #9caa8245;color:#465639}
.english-signature{margin-top:30px}.welcome .english-signature p{margin:0}.welcome .english-signature .host-name-en{font-size:29px}
.bouquet{font-family:'Segoe UI Emoji','Apple Color Emoji',sans-serif;font-size:.8em;white-space:nowrap}
@media(max-width:600px){.urdu-message,.english-message{padding:26px 20px 30px;border-radius:18px}.welcome .urdu-message p{font-size:21px;line-height:2.65;margin:22px auto}.welcome .urdu-message .urdu-greeting{font-size:21px}.welcome .urdu-signature p{font-size:20px;margin:0}.welcome .urdu-signature .host-name{font-size:26px}.welcome .english-message p{font-size:22px;line-height:1.65;margin-bottom:22px}.welcome .english-message .english-greeting{font-size:22px;line-height:1.65}.welcome .english-signature p{margin:0}.welcome .english-signature .host-name-en{font-size:25px}.english-message{margin-top:24px}}

/* Keep the full names comfortably inside the floral frame. */
.couple h1{font-size:clamp(48px,7vw,100px)}
@media(max-width:600px){.couple{width:100%;padding:0 25px}.couple h1{font-size:clamp(40px,10.8vw,62px);line-height:1.2}.ending .signature{font-size:32px;line-height:1.5}}