@import "../../frontend/node_modules/slick-carousel/slick/slick.css";
@import "../../frontend/node_modules/slick-carousel/slick/slick-theme.css";
.home-banner {
  position: relative;
  height: 100vh;
}
@media screen and (max-width: 1024px) {
  .home-banner {
    height: 65vh;
  }
}
@media screen and (max-width: 768px) {
  .home-banner {
    height: 700px;
  }
}
.home-banner__navigation {
  position: relative;
  margin-top: -19%;
}
@media screen and (max-width: 768px) {
  .home-banner__navigation {
    margin-top: -40%;
  }
}
.home-banner a {
  height: 100%;
}
.home-statistic__section {
  margin-top: -10%;
  position: relative;
  background: #ffe8cc;
  overflow: hidden;
}
@media screen and (max-width: 1024px) and (min-width: 769px) {
  .home-statistic__section-main-wraper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -moz-box-orient: horizontal;
       -moz-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
  }
}
@media screen and (max-width: 768px) {
  .home-statistic__section-main-wraper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.home-statistic__section .baby-image {
  position: relative;
  width: 18%;
}
@media screen and (max-width: 768px) {
  .home-statistic__section .baby-image {
    width: 100%;
    text-align: center;
    margin-bottom: -16px;
  }
}
.home-statistic__section .baby-image img {
  position: absolute;
  bottom: 0px;
  left: 0px;
}
@media screen and (max-width: 768px) {
  .home-statistic__section .baby-image img {
    position: relative;
    margin: 0 auto;
  }
}
.home-slider {
  height: 100%;
  position: relative;
}
.home-slider .slick-list,
.home-slider .slick-track,
.home-slider .slick-slide div {
  height: 100%;
}
.home-slider__wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .home-slider__wrapper .container {
    width: 90%;
  }
}
.home-slider__background {
  height: 100%;
}
.home-slider__background img {
  width: 100%;
  height: 100%;
  position: relative;
  -o-object-fit: cover;
     object-fit: cover;
}
.home-slider__ornamanet {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: linear-gradient(82deg, #050505 -11.55%, rgba(5, 5, 5, 0) 86.96%);
}
.home-slider__text {
  position: absolute;
  top: 0;
  z-index: 1;
  left: 0;
  width: 100%;
  height: 88%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
     -moz-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.home-slider__text .paragraph-font {
  height: auto !important;
}
.home-slider__text-content {
  margin-top: -8%;
}
@media screen and (max-width: 768px) {
  .home-slider__text-content {
    text-align: center;
  }
  .home-slider__text-content .main-title-font {
    font-size: 1.625rem;
    line-height: 34px;
    text-align: center;
  }
}
.home-slider__text p {
  color: #fff !important;
  margin-bottom: 15px;
}
@media screen and (max-width: 768px) {
  .home-slider__text p {
    text-align: center;
  }
}
.home-slider__text h2 {
  color: #ffd46b;
  margin: 15px 0;
}
@media screen and (max-width: 768px) {
  .home-slider__text h2 {
    text-align: center;
  }
}
.home-background {
  position: absolute;
  height: 115vh;
  right: 0;
  top: 0;
  z-index: -1;
}
.home-background_main {
  height: 100%;
  position: relative;
}
.home-background_main img {
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 768px) {
  .home-background:first-child {
    position: relative;
    height: auto;
  }
  .home-background:last-child {
    height: auto;
    width: 120%;
    top: -94vw;
    left: -28vw;
    z-index: 1;
  }
}

@media screen and (min-width: 640px) {
  .section-banner-top .container {
    max-width: none;
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .section-banner-top .medium-banner-font {
    font-size: 18px;
    line-height: 27px;
  }
}

@media screen and (max-width: 1024px) {
  .doctor-section .container,
  .product-section .container,
  .ulasan-section .container,
  .article-section .container,
  .promo-section .container,
  .start-now-section .container {
    max-width: none;
    width: 90%;
    margin: 0 auto;
  }
  .product-section .flex.flex-col.md\:grid {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .product-section .flex.flex-col.md\:grid > * {
    width: 100%;
    margin-bottom: 1.5rem;
  }
}
@media screen and (max-width: 1024px) and (min-width: 768px) and (max-width: 1024px) {
  .start-now-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .start-now-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-4 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) and (min-width: 768px) and (max-width: 1024px) {
  .promo-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .promo-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-4 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) and (min-width: 768px) and (max-width: 1024px) {
  .article-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) and (max-width: 767px) {
  .article-section .grid.grid-cols-1.md\:grid-cols-2.lg\:grid-cols-3 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
}
@media screen and (max-width: 1024px) {
  .site-header .desktop-nav {
    display: none;
  }
  .site-header .mobile-nav {
    display: block;
  }
}
.testimonial-item {
  padding: 24px 12px 75px 12px;
}
@media screen and (max-width: 768px) {
  .testimonial-item {
    padding-bottom: 40px;
  }
}
@media screen and (max-width: 480px) {
  .testimonial-item {
    padding-bottom: 32px;
  }
}
.testimonial-item_wrapper {
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  background: #fff;
  padding: 22px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
     -moz-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 32px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  border-radius: 16px;
  opacity: 0.8;
  position: relative;
  top: 13px;
  -webkit-box-shadow: 0px 30px 40px rgba(117, 75, 16, 0.01), 0px 20px 20px rgba(117, 75, 16, 0.02), 0px 10px 15px rgba(117, 75, 16, 0.03), 0px 5px 10px rgba(117, 75, 16, 0.04);
          box-shadow: 0px 30px 40px rgba(117, 75, 16, 0.01), 0px 20px 20px rgba(117, 75, 16, 0.02), 0px 10px 15px rgba(117, 75, 16, 0.03), 0px 5px 10px rgba(117, 75, 16, 0.04);
}
@media screen and (max-width: 820px) {
  .testimonial-item_wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -moz-box-orient: vertical;
       -moz-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
       -moz-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    gap: 24px;
    opacity: 1;
  }
}
.testimonial-item_images {
  width: 25%;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  height: 195px;
  position: relative;
}
.testimonial-item_images img {
  border-radius: 16px;
  position: relative;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 820px) {
  .testimonial-item_images {
    width: 100%;
    max-width: 100%;
    height: 300px;
  }
}
.testimonial-item_text {
  text-align: left;
  width: 77%;
  font-family: "Onest", serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #334155;
}
@media screen and (max-width: 480px) {
  .testimonial-item_text {
    text-align: center;
    width: 100%;
  }
}

.slick-dots {
  text-align: right;
  bottom: 0;
  right: 0;
}

.custom-dots {
  position: relative;
  width: 50%;
  top: 30px;
}
@media screen and (max-width: 768px) {
  .custom-dots {
    top: 10px;
  }
}
.custom-dots .slick-dots li {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.custom-dots .slick-dots li.slick-active button, .custom-dots .slick-dots li:hover button {
  background: #ed8910;
}
.custom-dots .slick-dots li button {
  background: #cbd5e1;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.custom-dots .slick-dots li button::before {
  display: none;
}

.banner-custom-dots {
  position: relative;
  width: 50%;
  top: 30px;
}
@media screen and (max-width: 820px) {
  .banner-custom-dots {
    top: 10px;
  }
}
.banner-custom-dots .slick-dots li {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.banner-custom-dots .slick-dots li.slick-active button, .banner-custom-dots .slick-dots li:hover button {
  background: #ed8910;
}
.banner-custom-dots .slick-dots li button {
  background: #cbd5e1;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.banner-custom-dots .slick-dots li button::before {
  display: none;
}

.slick-current.slick-active.slick-center .testimonial-item_wrapper {
  opacity: 1;
  top: 0px;
  padding: 32px;
}
.slick-current.slick-active.slick-center .testimonial-item_images {
  width: 25%;
}
.slick-current.slick-active.slick-center .testimonial-item_text {
  width: 75%;
}

.ulasan-slider_item {
  padding: 24px 24px 56px 24px;
}
@media screen and (max-width: 480px) {
  .ulasan-slider_item {
    padding: 0;
  }
}
.ulasan-slider_item-inset {
  -webkit-box-shadow: 0px 180px 50px 0px rgba(119, 81, 29, 0), 0px 115px 46px 0px rgba(119, 81, 29, 0), 0px 65px 39px 0px rgba(119, 81, 29, 0.02), 0px 29px 29px 0px rgba(119, 81, 29, 0.03), 0px 7px 16px 0px rgba(119, 81, 29, 0.03);
          box-shadow: 0px 180px 50px 0px rgba(119, 81, 29, 0), 0px 115px 46px 0px rgba(119, 81, 29, 0), 0px 65px 39px 0px rgba(119, 81, 29, 0.02), 0px 29px 29px 0px rgba(119, 81, 29, 0.03), 0px 7px 16px 0px rgba(119, 81, 29, 0.03);
  padding-bottom: 30px;
}

.ulasan-navigation-slider .slick-dots {
  text-align: left;
}
@media screen and (max-width: 480px) {
  .ulasan-navigation-slider .slick-dots {
    text-align: center;
  }
}
.ulasan-navigation-slider .slick-dots li {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.ulasan-navigation-slider .slick-dots li.slick-active button, .ulasan-navigation-slider .slick-dots li:hover button {
  background: #ed8910;
}
.ulasan-navigation-slider .slick-dots li button {
  background: #cbd5e1;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.ulasan-navigation-slider .slick-dots li button::before {
  display: none;
}