@import "../../vendors/outfit-font/css/style.css";
@import "colors.css";

.terms-content {
  max-width: 940px;
  padding: 40px 60px 60px;
  line-height: 1.26;
}

.terms-content a {
  color: var(--accent-blue);
}

.terms-main-content {
  display: flex;
  flex-direction: column;
  gap: 68px;
}

.terms-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-bottom: 60px;
}

.terms-heading-content {
  display: flex;
  align-items: center;
  gap: 20px;
}

.terms-heading-content h2 {
  font-size: 32px;
  font-weight: 600;
  color: var(--dark-active);
}

.terms-heading-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.terms-list {
  margin: -5px 0 0 28px;
}

.terms-page {
  display: flex;
  justify-content: center;
  background-color: var(--background);
}

.terms-section h5 {
  margin-bottom: 10px;
  font-size: 20px;
  font-weight: 500;
  color: var(--dark-active);
}

.terms-text {
  display: flex;
  flex-direction: column;
  gap: 15px;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--dark-default);
}

@media (max-width: 767px) {
  .terms-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 56px;
  }

  .terms-heading-content,
  .terms-text {
    gap: 16px;
  }

  .terms-heading-content h2 {
    font-size: 28px;
  }

  .terms-section h5 {
    margin-bottom: 24px;
    font-size: 16px;
    line-height: 1.7;
  }

  .terms-main-content {
    gap: 56px;
  }
}
