*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{

font-family:'Poppins',sans-serif;
height:100vh;
display:flex;
justify-content:center;
align-items:center;
overflow:hidden;
background:linear-gradient(135deg,#fff8fb,#ffe8f3,#ffdbe9);

}

.container{

text-align:center;
z-index:2;
position:relative;

}

h1{font-size: 55px;font-weight: 900;letter-spacing: 1px;color:#d63384;margin-top:30px;}

h2{

font-size:34px;
font-weight:500;
color:#444;
margin-top:15px;

}

p{

margin-top:25px;
font-size:18px;
color:#666;
line-height:32px;

}

/* Shopping Bag */

.fashion-icon{

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

}

.bag{

width:170px;
height:190px;
background:#ff4d94;
border-radius:20px;
position:relative;
box-shadow:0 20px 50px rgba(255,105,180,.25);
animation:float 3s ease-in-out infinite;

}

.bag:before{

content:"";
position:absolute;
width:90px;
height:45px;
border:8px solid white;
border-bottom:none;
border-radius:50px 50px 0 0;
left:50%;
transform:translateX(-50%);
top:-38px;

}

.heart{

position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
font-size:55px;
color:white;

}

@keyframes float{

0%{
transform:translateY(0);
}

50%{
transform:translateY(-18px);
}

100%{
transform:translateY(0);
}

}

/* Background Decorations */

.bg-circle{

position:absolute;
border-radius:50%;
background:rgba(255,255,255,.5);

}

.circle1{

width:350px;
height:350px;
top:-120px;
left:-80px;

}

.circle2{

width:250px;
height:250px;
right:-60px;
bottom:-50px;

}

.circle3{

width:180px;
height:180px;
top:60%;
left:10%;
background:rgba(255,192,203,.4);

}

@media(max-width:768px){

h1{

font-size:36px;
letter-spacing:2px;

}

h2{

font-size:26px;

}

p{

font-size:16px;
padding:0 20px;

}

.bag{

width:130px;
height:150px;

}

.bag:before{

width:70px;
height:35px;

}

.heart{

font-size:40px;

}

}

/* ===============================
   Two Column Layout
=================================*/

.container{
    width:90%;
    max-width:1300px;
    position:relative;
    z-index:10;
}

.main-wrapper{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
}

.left-content{
    width:48%;
    text-align:center;
}

.right-content{
    width:52%;
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
}

.shopping-girl{
    width:100%;
    max-width:560px;
    /* animation:floatGirl 4s ease-in-out infinite; */
    filter:drop-shadow(0 20px 40px rgba(255,105,180,.18));
}

@keyframes floatGirl{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-12px);
}

100%{
transform:translateY(0px);
}

}

@media (max-width:991px){

.main-wrapper{

flex-direction:column-reverse;
text-align:center;

}

.left-content,
.right-content{width:100%;}

.shopping-girl{max-width:350px;display: none;}

}