:root{
--gold:#D4AF37;
--emerald:#064e3b;
--cream:#fffdf5;
}

*{
letter-spacing: normal;
}

body{
font-family:'Montserrat', sans-serif;
background:#0f1f2e;
color:white;
overflow-x:hidden;
}

.font-script{
font-family:'Great Vibes', cursive;
}

.font-classic{
font-family:'Cinzel', serif;
}

/* Invitation */
.invitation{
width:100%;
max-width:650px;
margin:auto;
background:var(--cream);
color:var(--emerald);
padding:40px 20px;
text-align:center;
display:none;
flex-direction:column;
align-items:center;
box-shadow:0 20px 50px rgba(0,0,0,0.3);
}

/* Arabic Text */
.arabic{
font-family:'Noto Naskh Arabic', serif;
direction:rtl;
unicode-bidi:isolate;
font-size:34px;
line-height:2.2;
text-align:center;
word-spacing:6px;
}

/* Mobile */
@media (max-width:600px){
.arabic{
font-size:28px;
line-height:2.4;
}
}

/* Lantern */
.lantern{
position:fixed;
bottom:-100px;
width:20px;
height:40px;
background:rgba(255,215,0,0.5);
border-radius:10px;
animation:float 10s linear infinite;
}

@keyframes float{
0%{transform:translateY(0)}
100%{transform:translateY(-120vh)}
}

/* Envelope */
#envelope{
position:fixed;
inset:0;
background:radial-gradient(circle,#065f46,#064e3b);
display:flex;
align-items:center;
justify-content:center;
z-index:100;
transition:all 1.2s;
}

.envelope-wrapper{
width:320px;
height:220px;
background:var(--cream);
border:2px solid var(--gold);
position:relative;
cursor:pointer;
}

.envelope-flap{
position:absolute;
top:0;
border-left:160px solid transparent;
border-right:160px solid transparent;
border-top:110px solid var(--gold);
}

.envelope-seal{
position:absolute;
top:90px;
left:50%;
transform:translateX(-50%);
width:50px;
height:50px;
background:var(--gold);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}

/* Open Animation */
#envelope.opened{
opacity:0;
pointer-events:none;
transform:translateY(-100%);
}