#capacitacao-psicodramatista {
  & .cover {
    & > .container > .cover__content {
      & .cover__title {
        position: relative;
        --underline-height: 5px;

        .highlight {
          font-family: 'EB Garamond', serif;
        }
      }
    }
  }

  & .intro {
    display: grid;
    grid-template-columns: 330px auto;
    gap: 2rem;
    margin-bottom: 6rem;
    align-items: center;

    @media (max-width: 1024px) {
      grid-template-columns: 1fr;
      grid-auto-flow: row;
      gap: 2rem;

      &.intro > * {
        grid-column: 1 !important;
      }

      &.intro .intro__img {
        grid-row: 2;
        min-height: 300px;
        min-width: 300px;
      }

      &.intro .intro__content {
        display: contents;
        grid-row: 2;
        gap: 1rem;
        padding-top: 1rem;
      }

      &.intro .intro__card:first-child {
        grid-row: 1;
      }
    }

    .intro__img {
      grid-column: 1;
      background-color: black;
      border-radius: 2rem;
      box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.33);
      height: auto;
      width: 100%;
    }

    .intro__content {
      grid-column: 2;
      display: flex;
      flex-direction: column;
      gap: 3.5rem;
      justify-content: space-evenly;
      padding-block: 4rem;

      .intro__card {
        --background-color: var(--purple-main);
        --text-color: white;

        padding: 2rem;
        border-radius: 2rem;
        text-align: justify;
        background-color: var(--background-color);
        color: var(--text-color);
        font-weight: 600;
        box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.33);

        &:nth-child(2) {
          --background-color: white;
          --text-color: black;
          border: 1px solid black;

          .title {
            text-align: center;
            font-size: 1.25rem;
            font-weight: 700;
          }

          .body {
            font-weight: 500;

            ul {
              padding-left: .5rem;
            }
          }
        }
      }
    }
  }

  & .structure {
    display: grid;
    gap: 1rem;
    justify-items: center;

    @media (max-width: 1024px) {
      margin-top: 4rem;
    }

    .card {
      border-radius: 100vmax;
      border: 1px solid black;
      color: black;
      padding: 1rem;
      display: flex;
      gap: 1rem;
      align-items: center;
      box-shadow: 0 1px 4px rgba(0, 0, 0, 0.33);

      i {
        color: var(--active-pink);
      }
    }

    .title {
      display: flex;
      font-size: 2.5rem;
      --underline-height: 5px;

      > * {
        margin: 0;
      }
    }

    .subtitle {
      text-align: justify;
      width: 70%;
      margin-bottom: 2rem;
      font-size: 1.15rem;

      @media (max-width: 1024px) {
        &.subtitle {
          width: unset;
          margin-bottom: 0;
        }
      }
    }

    .items {
      display: grid;
      grid-template-columns: repeat(2, 5fr) 3fr;
      gap: 2rem;

      @media (max-width: 1024px) {
        grid-template-columns: 1fr;

        & > img {
          grid-row: 1;
        }

        .schedule {
          img {
            display: none;
          }
        }

        &.items > :nth-child(2n -1) {
          padding-top: 0;

          &.schedule .card {
            justify-content: center;
            justify-items: center;
          }
        }

        &.items .last {
          gap: 2rem;

          .cta {
            text-align: center;
            justify-content: center;
            justify-items: center;
          }
        }
      }

      img {
        border-radius: 2rem;
        box-shadow: 0 2px 11px 0 rgba(0, 0, 0, 0.33);
        width: 100%;
        height: auto;
        min-height: 200px;
        background-color: black;
        object-fit: cover;
      }

      > :nth-child(2n -1) {
        padding-top: 2rem;
      }

      .schedule {
        display: grid;
        gap: 2rem;
      }

      .last {
        display: grid;
        gap: 1rem;
        align-content: baseline;

        .card {
          border-radius: 2rem;
          display: grid;
        }

        .duration {
          justify-items: center;
          align-items: flex-start;
          align-content: flex-start;

          .duration__title {
            font-size: 1.25rem;
            display: flex;
            --underline-height: 3px;
          }
        }

        & > .cta {
          background-color: var(--purple-main);
          border: none;
          color: white;
          padding-top: 2rem;
          text-decoration: none;

          .content {
            font-size: .875rem;
            font-weight: 300;
          }

          .link {
            display: grid;
            grid-template-columns: auto 1fr;
            align-items: center;

            span {
              font-size: 1.25rem;
            }

            i {
              color: white;
            }
          }
        }
      }
    }
  }
}