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

/* BODY */

body{

font-family:'Poppins', sans-serif;

background:linear-gradient(270deg,#ffb6c1,#ffc0cb,#ffd2a6);
background-size:600% 600%;

animation:bgMove 18s infinite;

color:black;
line-height:1.7;

}

@keyframes bgMove{

0%{background-position:0% 50%;}
50%{background-position:100% 50%;}
100%{background-position:0% 50%;}

}



/* LOGO */

.logo{
position:absolute;
top:30px;
right:40px;
z-index:5;
}

.logo img{
	width: 180px;
	height: auto;
	display: block;
}

/* GENERAL SECTION SPACING */

section{
padding:100px 8%;
position:relative;
z-index:2;
}

/* HERO */

.hero{

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

gap:60px;

min-height:100vh;

position:relative;

}

.hero-text{
max-width:500px;
}

h1{

font-size:4rem;

background:linear-gradient(45deg,#ffffff,#ffe6f2,#ffd6eb);
-webkit-background-clip:text;
-webkit-text-fill-color:black;

}

h2{

text-align:center;
font-size:32px;
margin:40px 0;
color:#000000;
letter-spacing:2px;

}

.hero h2{
text-align:left;
}

.hero-image{

width:420px;

border-radius:15px;

box-shadow:0 20px 40px rgba(0,0,0,.4);

transition:.3s;

}

.hero-image:hover{
transform:scale(1.05);
box-shadow:0 25px 50px rgba(0,0,0,.45);
}

/* CONTENT SECTIONS */

.content-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:60px;

align-items:center;

}

.reverse{
direction:rtl;
}

.reverse *{
direction:ltr;
}

.content-image{

width:100%;

border-radius:15px;

box-shadow:0 15px 35px rgba(0,0,0,.4);

transition:.3s;

}

.content-image:hover{
transform:scale(1.05);
box-shadow:0 25px 50px rgba(0,0,0,.45);
}

.content-text{
max-width:500px;
}

/* CTA */

.cta{
text-align:center;
}

/* CTA BUTTON */

.cta-button{

display:block;
width:fit-content;
margin:30px auto;

padding:14px 32px;

background:linear-gradient(45deg,#ff8ac9,#ffc0cb);

color:black;

font-weight:600;

text-decoration:none;

border-radius:30px;

box-shadow:0 8px 20px rgba(0,0,0,.2);

transition:.3s;

}

.cta-image{

margin-top:40px;

width:320px;

border-radius:15px;

box-shadow:0 15px 35px rgba(0,0,0,.4);

transition:.3s;

}

.cta-image:hover{
transform:scale(1.05);
box-shadow:0 25px 50px rgba(0,0,0,.45);
}

/* FLOATING BUBBLES */

.bubble-wrapper{

position:fixed;
top:0;
left:0;

width:100%;
height:100%;

pointer-events:none;

overflow:hidden;

z-index:1;

}

.bubble{

position:absolute;

bottom:-150px;

width:65px;

opacity:.55;

animation:rise linear infinite;

}

/* RANDOM POSITIONS */

.bubble1{ left:3%; animation-duration:10s; }
.bubble2{ left:12%; animation-duration:13s; }
.bubble3{ left:22%; animation-duration:9s; }
.bubble4{ left:33%; animation-duration:15s; }
.bubble5{ left:45%; animation-duration:11s; animation-delay:8s; }
.bubble6{ left:57%; animation-duration:14s; }
.bubble7{ left:68%; animation-duration:10s; }
.bubble8{ left:78%; animation-duration:16s; }
.bubble9{ left:88%; animation-duration:12s; }
.bubble10{ left:95%; animation-duration:18s; }
.bubble11{ left:50%; animation-duration:13s; }
.bubble12{ left:70%; animation-duration:15s; }

/* BUBBLE ANIMATION */

@keyframes rise{

0%{
transform:translateY(0) scale(.8);
opacity:0;
}

30%{
opacity:.6;
}

70%{
opacity:.6;
}

100%{
transform:translateY(-1500px) scale(1.2);
opacity:0;
}

}

/* DAISIES */

.daisy{

position:fixed;

width:70px;

opacity:.9;

z-index:1;

animation:daisyFloat 10s infinite;

}

/* HERO AREA */

.daisy1{
top:5%;
left:5%;
}

.daisy2{
top:8%;
left:80%;
}

.daisy3{
top:25%;
left:2%;
}

/* MID PAGE */

.daisy4{
top:30%;
left:90%;
}

.daisy5{
top:55%;
left:8%;
}

.daisy6{
top:60%;
left:85%;
}

/* LOWER PAGE */





/* DAISY ANIMATION */

@keyframes daisyFloat{

0%{transform:translateX(0);}
50%{transform:translateX(60px);}
100%{transform:translateX(0);}

}

/* SPARKLES */

.sparkle{

position:absolute;

width:40px;

opacity:.6;

animation:sparkleFloat 8s infinite;

}

.sparkle1{
top:300px;
left:10%;
}

.sparkle2{
top:900px;
right:8%;
}

.sparkle3{
top:1600px;
left:20%;
}

@keyframes sparkleFloat{

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

}

/* FOOTER */

.footer{

text-align:center;

padding:40px;

margin-top:60px;

background:rgba(255,255,255,.4);

backdrop-filter:blur(8px);

font-size:14px;

letter-spacing:1px;

}

/* MOBILE */

@media(max-width:900px){

.hero{
flex-direction:column;
text-align:center;
}

.content-grid{
grid-template-columns:1fr;
}

.hero-image{
width:80%;
}

}