.block-cover-side {
  padding: 80px 0;
  --tag-color: #2060e6;
  --tag-bg-color: #ebf0fc;
}

.block-cover-side--tag-pink {
  --tag-color: #F07FAC;
  --tag-bg-color: #fef0f5;
}

.block-cover-side--tag-purple {
  --tag-color: #8278E8;
  --tag-bg-color: #f3f2fd;
}

.block-cover-side--tag-cyan {
  --tag-color: #54BFCE;
  --tag-bg-color: #eff9fb;
}

.block-cover-side--tag-orange {
  --tag-color: #E49872;
  --tag-bg-color: #fdf5f1;
}

.block-cover-side--tag-blue {
  --tag-color: #2060E6;
  --tag-bg-color: #ebf0fc;
}

.block-cover-side--tag-green {
  --tag-color: #53b15c;
  --tag-bg-color: #d2f8d6;
}

.block-cover-side__row {
  display: flex;
  align-items: center;
  gap: 60px;
}

.block-cover-side__text-box {
  flex: 1;
  max-width: 50%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.block-cover-side__tag {
  display: inline-block;
  color: var(--tag-color);
  background-color: var(--tag-bg-color);
  padding: 7px 16px;
  border-radius: 24px;
  font-size: 12px;
  line-height: 15px;
  font-weight: 500;
  text-transform: uppercase;
}

.block-cover-side__text {
  font-size: 18px;
  line-height: 1.6;
  color: #0e1155;
  max-width: 500px;
}

.block-cover-side__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-top: 16px;
}

.block-cover-side__media {
  flex: 1;
  max-width: 50%;
}

.block-cover-side__image {
  width: 100%;
  height: auto;
  display: block;
}

.block-cover-side__video {
  width: 100%;
  height: auto;
}

.block-cover-side__video video {
  width: 100%;
  height: auto;
  display: block;
}

@media (min-width: 1300px) {
  .block-cover-side__text-box {
    padding-left: 100px;
  }
}

@media screen and (max-width: 1200px) {
  .block-cover-side__row {
    gap: 30px;
  }
}

@media screen and (max-width: 768px) {
  .block-cover-side--mobile-reverse .block-cover-side__row {
    flex-direction: column-reverse;
  }

  .block-cover-side {
    padding: 40px 0;
  }

  .block-cover-side__row {
    flex-direction: column;
    gap: 40px;
  }

  .block-cover-side__text-box,
  .block-cover-side__media {
    max-width: 100%;
  }

  .block-cover-side__text {
    font-size: 16px;
  }

  .block-cover-side__buttons {
    flex-direction: column;
    align-items: flex-start;
  }
}