.CardSection {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 60px;
  margin-bottom: 60px;
  padding: 80px 20px;
  background-image: url('../Images/patterns/pattern-cardsection.svg');
  background-repeat: repeat;
  background-size: cover;
}

@media screen and (max-width: 768px) {

.CardSection {
    margin-top: 44px;
    margin-bottom: 44px;
}
  }

@media screen and (min-width: 1026px) {

.CardSection {
    padding: 120px 148px;
}
  }

.CardSection-content {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
}

.CardSection-content .Downloadable {
    width: 100%;
  }

@media screen and (min-width: 769px) {

.CardSection-content .Downloadable {
      width: calc(50% - 22px);
  }
    }

@media screen and (min-width: 1367px) {

.CardSection-content .Downloadable {
      width: calc(33.333% - 22px);
  }
    }

.CardSection-title {
  margin-bottom: 32px;
  font-family: var(--font-secondary-wide);
  font-size: var(--font-size-3xl);
  font-weight: 800;
  line-height: var(--font-line-height-3xl);
  color: #ffffff;
}

@media screen and (min-width: 769px) {

.CardSection-title {
    margin-bottom: 48px;
}
  }