.image-with-text-overlay {
  overflow: hidden;
  /* 字体响应 */
  --text-h0:clamp(2.1875rem, 3vw, 2.75rem);
  --text-h1:clamp(1.75rem, 2.5vw, 3.75rem);
  --text-h2:clamp(1.5rem, 2vw,3rem);
  --text-h3:clamp(1.375rem, 1.75vw, 2.25rem);
  --text-h4:clamp(1.125rem, 1.5vw, 1.75rem);

  .w-100 {
    width: 100%;
  }

  .h-100 {
    height: 100%;
  }

  .adapt-to-image::before {
    content: "";
    display: block;
    padding-bottom: var(--padding-bottom);
    margin-left: -1px;
    width: 1px;
  }

  .absolute-center {
    picture {
      height: 100%;
      width: 100%;
      position: inherit;
      img {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    }
  }

  .text-content {
    @media screen and (min-width: 699px) {
      max-width: 55%;
    }
  }

  .justify-content-start {
    justify-content: start;
  };
  .justify-content-center {
    justify-content: center;
  };
  .justify-content-end {
    justify-content: end;
  };
  .align-self-start  {
    align-items: start;
  };
  .align-self-center  {
    align-items: center;
  };
  .align-self-end  {
    align-items: end;
  };
  .text-start {
    text-align: start;
  };
  .text-center {
    text-align: center;
  };
  .text-end {
    text-align: end;
  };
  @media  screen and (min-width: 699px) {
    .justify-content-md-start {
      justify-content: start;
    };
    .justify-content-md-center {
      justify-content: center;
    };
    .justify-content-md-end {
      justify-content: end;
    };
    .align-self-md-start  {
      align-items: start;
    };
    .align-self-md-center  {
      align-items: center;
    };
    .align-self-md-end  {
      align-items: end;
    };
    .text-md-start {
      text-align: start;
    };
    .text-md-center {
      text-align: center;
    };
    .text-md-end {
      text-align: end;
    };
  }
    /* 除了首页 其他页面调整字体大小 */
    .custom-otherpage {
      .text-content {
        .bold {
          font-size: clamp(18px, 1.5vw, 20px) !important;
        }
        .heading {
          font-size: clamp(40px,3.5vw,60px) !important;
          @media screen and (max-width: 699px)  {
            margin-top: 12px !important;
          }
        }
        .description-text {
          @media screen and (max-width: 699px)  {
            margin-top: 12px !important;
          }
        }
      }
    }
}