@font-face{font-family:Ruqaa;src:url('./fonts/aref-ruqaa-bold.woff') format('woff');font-weight:700;font-display:swap}
@font-face{font-family:Amiri;src:url('./fonts/amiri.woff') format('woff');font-weight:400;font-display:swap}
@font-face{font-family:Cormorant;src:url('./fonts/cormorant.woff') format('woff');font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url('./fonts/jost.woff') format('woff');font-weight:400;font-display:swap}
:root{color-scheme:dark;--wine:#361721;--burgundy:#542132;--light-burgundy:#713044;--cream:#f1e4d8;--gold:#d4b476;--gold-light:#f2dda8;--muted:#d5b5aa;--line:#d4b47655;--foil:linear-gradient(115deg,#b58a46 0%,#f4dfab 28%,#cba65e 52%,#f0d8a0 76%,#bc914f 100%)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--wine);color:var(--cream);font:400 15px/1.7 Jost,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button,a{touch-action:manipulation}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--gold-light);outline-offset:6px}button:disabled{cursor:default}svg{display:block}h1,h2,h3,p{margin:0}h1,h2,h3,.serif{font:400 48px/1.1 Cormorant,Georgia,serif}button,a{transition:background-color .25s,color .25s,border-color .25s,box-shadow .25s}section{scroll-margin-top:24px}.eyebrow,.english-names{font-size:10px;text-transform:uppercase;letter-spacing:.28em;color:var(--muted);line-height:2}.eyebrow{color:var(--gold)}.leaf{position:absolute;pointer-events:none;width:440px;height:610px;color:var(--gold);opacity:.2}.leaf svg{width:100%;height:100%}.engraving{fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.filigree{width:140px;height:54px;color:var(--gold);margin:0 auto;opacity:.85}.filigree svg{width:100%;height:100%}
/* The paper texture stays still; only the decorative foliage moves. */
.welcome,.hero,.intro,.details,.closing{position:relative;isolation:isolate}.welcome:after,.hero:before,.intro:after,.closing:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' opacity='.035' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E");opacity:.5}
.welcome{position:fixed;inset:0;z-index:20;display:grid;place-items:center;overflow-y:auto;overflow-x:hidden;padding:42px 22px;background:radial-gradient(ellipse at 50% 38%,#743245 0%,#542132 48%,#361721 100%);transition:opacity .8s ease,visibility .8s;overscroll-behavior:contain}.welcome:before{content:'';position:fixed;inset:20px;border:1px solid var(--gold);box-shadow:inset 0 0 0 7px #542132,inset 0 0 0 8px var(--line);pointer-events:none}.welcome .leaf{width:460px;height:670px;opacity:.24}.welcome .left{left:-190px;bottom:-190px;transform:rotate(25deg)}.welcome .right{right:-190px;top:-170px;transform:rotate(205deg)}.welcome-inner{position:relative;width:min(570px,100%);padding:24px 22px;text-align:center;transition:transform .75s cubic-bezier(.2,.65,.3,1),opacity .55s}.bismillah{font:400 23px/1.9 Amiri,serif;color:var(--gold-light);margin-bottom:20px}.cover-ornament{display:none}.royal-names{font-family:Ruqaa,serif;font-weight:700;letter-spacing:0;line-height:1.65;overflow:visible}.arabic-name{display:inline-block;color:var(--gold-light);padding:.12em .2em .2em;line-height:1.7;letter-spacing:0;font-style:normal;overflow:visible}
@supports(background-clip:text){.arabic-name{background:var(--foil);background-clip:text;-webkit-background-clip:text;color:transparent}}
.cover-monogram{display:flex;justify-content:center;align-items:center;gap:8px;font-size:clamp(44px,8.2vw,78px);margin:18px 0 0}.cover-monogram .name-join{font-size:28px;color:var(--gold)}.cover-rule{height:1px;width:140px;margin:4px auto 22px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}.welcome .english-names{font-size:10px;letter-spacing:.3em;color:var(--gold-light);margin:12px 0}.cover-date{font-size:11px;letter-spacing:.23em;color:var(--muted);margin:18px 0 28px}.welcome .filigree{margin-top:24px}
nav{display:flex;align-items:center;justify-content:space-between;position:absolute;top:0;left:0;width:100%;padding:28px 6%;z-index:2}.monogram{font:400 italic 29px/1.4 Cormorant,Georgia,serif;letter-spacing:.06em;color:var(--gold-light)}nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-light)}.skip-link{position:fixed;top:10px;left:10px;z-index:30;transform:translateY(-200%);padding:12px 20px;background:var(--wine);border:1px solid var(--gold)}.skip-link:focus{transform:none}
.hero{display:grid;place-items:center;min-height:100svh;height:auto;padding:118px 38px 130px;background:radial-gradient(ellipse at 50% 28%,#713044 0%,#542132 58%,#4b202e 100%);overflow:hidden;text-align:center;color:var(--cream)}.hero:after{content:'';position:absolute;inset:21px;border:1px solid var(--line);pointer-events:none}.hero .leaf{width:520px;height:750px;opacity:.22}.hero .left{left:-210px;bottom:-160px;transform:rotate(20deg)}.hero .right{right:-220px;top:-160px;transform:rotate(205deg)}.hero .extra{right:-230px;bottom:-270px;transform:rotate(-40deg);opacity:.12}.hero-center{position:relative;width:min(540px,100%);min-width:0;padding:86px 40px 48px;isolation:isolate;z-index:1}.arch{position:absolute;inset:0;border:1px solid var(--gold);border-radius:270px 270px 5px 5px;box-shadow:0 0 0 8px #542132,0 0 0 9px var(--line);pointer-events:none;z-index:-1}.arch:before,.arch:after{content:'✦';position:absolute;bottom:-10px;background:var(--burgundy);padding:0 5px;color:var(--gold);font-size:17px;line-height:20px}.arch:before{left:-11px}.arch:after{right:-11px}.hero-center>.filigree{width:100px;height:38px;margin-bottom:12px}.arabic-invite{font:400 23px/1.9 Amiri,serif;color:var(--muted)}.hero h1{font-size:clamp(76px,8.2vw,102px);margin:4px 0 0;line-height:1.65}.hero h1 .arabic-name{display:block;padding:.02em .2em .1em;line-height:1.6}.hero h1 .name-join{display:block;color:var(--gold);font-size:27px;line-height:1.2}.hero .english-names{margin:14px 0 0;font-size:10px;color:var(--gold-light)}.hero-date{font-size:11px;letter-spacing:.17em;color:var(--gold-light);margin-top:24px}.hero-place{font-size:12px;color:var(--muted);letter-spacing:.08em;margin-top:7px}.hero-time{display:block;font-size:10px;letter-spacing:.17em;color:var(--gold);margin-top:8px}.scroll{position:absolute;bottom:35px;display:flex;align-items:center;flex-direction:column;justify-content:center;min-height:50px;text-decoration:none;font-size:10px;letter-spacing:.22em;color:var(--gold-light);z-index:1}.scroll:after{content:'';width:1px;height:24px;background:linear-gradient(var(--gold),transparent);margin-top:9px}
.intro{text-align:center;padding:90px 24px 78px;background:linear-gradient(#4b202e,#552535);overflow:hidden}.sprig{width:70px;height:88px;margin:auto;color:var(--gold);opacity:.7}.sprig svg{width:100%;height:100%}.royal-divider{display:flex;justify-content:center;align-items:center;gap:20px;color:var(--gold);font-size:17px;margin:20px auto}.royal-divider:before,.royal-divider:after{content:'';height:1px;width:65px;background:linear-gradient(90deg,transparent,var(--line))}.royal-divider:after{transform:rotate(180deg)}.ayah{font:400 clamp(29px,3.8vw,42px)/2.1 Amiri,serif!important;letter-spacing:0;color:var(--gold-light);max-width:760px;margin:22px auto 4px;padding:4px 8px;overflow:visible}.verse-source{display:inline-flex;align-items:center;justify-content:center;min-height:44px;font:400 15px/2 Amiri,serif;color:var(--muted);text-decoration:none}.verse-source:hover{color:var(--gold-light)}.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:520px;margin:36px auto 0;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}.countdown:before,.countdown:after{content:'◆';position:absolute;font-size:7px;color:var(--gold);left:50%;transform:translateX(-50%);background:#552535;padding:0 8px;line-height:8px}.countdown:before{top:-4px}.countdown:after{bottom:-4px}.countdown>div{min-width:0;border-inline-end:1px solid #d4b47633}.countdown>div:last-child{border:0}.countdown strong{display:block;font:400 clamp(36px,6vw,54px)/1.2 Cormorant,Georgia,serif;font-variant-numeric:tabular-nums lining-nums;color:var(--gold-light);min-width:2ch}.countdown span{display:block;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:6px}.countdown-note{font-size:11px;color:var(--muted);line-height:1.8;margin:20px auto 0;max-width:340px}
.details{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:70px;align-items:center;padding:35px max(40px,calc((100vw - 960px)/2)) 95px;background:linear-gradient(#552535,#4a202e)}.garden{height:480px;min-width:0;position:relative;border-radius:220px 220px 4px 4px;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 45% 25%,#95616b,#784250 45%,#492330 100%)}.garden:after{content:'';position:absolute;inset:17px;border:1px solid var(--gold);border-radius:205px 205px 2px 2px;pointer-events:none}.garden .leaf{width:410px;height:600px;bottom:-150px;left:-100px;transform:rotate(15deg);opacity:.32;color:#e1bfa9}.garden .second{left:auto;right:-150px;bottom:-200px;transform:rotate(-35deg);color:var(--wine);opacity:.65}.garden-label{position:relative;z-index:1;text-align:center;width:76%;padding:27px 12px;background:#502330ee;border:1px solid var(--gold);outline:1px solid var(--line);outline-offset:7px}.garden-label span{display:block;font-size:10px;letter-spacing:.15em;color:var(--muted)}.garden-label span[lang=ar]{font:400 19px/1.8 Amiri,serif;letter-spacing:0;color:var(--gold-light)}.garden-names{display:block;font:700 clamp(29px,3vw,38px)/1.95 Ruqaa,serif;letter-spacing:0;color:var(--gold-light);padding:5px 12px;margin:8px 0}.garden-label .filigree{width:85px;height:32px;margin:0 auto 12px}.details-copy{min-width:0}.details h2{font-size:54px;color:var(--gold-light);margin:15px 0 26px}.detail-row{border-top:1px solid var(--line);padding:22px 0;position:relative;padding-left:22px}.detail-row:before{content:'';width:4px;height:4px;border:1px solid var(--gold);transform:rotate(45deg);position:absolute;left:0;top:30px}.detail-row small{font-size:10px;letter-spacing:.23em;text-transform:uppercase;color:var(--gold)}.detail-row p{margin-top:7px;font-size:17px;color:var(--cream)}.detail-row .sub{font-size:13px;color:var(--muted);margin-top:3px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:13px 18px;border:1px solid var(--gold);background:var(--foil);color:#391b26;font-size:10px;line-height:1.6;letter-spacing:.13em;text-decoration:none;text-transform:uppercase}.button:hover{box-shadow:0 3px 18px #d4b47620}.button.outline{background:transparent;color:var(--gold-light);border-color:#d4b47699}.button.outline:hover{background:#d4b47610}
.closing{text-align:center;padding:65px 24px 70px;background:linear-gradient(#4a202e,#361721);overflow:hidden}.closing .leaf{width:270px;height:390px;opacity:.14;bottom:-180px}.closing .left{left:-115px;transform:rotate(20deg)}.closing .right{right:-115px;transform:scaleX(-1) rotate(20deg)}.closing>.filigree{width:160px;height:60px}.closing .ayah{font-size:clamp(27px,3.5vw,39px)!important;max-width:690px}.arabic-signature{font:700 38px/2 Ruqaa,serif;letter-spacing:0;color:var(--gold-light);padding:12px 20px 5px;margin-top:20px}footer{text-align:center;padding:24px;font-size:9px;letter-spacing:.2em;color:var(--muted);border-top:1px solid #d4b47625;background:var(--wine)}.calendar-status{font-size:12px;color:var(--muted);min-height:22px;margin-top:12px}.site-content{overflow-x:clip}.site-content [lang=ar]{font-synthesis:none}.verse-line{display:inline-block}
@media(prefers-reduced-motion:no-preference){.welcome .leaf{animation:breathe 8s ease-in-out infinite alternate}.welcome .right{animation-delay:-4s}.hero .leaf{animation:breathe 9s ease-in-out infinite alternate}.hero .right{animation-delay:-4s}.reveal{opacity:0;transform:translateY(16px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.65,.3,1)}.reveal.visible{opacity:1;transform:none}}
@keyframes breathe{to{translate:4px 3px}}@keyframes ceremony{from{opacity:.35;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:800px){.details{gap:38px;padding-inline:35px}.details h2{font-size:45px}.garden{height:420px}.actions{flex-direction:column;align-items:stretch}}


@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

.garden-grove{position:absolute;inset:auto 0 0;width:100%;height:78%;color:var(--gold);opacity:.24;pointer-events:none}.garden{background:radial-gradient(ellipse at 45% 25%,#a36d73 0%,#784250 45%,#492330 100%)}



/* One engraving language, from the opening palms to the garden vignette. */
.welcome .leaf{opacity:.38}.hero .leaf{opacity:.3}.hero .extra{opacity:.16}
.welcome-inner{padding-block:38px}.welcome .filigree{margin:12px auto 4px;width:130px;opacity:.7}
.cover-monogram{font-size:clamp(48px,9vw,86px);gap:12px;margin:6px 0 0;align-items:baseline}
.cover-monogram .name-moustafa{font-size:.96em}.cover-monogram .name-rana{font-size:1.15em;position:relative;top:.035em}
.cover-monogram .name-join{font-size:.3em;align-self:center}
.cover-rule{margin:0 auto 20px;width:90px}.cover-date{margin:16px 0 25px}



.hero-center{width:min(560px,100%);padding:70px 40px 42px}.hero h1{font-size:clamp(72px,7.7vw,94px);margin-top:8px}
.hero h1 .arabic-name{line-height:1.38;padding-block:.03em .09em}.hero h1 .name-join{font-size:23px;line-height:.95}
.hero-center>.filigree{height:30px;margin-bottom:14px}.hero .english-names{margin-top:14px}
.hero-event{margin:27px auto 0;padding-top:22px;border-top:1px solid var(--line);max-width:310px;display:flex;flex-direction:column;align-items:center}
.hero-date{display:block;margin:0;font:400 25px/1.4 Cormorant,Georgia,serif;letter-spacing:.025em;color:var(--gold-light)}
.event-rule{width:24px;height:1px;background:var(--line);margin:12px auto}
.hero-time{font-size:10px;letter-spacing:.16em;margin:0}.hero-place{margin:9px 0 0;font-size:12px}
.intro{padding-top:95px;padding-bottom:70px}.intro>.royal-divider{margin-top:0;margin-bottom:30px}
.intro .ayah{margin-top:0}.timepiece{max-width:520px;margin:65px auto 0;padding-top:0}
.timepiece-label{font-size:10px;letter-spacing:.23em;color:var(--muted)}
.countdown{margin-top:20px;padding-block:25px}.countdown strong{font-size:56px;color:var(--gold-light)}
.countdown span{font-size:10px;letter-spacing:.12em}.countdown-note{font-size:11px;letter-spacing:.04em;margin-top:17px}
.garden{background:radial-gradient(ellipse at 50% 25%,#784250,#542132 70%,#492330);height:490px}
.garden-scene{width:100%;height:100%;padding:10px 14px;color:var(--gold);stroke-width:1;opacity:.85}
.garden:after{inset:14px;opacity:.65}
.signature-seal{width:82px;height:82px;margin:32px auto 0;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--gold-light);position:relative}
.signature-seal:after{content:'';position:absolute;inset:5px;border:1px solid #d4b47625;border-radius:50%}
.signature-seal>span{font:700 32px/1.8 Ruqaa,serif;padding:7px 8px 11px;position:relative;z-index:1}
.signature-seal .seal-divider{font:400 15px/1.8 Cormorant,serif;margin:0 5px;color:var(--gold)}
.closing .leaf{opacity:.22}
@media(max-width:800px){.garden{height:430px}}



/* Continuous entrance: a normal scroll carries the cover into its invitation. */
.welcome{position:relative;inset:auto;min-height:100svh;height:auto;z-index:auto;overflow:hidden;padding:66px 22px 96px;--cover-progress:0;background:radial-gradient(ellipse at 50% 35%,#743245 0%,#542132 73%);transition:none}
.welcome:before{position:absolute;inset:20px;transform:scale(calc(1 + var(--cover-progress)*.045));opacity:calc(1 - var(--cover-progress)*.55);transform-origin:50% 50%}
.welcome-inner{transform:translateY(calc(var(--cover-progress)*-28px));opacity:calc(1 - var(--cover-progress)*.96);transition:none}
.welcome .leaf{animation:none}
.welcome .left{transform:translateX(calc(var(--cover-progress)*-40px)) rotate(25deg)}
.welcome .right{transform:translateX(calc(var(--cover-progress)*40px)) rotate(205deg)}
.cover-date{margin-bottom:0}
.cover-scroll{position:absolute;bottom:35px;left:50%;translate:-50% 0;display:grid;place-items:center;width:48px;height:58px;text-decoration:none;opacity:calc(1 - var(--cover-progress));}
.cover-scroll span{display:block;width:1px;height:43px;background:linear-gradient(transparent,var(--gold) 45%,var(--gold-light));position:relative}
.cover-scroll span:after{content:'';position:absolute;width:5px;height:5px;border-right:1px solid var(--gold-light);border-bottom:1px solid var(--gold-light);bottom:0;left:-2px;rotate:45deg}
.hero{padding-top:80px;background:radial-gradient(ellipse at 50% 40%,#713044 0%,transparent 65%),linear-gradient(#542132 65%,#4b202e)}
.details h2.section-title{font:400 51px/1.8 Amiri,serif;letter-spacing:0;color:var(--gold-light);width:max-content;max-width:100%;padding-inline:3px;margin:0 0 23px}


@media(prefers-reduced-motion:reduce){.welcome-inner,.welcome:before{transform:none;opacity:1}.welcome .left{transform:rotate(25deg)}.welcome .right{transform:rotate(205deg)}.cover-scroll{opacity:1}}

/* Phone layouts: generous Arabic ink bounds, readable labels, natural flow. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media(max-width:650px){
 body{font-size:16px}
 .welcome{min-height:100vh;min-height:100svh;padding:calc(48px + env(safe-area-inset-top)) max(22px,env(safe-area-inset-left)) calc(87px + env(safe-area-inset-bottom));overscroll-behavior:auto}
 .welcome:before{inset:calc(12px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));box-shadow:inset 0 0 0 5px #542132,inset 0 0 0 6px var(--line)}
 .welcome-inner{padding:18px 4px;width:100%;max-width:440px}
 .bismillah{font-size:22px;line-height:1.9;margin-bottom:16px}
 .welcome .filigree{width:112px;height:36px;margin:8px auto}
 .cover-monogram{font-size:clamp(43px,12vw,68px);gap:5px;margin-top:4px}
 .cover-monogram .name-join{font-size:.3em}
 .cover-rule{margin:0 auto 15px}
 .welcome .english-names{font-size:11px;letter-spacing:.17em;line-height:1.8;margin:12px 0}
 .cover-date{font-size:12px;letter-spacing:.13em;margin:14px 0 0;line-height:1.8}
 .welcome .leaf{width:320px;height:500px;opacity:.32}
 .welcome .left{left:-150px;bottom:-145px}
 .welcome .right{right:-150px;top:-130px}
 .cover-scroll{width:52px;height:54px;bottom:calc(21px + env(safe-area-inset-bottom))}
 .cover-scroll span{height:34px}
 .hero{min-height:0;height:auto;padding:48px max(25px,env(safe-area-inset-left)) 92px}
 .hero:after{inset:12px;border-color:#d4b47635}
 .hero-center{width:100%;max-width:420px;padding:58px 18px 30px}
 .arch{border-radius:210px 210px 4px 4px;box-shadow:0 0 0 6px #542132,0 0 0 7px var(--line)}
 .hero-center>.filigree{height:28px;width:95px;margin-bottom:12px}
 .arabic-invite{font-size:21px;line-height:1.8}
 .hero h1{font-size:clamp(61px,17.5vw,80px);margin-top:8px}
 .hero h1 .arabic-name{line-height:1.33;padding:.03em .2em .1em}
 .hero h1 .name-join{font-size:23px;line-height:1}
 .hero .english-names{font-size:11px;letter-spacing:.12em;margin-top:14px;line-height:1.8}
 .hero-event{width:100%;max-width:290px;margin-top:22px;padding-top:18px}
 .hero-date{font-size:26px;letter-spacing:0;line-height:1.4}
 .event-rule{margin:10px auto}
 .hero-time{font-size:11px;letter-spacing:.1em}
 .hero-place{font-size:13px;line-height:1.7;letter-spacing:.02em;margin-top:7px}
 .hero .leaf{width:320px;height:500px;opacity:.24;animation:none}
 .hero .left{left:-155px;bottom:-125px}
 .hero .right{right:-155px;top:-90px}
 .hero .extra{display:none}
 .hero .scroll{bottom:22px;font-size:11px;letter-spacing:.13em;min-height:48px}
 .scroll:after{height:19px;margin-top:7px}
 .intro{padding:58px max(20px,env(safe-area-inset-left)) 52px}
 .intro>.royal-divider{margin-bottom:24px}
 .royal-divider{gap:15px}.royal-divider:before,.royal-divider:after{width:47px}
 .intro .ayah{font-size:clamp(27px,7.6vw,32px)!important;line-height:2!important;padding:5px 0;margin:0 auto 5px;text-wrap:balance}
 .verse-source{font-size:17px;min-height:48px;line-height:1.9;padding:4px 6px}
 .timepiece{margin-top:39px;max-width:420px}
 .timepiece-label{font-size:11px;letter-spacing:.16em}
 .countdown{margin-top:18px;padding:22px 0;max-width:420px}
 .countdown strong{font-size:clamp(39px,11vw,49px);line-height:1.2}
 .countdown span{font-size:11px;letter-spacing:.025em;margin-top:7px;line-height:1.5}
 .countdown-note{font-size:12px;line-height:1.8;letter-spacing:0;margin:17px auto 0}
 .details{grid-template-columns:minmax(0,1fr);padding:12px max(23px,env(safe-area-inset-left)) 54px;gap:34px}
 .details-copy{grid-row:1;width:100%;max-width:420px;margin:auto}
 .details h2.section-title{font-size:44px;line-height:1.65;margin:0 0 18px;padding-inline:3px}
 .detail-row{padding:19px 0 19px 19px}
 .detail-row:before{top:28px}
 .detail-row small{font-size:11px;letter-spacing:.17em}
 .detail-row p{font-size:17px;line-height:1.65;margin-top:7px}
 .detail-row .sub{font-size:14px;line-height:1.7}
 .actions{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:18px}
 .actions>*{width:100%;min-width:0;min-height:54px;padding:15px 16px;font-size:12px;letter-spacing:.08em;line-height:1.6}
 .button:active{box-shadow:inset 0 0 0 2px #391b2620}
 .button.outline:active{background:#d4b47616}
 .calendar-status{font-size:13px;line-height:1.7;min-height:23px;margin-top:12px}
 .garden{grid-row:2;height:auto;aspect-ratio:4/5;max-width:330px;width:100%;margin:0 auto}
 .garden-scene{padding:9px 12px}.garden:after{inset:12px}
 .closing{padding:45px max(21px,env(safe-area-inset-left)) 45px}
 .closing>.filigree{width:128px;height:46px}
 .closing .ayah{font-size:clamp(25px,6.8vw,29px)!important;line-height:2!important;padding:5px 0;margin:18px auto 7px;text-wrap:balance}
 .closing .verse-line{display:block}
 .closing .leaf{width:230px;height:330px;opacity:.16;bottom:-155px}
 .signature-seal{width:72px;height:72px;margin-top:23px}
 .signature-seal>span{font-size:29px}
 footer{font-size:11px;letter-spacing:.065em;line-height:1.8;padding:20px max(20px,env(safe-area-inset-left)) calc(20px + env(safe-area-inset-bottom))}
 .skip-link{top:calc(10px + env(safe-area-inset-top));left:15px;max-width:calc(100% - 30px);font-size:14px}
 .reveal{transition-duration:.45s;transform:translateY(10px)}
 .reveal.visible{transform:none}
}
@media(max-width:360px){
 .cover-monogram{font-size:41px;gap:3px}
 .welcome .english-names{font-size:10px;letter-spacing:.12em}
 .bismillah{font-size:21px}
 .hero{padding-inline:23px}.hero-center{padding-inline:14px;padding-top:54px}
 .hero h1{font-size:60px}.arabic-invite{font-size:20px}
 .hero-date{font-size:24px}.hero-place{font-size:12px}
 .intro .ayah{font-size:27px!important}
 .countdown strong{font-size:39px}.countdown span{font-size:10px}
 .details{padding-inline:21px}.detail-row p{font-size:16px}
 .closing .ayah{font-size:25px!important}
}
/* Landscape phones remain normal-flow documents; nothing is height-clipped. */
@media(max-height:500px) and (orientation:landscape){
 .welcome{min-height:100svh;padding-top:28px;padding-bottom:70px}
 .welcome-inner{padding-block:8px}.bismillah{margin-bottom:5px}
 .welcome .filigree{height:28px;margin-block:4px}
 .cover-monogram{font-size:55px;margin:0}.cover-date{margin-top:8px}
 .welcome .english-names{margin-block:6px}.cover-rule{margin-bottom:8px}
 .cover-scroll{bottom:12px;height:44px}
 .hero{min-height:0;padding-top:46px;padding-bottom:88px}
}
@media(hover:none) and (pointer:coarse){.hero .leaf{animation:none}.reveal{transition-duration:.4s}}
@media(prefers-reduced-motion:reduce){.reveal{transform:none;opacity:1}}

@media(max-height:500px) and (orientation:landscape){
 .welcome,.hero{padding-inline:max(28px,env(safe-area-inset-left)) max(28px,env(safe-area-inset-right))}
 .details{padding-inline:max(30px,env(safe-area-inset-left)) max(30px,env(safe-area-inset-right))}
 .button{min-height:52px;font-size:12px}.verse-source{font-size:17px;min-height:48px}
 .countdown span{font-size:11px;letter-spacing:.03em}
 footer{padding-bottom:calc(20px + env(safe-area-inset-bottom));font-size:11px}
}