body{

margin:0;

background:
url("https://www.transparenttextures.com/patterns/paper-fibers.png"),
linear-gradient(#fff7f3,#f7efe6);

font-family:'Cormorant Garamond', serif;
color:#3b2f2f;
text-align:center;

}

#site{
display:none;
}

/* intro card */

#intro{

position:fixed;
width:100%;
height:100%;
background:#f7efe6;

display:flex;
align-items:center;
justify-content:center;

}

.invite-card{

background:white;
padding:40px;
border-radius:12px;
border:2px solid #c7a35f;
box-shadow:0 10px 30px rgba(0,0,0,0.15);

}

.invite-card h1{

font-family:'Playfair Display', serif;

}

.invite-card button{

margin-top:20px;
padding:12px 25px;
background:#c7a35f;
border:none;
color:white;
border-radius:30px;
cursor:pointer;

}

/* vines */

.vines-left,
.vines-right{

position:fixed;
top:0;
width:120px;
height:100%;
background-size:contain;
background-repeat:no-repeat;
opacity:0.5;
pointer-events:none;

}

.vines-left{

left:0;
background-image:url("https://pngimg.com/uploads/vine/vine_PNG25.png");

}

.vines-right{

right:0;
background-image:url("https://pngimg.com/uploads/vine/vine_PNG25.png");
transform:scaleX(-1);

}

/* petals */

.petals{

position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background-image:url("https://pngimg.com/uploads/rose_petals/rose_petals_PNG6.png");
background-size:40px;
opacity:0.08;
pointer-events:none;

}

/* layout */

.container{

max-width:480px;
margin:auto;
padding:35px 22px;

}

/* hero */

.hero{
padding:10px 18px;
}

.hero h1{

font-family:'Playfair Display', serif;
font-size:42px;
margin-bottom:12px;

}

.tagline{

font-size:18px;
line-height:1.6;
max-width:340px;
margin:0 auto 18px auto;

}

.wedding-date{

font-size:20px;
font-weight:bold;

margin:18px 0 6px 0;

}

.location{

font-size:17px;
color:#555;

margin:0 0 8px 0;

}

.countdown-box{

font-family:'Playfair Display', serif;

font-size:22px;

font-weight:500;

color:#2d2520;

margin-top:6px;

}
/* invitation cards */

.story-section{
margin:45px 0;
}

.story-section img{

width:100%;
border-radius:14px;
box-shadow:0 10px 25px rgba(0,0,0,0.15);

}

/* titles */

.story-section h2{

font-family:'Playfair Display', serif;
font-size:28px;
margin-bottom:10px;

}

/* borders */

.cover img{border:3px solid #7C0A2B;}

.engagement img{border:3px solid #790C94;}
.engagement h2{color:#790C94;}

.haldi img{border:3px solid #d4a017;}
.haldi h2{color:#d4a017;}
.mehendi{color:#2f8f4e;}

.sangeet img{border:3px solid #3c3f8f;}
.sangeet h2{color:#3c3f8f;}

.wedding img{border:3px solid #c4412d;}
.wedding h2{color:#c4412d;}

/* buttons */

button{

padding:12px 22px;
border:none;
color:white;
border-radius:30px;
cursor:pointer;
font-size:14px;
margin-top:10px;

}

.engagement-btn{background:#790C94;}
.haldi-btn{background:#d4a017;}
.sangeet-btn{background:#3c3f8f;}
.wedding-btn{background:#c4412d;}

button:hover{
opacity:0.9;
}

footer{
margin:40px 0;
}