.custom-product-card {
  .custom-product-card__wrapper {
    display: flex;
    flex-direction: column;
    gap: 28px;
    height: 100%;

    @media screen and (max-width: 768px) {
      border-radius: 8px;
      gap: 14px;
      background-color: rgb(var(--color-base-tertiary-background));
    }
  }

  .buttons-block {
    display: flex;
    align-items: center;
    gap: var(--sp-2);
    margin-top: auto;
    flex-wrap: wrap;

    .button--secondary,
    .quick-add-button,
    form {
      width: fit-content;

      @media screen and (max-width: 768px) {
        width: 100%;
      }
    }

    &:not(.buttons-block--buy-button) {
      .button--secondary {
        @media screen and (max-width: 768px) {
          background-color: var(--color-base-button-gradient);
          border-radius: 8px;
          border-color: var(--color-base-button-gradient);
          color: rgb(var(--color-total-white));
        }
      }
    }

  }

  .custom-product-card__image-block {
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    position: relative;

    img {
      width: 100%;
      height: 100%;
    }

    @media screen and (max-width: 768px) {
      border-radius: 8px 8px 0 0;
    }

    .badges-block {
      position: absolute;
      display: flex;
      flex-direction: column;
      gap: 4px;
      align-items: end;
      right: 16px;
      top: 16px;

      @media screen and (max-width: 768px) {
        right: 6px;
        top: 6px;
      }

      .badges-block__badge {
        display: flex;
        padding: 8px 12px;
        border-radius: 999px;
        background-color: rgb(var(--color-total-white));

        @media screen and (max-width: 768px) {
          padding: 8px 10px;
        }

        span {
          font-weight: 600;
          font-size: clamp(var(--sp-2), 2vw, var(--sp-3));
          line-height: 100%;
          letter-spacing: -0.02em;
          text-align: center;
          color: #0f1113;
        }
      }
    }
  }

  .custom-product-card__content {
    display: flex;
    flex-direction: column;
    flex: 1;

    @media screen and (max-width: 768px) {
      padding: 0 14px 18px;
    }

    .custom-product-card__title {
      display: block;

      h2 {
        font-weight: 700;
        font-size: clamp(var(--sp-4), 2.5vw, var(--sp-6d5));
        line-height: 110%;
        letter-spacing: -0.02em;
        color: rgb(var(--color-total-black));
      }
    }

    .price-block {
      display: flex;
      gap: 10px;
      margin-top: 24px;
      margin-bottom: 13px;
      align-items: center;

      @media screen and (max-width: 768px) {
        gap: 12px;
        row-gap: 6px;
        flex-wrap: wrap;
        margin: 6px 0 18px;
      }

      .price-block__final {
        font-weight: 700;
        font-size: clamp(var(--sp-3d5), 2.5vw, var(--sp-5));
        line-height: 120%;
        color: rgb(var(--color-total-black));
      }

      .price-block__compare {
        font-weight: 400;
        font-size: clamp(var(--sp-3d5), 2.5vw, var(--sp-4d5));
        line-height: 100%;
        text-decoration: line-through;

        @media screen and (max-width: 768px) {
          color: rgb(var(--color-danger));
        }
      }

      .price-block__discount {
        border-radius: 999px;
        padding: 6px 10px;
        background-color: var(--color-base-button-gradient);
        display: flex;

        @media screen and (max-width: 768px) {
          padding: 4px 10px;
        }

        span {
          color: rgb(var(--color-total-white));
          font-weight: 700;
          font-size: clamp(var(--sp-2), 4vw, var(--sp-2d5));
          line-height: 140%;
          text-transform: uppercase;
          text-align: center;
        }
      }
    }
  }
}
