@import url("https://fonts.googleapis.com/css2?family=David+Libre:wght@400;500;700&family=Poppins: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=Rubik:ital,wght@0,300..900;1,300..900&display=swap");
body {
  font-family: "rubik", sans-serif;
  overflow-x: hidden !important ;
}
/* bootstrap classes */
.container {
  max-width: 1170px !important;
}
.bg-primary {
  background: #ed017f !important;
}
.py-9 {
  padding: 8px 20px;
}
.py-111 {
  padding: 222px 15px 15px;
}
.bg-warning {
  background-color: white !important;
}
.py-20 {
  padding: 20px 25px;
}
.border-warning {
  color: #ed017f !important ;
  border-color: #ed017f !important;
}
.mx-vh-100 {
  max-height: 100vh;
}
.card {
  border: none;
}

.ms-auto {
  margin-left: -6px !important;
}
/* header class */
.header-section {
  left: 0;
  right: 0;
}
.navbar-brand > img {
  max-width: 109px;
  max-height: 53px;
  object-fit: contain;
}
.column-gap-40 {
  gap: 40px;
}

/* Banner-section */
.content > h1 {
  font-size: 63px;
  max-width: 453px;
}
.content > p {
  color: #676767;
  line-height: 22px;
  max-width: 380px;
  margin-block: 23px 38px;
}
.content > .nav-btn > a {
  margin-right: 20px;
}
.right-content {
  background: url(../Assets/Big.png) no-repeat center/cover;
  height: 682px;
  width: 710px;
  bottom: 520px;
  /* left: 650px; */
  left: 575px;
  z-index: -1;
}
.right-content > div:first-child {
  top: 114px;
  left: -170px;
  max-width: 905px;
  max-height: 654px;
}
.right-content > div:last-child {
  right: 30px;
  top: 200px;
  gap: 19px;
  border: none;
  box-shadow: 2px 2px 15px rgb(129, 122, 110);
}
.right-content > div:nth-child(2) {
  top: 140px;
  left: -70px;
  gap: 19px;
  border: none;
  box-shadow: 2px 2px 15px rgb(129, 122, 110);
}
.right-content > div:nth-child(2) > a > h3,
.right-content > div:last-child > a > h3 {
  font-size: 18px;
}
.right-content > .family-pic > img {
  max-width: 905px;
  max-height: 654px;
  object-fit: contain;
}
.mobile-view {
  background: url(../Assets/Big.png) no-repeat center/cover;
  display: none;
}

/* Cards section */
.card-body p {
  font-size: 16px;
  max-width: 160px;
  color: rgba(0, 0, 0, 0.4);
}
.card-body h3 {
  margin-block: 18px 10px;
  font-size: 22px;
  line-height: 22px;
}
.card-title > h1 {
  font-size: 36px;
  line-height: 43px;
}
.card-title > p {
  max-width: 660px;
  margin: auto;
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 75px;
}

/* Slider section */

.slide-section {
  background: #fce0ef33;
  overflow: hidden;
}

.slide-section > div {
  max-width: 1200px !important;
  padding-block: 78px 69px;
}

.slide-section > div > h1 {
  color: #343434;
  margin-bottom: 88px;
}

.swiper {
  max-width: 100%;
  max-height: 100%;
}

.swiper-slide > img {
  max-width: 185px;
  max-height: 110px;
  object-fit: contain;
}

/* Service Section */
.service-section {
  background-color: #fef9fc;
}
.service-title > h1 {
  font-size: 36px;
  line-height: 43px;
}
.service-title > p {
  color: rgba(0, 0, 0, 0.4);
  margin-bottom: 75px;
}

.arrow > h3 {
  max-width: 195px;
  font-size: 20px;
  line-height: 35px;
}
.arrow {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.py-100 {
  padding: 100px 15px 70px;
}

/* Result card section */
.card-body h2 {
  font-size: 40px;
  font-weight: 700;
  line-height: 43px;
  color: #343434;
}
/* Newsletter Section */
.newsletter {
  padding: 100px 15px;
  background-color: #fef9fc;
}
.newsletter > .container > h1 {
  font-size: 36px;
  font-weight: 700;
  line-height: 43px;
  color: #343434;
}
.newsletter > .container > p {
  padding: 20px 0 34px;
  max-width: 410px;
  line-height: 22px;
  font-weight: 400;
  color: #676767;
}
.form-control {
  width: 320px;
  margin-right: 12px;
}
.input-group {
  width: 50%;
}
/* Footer Section */
.btn-pink {
  background-color: #fc0e9f;
  color: white;
}
.btn-pink:hover {
  background-color: #e10c8d;
}
.text-pink {
  color: #fc0e9f;
}
.fa-solid {
  width: 10px;
  margin-right: 20px;
}
.font-col > li > a {
  color: #676767 !important;
}

.slide-swiper {
  display: none !important;
}
/* media screen */

  .slide-swiper > .swiper-wrapper > .swiper-slide > .top-img{
    min-height: 350px;
  }

@media screen and (max-width: 1024px) {
  .banner-section > .container > .row {
    flex-direction: column-reverse;
    text-align: center;
  }
  .content > h1,
  .content > p {
    margin: auto;
    margin-bottom: 20px;
  }
  .right-content {
    display: none !important;
  }
  .mobile-view {
    display: block !important;
    max-width: 100%;
  }

  .right-img > img {
    max-width: 100%;
  }
  .py-111 {
    padding-top: 150px !important;
  }

  /* Blog-section */
  .blog-section > div {
    flex-direction: column;
    text-align: center;
  }
  .blog-right {
    margin-bottom: 15px;
  }
  /* Card Section */
  .service-section > .container > .row {
    display: none !important;
  }

  .slide-swiper {
    display: block !important;
  }
  .slide-swiper > .swiper-wrapper > .swiper-slide > h3 {
    font-size: 14px;
  }
}
@media screen and (max-width: 991px) {
  .column-gap-40 {
    text-align: center;
    backdrop-filter: blur(40px);
  }
  .column-gap-40 > li > a {
    color: #000000 !important;
  }
  .navbar-toggler {
    background-color: rgb(255, 133, 133);
  }
}
@media screen and (max-width: 475px) {
  .content > h1 {
    font-size: 30px;
  }
  .card-title > h1 {
    font-size: 24px;
  }
  .blog-left,
  .blog-left > img {
    max-width: 325px;
  }
  .py-100 {
    padding-top: 40px;
  }
  .card-title > p {
    margin-bottom: 25px;
  }
  .swiper-wrapper{
    gap: 110px;
  }
}