

* {
  box-sizing: border-box;
}


/* ================= MAIN SLIDER ================= */

.jia-hero-slider {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.jia-slider-wrapper {
  width: 100%;
  height: 520px;
  position: relative;
  overflow: hidden;
}


/* ================= SLIDE ================= */

.jia-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease;
}

.jia-slide.active {
  opacity: 1;
  visibility: visible;
  z-index: 2;
}


/* ================= IMAGE ================= */

.jia-slide-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}


/* ================= DARK OVERLAY ================= */

.jia-slide-overlay {
  position: absolute;
  inset: 0;

  background:
    linear-gradient(
      90deg,
      rgba(8, 24, 45, 0.85) 0%,
      rgba(8, 24, 45, 0.60) 45%,
      rgba(8, 24, 45, 0.15) 100%
    );
}


/* ================= CONTENT ================= */

.jia-slide-content {
  position: absolute;
  z-index: 5;

  left: 8%;
  top: 50%;

  transform: translateY(-50%);

  max-width: 650px;

  color: #fff;
}


/* SMALL TITLE */

.jia-small-title {
  display: inline-block;

  color: #20b99a;

  font-size: 15px;
  font-weight: 600;

  letter-spacing: 2px;

  margin-bottom: 15px;
}


/* HEADING */

.jia-slide-content h1 {

  font-size: 54px;

  line-height: 1.15;

  font-weight: 500;

  margin: 0 0 20px;
}

.jia-slide-content h1 strong {
  color: #20b99a;
  font-weight: 700;
}


/* PARAGRAPH */

.jia-slide-content p {

  font-size: 17px;

  line-height: 1.8;

  color: #f3f4f6;

  max-width: 570px;

  margin-bottom: 30px;
}


/* ================= BUTTONS ================= */

.jia-slide-buttons {

  display: flex;

  align-items: center;

  gap: 15px;
}


/* PRIMARY BUTTON */

.jia-btn-primary {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background: #20a98f;

  color: #fff;

  padding: 15px 25px;

  border-radius: 4px;

  font-size: 14px;

  font-weight: 600;

  text-decoration: none;

  transition: all 0.3s ease;
}

.jia-btn-primary:hover {

  background: #fff;

  color: #10182b;

}


/* OUTLINE BUTTON */

.jia-btn-outline {

  display: inline-flex;

  align-items: center;

  gap: 9px;

  color: #fff;

  border: 1px solid rgba(255,255,255,0.8);

  padding: 14px 24px;

  border-radius: 4px;

  font-size: 14px;

  font-weight: 600;

  text-decoration: none;

  transition: all 0.3s ease;
}

.jia-btn-outline:hover {

  background: #fff;

  color: #10182b;

}


/* ================= ARROWS ================= */

.jia-prev,
.jia-next {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  z-index: 10;

  width: 48px;

  height: 48px;

  border: none;

  border-radius: 50%;

  background: rgba(255,255,255,0.20);

  color: #fff;

  cursor: pointer;

  font-size: 17px;

  transition: all 0.3s ease;
}

.jia-prev {
  left: 25px;
}

.jia-next {
  right: 25px;
}

.jia-prev:hover,
.jia-next:hover {

  background: #20a98f;

}


/* ================= DOTS ================= */

.jia-slider-dots {

  position: absolute;

  bottom: 25px;

  left: 50%;

  transform: translateX(-50%);

  z-index: 20;

  display: flex;

  gap: 10px;
}

.jia-dot {

  width: 11px;

  height: 11px;

  border-radius: 50%;

  background: rgba(255,255,255,0.55);

  cursor: pointer;

  transition: all 0.3s ease;
}

.jia-dot.active {

  width: 30px;

  border-radius: 10px;

  background: #20a98f;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 900px) {

  .jia-slider-wrapper {
    height: 550px;
  }

  .jia-slide-content {
    left: 7%;
    max-width: 550px;
  }

  .jia-slide-content h1 {
    font-size: 44px;
  }

  .jia-slide-content p {
    font-size: 15px;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

  .jia-slider-wrapper {

    /*
      Full-width mobile banner
    */

    width: 100%;

    height: 650px;

  }


  .jia-slide {

    width: 100%;
    height: 100%;

  }


  /*
    Full image visible on mobile
  */

  .jia-slide-image {

    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}


  .jia-slide-overlay {

    background:
      linear-gradient(
        180deg,
        rgba(8,24,45,0.15) 0%,
        rgba(8,24,45,0.45) 40%,
        rgba(8,24,45,0.90) 100%
      );

  }


  .jia-slide-content {

    left: 6%;

    right: 6%;

    top: auto;

    bottom: 80px;

    transform: none;

    max-width: none;

    text-align: center;

  }


  .jia-small-title {

    font-size: 11px;

    letter-spacing: 1.2px;

    margin-bottom: 10px;

  }


  .jia-slide-content h1 {

    font-size: 30px;

    line-height: 1.2;

    margin-bottom: 14px;

  }


  .jia-slide-content p {

    font-size: 13px;

    line-height: 1.6;

    margin: 0 auto 20px;

    max-width: 340px;

  }


  /* MOBILE BUTTONS */

  .jia-slide-buttons {

    justify-content: center;

    flex-wrap: wrap;

    gap: 9px;

  }


  .jia-btn-primary,
  .jia-btn-outline {

    padding: 11px 15px;

    font-size: 11px;

  }


  /* MOBILE ARROWS */

  .jia-prev,
  .jia-next {

    width: 38px;

    height: 38px;

    font-size: 13px;

  }


  .jia-prev {
    left: 10px;
  }

  .jia-next {
    right: 10px;
  }


  /* DOTS */

  .jia-slider-dots {

    bottom: 25px;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-slider-wrapper {

    height: 600px;

  }

  .jia-slide-content h1 {

    font-size: 26px;

  }

  .jia-slide-content p {

    font-size: 12px;

  }

  .jia-btn-primary,
  .jia-btn-outline {

    padding: 10px 12px;

    font-size: 10px;

  }

}

<!-- =====================================================
     CSS
===================================================== -->


.jia-about-section {
  width: 100%;
  padding: 100px 5%;
  background: #ffffff;
  overflow: hidden;
}

.jia-about-container {
  max-width: 1200px;
  margin: auto;

  display: grid;
  grid-template-columns: 48% 52%;
  align-items: center;
  gap: 70px;
}


/* =====================================================
   LEFT IMAGE
===================================================== */

.jia-about-image-area {
  position: relative;
  padding: 0 20px 25px 0;
}

.jia-about-image {
  width: 100%;
  height: 530px;
  overflow: hidden;
  border-radius: 8px;
  position: relative;
}

.jia-about-image img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.jia-about-image:hover img {
  transform: scale(1.05);
}


/* =====================================================
   EXPERIENCE BOX
===================================================== */

.jia-experience-box {
  position: absolute;

  right: -5px;
  bottom: 0;

  width: 210px;
  min-height: 120px;

  background: #10182b;

  color: #ffffff;

  display: flex;
  align-items: center;

  padding: 22px;

  border-left: 5px solid #20a98f;

  box-shadow: 0 15px 35px rgba(0,0,0,0.18);
}


.jia-experience-number {
  color: #20b99a;

  font-size: 48px;

  line-height: 1;

  font-weight: 700;

  margin-right: 12px;
}


.jia-experience-text {
  font-size: 13px;

  line-height: 1.5;

  font-weight: 600;

  letter-spacing: .5px;
}


/* =====================================================
   RIGHT CONTENT
===================================================== */

.jia-about-content {
  padding-top: 5px;
}


.jia-about-subtitle {
  color: #20a98f;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 1.5px;

  display: block;

  margin-bottom: 13px;
}


.jia-about-content h2 {
  font-size: 42px;

  line-height: 1.2;

  font-weight: 600;

  color: #10182b;

  margin: 0 0 22px;
}


.jia-about-content h2 span {
  color: #20a98f;

  display: block;
}


.jia-about-content p {
  color: #667085;

  font-size: 15px;

  line-height: 1.8;

  margin: 0 0 15px;
}


.jia-about-intro {
  font-size: 16px !important;
  color: #475467 !important;
}


.jia-about-content strong {
  color: #10182b;
}


/* =====================================================
   FEATURES
===================================================== */

.jia-about-features {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px;

  margin: 28px 0;
}


.jia-about-feature {

  display: flex;

  align-items: flex-start;

  gap: 12px;
}


.jia-feature-icon {

  min-width: 43px;

  width: 43px;

  height: 43px;

  border-radius: 50%;

  background: #e9f8f5;

  color: #20a98f;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 17px;
}


.jia-about-feature h4 {

  font-size: 14px;

  color: #10182b;

  margin: 0 0 4px;

  font-weight: 600;
}


.jia-about-feature p {

  font-size: 12px !important;

  line-height: 1.5 !important;

  margin: 0 !important;

  color: #7b8492 !important;
}


/* =====================================================
   BUTTON
===================================================== */

.jia-about-btn {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  background: #20a98f;

  color: #ffffff;

  padding: 14px 23px;

  border-radius: 4px;

  font-size: 13px;

  font-weight: 600;

  text-decoration: none;

  transition: all .3s ease;
}


.jia-about-btn:hover {

  background: #10182b;

  color: #ffffff;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 950px) {

  .jia-about-section {
    padding: 75px 5%;
  }

  .jia-about-container {

    grid-template-columns: 1fr;

    gap: 55px;

    max-width: 700px;

  }

  .jia-about-image {
    height: 500px;
  }

  .jia-about-content h2 {
    font-size: 38px;
  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

  .jia-about-section {

    padding: 60px 5%;

  }


  .jia-about-container {

    display: flex;

    flex-direction: column;

    gap: 45px;

  }


  /* IMAGE */

  .jia-about-image-area {

    width: 100%;

    padding: 0 10px 20px 0;

  }


  .jia-about-image {

    width: 100%;

    height: 400px;

    border-radius: 7px;

  }


  /* EXPERIENCE */

  .jia-experience-box {

    width: 175px;

    min-height: 95px;

    padding: 16px;

    right: 0;

  }


  .jia-experience-number {

    font-size: 38px;

  }


  .jia-experience-text {

    font-size: 10px;

  }


  /* CONTENT */

  .jia-about-subtitle {

    font-size: 11px;

    letter-spacing: 1px;

  }


  .jia-about-content h2 {

    font-size: 30px;

    line-height: 1.25;

  }


  .jia-about-content p {

    font-size: 13px;

    line-height: 1.7;

  }


  .jia-about-intro {

    font-size: 14px !important;

  }


  /* FEATURES */

  .jia-about-features {

    grid-template-columns: 1fr;

    gap: 17px;

    margin: 25px 0;

  }


  .jia-about-feature h4 {

    font-size: 13px;

  }


  .jia-about-feature p {

    font-size: 11px !important;

  }


  /* BUTTON */

  .jia-about-btn {

    padding: 13px 18px;

    font-size: 11px;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-about-image {

    height: 350px;

  }

  .jia-about-content h2 {

    font-size: 27px;

  }

  .jia-experience-box {

    width: 160px;

  }

}

/* ================= MAIN SECTION ================= */

.jia-services-section {

  width: 100%;

  padding: 95px 5%;

  background: #f6faf9;

  overflow: hidden;

}


.jia-services-container {

  max-width: 1200px;

  margin: auto;

}


/* ================= HEADING ================= */

.jia-services-heading {

  max-width: 700px;

  margin: 0 auto 55px;

  text-align: center;

}


.jia-section-subtitle {

  display: inline-block;

  color: #20a98f;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 1.7px;

  margin-bottom: 12px;

}


.jia-services-heading h2 {

  color: #10182b;

  font-size: 42px;

  line-height: 1.2;

  font-weight: 600;

  margin: 0 0 17px;

}


.jia-services-heading h2 span {

  color: #20a98f;

}


.jia-services-heading p {

  color: #697586;

  font-size: 15px;

  line-height: 1.8;

  margin: 0;

}


/* ================= SERVICES GRID ================= */

.jia-services-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 25px;

}


/* ================= SERVICE CARD ================= */

.jia-service-card {

  background: #ffffff;

  border: 1px solid #e7efed;

  padding: 30px 25px;

  display: flex;

  align-items: flex-start;

  gap: 18px;

  border-radius: 8px;

  position: relative;

  overflow: hidden;

  transition: all 0.35s ease;

}


.jia-service-card::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  width: 4px;

  height: 0;

  background: #20a98f;

  transition: 0.35s ease;

}


.jia-service-card:hover {

  transform: translateY(-7px);

  box-shadow: 0 15px 35px rgba(16, 24, 43, 0.10);

  border-color: #d8ece7;

}


.jia-service-card:hover::before {

  height: 100%;

}


/* ================= SERVICE ICON ================= */

.jia-service-icon {

  flex-shrink: 0;

  width: 58px;

  height: 58px;

  background: #e8f7f3;

  color: #20a98f;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 23px;

  transition: all 0.35s ease;

}


.jia-service-card:hover .jia-service-icon {

  background: #20a98f;

  color: #ffffff;

  transform: rotateY(180deg);

}


/* ================= SERVICE CONTENT ================= */

.jia-service-content {

  flex: 1;

}


.jia-service-content h3 {

  color: #10182b;

  font-size: 17px;

  line-height: 1.4;

  font-weight: 600;

  margin: 0 0 8px;

}


.jia-service-content p {

  color: #748091;

  font-size: 12px;

  line-height: 1.7;

  margin: 0 0 12px;

}


.jia-service-content a {

  display: inline-flex;

  align-items: center;

  gap: 7px;

  color: #20a98f;

  font-size: 12px;

  font-weight: 600;

  text-decoration: none;

  transition: 0.3s;

}


.jia-service-content a i {

  font-size: 10px;

  transition: 0.3s;

}


.jia-service-content a:hover {

  color: #10182b;

}


.jia-service-content a:hover i {

  transform: translateX(4px);

}


/* ================= BOTTOM BUTTON ================= */

.jia-services-button {

  text-align: center;

  margin-top: 50px;

}


.jia-services-button a {

  display: inline-flex;

  align-items: center;

  gap: 10px;

  padding: 14px 25px;

  background: #10182b;

  color: #ffffff;

  border-radius: 4px;

  font-size: 13px;

  font-weight: 600;

  text-decoration: none;

  transition: 0.3s;

}


.jia-services-button a:hover {

  background: #20a98f;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1000px) {

  .jia-services-section {

    padding: 75px 5%;

  }


  .jia-services-grid {

    grid-template-columns: repeat(2, 1fr);

  }


  .jia-services-heading h2 {

    font-size: 36px;

  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 650px) {

  .jia-services-section {

    padding: 60px 5%;

  }


  .jia-services-heading {

    margin-bottom: 35px;

  }


  .jia-section-subtitle {

    font-size: 10px;

    letter-spacing: 1.1px;

  }


  .jia-services-heading h2 {

    font-size: 29px;

    line-height: 1.3;

  }


  .jia-services-heading p {

    font-size: 13px;

    line-height: 1.7;

  }


  /* SINGLE COLUMN MOBILE */

  .jia-services-grid {

    grid-template-columns: 1fr;

    gap: 15px;

  }


  .jia-service-card {

    padding: 22px 18px;

    gap: 15px;

  }


  .jia-service-icon {

    width: 50px;

    height: 50px;

    font-size: 19px;

  }


  .jia-service-content h3 {

    font-size: 15px;

  }


  .jia-service-content p {

    font-size: 11px;

    line-height: 1.6;

  }


  .jia-service-content a {

    font-size: 11px;

  }


  .jia-services-button {

    margin-top: 35px;

  }


  .jia-services-button a {

    padding: 12px 20px;

    font-size: 11px;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-services-heading h2 {

    font-size: 26px;

  }


  .jia-service-card {

    padding: 18px 15px;

  }


  .jia-service-icon {

    width: 45px;

    height: 45px;

    font-size: 17px;

  }


  .jia-service-content h3 {

    font-size: 14px;

  }

}

/* =====================================================
   FOOTER MAIN
===================================================== */

.jia-footer {

  width: 100%;

  background: #10182b;

  color: #ffffff;

  overflow: hidden;

}


.jia-footer-main {

  padding: 75px 5% 60px;

}


.jia-footer-container {

  max-width: 1200px;

  margin: auto;

  display: grid;

  grid-template-columns:
    1.5fr
    1fr
    1.2fr
    1.4fr;

  gap: 50px;

}


/* =====================================================
   LOGO
===================================================== */

.jia-footer-logo {

  display: inline-block;

  margin-bottom: 22px;

}


.jia-footer-logo img {

  width: 230px;

  max-width: 100%;

  height: auto;

  display: block;

}


/* =====================================================
   ABOUT TEXT
===================================================== */

.jia-footer-about p {

  color: #b8c1ce;

  font-size: 13px;

  line-height: 1.8;

  margin: 0;

  max-width: 330px;

}


/* =====================================================
   FOOTER HEADINGS
===================================================== */

.jia-footer-column h3 {

  font-size: 18px;

  font-weight: 600;

  color: #ffffff;

  margin: 4px 0 10px;

}


.jia-footer-line {

  width: 45px;

  height: 2px;

  background: #20a98f;

  margin-bottom: 22px;

}


/* =====================================================
   FOOTER LINKS
===================================================== */

.jia-footer-column ul {

  list-style: none;

  padding: 0;

  margin: 0;

}


.jia-footer-column ul li {

  margin-bottom: 12px;

}


.jia-footer-column ul li a {

  display: inline-flex;

  align-items: center;

  gap: 9px;

  color: #b8c1ce;

  font-size: 13px;

  text-decoration: none;

  transition: all .3s ease;

}


.jia-footer-column ul li a i {

  color: #20a98f;

  font-size: 10px;

}


.jia-footer-column ul li a:hover {

  color: #20a98f;

  transform: translateX(4px);

}


/* =====================================================
   SOCIAL MEDIA
===================================================== */

.jia-footer-social {

  display: flex;

  gap: 10px;

  margin-top: 25px;

}


.jia-footer-social a {

  width: 38px;

  height: 38px;

  border: 1px solid rgba(255,255,255,.15);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  font-size: 13px;

  text-decoration: none;

  transition: all .3s ease;

}


.jia-footer-social a:hover {

  background: #20a98f;

  border-color: #20a98f;

  transform: translateY(-3px);

}


/* =====================================================
   CONTACT INFORMATION
===================================================== */

.jia-contact-item {

  display: flex;

  align-items: flex-start;

  gap: 13px;

  margin-bottom: 20px;

}


.jia-contact-icon {

  width: 38px;

  height: 38px;

  min-width: 38px;

  background: rgba(32,169,143,.12);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #20a98f;

  font-size: 14px;

}


.jia-contact-item span {

  display: block;

  color: #20a98f;

  font-size: 11px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: .7px;

  margin-bottom: 5px;

}


.jia-contact-item p {

  color: #b8c1ce;

  font-size: 12px;

  line-height: 1.7;

  margin: 0;

}


.jia-contact-item a {

  color: #d8dee8;

  font-size: 13px;

  text-decoration: none;

  transition: .3s;

}


.jia-contact-item a:hover {

  color: #20a98f;

}


/* =====================================================
   BOTTOM FOOTER
===================================================== */

.jia-footer-bottom {

  border-top: 1px solid rgba(255,255,255,.10);

  padding: 20px 5%;

}


.jia-footer-bottom-container {

  max-width: 1200px;

  margin: auto;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

}


.jia-footer-bottom p {

  color: #8994a5;

  font-size: 11px;

  margin: 0;

}


.jia-footer-bottom strong {

  color: #20a98f;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1000px) {

  .jia-footer-container {

    grid-template-columns: 1fr 1fr;

    gap: 45px;

  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 650px) {

  .jia-footer-main {

    padding: 55px 6% 40px;

  }


  .jia-footer-container {

    grid-template-columns: 1fr;

    gap: 38px;

  }


  .jia-footer-about p {

    max-width: 100%;

    font-size: 12px;

  }


  .jia-footer-logo img {

    width: 205px;

  }


  .jia-footer-column h3 {

    font-size: 17px;

  }


  .jia-footer-column ul li a {

    font-size: 12px;

  }


  .jia-contact-item {

    margin-bottom: 18px;

  }


  .jia-footer-bottom {

    padding: 18px 6%;

  }


  .jia-footer-bottom-container {

    flex-direction: column;

    text-align: center;

    gap: 8px;

  }


  .jia-footer-bottom p {

    font-size: 10px;

    line-height: 1.6;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-footer-main {

    padding: 45px 5% 35px;

  }


  .jia-footer-container {

    gap: 32px;

  }


  .jia-footer-logo img {

    width: 185px;

  }


  .jia-footer-social a {

    width: 35px;

    height: 35px;

  }

}

/* =====================================================
   MAIN SECTION
===================================================== */

.jia-why-section {

  width: 100%;

  background: #ffffff;

  overflow: hidden;

}


.jia-why-container {

  width: 100%;

  display: grid;

  grid-template-columns: 50% 50%;

  align-items: stretch;

}


/* =====================================================
   LEFT CONTENT
===================================================== */

.jia-why-content {

  background: #10182b;

  color: #ffffff;

  padding: 65px 7% 65px 7%;

  position: relative;

}


/* subtle healthcare background */

.jia-why-content::before {

  content: "";

  position: absolute;

  width: 250px;

  height: 250px;

  border-radius: 50%;

  right: -100px;

  top: -100px;

  border: 1px solid rgba(32,169,143,.15);

}


/* =====================================================
   SMALL TITLE
===================================================== */

.jia-why-small-title {

  display: block;

  color: #20b99a;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 1.8px;

  margin-bottom: 7px;

}


/* =====================================================
   HEADING
===================================================== */

.jia-why-content h2 {

  font-size: 38px;

  line-height: 1.2;

  font-weight: 600;

  margin: 0;

  color: #ffffff;

}


.jia-why-content h2 span {

  color: #20b99a;

}


/* =====================================================
   HEADING LINE
===================================================== */

.jia-heading-line {

  width: 100px;

  height: 3px;

  background: rgba(32,169,143,.25);

  margin: 20px 0 28px;

  position: relative;

}


.jia-heading-line span {

  display: block;

  width: 50px;

  height: 3px;

  background: #20b99a;

}


/* =====================================================
   PARAGRAPHS
===================================================== */

.jia-why-content > p {

  max-width: 700px;

  color: #d4dae3;

  font-size: 14px;

  line-height: 1.8;

  margin: 0 0 15px;

}


.jia-why-content > p strong {

  color: #ffffff;

}


/* =====================================================
   CARE HEADING
===================================================== */

.jia-care-heading {

  font-size: 21px;

  line-height: 1.4;

  font-weight: 500;

  color: #ffffff;

  margin: 27px 0 20px;

}


/* =====================================================
   REASONS GRID
===================================================== */

.jia-reasons-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 13px 25px;

  margin-bottom: 28px;

}


.jia-reason {

  display: flex;

  align-items: center;

  gap: 11px;

}


.jia-reason-icon {

  width: 34px;

  height: 34px;

  min-width: 34px;

  border-radius: 50%;

  background: rgba(32,169,143,.14);

  border: 1px solid rgba(32,169,143,.35);

  display: flex;

  align-items: center;

  justify-content: center;

  color: #20b99a;

  font-size: 13px;

}


.jia-reason span {

  color: #ffffff;

  font-size: 13px;

  font-weight: 500;

}


/* =====================================================
   MISSION / VISION / INTEGRITY
===================================================== */

.jia-mission-vision {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  gap: 12px;

  margin-top: 20px;

}


.jia-mv-box {

  background: rgba(255,255,255,.06);

  border: 1px solid rgba(255,255,255,.10);

  padding: 16px 13px;

  border-radius: 5px;

  display: flex;

  flex-direction: column;

  gap: 10px;

}


.jia-mv-icon {

  width: 35px;

  height: 35px;

  border-radius: 50%;

  background: #20a98f;

  color: #ffffff;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 13px;

}


.jia-mv-box h4 {

  color: #20b99a;

  font-size: 14px;

  font-weight: 600;

  margin: 0 0 5px;

}


.jia-mv-box p {

  color: #c5ccd7;

  font-size: 11px;

  line-height: 1.6;

  margin: 0;

}


/* =====================================================
   RIGHT IMAGE
===================================================== */

.jia-why-image {

  min-height: 720px;

  position: relative;

  overflow: hidden;

  background: #eaf4f2;

}


.jia-why-image img {

  width: 100%;

  height: 100%;

  min-height: 720px;

  display: block;

  object-fit: cover;

  object-position: center;

  transition: transform .7s ease;

}


.jia-why-image:hover img {

  transform: scale(1.03);

}


/* =====================================================
   IMAGE BADGE
===================================================== */

.jia-image-badge {

  position: absolute;

  left: 30px;

  bottom: 30px;

  display: flex;

  align-items: center;

  gap: 12px;

  background: #ffffff;

  padding: 14px 20px;

  border-radius: 5px;

  box-shadow: 0 10px 30px rgba(0,0,0,.15);

}


.jia-badge-icon {

  width: 42px;

  height: 42px;

  min-width: 42px;

  border-radius: 50%;

  background: #20a98f;

  color: #ffffff;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 17px;

}


.jia-image-badge strong {

  display: block;

  color: #10182b;

  font-size: 14px;

}


.jia-image-badge span {

  display: block;

  color: #20a98f;

  font-size: 10px;

  margin-top: 2px;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 1100px) {

  .jia-why-content {

    padding: 50px 5%;

  }


  .jia-why-content h2 {

    font-size: 32px;

  }


  .jia-why-content > p {

    font-size: 13px;

  }


  .jia-care-heading {

    font-size: 19px;

  }


  .jia-mission-vision {

    grid-template-columns: 1fr;

  }


  .jia-mv-box {

    flex-direction: row;

    align-items: flex-start;

  }


  .jia-why-image,
  .jia-why-image img {

    min-height: 700px;

  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 750px) {

  .jia-why-container {

    display: flex;

    flex-direction: column;

  }


  /* IMAGE FIRST ON MOBILE */

  .jia-why-image {

    order: 1;

    width: 100%;

    min-height: 420px;

    height: 420px;

  }


  .jia-why-image img {

    width: 100%;

    height: 420px;

    min-height: 420px;

    object-fit: cover;

  }


  /* CONTENT */

  .jia-why-content {

    order: 2;

    padding: 50px 6%;

  }


  .jia-why-content h2 {

    font-size: 29px;

  }


  .jia-why-small-title {

    font-size: 11px;

  }


  .jia-why-content > p {

    font-size: 13px;

    line-height: 1.75;

  }


  .jia-care-heading {

    font-size: 19px;

    margin-top: 25px;

  }


  /* REASONS */

  .jia-reasons-grid {

    grid-template-columns: 1fr;

    gap: 12px;

  }


  .jia-reason {

    padding: 5px 0;

  }


  .jia-reason span {

    font-size: 13px;

  }


  /* MISSION */

  .jia-mission-vision {

    grid-template-columns: 1fr;

    gap: 12px;

  }


  .jia-mv-box {

    flex-direction: row;

    align-items: flex-start;

    padding: 15px;

  }


  .jia-mv-box h4 {

    font-size: 14px;

  }


  .jia-mv-box p {

    font-size: 11px;

  }


  /* BADGE */

  .jia-image-badge {

    left: 15px;

    bottom: 15px;

    padding: 11px 14px;

  }


  .jia-badge-icon {

    width: 36px;

    height: 36px;

    min-width: 36px;

    font-size: 14px;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-why-content {

    padding: 42px 5%;

  }


  .jia-why-content h2 {

    font-size: 26px;

  }


  .jia-why-content > p {

    font-size: 12px;

  }


  .jia-care-heading {

    font-size: 17px;

  }


  .jia-why-image,
  .jia-why-image img {

    height: 350px;

    min-height: 350px;

  }

}

/* =====================================================
   MAIN SECTION
===================================================== */

.jia-reviews-section {

  width: 100%;

  padding: 90px 5%;

  background: #f5faf9;

  overflow: hidden;

}


.jia-reviews-container {

  max-width: 1200px;

  margin: auto;

}


/* =====================================================
   HEADING
===================================================== */

.jia-reviews-heading {

  max-width: 680px;

  margin: 0 auto 50px;

  text-align: center;

}


.jia-reviews-subtitle {

  display: block;

  color: #20a98f;

  font-size: 13px;

  font-weight: 600;

  letter-spacing: 1.8px;

  margin-bottom: 10px;

}


.jia-reviews-heading h2 {

  color: #10182b;

  font-size: 42px;

  line-height: 1.2;

  font-weight: 600;

  margin: 0;

}


.jia-reviews-heading h2 span {

  color: #20a98f;

}


.jia-review-heading-line {

  width: 90px;

  height: 3px;

  background: #d8ece7;

  margin: 18px auto 20px;

}


.jia-review-heading-line span {

  display: block;

  width: 45px;

  height: 3px;

  background: #20a98f;

}


.jia-reviews-heading p {

  color: #718096;

  font-size: 14px;

  line-height: 1.8;

  margin: 0;

}


/* =====================================================
   SLIDER
===================================================== */

.jia-review-slider {

  position: relative;

  width: 100%;

  overflow: hidden;

  padding: 10px 0 20px;

}


.jia-review-track {

  display: flex;

  gap: 25px;

  transition: transform .6s ease;

}


/* =====================================================
   REVIEW CARD
===================================================== */

.jia-review-card {

  flex: 0 0 calc((100% - 50px) / 3);

  background: #ffffff;

  border: 1px solid #e3eeeb;

  border-radius: 8px;

  padding: 28px 25px;

  position: relative;

  min-height: 300px;

  box-shadow: 0 5px 20px rgba(16,24,43,.04);

  transition: all .3s ease;

}


.jia-review-card:hover {

  transform: translateY(-5px);

  box-shadow: 0 15px 35px rgba(16,24,43,.10);

}


/* =====================================================
   USER
===================================================== */

.jia-review-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

}


.jia-review-user {

  display: flex;

  align-items: center;

  gap: 12px;

}


.jia-review-avatar {

  width: 48px;

  height: 48px;

  border-radius: 50%;

  background: #e8f7f3;

  color: #20a98f;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 17px;

}


.jia-review-user h3 {

  color: #10182b;

  font-size: 14px;

  font-weight: 600;

  margin: 0 0 3px;

}


.jia-review-user span {

  color: #8a94a4;

  font-size: 10px;

}


/* =====================================================
   GOOGLE ICON
===================================================== */

.jia-google-icon {

  color: #4285f4;

  font-size: 19px;

}


/* =====================================================
   STARS
===================================================== */

.jia-stars {

  display: flex;

  gap: 4px;

  margin: 20px 0 14px;

}


.jia-stars i {

  color: #f5b301;

  font-size: 13px;

}


/* =====================================================
   REVIEW TEXT
===================================================== */

.jia-review-card > p {

  color: #667085;

  font-size: 13px;

  line-height: 1.8;

  margin: 0;

}


/* =====================================================
   QUOTE
===================================================== */

.jia-review-quote {

  position: absolute;

  right: 22px;

  bottom: 18px;

  color: #e4f2ef;

  font-size: 28px;

}


/* =====================================================
   ARROWS
===================================================== */

.jia-review-prev,
.jia-review-next {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  width: 43px;

  height: 43px;

  border-radius: 50%;

  border: none;

  background: #10182b;

  color: #ffffff;

  cursor: pointer;

  z-index: 5;

  transition: .3s;

}


.jia-review-prev {

  left: 5px;

}


.jia-review-next {

  right: 5px;

}


.jia-review-prev:hover,
.jia-review-next:hover {

  background: #20a98f;

}


/* =====================================================
   DOTS
===================================================== */

.jia-review-dots {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 8px;

  margin-top: 20px;

}


.jia-review-dot {

  width: 9px;

  height: 9px;

  background: #cbd9d6;

  border-radius: 50%;

  cursor: pointer;

  transition: .3s;

}


.jia-review-dot.active {

  width: 27px;

  border-radius: 10px;

  background: #20a98f;

}


/* =====================================================
   REVIEW BUTTON
===================================================== */

.jia-review-button {

  text-align: center;

  margin-top: 35px;

}


.jia-review-button a {

  display: inline-flex;

  align-items: center;

  gap: 9px;

  background: #10182b;

  color: #ffffff;

  padding: 14px 24px;

  border-radius: 4px;

  text-decoration: none;

  font-size: 12px;

  font-weight: 600;

  transition: .3s;

}


.jia-review-button a:hover {

  background: #20a98f;

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 950px) {

  .jia-reviews-section {

    padding: 70px 5%;

  }


  .jia-review-card {

    flex: 0 0 calc((100% - 25px) / 2);

  }


  .jia-reviews-heading h2 {

    font-size: 36px;

  }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 650px) {

  .jia-reviews-section {

    padding: 60px 5%;

  }


  .jia-reviews-heading {

    margin-bottom: 30px;

  }


  .jia-reviews-subtitle {

    font-size: 10px;

    letter-spacing: 1.2px;

  }


  .jia-reviews-heading h2 {

    font-size: 29px;

  }


  .jia-reviews-heading p {

    font-size: 12px;

    line-height: 1.7;

  }


  .jia-review-card {

    flex: 0 0 100%;

    min-height: 290px;

    padding: 23px 20px;

  }


  .jia-review-card > p {

    font-size: 12px;

  }


  .jia-review-prev,
  .jia-review-next {

    width: 37px;

    height: 37px;

    font-size: 12px;

  }


  .jia-review-prev {

    left: 5px;

  }


  .jia-review-next {

    right: 5px;

  }


  .jia-review-button a {

    padding: 12px 17px;

    font-size: 10px;

  }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

  .jia-review-card {

    min-height: 300px;

  }


  .jia-review-user h3 {

    font-size: 13px;

  }


  .jia-review-card > p {

    font-size: 11px;

    line-height: 1.7;

  }

}

/* =====================================================
   FIXED FLOATING BUTTON CONTAINER
   ALWAYS STAYS ON SCREEN DURING SCROLL
===================================================== */

.jiya-fixed-buttons {

    position: fixed !important;

    right: 22px !important;

    bottom: 25px !important;

    z-index: 2147483647 !important;

    display: flex;

    flex-direction: column;

    gap: 12px;

    /* Prevent movement while page scrolls */

    transform: translateZ(0);

}


/* =====================================================
   COMMON BUTTON
===================================================== */

.jiya-fixed-buttons a {

    position: relative;

    width: 58px;

    height: 58px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    text-decoration: none;

    box-sizing: border-box;

    box-shadow:
        0 5px 15px rgba(0,0,0,.25);

    transition:
        transform .3s ease,
        background .3s ease;

}


/* =====================================================
   ICON
===================================================== */

.jiya-fixed-buttons i {

    color: #ffffff;

    font-size: 22px;

}


/* =====================================================
   CALL BUTTON
===================================================== */

.jiya-fixed-call {

    background: #10182b;

}


.jiya-fixed-call:hover {

    background: #20a98f;

    transform: scale(1.1);

}


/* =====================================================
   WHATSAPP BUTTON
===================================================== */

.jiya-fixed-whatsapp {

    background: #20a98f;

}


.jiya-fixed-whatsapp:hover {

    background: #10182b;

    transform: scale(1.1);

}


/* =====================================================
   LABEL
===================================================== */

.jiya-fixed-buttons span {

    position: absolute;

    right: 70px;

    top: 50%;

    transform: translateY(-50%);

    background: #10182b;

    color: #ffffff;

    padding: 8px 12px;

    border-radius: 5px;

    font-family: Arial, sans-serif;

    font-size: 11px;

    font-weight: 600;

    white-space: nowrap;

    opacity: 0;

    visibility: hidden;

    transition: all .25s ease;

}


/* Label arrow */

.jiya-fixed-buttons span::after {

    content: "";

    position: absolute;

    right: -5px;

    top: 50%;

    transform: translateY(-50%);

    border-left: 5px solid #10182b;

    border-top: 5px solid transparent;

    border-bottom: 5px solid transparent;

}


/* Show label */

.jiya-fixed-buttons a:hover span {

    opacity: 1;

    visibility: visible;

}


/* =====================================================
   WHATSAPP PULSE
===================================================== */

.jiya-fixed-whatsapp::before {

    content: "";

    position: absolute;

    width: 100%;

    height: 100%;

    left: 0;

    top: 0;

    border-radius: 50%;

    border: 2px solid #20a98f;

    box-sizing: border-box;

    animation: jiyaPulse 2s infinite;

}


@keyframes jiyaPulse {

    0% {

        transform: scale(1);

        opacity: .8;

    }

    70% {

        transform: scale(1.4);

        opacity: 0;

    }

    100% {

        transform: scale(1.4);

        opacity: 0;

    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 600px) {

    .jiya-fixed-buttons {

        position: fixed !important;

        right: 12px !important;

        bottom: 20px !important;

        z-index: 2147483647 !important;

        gap: 10px;

    }


    .jiya-fixed-buttons a {

        width: 52px;

        height: 52px;

    }


    .jiya-fixed-buttons i {

        font-size: 20px;

    }


    /* Hide text labels on mobile */

    .jiya-fixed-buttons span {

        display: none !important;

    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 380px) {

    .jiya-fixed-buttons {

        right: 9px !important;

        bottom: 15px !important;

    }


    .jiya-fixed-buttons a {

        width: 48px;

        height: 48px;

    }


    .jiya-fixed-buttons i {

        font-size: 18px;

    }

}

