:root {
  --type-h1-font-size: 2rem;
  --type-h1-line-height: 2.6rem;
  --type-h1-font-family: Brown, sans-serif;
  --type-h1-font-weight: 700;
  --type-h1-letter-spacing: 0;
  --type-h2-font-size: 1.75rem;
  --type-h2-line-height: 2.275rem;
  --type-h2-font-family: Brown, sans-serif;
  --type-h2-font-weight: 700;
  --type-h2-letter-spacing: 0;
  --type-h3-font-size: 1.5rem;
  --type-h3-line-height: 1.95rem;
  --type-h3-font-family: Brown, sans-serif;
  --type-h3-font-weight: 700;
  --type-h3-letter-spacing: 0;
  --type-h4-font-size: 1.375rem;
  --type-h4-line-height: 1.7875rem;
  --type-h4-font-family: Brown, sans-serif;
  --type-h4-font-weight: 700;
  --type-h4-letter-spacing: 0;
  --type-h5-font-size: 1.125rem;
  --type-h5-line-height: 1.4625rem;
  --type-h5-font-family: Brown, sans-serif;
  --type-h5-font-weight: 700;
  --type-h5-letter-spacing: 0;
  --type-body-font-size: 1rem;
  --type-body-line-height: 1.6rem;
  --type-body-font-family: Brown, sans-serif;
  --type-body-font-weight: 400;
  --type-body-letter-spacing: 0;
  --type-button-font-size: 1rem;
  --type-button-line-height: 1.6rem;
  --type-button-font-family: Brown, sans-serif;
  --type-button-font-weight: 700;
  --type-button-letter-spacing: 0;
  --type-small-font-size: 0.8rem;
  --type-small-line-height: 1.2813rem;
  --type-small-font-family: Brown, sans-serif;
  --type-small-font-weight: 400;
  --type-small-letter-spacing: 0;
  --type-tiny-font-size: 0.6938rem;
  --type-tiny-line-height: 1.1125rem;
  --type-tiny-font-family: Brown, sans-serif;
  --type-tiny-font-weight: 400;
  --type-tiny-letter-spacing: 0;
}

@media only screen and (width > 767px) {
  :root {
    --type-h1-font-size: 2.9875rem;
    --type-h1-line-height: 3.8813rem;
    --type-h1-font-family: Brown, sans-serif;
    --type-h1-font-weight: 700;
    --type-h1-letter-spacing: 0;
    --type-h2-font-size: 2.4875rem;
    --type-h2-line-height: 3.2313rem;
    --type-h2-font-family: Brown, sans-serif;
    --type-h2-font-weight: 700;
    --type-h2-letter-spacing: 0;
    --type-h3-font-size: 2.075rem;
    --type-h3-line-height: 2.7rem;
    --type-h3-font-family: Brown, sans-serif;
    --type-h3-font-weight: 700;
    --type-h3-letter-spacing: 0;
    --type-h4-font-size: 1.725rem;
    --type-h4-line-height: 2.2437rem;
    --type-h4-font-family: Brown, sans-serif;
    --type-h4-font-weight: 700;
    --type-h4-letter-spacing: 0;
    --type-h5-font-size: 1.4375rem;
    --type-h5-line-height: 1.8687rem;
    --type-h5-font-family: Brown, sans-serif;
    --type-h5-font-weight: 700;
    --type-h5-letter-spacing: 0;
    --type-body-font-size: 1rem;
    --type-body-line-height: 1.6rem;
    --type-body-font-family: Brown, sans-serif;
    --type-body-font-weight: 400;
    --type-body-letter-spacing: 0;
    --type-button-font-size: 1rem;
    --type-button-line-height: 1.6rem;
    --type-button-font-family: Brown, sans-serif;
    --type-button-font-weight: 700;
    --type-button-letter-spacing: 0;
    --type-small-font-size: 0.8313rem;
    --type-small-line-height: 1.3313rem;
    --type-small-font-family: Brown, sans-serif;
    --type-small-font-weight: 400;
    --type-small-letter-spacing: 0;
    --type-tiny-font-size: 0.6938rem;
    --type-tiny-line-height: 1.1125rem;
    --type-tiny-font-family: Brown, sans-serif;
    --type-tiny-font-weight: 400;
    --type-tiny-letter-spacing: 0;
  }
}
@layer components {
  .about-section {
    margin-bottom: var(--spacing-xxl);
  }
  .about-section:last-child {
    margin-bottom: 0;
  }
  .about-intro {
    color: rgb(83, 81, 77);
    margin-bottom: var(--spacing-xl);
  }
  .about-team-grid {
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-xl) var(--spacing-l);
    margin-bottom: var(--spacing-l);
  }
  @media (width >= 768px) {
    .about-team-grid .about-profile {
      flex: 1 1 480px;
    }
  }
  .about-profile {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-l);
  }
  @media (width >= 768px) {
    .about-profile {
      flex-direction: row;
    }
  }
  .about-profile-img {
    align-self: center;
    width: 100%;
    max-width: 240px;
    aspect-ratio: 1/1;
    border-radius: 0.75rem;
    object-fit: cover;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
  }
  @media (width >= 768px) {
    .about-profile-img {
      align-self: flex-start;
      flex-shrink: 0;
    }
  }
  .about-profile-title {
    font-size: 0.8rem;
    line-height: 1.2813rem;
    font-family: Brown, sans-serif;
    font-weight: 400;
    letter-spacing: 0;
  }
  @media only screen and (width > 767px) {
    .about-profile-title {
      font-size: 0.8313rem;
      line-height: 1.3313rem;
      font-family: Brown, sans-serif;
      font-weight: 400;
      letter-spacing: 0;
    }
  }
  .about-profile-title {
    color: rgb(163, 161, 156);
    margin: 0 0 var(--spacing-m);
  }
  .about-profile-desc {
    font-size: 1rem;
    line-height: 1.6rem;
    font-family: Brown, sans-serif;
    font-weight: 400;
    letter-spacing: 0;
  }
  @media only screen and (width > 767px) {
    .about-profile-desc {
      font-size: 1rem;
      line-height: 1.6rem;
      font-family: Brown, sans-serif;
      font-weight: 400;
      letter-spacing: 0;
    }
  }
  .about-profile-desc {
    color: rgb(83, 81, 77);
    margin: 0;
    line-height: 1.6;
  }
  .about-body {
    color: rgb(83, 81, 77);
    margin-bottom: var(--spacing-m);
  }
  .about-body:last-child {
    margin-bottom: 0;
  }
  .about-link {
    color: rgb(65, 81, 201);
    text-decoration: underline;
  }
  .about-report-figure {
    margin: var(--spacing-xl) 0 0;
    text-align: center;
  }
  .about-report-figure img {
    max-width: 240px;
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    display: block;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
  }
}