:root{--cream:#f3eee5;--paper:#fbf8f2;--ink:#3c3a34;--muted:#7b7569;--green:#66725e;--gold:#a88d67;--rose:#c6a49a;--line:rgba(60,58,52,.14);--shadow:0 20px 60px rgba(48,42,34,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Alexandria",sans-serif;overflow-x:hidden}.site{transition:filter .4s ease}.is-locked{height:100vh;overflow:hidden}.section{min-height:100svh;display:grid;place-items:center;position:relative;padding:70px 22px;overflow:hidden}.container{width:min(100%,980px);margin:auto;text-align:center;position:relative;z-index:3}.narrow{width:min(100%,680px)}
.intro{position:fixed;inset:0;z-index:100;background:linear-gradient(rgba(245,240,232,.68),rgba(245,240,232,.82)),url('assets/background.png') center/cover no-repeat;display:grid;place-items:center;padding:24px;transition:opacity .8s ease,visibility .8s ease;overflow:hidden}.intro:before,.intro:after,.section:before,.section:after{content:"";position:absolute;pointer-events:none}.intro:before,.section:before{inset:0;background-image:radial-gradient(circle at 9% 18%,rgba(255,255,255,.92) 0 1px,transparent 1.8px),radial-gradient(circle at 22% 72%,rgba(220,193,145,.65) 0 1.2px,transparent 2px),radial-gradient(circle at 72% 22%,rgba(255,255,255,.9) 0 1px,transparent 1.8px),radial-gradient(circle at 88% 62%,rgba(218,194,151,.58) 0 1.1px,transparent 2px),radial-gradient(circle at 54% 46%,rgba(255,255,255,.8) 0 1px,transparent 1.7px);background-size:170px 170px,220px 220px,190px 190px,240px 240px,210px 210px;opacity:.72;z-index:1}.intro:after,.section:after{width:520px;height:520px;right:-220px;top:-180px;background:linear-gradient(rgba(250,247,241,.35),rgba(250,247,241,.76)),url('assets/background.png') center/cover no-repeat;border-radius:48% 52% 50% 45%;opacity:.34;filter:saturate(.8) brightness(1.06);transform:rotate(14deg);z-index:1}.intro.hide{opacity:0;visibility:hidden}.intro-card{text-align:center;padding:46px 24px;width:min(100%,520px);background:rgba(251,248,242,.72);border:1px solid rgba(255,255,255,.75);backdrop-filter:blur(9px);box-shadow:var(--shadow);position:relative;z-index:2}.intro-card:before{content:"✦  ·  ✧  ·  ✦";display:block;color:rgba(168,141,103,.7);letter-spacing:7px;font-size:13px;margin-bottom:18px}.bismillah{font-family:"Aref Ruqaa",serif;font-size:17px;color:var(--green);line-height:2}.intro h1,.hero h2,.closing-names{font-family:"Aref Ruqaa",serif;font-weight:700}.intro h1{font-size:clamp(58px,16vw,104px);line-height:.9;margin:25px 0 16px}.intro h1 span,.hero h2 span{color:var(--gold);font-weight:400}.intro p{color:var(--muted);margin-bottom:28px}.intro small{display:block;margin-top:14px;color:var(--muted)}
.eyebrow{font-size:11px;letter-spacing:3px;color:var(--gold);font-weight:600}.primary-btn,.secondary-btn,.ghost-btn{border:0;text-decoration:none;cursor:pointer;font:inherit;border-radius:999px;transition:.25s ease;display:inline-flex;align-items:center;justify-content:center}.primary-btn{background:var(--green);color:white;padding:14px 28px}.primary-btn:hover{transform:translateY(-2px);filter:brightness(.95)}.primary-btn:disabled{opacity:.55;cursor:wait;transform:none}.secondary-btn{background:#ece6da;color:var(--ink);padding:11px 18px}.secondary-btn:disabled{opacity:.4;cursor:not-allowed}.ghost-btn{border:1px solid rgba(255,255,255,.5);color:white;padding:12px 24px;background:rgba(255,255,255,.08)}.inline-btn{margin-top:30px}.music-toggle{position:fixed;z-index:80;left:18px;bottom:18px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:rgba(72,77,66,.8);color:white;backdrop-filter:blur(8px);font-size:20px;cursor:pointer;box-shadow:var(--shadow)}
.hero{background:url('assets/background.png') center/cover no-repeat;color:white;text-align:center}.hero:after{display:none}.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(43,43,39,.18),rgba(43,43,39,.48));z-index:1}.hero-content{z-index:3;width:min(100%,760px)}.hero h2{font-size:clamp(72px,18vw,150px);line-height:.82;margin:28px 0}.hero-date{font-size:14px;letter-spacing:1px}.hero-copy{font-size:16px;line-height:2;margin:22px auto 28px;width:min(100%,520px)}.quran{font-family:"Aref Ruqaa",serif;font-size:clamp(18px,3.2vw,24px);line-height:2.05;max-width:700px;margin:18px auto;color:#fff;text-shadow:0 2px 15px rgba(0,0,0,.25)}.ornament{color:#d8bd93;font-size:24px;margin:20px 0}.ornament.large{font-size:34px}.scroll-note{position:absolute;bottom:24px;font-size:11px;opacity:.8;z-index:3}
h3{font-family:"Aref Ruqaa",serif;font-size:clamp(40px,8vw,64px);margin:15px 0 20px}.soft-section{background:linear-gradient(rgba(251,248,242,.91),rgba(251,248,242,.95)),url('assets/background.png') center/cover no-repeat}.soft-section:after{left:-235px;right:auto;top:auto;bottom:-210px;transform:rotate(-22deg)}.details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.info-card{padding:34px 18px;border:1px solid var(--line);background:rgba(255,255,255,.82);backdrop-filter:blur(4px);box-shadow:0 8px 30px rgba(52,47,39,.05);position:relative}.info-card:before{content:'✦';position:absolute;top:10px;left:12px;color:rgba(168,141,103,.46);font-size:14px}.info-card span{display:block;color:var(--muted);font-size:12px;margin-bottom:10px}.info-card strong{font-size:18px;font-weight:500}
.countdown-section{background:linear-gradient(rgba(72,82,67,.94),rgba(72,82,67,.96)),url('assets/background.png') center/cover no-repeat;color:white;min-height:75svh}.countdown-section:after{opacity:.17;filter:grayscale(.2) brightness(1.2)}.countdown-section .eyebrow{color:#dfcaa8}.countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.countdown div{padding:20px 10px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.025);backdrop-filter:blur(2px)}.countdown strong{display:block;font-family:"Aref Ruqaa",serif;font-size:42px}.countdown span{font-size:11px;opacity:.75}
.message-section{background:linear-gradient(rgba(245,240,231,.90),rgba(245,240,231,.96)),url('assets/background.png') center/cover no-repeat}.message-section:after{right:-210px;top:auto;bottom:-230px;transform:rotate(28deg)}.section-copy{color:var(--muted);line-height:1.9;margin-top:0;margin-bottom:26px}.guestbook-card{text-align:right;background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.8);padding:28px;box-shadow:var(--shadow);position:relative;backdrop-filter:blur(8px)}.guestbook-card:before{content:'✦  ✧  ✦';position:absolute;top:11px;left:18px;color:rgba(168,141,103,.35);font-size:12px;letter-spacing:6px}label{display:block;font-size:12px;margin:15px 2px 8px;color:var(--muted)}input,textarea{width:100%;border:1px solid var(--line);background:#fcfaf6;padding:14px 16px;font:inherit;color:var(--ink);outline:none;border-radius:10px}input:focus,textarea:focus{border-color:#9c9b88}.voice-box{margin-top:20px;padding:18px;border:1px dashed rgba(60,58,52,.25);border-radius:14px;background:rgba(250,247,241,.88)}.voice-box p{margin-top:0}.voice-actions{display:flex;gap:10px;flex-wrap:wrap}.recording-status,.save-status{font-size:12px;color:var(--muted);margin:12px 2px}.save-status.success{color:#52684e}.save-status.error{color:#9b4a4a}.voice-box audio{width:100%;margin-top:8px}.save-btn{width:100%;margin-top:20px}.hint{display:block;color:var(--muted);margin-top:12px;line-height:1.7}
.closing-section{min-height:80svh;background:linear-gradient(rgba(250,247,241,.80),rgba(250,247,241,.91)),url('assets/background.png') center/cover no-repeat}.closing-section:after{left:-210px;right:auto;top:-180px;transform:rotate(-18deg)}.closing-section p{color:var(--muted)}.closing-names{font-size:60px;margin:24px 0 8px}.closing-date{letter-spacing:5px}.closing-section h3:before,.message-section h3:before,.soft-section h3:before,.countdown-section h3:before{content:"✦  ✧  ✦";display:block;font-family:serif;font-size:12px;letter-spacing:7px;color:rgba(168,141,103,.65);margin-bottom:16px}.countdown-section h3:before{color:rgba(239,218,191,.7)}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:700px){.section{padding:58px 18px}.details-grid{grid-template-columns:1fr}.countdown{gap:6px}.countdown strong{font-size:34px}.countdown div{padding:16px 5px}.guestbook-card{padding:18px}.voice-actions>*{flex:1}.hero h2{font-size:82px}.intro h1{font-size:76px}.quran{font-size:18px}.intro:after,.section:after{width:360px;height:360px;right:-190px;top:-110px}.soft-section:after,.closing-section:after{left:-190px;right:auto}.message-section:after{right:-190px;bottom:-140px;top:auto}}