/*START HERO SECTION */
.section-hero {
  background: linear-gradient(to right, var(--color-blue-200) 0%, var(--color-blue-500) 80%);
  position: relative;
  overflow: hidden;
}

.section-hero .central-container {
  display: flex;
  min-height: 800px;
  gap: 1rem;
}

.section-hero .central-container .content p {
  max-width: 515px;
}

.section-hero .central-container .content,
.section-hero .central-container .visual {
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  flex: 1 1 0;
  min-width: 0;
}

.section-hero .central-container .content {
  flex: 1.2;
}

.section-hero .central-container .visual {
  align-self: stretch;
}

.section-hero .central-container .visual .hero-image {
  position: absolute;
  width: 127%;
  min-width: 520px;
  height: auto;
  object-fit: cover;
  right: -18%;
  top: -15%;
  z-index: 1;
}

@media all and (max-width: 1400px) {
  .section-hero .central-container .content {
    flex: 1;
  }

  .section-hero .central-container .visual .hero-image {
    width: 115%;
    right: -10%;
  }
}

@media all and (max-width: 1023px) {
  .section-hero .central-container .visual .hero-image {
    min-width: 520px;
    width: 115%;
  }
}

@media all and (max-width: 950px) {
  .section-hero .central-container .visual .hero-image {
    min-width: 436px;
    width: 115%;
    top: auto;
    bottom: -17%;
  }
}

@media all and (max-width: 810px) {
  .section-hero .central-container {
    flex-direction: column;
    min-height: 0;
    align-items: center;
    gap: 6rem;
  }

  .section-hero .central-container .content p {
    max-width: none;
  }

  .section-hero .central-container .visual {
    min-height: 270px;
    min-width: 350px;
    align-self: auto;
  }

  .section-hero .central-container .visual .hero-image {
    min-width: 0;
    max-width: 299px;
    bottom: -56%;
    right: 7%;
  }

  .section-hero .button {
    width: 100%;
  }
}
/* END HERO SECTION */

/* START WHY CHOOSE SECTION */
.section-why-choose .central-container {
  padding: 8.2rem 0.8rem;
}

.section-why-choose .central-container .benefits-cards {
  display: flex;
  gap: 0.8rem;
}

.section-why-choose .central-container .benefits-cards .benefit-card {
  display: flex;
  flex-direction: column;
  background-color: var(--color-gray-50);
  border-radius: var(--radius-primary);
  gap: 2.4rem;
  align-items: flex-start;
  align-items: center;
  padding: 4.6rem 3.4rem;
}

.section-why-choose .central-container .benefits-cards .benefit-card .title {
  max-width: 200px;
}

.section-why-choose .central-container .benefits-cards .benefit-card .description {
  max-width: 260px;
}

.section-why-choose .central-container .benefits-cards .benefit-card img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: var(--radius-primary);
}

.section-why-choose .central-container .benefits-cards .benefit-card .image-wrapper {
  position: relative;
}

.section-why-choose .central-container .benefits-cards .benefit-card p {
  color: var(--color-gray-800);
  font: var(--font-sm);
}

.section-why-choose .central-container .benefits-cards .benefit-card .tag {
  position: absolute;
  padding: 0.8rem 1.4rem;
  border-radius: 99rem;
  display: flex;
  gap: 0.8rem;
  background-color: var(--color-gray-800);
  justify-content: center;
  align-items: center;
}

.section-why-choose .central-container .benefits-cards .benefit-card .tag p {
  font: var(--font-caption);
  text-transform: uppercase;
  color: var(--color-white);
}

.section-why-choose .central-container .benefits-cards .benefit-card .tag img {
  height: 24px;
  width: 24px;
}

.section-why-choose .central-container .benefits-cards .benefit-card:nth-child(1) .image-wrapper .tag {
  top: 57%;
  right: 9%;
}

.section-why-choose .central-container .benefits-cards .benefit-card:nth-child(2) .image-wrapper .tag {
  top: 57%;
  left: 8%;
}

.section-why-choose .central-container .benefits-cards .benefit-card:nth-child(3) .image-wrapper .tag {
  top: 57%;
  left: 15%;
}

@media all and (max-width: 810px) {
  .section-why-choose .central-container {
    padding: 6rem 0.8rem;
  }

  .section-why-choose .central-container .benefits-cards {
    flex-direction: column;
  }

  .section-why-choose .central-container .benefits-cards .benefit-card {
    padding: 3.2rem 2rem;
    gap: 1.8rem;
  }

  .section-why-choose .central-container .benefits-cards .benefit-card .title {
    max-width: none;
  }

  .section-why-choose .central-container .benefits-cards .benefit-card .image-wrapper {
    width: 90%;
  }

  .section-why-choose .central-container .benefits-cards .benefit-card .tag {
    padding: 0.6rem 1rem;
  }
}
/* END WHY CHOOSE SECTION */

/* START CARE TYPES SECTION */
.section-care-types .central-container .cards {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.section-care-types .central-container .care-type-card {
  display: flex;
  gap: 2rem;
  padding: 0.8rem 0.8rem 0.8rem 4.6rem;
  background-color: var(--color-gray-50);
  flex: 1;
  border-radius: var(--radius-primary);
}

.section-care-types .central-container .care-type-card .content {
  flex: 1;
  padding: 3.8rem 0;
  display: flex;
  flex-direction: column;
  gap: 3.2rem;
  align-self: stretch;
  justify-content: space-between;
}

.section-care-types .central-container .care-type-card .image-wrapper {
  flex: 1;
  border-radius: var(--radius-secondary);
  background-color: var(--color-gray-200);
  overflow: hidden;
  height: fit-content;
}

.section-care-types .central-container .care-type-card .image-wrapper img {
  display: block;
  width: 100%;
}

.section-care-types .central-container .care-type-card .top {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
}

.section-care-types .central-container .care-type-card .top .title {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.section-care-types .central-container .care-type-card .bottom {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
}

.section-care-types .central-container .care-type-card .bottom .care-services-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.section-care-types .central-container .care-type-card .bottom .care-services-item {
  display: flex;
  gap: 1rem;
}

.section-care-types .central-container .care-type-card .bottom .care-services-item img {
  width: 24px;
  height: 24px;
}

.section-care-types .central-container .care-type-card .bottom .care-services-item h6 {
  flex: 1;
}

.section-care-types .central-container .care-type-card .bottom .lists {
  display: flex;
  gap: 1.8rem;
}

@media all and (max-width: 1200px) {
  .section-care-types .central-container .care-type-card {
    flex-direction: column-reverse;
    padding: 0.8rem;
    gap: 1.2rem;
  }

  .section-care-types .central-container .care-type-card .content {
    padding: 2.4rem;
  }

  .section-care-types .central-container .care-type-card .image-wrapper {
    max-width: 470px;
  }
}

@media all and (max-width: 800px) {
  .section-care-types .central-container .care-type-card .content {
    padding: 1.2rem;
    gap: 2.4rem;
  }

  .section-care-types .central-container .care-type-card .bottom .lists {
    flex-direction: column;
    gap: 1.2rem;
  }
}
/* END CARE TYPES SECTION */

/* START OUR APPROACH SECTION */
.section-our-approach .video-wrapper {
  position: relative;
  width: 100%;
  max-width: 1038px;
}

.section-our-approach .video-wrapper video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: var(--radius-primary);
}

.section-our-approach .video-control {
  position: absolute;
  inset: 0;
  margin: auto;
  padding: 1.4rem 2.2rem;
  width: fit-content;
  height: fit-content;
  border-radius: var(--radius-primary);
  border: none;
  font: var(--font-lg-button);
  color: var(--color-white);
  cursor: pointer;
  transition: transform .2s ease, opacity .2s ease;
  z-index: 3;
  overflow: hidden;
  display: flex;
  gap: 1.2rem;
  align-items: center;
  backdrop-filter: blur(70px);
  background: transparent;
}

.section-our-approach .video-fit-container {
  width: fit-content;
  border-radius: var(--radius-primary);
  overflow: hidden;
  aspect-ratio: 16 / 9;
}

.section-our-approach .video-wrapper:hover .video-control {
  transform: scale(1.15);
}

.section-our-approach .video-wrapper.playing .video-control {
  opacity: 0;
  pointer-events: none;
}

.section-our-approach video::-webkit-media-controls-start-playback-button {
  display: none !important;
}

.section-our-approach video::-webkit-media-controls-overlay-play-button {
  display: none !important;
}
/* END OUR APPROACH SECTION */

/* START WE PROVIDE SECTION */
.section-we-provide {
  background: linear-gradient(to bottom, var(--color-blue-500) 0%, var(--color-blue-200) 100%);
}

.section-we-provide .central-container {
  display: flex;
  align-items: center;
  gap: 3.2rem;
}

.section-we-provide .central-container > .content {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.section-we-provide .central-container .content div p {
  max-width: 514px;
}

.section-we-provide .central-container .visual {
  padding: 2.4rem 0;
  flex: 1;
}

.section-we-provide .central-container .visual img {
  width: 100%;
  height: auto;
  object-fit: cover;
  min-width: 420px;
  z-index: 1;
  position: relative;
}

@media all and (max-width: 1023px) {
  .section-we-provide {
    background: linear-gradient(to bottom, var(--color-blue-500) 0%, var(--color-blue-200) 97%);
  }
}

@media all and (max-width: 900px) {
  .section-we-provide {
    background: linear-gradient(to bottom, var(--color-blue-500) 0%, var(--color-blue-200) 92%);
  }
}

@media all and (max-width: 850px) {
  .section-we-provide {
    background: linear-gradient(to bottom, var(--color-blue-500) 0%, var(--color-blue-200) 87%);
  }
}

@media all and (max-width: 810px) {
  .section-we-provide {
    background: linear-gradient(to bottom, var(--color-blue-500) 0%, var(--color-blue-200) 110%);
  }

  .section-we-provide .central-container .visual {
    padding: 0;
  }

  .section-we-provide .central-container {
    flex-direction: column;
  }

  .section-we-provide .central-container .visual img {
    min-width: 0;
    max-width: 370px;
  }
}
/* END WE PROVIDE SECTION */
