.icon {
  --size: clamp(0.9rem, 100%, 1.4rem);
  --url: 'path_to_icon';
  mask-image: var(--url);
  mask-position: center center;
  mask-repeat: no-repeat;
  mask-size: contain;
  display: block;
  width: var(--size);
  background-color: var(--primary-color, #000);
  aspect-ratio: 1;
}

.icon--analisys {
  --url: url("./features/analisys.svg");
}

.icon--calculator {
  --url: url("./features/calculator.svg");
}

.icon--call {
  --url: url("./features/call.svg");
}

.icon--choises {
  --url: url("./features/choises.svg");
}

.icon--delivery {
  --url: url("./features/delivery.svg");
}

.icon--diplom {
  --url: url("./features/diplom.svg");
}

.icon--discount {
  --url: url("./features/discount.svg");
}

.icon--document {
  --url: url("./features/document.svg");
}

.icon--factory {
  --url: url("./features/factory.svg");
}

.icon--handshake {
  --url: url("./features/handshake.svg");
}

.icon--like {
  --url: url("./features/like.svg");
}

.icon--medal {
  --url: url("./features/medal.svg");
}

.icon--pin {
  --url: url("./features/pin.svg");
}

.icon--schedule {
  --url: url("./features/schedule.svg");
}

.icon--scheme {
  --url: url("./features/scheme.svg");
}

.icon--shield {
  --url: url("./features/shield.svg");
}

.icon--star {
  --url: url("./features/star.svg");
}

.icon--target {
  --url: url("./features/target.svg");
}

.icon--tool {
  --url: url("./features/tool.svg");
}

.icon--wallet {
  --url: url("./features/wallet.svg");
}

.icon--close {
  --url: url("./menu-close.svg");
}

.icon--open {
  --url: url("./menu-open.svg");
}

.icon--filter {
  --url: url("./filter.svg");
}

.icon--user {
  --url: url("./user.svg");
}

.icon--cart {
  --url: url("./cart.svg");
}

.icon--search {
  --url: url("./search.svg");
}

.icon--minus {
  --url: url("./minus.svg");
}

.icon--plus {
  --url: url("./plus.svg");
}

.icon--trash {
  --url: url("./trash.svg");
}

.icon--cod {
  --url: url("./cod.svg");
}

.icon--bacs {
  --url: url("./bacs.svg");
}

.icon--cheque {
  --url: url("./cheque.svg");
}

.icon--check {
  --url: url("./check.svg");
}

.icon--orders {
  --url: url("./orders.svg");
}

.icon--edit-account {
  --url: url("./edit-account.svg");
}

.icon--customer-logout {
  --url: url("./customer-logout.svg");
}

.icon--phone {
  --url: url("./contacts/phone.svg");
}

.icon--contact-time {
  --url: url("./contacts/time.svg");
}

.icon--address {
  --url: url("./contacts/address.svg");
}

.icon--email {
  --url: url("./contacts/email.svg");
}

.icon--factory {
  --url: url("./features/factory.svg");
}

.icon--handshake {
  --url: url("./features/handshake.svg");
}

.icon--wallet {
  --url: url("./features/wallet.svg");
}

.icon--warehouse {
  --url: url("./features/warehouse.svg");
}

.icon--scheme {
  --url: url("./features/scheme.svg");
}

.icon--certificate {
  --url: url("./features/certificate.svg");
}

.icon--truck {
  --url: url("./features/truck.svg");
}

.icon--time {
  --url: url("./features/time.svg");
}

.icon--arrow-next {
  --url: url("./arrow-next.svg");
}

.icon--arrow-prev {
  --url: url("./arrow-prev.svg");
}

.icon--arrow-top {
  --url: url("./arrow-top.svg");
}