@import url("https://fonts.googleapis.com/css2?family=Azeret+Mono:ital,wght@0,100..900;1,100..900&family=Fira+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap");
* {
  margin: 0;
  padding: 0;
}
body {
  font-family: "Lato", serif;
}

/* header section start  */
.hero {
  background-color: rgba(229, 84, 115, 0.1);
  display: flex;
  gap: 70px;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  max-width: 1920px;
  height: 850px;
  padding-top: 50px;
}
.hero-description {
  width: 708px;
}
.hero-description h1 {
  color: rgb(39, 39, 39);
  font-family: Lato;
  font-size: 80px;
  font-weight: 800;
  line-height: 96px;
  letter-spacing: 0%;
  text-align: left;
  margin-top: 197px;
  margin-bottom: 32px;
}
.hero-description p {
  color: rgba(39, 39, 39, 0.6);
  font-family: Lato;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  letter-spacing: 0%;
  text-align: left;
  margin-bottom: 32px;
}
.hero-img {
  width: 635px;
  height: 100%;
}
.hero-img img {
  width: 100%;
  height: 100%;
}
.btn-primary {
  padding: 20px 43px;
  border-radius: 8px;
  background: rgb(229, 84, 115);
  border: none;
  color: rgb(255, 255, 255);
  font-family: Lato;
  font-size: 20px;
  font-weight: 700;
  text-align: left;
  margin-bottom: 147px;
}
.btn-primary:hover{
  background-color: aquamarine;
  color: black;
  cursor: pointer;
}
/* header section end  */

/* flowers card section start ******************** */
.flowers-heading {
  text-align: center;
  margin-top: 178px;
}
.flowers-heading h1 {
  color: rgb(39, 39, 39);
  font-family: Lato;
  font-size: 40px;
  font-weight: 800;
  line-height: 48px;
  letter-spacing: 0%;
  text-align: center;
}
.flowers-heading p {
  color: rgba(39, 39, 39, 0.6);
  font-family: Lato;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  margin-bottom: 48px;
  margin-top: 24px;
}

.flowers-parent {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
.flower-1 {
  width: 310px;
  height: 428px;
  border-radius: 300px 300px 0px 0px;
  background: rgba(167, 33, 98, 0.15);
  align-content: end;
  justify-content: center;
  padding: 110px 78px 0 76px;
}
.flower-2 {
  width: 310px;
  height: 428px;
  border-radius: 300px 300px 0px 0px;
  background: rgba(5, 151, 160, 0.15);
  align-content: end;
  justify-content: center;
  padding: 110px 78px 0 76px;
}
.flower-3 {
  width: 310px;
  height: 428px;
  border-radius: 300px 300px 0px 0px;
  background: rgba(71, 125, 17, 0.15);
  align-content: end;
  justify-content: center;
  padding: 110px 78px 0 76px;
}
.flower-title {
  text-align: center;
  color: rgb(39, 39, 39);
  font-size: 24px;
  font-weight: 700;
  text-decoration-line: underline;
}
.flowers-parent img {
  width: 310px;
  height: 428px;
}
.flowers-parent img:hover{
  opacity: 0.8;
  cursor: pointer;
}
/* flowers card section end ******************* */

/* contact section start ?**************** */
.contact {
  margin-top: 128px;
}
.contact-parent {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 85px 175px;
  gap: 100px;
  text-align: center;
  border-radius: 8px;
  background: rgba(39, 39, 39, 0.05);
  width: 1090px;
  margin: 0 auto;
}
.contact-parent img {
  width: 88px;
  height: 88px;
}
.contact-parent p {
  margin-top: 24px;
  color: rgba(39, 39, 39, 0.8);
  font-size: 24px;
  /* font-weight: 600; */
  text-align: center;
}
/* .contact section end ******************** */

/* discount section start ************ */
.discount {
  /* height: 100%; */
  padding: 80px 260px 80px 260px;
  background: rgba(229, 84, 115, 0.05);
  max-width: 1920px;
  border-radius: 8px;
  margin: 128px auto;
}
.discount-parent {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 120px;
}

.discount-details h1 {
  font-size: 40px;
  font-weight: 800;
  line-height: 48px;
  letter-spacing: 0%;
  text-align: center;
  margin-top: 230px;
  margin-bottom: 24px;
}
.discount-details p {
  color: rgba(39, 39, 39, 0.6);
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  margin-bottom: 32px;
  max-width: 594px;
}
.discount-details button {
  align-items: center;
  margin-left: 200px;
}
.disc-flower img {
}
/* discount section end ************* */

/* instagram section start *********** */

.instagram {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.instagram h1 {
  color: rgb(39, 39, 39);
  font-size: 40px;
  font-weight: 800;
  text-align: center;
  margin-bottom: 24px;
}
.instagram p {
  color: rgba(39, 39, 39, 0.6);
  font-size: 18px;
  font-weight: 400;
  text-align: center;
  margin-bottom: 48px;
}
.insta-img {
  display: flex;
  gap: 24px;
  margin-bottom: 128px;
}
.insta-img img:hover{
  opacity: 0.8;
  cursor: pointer;
}
.insta-img img {
  width: 342px;
  height: 396px;
  border-radius: 5px;
}

/* instagram section end **************** */

/* subscriber section start ********* */
.subscribe {
  background-image: url("Flower-Asset/Rectangle\ 9.png");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  max-width: 1440px;
  height: 80vh;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  /* position: relative; */
}
.parent {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}
.parent h1 {
  color: rgb(39, 39, 39);
  font-size: 40px;
  font-weight: 800;
  line-height: 48px;
  text-align: center;
  margin-bottom: 16px;
}
.parent p {
  color: rgba(39, 39, 39, 0.6);
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  text-align: center;
  margin-bottom: 48px;
}
.input-btn {
  display: flex;
  gap: 16px;
}
.input-btn button {
  margin-bottom: 0;
}
input {
  color: rgba(39, 39, 39, 0.6);
  font-size: 20px;
  font-weight: 400;
  line-height: 19px;
  text-align: left;
  border-radius: 8px;
  padding: 20px;
  border: none;
  width: 700px;
  background: rgb(255, 255, 255);
}
/* subscriber section end **************** */

/* footer section start **************** */
footer {
  display: flex;
  justify-content: center;
  background-color: #111010;
  color: white;
  text-align: center;
}
.footer-details {
  width: 625px;
  padding: 128px 0;
}
.footer-details h1 {
  font-size: 48px;
  font-weight: 800;
  line-height: 58px;
  color: #e55473;
  margin-bottom: 24px;
}
.footer-details h6 {
  color: rgba(255, 255, 255, 0.9);
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  margin-bottom: 32px;
}
.footer-details p {
  color: rgba(255, 255, 255, 0.4);
  font-size: 16px;
  font-weight: 400;
  line-height: 19px;
}
/* responsive for smaller device start  */
@media screen and (max-width: 576px) {
  .hero {
    flex-direction: column;
    width: 100%;
    height: 100%;
    padding-top: 30px;
  }
  .hero-description {
    padding: 0px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .hero-img img,
  .hero-img {
    width: 100%;
  }
  .btn-primary {
    /* margin-bottom: 32px; */
    margin: 0 auto;
    padding: 8px 15px;
    max-width: 177px;
  }
  .hero-description h1 {
    font-size: 46px;
    line-height: 54px;
    margin-top: 0px;
    margin-bottom: 20px;
    padding: 0px 15px;
    text-align: center;
  }
  .hero-description p {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 16px;
    padding: 0px 15px;
  }
  .flowers-parent {
    flex-direction: column;
    gap: 24px;
    width: 100%;
    align-items: center;
    justify-content: center;
  }
  .flower-1,
  .flower-2,
  .flower-3 {
    width: 70%;
    padding: 20px;
  }
  .flowers-parent h1 {
    font-size: 24px;
  }
  .flower-1,
  .flower-2,
  .flower-3 img {
    width: 70%;
    padding-bottom: 0;
  }
  .flower-title {
    margin-top: 20px;
  }
  .contact-parent {
    flex-direction: column;
    width: 100%;
    padding: 0;
  }
  .discount-parent {
    flex-direction: column;
    gap: 0px;
  }
  .discount {
    padding: 0;
    margin-top: 0px;
  }
  .discount-details {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .discount-details h1 {
    margin-top: 0;
  }
  .discount-details p {
    width: 100%;
  }

  .disc-flower img {
    width: 100%;
  }

  .discount-details button {
    margin: 0 auto;
    margin-bottom: 30px;
  }
  .insta-details p {
    width: 100%;
  }
  .insta-img {
    flex-direction: column;
    margin-bottom: 60px;
  }
  .insta-img img {
    width: 100%;
  }
  .subscribe {
    background: rgba(229, 84, 115, 0.044);
    height: 100%;
    padding: 60px 20px;
  }
  .parent h1 {
    font-size: 32px;
    margin-bottom: 8px;
  }
  .parent p {
    margin-bottom: 20px;
  }
  input {
    width: 100%;
  }
  footer {
    padding: 0px;
  }
  .footer-details {
    width: 100%;
    padding-top: 30px;
  }
}

/* responsive for smaller device end */