:root{
  --wine:#651329; --wine2:#8d2441; --ink:#21161b; --muted:#77676d;
  --cream:#fffaf7; --paper:#fffefd; --soft:#f8ecee; --line:#eadcdf;
  --blush:#efbac5; --gold:#c99a60; --shadow:0 22px 70px rgba(72,18,36,.13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Tajawal",system-ui,-apple-system,Segoe UI,sans-serif;overflow-x:hidden}
img{display:block;width:100%}
button,a{font:inherit}
button{cursor:pointer}
.wrap{width:min(1040px,calc(100% - 30px));margin:auto}
.serif{font-family:"Noto Naskh Arabic","Times New Roman",serif}
.topbar{position:fixed;z-index:50;top:0;left:0;right:0;padding:14px 0;pointer-events:none}
.topbar .inside{display:flex;justify-content:space-between;align-items:center}
.brand{pointer-events:auto;color:white;background:rgba(35,12,20,.28);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(12px);padding:9px 12px;border-radius:99px;font-size:12px;font-weight:800}
.music{pointer-events:auto;border:1px solid rgba(255,255,255,.16);background:rgba(35,12,20,.28);backdrop-filter:blur(12px);color:white;padding:9px 13px;border-radius:99px;font-size:12px}
.section{padding:88px 0}
.eyebrow{font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:900;color:var(--wine)}
.head{text-align:center;max-width:720px;margin:0 auto 46px}
.head h2{font-size:clamp(39px,7vw,67px);line-height:1.05;color:#401723;margin:10px 0}
.head p{color:var(--muted);line-height:1.85;margin:0}
.btn{display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:999px;padding:14px 22px;background:var(--wine);color:white;font-weight:800;text-decoration:none;box-shadow:0 12px 30px rgba(101,19,41,.22)}
.btn.light{background:white;color:var(--wine)}
.reveal{opacity:0;transform:translateY(18px);transition:.65s cubic-bezier(.2,.8,.2,1)}
.reveal.on{opacity:1;transform:none}
footer{padding:38px 0;text-align:center;color:#9c878d;font-size:11px;border-top:1px solid var(--line)}
@media(max-width:600px){
 .wrap{width:min(100% - 24px,1040px)}
 .section{padding:72px 0}
 .topbar{padding:10px 0}
 .brand,.music{font-size:11px;padding:8px 10px}
}

.hero{min-height:100svh;display:grid;place-items:center;position:relative;overflow:hidden;text-align:center;color:white;background:linear-gradient(145deg,#421420,#87243f 56%,#c56a78)}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 24%,rgba(255,219,153,.22),transparent 22%),radial-gradient(circle at 12% 80%,rgba(255,255,255,.09),transparent 25%)}
.hero-content{position:relative;z-index:2;padding:100px 0 60px}.gift{font-size:64px}.hero .eyebrow{color:#f2bdc7}.hero h1{font-size:clamp(50px,10vw,90px);line-height:1.04;margin:12px 0}.hero h1 span{display:block;color:#f6c4cd}.hero p{max-width:610px;margin:0 auto 24px;line-height:1.9;color:#ead9df}.chapter{display:inline-flex;margin-bottom:20px;padding:8px 13px;border-radius:99px;border:1px solid rgba(255,255,255,.17);background:rgba(255,255,255,.08)}
.songbar{background:white;border-bottom:1px solid var(--line)}.songin{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:17px 0;direction:rtl}.songmeta{display:flex;gap:11px;align-items:center}.disc{width:42px;height:42px;border-radius:50%;background:radial-gradient(circle,#fff 0 8%,#25161c 9% 23%,#651329 24%)}.songmeta small{display:block;color:var(--muted)}
.gallerySec{background:linear-gradient(180deg,#fffaf7,#f9edef)}.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.tile{border-radius:21px;overflow:hidden;min-height:260px}.tile:nth-child(1){grid-column:span 7;min-height:470px}.tile:nth-child(2){grid-column:span 5}.tile:nth-child(3){grid-column:span 5}.tile:nth-child(4){grid-column:span 7}.tile:nth-child(5),.tile:nth-child(6){grid-column:span 6}.tile img{height:100%;object-fit:cover}
.wishes{background:#30131d;color:white}.wishes .head h2{color:white}.wishes .head p{color:#d8c6cc}.wishgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.wish{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:21px;padding:23px;direction:rtl;text-align:right}.wish .icon{font-size:27px}.wish h3{font-size:24px;margin:12px 0}.wish p{color:#d7c5cb;line-height:1.85;margin:0}
.final{background:white;text-align:center}.cake{font-size:64px}.final h2{font-size:clamp(46px,8vw,78px);color:#401723;margin:10px 0}.final p{max-width:700px;margin:0 auto 22px;white-space:pre-line;line-height:2;color:var(--muted)}
.confetti{position:fixed;inset:0;z-index:100;pointer-events:none;overflow:hidden}.confetti i{position:absolute;top:-20px;width:8px;height:14px;animation:fall 3s linear forwards}@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
@media(max-width:700px){.gallery .tile{grid-column:1/-1!important;min-height:360px!important}.wishgrid{grid-template-columns:1fr}}

@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1!important;transform:none!important;transition:none!important}
}

/* Demo photo finishing */
.photo img,.ph img,.tile img,.note img{
  filter:saturate(.88) contrast(.98) brightness(.96);
}

.langToggle{pointer-events:auto;border:1px solid rgba(255,255,255,.16);background:rgba(35,12,20,.28);backdrop-filter:blur(12px);color:#fff;padding:9px 12px;border-radius:99px;font-size:11px;font-weight:800;margin-inline-end:6px}

body.en{direction:ltr;font-family:Inter,Arial,sans-serif}
body.en .copy,body.en .paper,body.en .letter,body.en .wish,body.en .note,body.en .finalNote{text-align:left;direction:ltr}
body.en .songin{direction:ltr}