.key-question__section {
  background: rgba(var(--bg-color-26));
  /* padding: 80px 0px; */

  .key-question__title {
    font-family: var(--font-source-serif-4);
    font-size: var(--font-9-2);
    line-height: 1.1;
    font-weight: 700;
    color: rgba(var(--text-color-5));
    text-align: center;
    margin-bottom: 43px;
  }

  .key-question__container {
    max-width: 1020px;
    margin: 0 auto;
    background: rgba(var(--bg-color-1));
    border-radius: var(--border-radius-8);
    overflow: hidden;
    box-shadow: 0px 10px 25px 0px rgba(var(--bg-color-6), 10%);

    .key-question__card {
      display: flex;
      align-items: center;
      padding: 56px 48px 48px 48px;
      border-bottom: 1px solid rgba(var(--border-color-22));
      gap: 64px;
      position: relative;

      &:last-child {
        border-bottom: none;
      }

      .key-question__card-left {
        max-width: 380px;
        width: 100%;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        gap: 20px;

        .key-question__card-accent {
          width: 6px;
          height: 34px;
          background: rgba(var(--bg-color-14));
          border-radius: var(--border-radius-2);
          flex-shrink: 0;
        }

        .key-question__card-title {
          font-family: var(--font-source-serif-4);
          font-size: var(--font-16);
          line-height: 1.4;
          font-weight: 700;
          color: rgba(var(--text-color-5));
        }
      }

      .key-question__card-right {
        flex: 1;

        .key-question__card-description {
          font-size: var(--font-24);
          line-height: 1.4;
          color: rgba(var(--text-color-9));
          font-weight: 400;
        }
      }
    }
  }

  @media (max-width: 1024px) {
    .key-question__container {
      .key-question__card {
        padding: 36px 42px;

        .key-question__card-left {
          max-width: 300px;
        }
      }
    }
  }

  @media (max-width: 880px) {
    .key-question__container {
      .key-question__card {
        padding: 30px 36px;

        .key-question__card-left {
          max-width: 240px;
        }
      }
    }
  }

  @media (max-width: 768px) {
    .key-question__container {
      .key-question__card {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 24px 30px;

        .key-question__card-left {
          max-width: 100%;
          gap: 12px;
        }
      }
    }
  }
}