:root {
  --color-primary: #2560d8;
  --color-yellow: #e2ee4e;
  --color-red: #ef5311;
  --color-tomato: #ff4f00;
  --color-bg: #fafafa;

  --color-text: #272928;
  --color-subtext: #505251;
  --color-light-text: #7f7f7f;

  --container-width: 1600px;

      --padding-section: clamp(20px, 6vw, 70px);

  --shadow: 0 4px 10px #00000036;
}
.reviews {
  margin-bottom: 16px;
  padding: 0 24px;
}
.crm-benefits__container {
  background: #ebeef5;
  padding: 24px;
  border-radius: 20px;
}
.crm-benefits__title {
  margin-bottom: 24px;
  padding: 14px 16px;
  background-color: var(--color-primary);
  border-radius: 16px;
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  color: #ffffff;
}

.crm-benefits__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
/* ===== карточка ===== */
.crm-benefit-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 20px 16px 24px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease-in-out;
}

.crm-benefit-card__icon {
  width: 70px;
  height: 70px;
  margin: 0 auto 12px;
  border-radius: 16px;
  background: #f2f5ff;
  padding: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.crm-benefit-card__icon img {
  width: 100%;
  object-fit: contain;
}
.crm-benefit-card__title {
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--text);
}

.crm-benefit-card__text {
  font-size: 14px;
  line-height: 130%;
      text-align: justify;
        text-align: justify;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-wrap: break-word;
    overflow-wrap: break-word;
  color: var(--color-subtext);
}

/* ===== tablet ===== */
@media (min-width: 768px) {
  .crm-benefits__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }

  .crm-benefits__title {
    font-size: 20px;
  }
}

/* ===== desktop ===== */
@media (min-width: 1024px) {
  .crm-benefits__grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .crm-benefit-card {
    padding: 28px 20px 32px;
  }

  .crm-benefit-card__title {
    font-size: 18px;
  }

  .crm-benefit-card__text {
    font-size: 16px;
  }
}

/* ================= REVIEWS ================= */

/* Card */
.review-card {
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 4px 10px #0000000d;
  padding: 32px;
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: 32px;
  margin-bottom: 24px;
}

.review-card > * {
  min-width: 0;
}

/* Left side */
.review-card__side {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  text-align: center;
}

/* Author */
.review-author__role {
  margin-bottom: 4px;
  font-weight: 500;
  color: var(--color-text);
}

.review-author__company {
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  display: inline-block;
  margin-bottom: 4px;
}

.review-author__name {
  font-size: 14px;
  color: var(--color-light-text);
}

/* Content */
.review-card__content {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.review-block ol{
    margin-left: 1.2rem; 
}
.review-block p{
    margin: 0;
    line-height: 180%;
    font-weight: 400;
    font-size: 18px;
    color: var(--color-text);
}
.review-block ol li{
   padding-bottom: 10px; 
}
.review-block ol li:last-child{
   padding-bottom: 0px; 
}
.review-block__label {
  display: inline-block;
  padding: 12px 20px;
  background: #f2f7ff;
  color: var(--color-text);
  border-radius: 8px;
  margin-bottom: 8px;
  font-weight: 500;
}

/* ================= ADAPTIVE ================= */

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

  .review-card__side {
    flex-direction: row;
    align-items: center;
    text-align: left;
  }
}

@media (max-width: 560px) {
  .review-card {
    padding: 20px;
    gap: 20px;
  }

  .review-card__side {
    flex-direction: column;
    text-align: center;
  }
}
@media (max-width: 420px) {
  .review-card {
    padding: 20px;
    gap: 20px;
  }
  .review-logo {
    max-width: 167px;
    height: auto;
  }
  .review-logo img {
    width: 100%;
  }
}
