@media screen and (max-width: 768px) {
  .landing-section {
    padding: 0;
    height: 420px;
    width: 100%;
    overflow: unset;
    .navigation {
      display: flex;
      align-items: start;
      ul li {
        text-align: center;
        font-family: Inter;
        font-size: 9px;
        font-style: normal;
        font-weight: 500;
        line-height: 124%;
      }
    }
    .navigation img {
      width: 44px;
      height: 42px;
      margin-top: 0;
      margin-bottom: 1.5em;
    }
    .landing-content {
      padding: 0 20px;
      margin-top: 0px;
      h1.landing-content-title {
        text-align: center;
        font-size: 25px;
        line-height: 94%; /* 23.5px */
        text-transform: capitalize;
      }
      h3 {
        font-size: 12px;
      }
      p {
        width: auto;
        text-align: center;
        font-family: Inter;
        font-size: 10px;
        font-style: normal;
        font-weight: 500;
        margin-top: 10px;
        margin-bottom: 20px;
        line-height: 120%;
      }
      .landing-content-buttons {
        flex-direction: column;
        margin-top: 0;
        margin-bottom: 1em;
      }
      button.landing-content-button {
        width: 140px;
        height: 34px;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
      }
      button.landing-howworks-button {
        width: 140px;
        height: 34px;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
      }
    }
  }

  .categories {
    padding: 20px;
    width: 100%;
    .categories-title {
      font-size: 13px;
      font-style: normal;
      font-weight: 500;
      line-height: 120%; /* 15.6px */
      letter-spacing: 0.13px;
    }
    .categories-slider {
      padding-left: 0;
      margin-left: 20px;
      gap: 28px;
      /* overflow-x: scroll; */
      .categories-slider-item-image-container {
        width: 71px;
        height: 22px;
        border-radius: 100px;
        margin-bottom: 9px;
        img {
          object-position: 0px -15px;
        }
      }
      .categories-description {
        font-size: 5px;
        font-style: normal;
        font-weight: 300;
        line-height: 120%;
      }
    }
  }

   .sliders-container {
        padding: 0px 10px;
    }

  .filmmakers {
    width: 100%;
    .filmmakers-slider {
      overflow: hidden;
    }
  }

  .testimonials {
    padding: 20px;
    width: 100%;
    margin-bottom: 41px;

    .testimonials-white-container {
      padding: 20px 30px;
      color: var(--black);
      width: 344px;
      height: 232px;
      .testimonial-stars {
        img {
          width: 25px;
          height: 27.89px;
        }
      }
      .testimonial-words {
        font-size: 15px;
        font-style: normal;
        font-weight: 300;
        line-height: 120%;
        margin: 0;
        margin-bottom: 14px;
      }
    }
    .testimonial-information {
      img {
        width: 35px;
        height: 35px;
        margin: 0;
      }
      h3:first-of-type {
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: 120%;
      }
      h3:last-of-type {
        font-size: 9px;
        font-style: normal;
        font-weight: 300;
        line-height: 120%;
      }
    }
  }

  .illustrious-academia {
    width: 100%;
    padding: 20px;
    .illustrious-academia-slider {
      padding: 0 20px;
      overflow: hidden;
    }
  }

  .consciousness {
    padding: 20px;
    width: 100%;
    .consciousness-slider {
      padding: 0 20px;
      overflow: hidden;
    }
  }

  .how-it-works {
    padding: 20px;
    margin: 57px 0;
    width: 100%;
    .how-it-works-box {
      width: 90%;
      height: auto;
      padding: 20px;

      .how-it-works-title {
        font-size: 22px;
        font-style: normal;
        font-weight: 500;
        line-height: 120%; /* 15.6px */
        letter-spacing: 0.13px;
      }

      .how-it-works-description {
        font-size: 12px;
        font-style: normal;
        font-weight: 300;
        line-height: 120%; /* 14.4px */
        letter-spacing: 0.12px;
        margin-top: 13px;
      }

      .how-it-works-steps {
        display: flex;
        flex-direction: column;
        max-width: 80%;
        height: 469px;
        margin: 20px auto 0 auto;
        .how-it-works-steps-item {
          margin-bottom: 24px;
          padding: 0;
          padding-bottom: 10px;
          gap: 9px;
          justify-content: start;
          &:not(:last-of-type) {
            border: none;
            border-bottom: 2px solid #464646;
          }

          img {
            width: 35px;
            height: 35px;
          }

          span:first-of-type {
            font-size: 18px;
            font-style: normal;
            font-weight: 700;
            line-height: 120%;
          }

          span:last-of-type {
            font-size: 12px;
            font-style: normal;
            font-weight: 400;
            line-height: 124%;
          }
        }
      }
    }
  }

  .popular-offerings {
    padding: 0 20px;
    width: 100%;
    margin-bottom: 62px;
    .popular-offerings-title {
      font-size: 13px;
      font-style: normal;
      font-weight: 500;
      line-height: 120%; /* 15.6px */
      letter-spacing: 0.13px;
      margin-bottom: 38px;
    }
    .popular-offerings-subtitle {
      display: none;
    }
    .popular-offerings-slider {
      margin-left: 20px;
      /* overflow-x: scroll; */
    }
  }

  .connect-experts {
    padding: 20px;
    margin: 40px 0;
    width: 100%;
    .connect-experts-title {
      font-size: 13px;
      font-style: normal;
      font-weight: 700;
      line-height: 120%;
    }
    .connect-experts-subtitle {
      font-size: 8px;
      font-style: normal;
      font-weight: 500;
      line-height: 124%;
      width: 285px;
      margin-bottom: 62px;
    }
    .connect-experts-slider {
      flex-direction: column;
      justify-content: center;
      align-items: center;
      div {
        width: 248px;
        height: 189px;
      }
    }
  }

  .top-products {
    padding: 0 20px;
    margin-bottom: 84px;
    width: 100%;

    .top-products-title {
      font-size: 13px;
      font-style: normal;
      font-weight: 500;
      line-height: 120%; /* 15.6px */
      letter-spacing: 0.13px;
      margin-bottom: 38px;
    }

    .top-products-subtitle {
      display: none;
    }

    .top-products-slider {
      gap: 8px;
      /* overflow-x: scroll; */
    }
  }

  .gathr-sticky-btn {
    right: 30px;
    bottom: 20px;
    z-index: 999;
  }

  .powered_by_gathr_sticky {
    font-size: 11px;
    font-weight: 600;
    width: 175px;
    padding: calc(0.55rem + 1px) calc(1.25rem + 1px);
  }

  .powered_by_gathr_sticky img{
    width: 20px;
    margin-left: 5px;
  }

  .footer {
    width: 100%;
    /* height: 215px; */
    flex-direction: column;
    gap: 20px;
    .footer-content {
      background-position: top, top, top, center -66px;
      p {
        width: 253px;
        font-size: 15px;
        font-style: normal;
        font-weight: 700;
        line-height: 124%;
      }
      button {
        width: 140px;
        height: 34px;
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: 150%;
      }
    }
  }
}

@media screen and (max-width: 400px) {
.how-it-works {
  padding: 20px;
  margin: 57px 0;
  width: 100%;
  .how-it-works-box {
    width: 90%;
    height: auto;
    padding: 20px 20px 40px;  
    }
  }

  .landing-section {
    .landing-content {
        padding: 0px;
    }
  }

    .filmmakers {
        .filmmakers-slider {
            overflow: unset;
            .swiper-wrapper {
                margin-left: 35px;
            }
        }
    }
}