/* About Us Container */
.about-us {
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  margin: 0 auto;
  padding: var(--Space-5, 20px) var(--Space-10, 40px);
}

.about-us-title-container {
  display: flex;
  padding: var(--Space-4, 16px) 0px var(--Space-8, 32px) 0px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--Space-2, 8px);
  align-self: stretch;
}

/* About Us Title */
.about-us-title {
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  font-size: 40px;
  font-weight: var(--Body-Font-Weight-Strong, 600);
  color: var(--On-background-Brand-Default, #231f20);
  margin-bottom: var(--Space-5, 20px);
  text-align: center;
}

/* About Us Content */
.about-us-content-container {
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  font-size: var(--Body-Size-Large, 20px);
  line-height: 1.7;
  color: var(--On-background-Brand-Default, #231f20);
}

.about-us-content-container p {
  margin-bottom: var(--Space-6, 24px);
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  font-size: var(--Body-Size-Large, 20px);
  font-weight: var(--Body-Font-Weight-Regular, 400);
  line-height: 150%;
}

.about-us-content-container h1,
.about-us-content-container h2,
.about-us-content-container h3,
.about-us-content-container h4,
.about-us-content-container h5,
.about-us-content-container h6 {
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  font-weight: var(--Body-Font-Weight-Strong, 600);
  color: var(--On-background-Brand-Default, #231f20);
  line-height: 130%;
  margin-top: var(--Space-10, 40px);
  margin-bottom: var(--Space-5, 20px);
}

.about-us-content-container h1 {
  font-size: var(--Title-Page-Size-Medium, 48px);
}

.about-us-content-container h2 {
  font-size: var(--Title-Page-Size-Small, 40px);
}

.about-us-content-container h3 {
  font-size: var(--Heading-Size-Large, 32px);
}

.about-us-content-container h4 {
  font-size: var(--Body-Size-Large, 20px);
}

.about-us-content-container ul,
.about-us-content-container ol {
  margin-bottom: var(--Space-6, 24px);
  padding-left: var(--Space-8, 32px);
}

.about-us-content-container li {
  margin-bottom: var(--Space-2, 8px);
  font-family: var(--Type-Font-Serif, "Plus Jakarta Sans");
  font-size: var(--Body-Size-Large, 20px);
  font-weight: var(--Body-Font-Weight-Regular, 400);
  line-height: 150%;
}

/* Mobile Responsive */
@media (max-width: 575px) {
  .about-us {
    padding: var(--Space-3, 12px) var(--Space-4, 16px);
  }

  .about-us-title-container {
    margin-bottom: var(--Space-3, 12px);
  }

  .about-us-title {
    font-size: 24px;
    margin-bottom: var(--Space-3, 12px);
  }

  .about-us-content-container p,
  .about-us-content-container li {
    font-size: var(--Body-Size-Medium, 18px);
  }

  .about-us-content-container h1 {
    font-size: var(--Title-Page-Size-Small, 32px);
  }

  .about-us-content-container h2 {
    font-size: var(--Title-Page-Size-Small, 28px);
  }

  .about-us-content-container h3 {
    font-size: var(--Title-Page-Size-Small, 24px);
  }

  .about-us-content-container h4 {
    font-size: var(--Body-Size-Medium, 18px);
  }

  .about-us-content-container ul,
  .about-us-content-container ol {
    padding-left: var(--Space-5, 20px);
  }
}

/* Tablet Responsive */
@media (min-width: 576px) and (max-width: 991px) {
  .about-us {
    padding: var(--Space-4, 16px) var(--Space-5, 20px);
  }

  .about-us-title {
    font-size: 32px;
  }

  .about-us-content-container p,
  .about-us-content-container li {
    font-size: var(--Body-Size-Medium, 18px);
  }

  .about-us-content-container h1 {
    font-size: var(--Title-Page-Size-Medium, 40px);
  }

  .about-us-content-container h2 {
    font-size: var(--Title-Page-Size-Small, 32px);
  }

  .about-us-content-container h3 {
    font-size: var(--Heading-Size-Large, 28px);
  }

  .about-us-content-container h4 {
    font-size: var(--Body-Size-Medium, 18px);
  }
}

/* Desktop Responsive */
@media (min-width: 992px) {
  .about-us {
    padding: var(--Space-5, 20px) var(--Space-10, 40px);
  }

  .about-us-title {
    font-size: 40px;
    margin-bottom: var(--Space-4, 16px);
  }

  .about-us-content-container p,
  .about-us-content-container li {
    font-size: var(--Body-Size-Large, 20px);
  }
}