:root{
--grass:#CFAA7D;
--thicket:#B9AF5F;
--blossom:#BF9A9C;
--berry:#CC7C72;
--sky:#8096AD;
}
*{margin:0;padding:0;box-sizing:border-box}
body{
font-family:Inter,sans-serif;
background:linear-gradient(135deg,#f7f2ef,#fff);
color:white;
overflow-x:hidden;
}
#bg{
position:fixed;
inset:0;
z-index:-1;
}
.hero{
height:100vh;
display:flex;
align-items:center;
justify-content:center;
padding:30px;
}
.glass{
backdrop-filter:blur(18px);
background:rgba(255,255,255,.12);
border:1px solid rgba(255,255,255,.25);
padding:60px;
border-radius:30px;
text-align:center;
max-width:800px;
}
.mono{
font-size:2rem;
letter-spacing:10px;
margin-bottom:20px;
}
h1,h2{
font-family:"Cormorant Garamond",serif;
}
h1{font-size:5rem}
h2{font-size:3rem;margin-bottom:20px}
.sub{font-style:italic;margin-bottom:15px}

.panel{
min-height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
padding:80px 10%;
text-align:center;
}

.palette{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:20px;
width:100%;
max-width:1000px;
margin-top:40px;
}
.palette div{
padding:70px 20px;
border-radius:25px;
font-size:1.2rem;
}

.gallery{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:25px;
width:100%;
max-width:1000px;
margin-top:40px;
}
.ph{
height:350px;
border-radius:25px;
background:rgba(255,255,255,.15);
display:flex;
align-items:center;
justify-content:center;
backdrop-filter:blur(8px);
}

.rsvp{
display:inline-block;
margin-top:30px;
padding:18px 40px;
background:white;
color:#CC7C72;
text-decoration:none;
border-radius:50px;
font-weight:bold;
}

.reveal{
opacity:0;
transform:translateY(80px);
}