.circle-content {
      flex-wrap: wrap;
      padding: 20px;
      gap: 20px;
    }
    .image-column {
      flex: 1;
      min-width: 300px;
      max-width: 500px;
      text-align: center;
    }
    .image-column img {
      width: 50%;
      height: 100%;
      object-fit: cover;
      position: absolute;
      left: 0;
      top: 0;
    }
    .text-column {
      flex: 1;
      position: relative;
      left: 53%;
      top: -20%;
      overflow: hidden;
    }
    .text-column h1 {
      margin: 0;
      color: #1a2a30;
    }
    .text-column h3 {
      color: #1a2a30;
      font-size: 35px;
      margin: 24px 0;
    }
    .text-column h2 {
      margin: 0;
      font-size: 18px;
      color: #1a2a30;
    }
    .text-column p {
      color: #1a2a30;
    }
    @media (max-width: 768px) {
      .circle-content {
        width: 90vw;
        height: 90vw;
        flex-direction: column;
      }
      .image-column {
        flex: none;
        height: 50%;
      }
      .image-column img {
        clip-path: none;
        object-fit: cover;
        width: 100%;
        height: 100%;
      }
      .text-column {
        flex: none;
        height: 50%;
        align-items: center;
        text-align: center;
        padding: 10px;
      }
    }