.plugin {
  display: flex;
  gap: var(--gap);
  align-items: center;
}
@media (max-width: 759px) {
  .plugin {
    flex-direction: column;
  }
}

.plugin-img {
  flex: 0 0 300px;
  max-width: 300px;
}
@media (max-width: 759px) {
  .plugin-img {
    flex: 0 0 auto;
    max-width: auto;
  }
}

.plugin-desc {
  color: #fff;
}

.card-plugin {
  padding: var(--gap-sm) 0;
  display: flex;
  gap: var(--gap-2xl);
  align-items: center;
  font-size: var(--fs-small);
  border-bottom: 1px solid var(--base-border-color);
}
@media (max-width: 959px) {
  .card-plugin {
    flex-wrap: wrap;
    gap: var(--gap-xs);
  }
}

.card-plugin--sm {
  gap: var(--gap-sm);
}
.card-plugin--sm .card-plugin__img, .card-plugin--sm .card-plugin__video {
  flex: 0 0 110px;
  max-width: 110px;
}

@media (max-width: 959px) {
  .card-plugin__desc {
    flex: 0 0 100%;
    max-width: 100%;
    order: -1;
  }
}
.card-plugin__img, .card-plugin__video {
  flex: 0 0 180px;
  max-width: 180px;
}

.card-plugin__name {
  color: var(--primary);
  text-decoration: none;
  display: block;
}

.card-plugin__desc {
  flex-grow: 1;
  align-self: center;
}

.card-plugin__file {
  flex: 0 0 84px;
  max-width: 84px;
  text-align: center;
}

.card-plugin__file--flex {
  display: flex;
  gap: var(--gap-xs);
  flex-wrap: wrap;
  justify-content: center;
}

@media (max-width: 759px) {
  .card-plugin__img {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .card-plugin__video, .card-plugin__file {
    --width: calc((100% - 2 * var(--gap-xs)) / 3.001);
    flex: 0 0 var(--width);
    max-width: var(--width);
  }
  .card-plugin__video .link-overlay img {
    width: 32px;
  }
}