.urble-section-e-1,
.urble-section-e-2,
.urble-section-e-3,
.urble-section-e-4,
.urble-section-e-5,
.urble-section-e-6,
.urble-section-e-7 {
  display: flex;

  .urble-section-blocks {
    width: 1080px;
    max-width: 100%;
    position: relative;
    margin: auto;
    display: flex;
  }
}

.urble-section-e-1 {
  padding: 64px 0;
  background: var(--urble-linear-gradient-light-greenish-wide);

  .urble-section-blocks {
    display: flex;
    justify-content: space-between;
    gap: 64px;

    .urble-section-content {
      display: flex;
      flex-direction: column;
      gap: 32px;

      h1 {
        width: 533px;
        z-index: 1;
      }

      .urble-section-content-text {
        width: 529px;
      }

      .urble-search {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 441px;
        height: 64px;
        padding: 0 16px;
        border: 2px solid var(--_Prim-Color-light-200);
        border-radius: 32px;
        background-color: var(--_Prim-Color-light-000-White);
        box-shadow: var(--urble-box-shadow-light);

        input {
          flex-grow: 1;
          border: none;
          outline: none;
          padding: 10px;
          font-size: 16px;
          border-radius: 25px;
          background-color: transparent;

          &::placeholder {
            color: var(--_Prim-Color-light-200);
          }
        }

        button {
          background: none;
          border: none;
          cursor: pointer;
          padding: 0;
          margin-left: 10px;
          width: 20px;
          height: 20px;
        }
      }
    }

    .urble-section-content-image {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      flex-grow: 1;
      gap: 32px;

      .urble-card {
        background: var(--_Prim-Color-dark-100-Brand);
        width: 305px;
        height: 200px;

        &.urble-card-image-1 {
          align-self: end;
        }

        &.urble-card-image-2 {
          align-self: center;
        }

        &.urble-card-image-3 {
          align-self: start;
        }

        img {
          width: 200px;
          margin: auto;
        }

        h3 {
          font-family: Roboto;
          font-size: 20px;
          font-weight: 700;
          line-height: 28px;
          text-align: center;
          color: var(--_Prim-Color-light-000-White);
        }
      }
    }
  }
}

.urble-section-e-2 {
  padding: 32px 0 64px 0;

  .urble-section-blocks {
    gap: 32px;
    flex-wrap: wrap;

    .urble-card {
      background: var(--_Prim-Color-light-100);
      padding: 32px;
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: auto;
      gap: 10px;
      min-width: calc((100% / 2) - 32px);

      .urble-link_button {
        color: var(--_Prim-Color-light-000-White);
      }
    }
  }
}

.urble-section-e-3 {
  padding: 64px 0 226px 0;
  background: var(--urble-color-surface-brand-low-emphasis);

  .urble-section-blocks {
    display: flex;
    flex-direction: column;
    gap: 64px;
    position: relative;

    h1 {
      z-index: 1;
    }

    .urble-section-content {
      display: flex;
      flex-direction: column;
      gap: 32px;

      .urble-link_button {
        background: transparent;
        border: 1px solid var(--_Prim-Color-dark-100-Brand);
        color: var(--_Prim-Color-dark-100-Brand);
      }
    }

    .urble-cards {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: flex-start;
      gap: 32px;

      .urble-card {
        min-height: 600px;
        flex: 1 1 calc((100% - 64px) / 3);
        max-width: calc((100% - 64px) / 3);
        min-width: 280px;
        justify-content: space-between;
        gap: 0;
        outline: 2px solid var(--_Prim-Color-light-200);
        box-shadow: var(--urble-box-shadow-light);

        .urble-card-avatar {
          width: fit-content;
          margin-bottom: 8px;

          img {
            max-width: 100%;
          }
        }

        .urble-card-avatar--rounded {
          img {
            border-radius: 24px;
          }
        }

        h2 {
          font-size: 20px;
          line-height: 28px;
          font-weight: 700;
          margin-bottom: 8px;
        }

        .urble-card-link {
          display: flex;
          flex-direction: column;
          height: 100%;
          color: inherit;
          text-decoration: none;

          &:hover,
          &:focus-visible {
            text-decoration: none;

            h2 {
              text-decoration: underline;
            }
          }

          &:visited {
            color: inherit;
          }
        }

        .urble-card-text {
          line-height: 22px;
          margin-bottom: 24px;
        }

        .urble-card-topic {
          display: inline-flex;
          align-items: center;
          padding: 4px 12px;
          border-radius: 16px;
          background: var(--_Prim-Color-light-200);
          color: var(--urble-color-text-primary);
          font-size: 14px;
          font-weight: 600;
          width: fit-content;
          margin: 8px 0 16px;
        }

        .urble-card-person {
          display: flex;
          flex-direction: row;
          align-items: center;
          gap: 12px;
          margin-bottom: 24px;

          .urble-card-person-face {
            width: 40px;
            height: 40px;
            border-radius: 99999px;
            position: relative;
            overflow: hidden;

            img {
              width: 100%;
              height: 100%;
            }
          }

          .urble-card-person-name {
            color: var(--urble-color-text-primary-disabled);
          }
        }

        .urble-card-controls {
          flex-grow: 1;
          display: flex;

          .urble-link_button {
            background: transparent;
            color: var(--_Prim-Color-dark-100-Brand);
            align-self: end;
            text-decoration: none;
          }
        }
      }
    }

    .urble-patch-content {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
      bottom: -374px;
      background: var(--_Prim-Color-dark-100-Brand);
      width: 860px;
      max-width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 32px;
      padding: 64px 0;
      border-radius: 32px;
      z-index: 50;

      h2 {
        color: var(--_Prim-Color-light-000-White);
        font-size: 48px;
        line-height: 48px;
      }

      .urble-patch-content-text {
        color: var(--_Prim-Color-light-000-White);
      }

      .urble-link_button {
        background: var(--_Prim-Color-light-000-White);
        border-color: var(--_Prim-Color-light-000-White);
        color: var(--_Prim-Color-dark-100-Brand);
      }
    }
  }
}

.urble-section-e-4 {
  padding: 226px 0 64px 0;

  .urble-section-blocks {
    flex-direction: row;
    gap: 32px;

    .urble-section-content {
      display: flex;
      flex-direction: column;
      gap: 32px;

      h1 {
        width: 700px;
      }

      .urble-section-content-text {
        width: 529px;
      }

      .urble-link_button {
        background: var(--_Prim-Color-light-000-White);
        border-color: var(--_Prim-Color-dark-100-Brand);
        color: var(--_Prim-Color-dark-100-Brand);
      }
    }
  }
}

.urble-section-e-5 {
  padding: 64px 0;

  .urble-section-blocks {
    display: flex;
    flex-direction: column;
    gap: 32px;

    .urble-cards-1,
    .urble-cards-2,
    .urble-cards-3 {
      display: flex;
      flex-direction: row;
      gap: 32px;
    }

    .urble-card {
      display: flex;
      flex-direction: row;
      gap: 24px;
      padding: 24px;
      box-shadow: var(--urble-box-shadow-light);

      .urble-card-content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: 16px;

        .urble-card-header {
          display: flex;
          flex-direction: row;
          justify-content: space-between;

          .urble-card-label {
            background: var(--_Prim-Color-light-200);
            border-radius: 99999px;
            padding: 4px 12px;
            line-height: 20px;
          }

          .urble-filled {
            font-variation-settings: 'FILL' 1;
            font-weight: 700;
          }
        }

        .urble-desc {
          line-height: 22px;
          font-weight: 700;
          margin-top: -16px;
        }

        .urble-card-text {
          color: var(--_Prim-Color-dark-300);
          line-height: 22px;
        }

        .urble-link_button {
          color: var(--_Prim-Color-light-000-White);
        }
      }
    }

    .urble-cards-1,
    .urble-cards-2,
    .urble-cards-3 {
      display: flex;
      flex-direction: row;
      gap: 32px;
    }

    .urble-cards-1 {
      height: 318px;

      .urble-card-1 {
        display: flex;
        flex-grow: 1;
        max-width: 100%;
        height: 100%;

        img {
          height: 100%;
        }
      }

      .urble-card-2 {
        width: 392px;
        height: 100%;
      }
    }

    .urble-cards-2 {
      width: 100%;
      flex-wrap: wrap;

      .urble-card-1,
      .urble-card-2 {
        min-width: 524px;
        height: 384px;
        max-width: 100%;

        .urble-card-image {
          background: var(--urble-linear-gradient);
          flex-grow: 1;
          border-radius: 24px;
          padding: 24px;
          display: flex;
          justify-content: center;
          align-items: center;
        }
      }
    }

    .urble-cards-3 {
      .urble-card-2 {
        display: flex;
        flex-grow: 1;
        max-width: 100%;

        img {
          height: 100%;
        }
      }

      .urble-card {
        height: 398px;
      }

      .urble-card-1 {
        width: 392px;
      }
    }
  }
}

.urble-section-e-6 {
  padding: 0;

  height: 580px;
  position: relative;

  .urble-section-background {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -5;
  }

  .urble-figure {
    position: absolute;
    top: 64px;
    left: -300px;
  }

  .urble-circle-4,
  .urble-circle-5,
  .urble-circle-6 {
    position: absolute;
    background: var(--urble-linear-gradient);
    border-radius: 600px;
  }

  .urble-circle-4 {
    width: 114px;
    height: 114px;
    bottom: -57px;
    right: 200px;
  }

  .urble-circle-5 {
    width: 66px;
    height: 66px;
    right: 225px;
    bottom: 118px;
  }

  .urble-circle-6 {
    width: 49px;
    height: 49px;
    bottom: 70px;
    right: 104px;
  }
}

.urble-section-e-7 {
  padding: 64px 0;

  .urble-section-blocks {
    display: flex;
    flex-direction: column;
    gap: 64px;

    .urble-accordion-sections {
      width: 638px;
      max-width: 100%;

      .urble-link_button {
        margin-top: 8px;
        background: transparent;
        border-color: var(--_Prim-Color-dark-100-Brand);
        color: var(--_Prim-Color-dark-100-Brand);
      }
    }

    .urble-section-block-1 {
      display: flex;
      flex-direction: row;
      gap: 96px;
      justify-content: space-between;

      .urble-card {
        background: var(--_Prim-Color-light-200);

        .urble-link_button {
          color: var(--_Prim-Color-light-000-White);
        }
      }
    }
  }
}