:root {
  --mc-icon-check: url("assets/icons/check.svg");
  --mc-icon-badge: url("assets/icons/badge-check.svg");
  --mc-icon-shield: url("assets/icons/shield-check.svg");
  --mc-icon-settings: url("assets/icons/settings.svg");
  --mc-icon-headset: url("assets/icons/headset.svg");
  --mc-icon-clock: url("assets/icons/clock.svg");
  --mc-icon-map: url("assets/icons/map-pinned.svg");
  --mc-icon-phone: url("assets/icons/phone.svg");
  --mc-icon-calendar: url("assets/icons/calendar-check-2.svg");
  --mc-icon-book: url("assets/icons/book-check.svg");
  --mc-icon-globe: url("assets/icons/globe.svg");
  --mc-icon-wrench: url("assets/icons/wrench.svg");
  --mc-icon-mail: url("assets/icons/mail.svg");
  --mc-icon-chart: url("assets/icons/chart-column-big.svg");
  --mc-icon-ruler: url("assets/icons/ruler.svg");
  --mc-icon-factory: url("assets/icons/factory.svg");
  --mc-icon-hard-hat: url("assets/icons/hard-hat.svg");
  --mc-health-ent: url("assets/icons/health/ent.svg");
  --mc-health-eye: url("assets/icons/health/eye.svg");
  --mc-health-hearing: url("assets/icons/health/hearing-aid.svg");
  --mc-health-cochlear: url("assets/icons/health/cochlear-implant.svg");
  --mc-health-surgery: url("assets/icons/health/surgery.svg");
  --mc-health-dermatology: url("assets/icons/health/dermatology.svg");
  --mc-health-diagnostics: url("assets/icons/health/diagnostics.svg");
  --mc-health-doctor: url("assets/icons/health/doctor.svg");
  --mc-health-hospital: url("assets/icons/health/hospital.svg");
  --mc-health-stethoscope: url("assets/icons/health/stethoscope.svg");
  --mc-health-records: url("assets/icons/health/medical-records.svg");
  --mc-health-telemedicine: url("assets/icons/health/telemedicine.svg");
  --mc-health-medicines: url("assets/icons/health/medicines.svg");
  --mc-health-lab: url("assets/icons/health/lab.svg");
  --mc-health-search: url("assets/icons/health/medical-search.svg");
  --mc-health-child: url("assets/icons/health/child-care.svg");
  --mc-health-dry-eye: url("assets/icons/health/dry-eyes.svg");
  --mc-health-hospitalized: url("assets/icons/health/hospitalized.svg");
  --mc-health-nose: url("assets/icons/health/nose.svg");
  --mc-health-ear: url("assets/icons/health/ear.svg");
  --mc-health-eyeglasses: url("assets/icons/health/eyeglasses.svg");
  --mc-health-pediatric-surgery: url("assets/icons/health/pediatric-surgery.svg");
}

.mc-icon,
.mc-card h3::before,
.mc-fact::before,
.mc-note h3::before,
.mc-related strong::before,
.mc-list li::before,
.mc-mini-list li::before,
#services h3::before,
#care-path h3::before,
#service-lines h3::before,
#diagnostics h3::before,
#hearing-aids .font-medium::before,
#prices-preview .font-medium::before,
#location .font-medium::before,
#trust .font-medium::before {
  content: "";
  display: inline-block;
  width: 1.05em;
  height: 1.05em;
  flex: 0 0 auto;
  background: currentColor;
  vertical-align: -0.16em;
  -webkit-mask: var(--mc-health-stethoscope) center / contain no-repeat;
  mask: var(--mc-health-stethoscope) center / contain no-repeat;
}

.mc-card h3::before,
.mc-note h3::before,
.mc-related strong::before,
#services h3::before,
#care-path h3::before,
#service-lines h3::before,
#diagnostics h3::before {
  margin-right: .55em;
  color: var(--accent);
}

.mc-fact::before {
  display: grid;
  width: 34px;
  height: 34px;
  margin-bottom: 14px;
  color: var(--primary);
  -webkit-mask-image: var(--mc-health-hospital);
  mask-image: var(--mc-health-hospital);
}

.mc-fact:nth-child(2)::before {
  -webkit-mask-image: var(--mc-health-diagnostics);
  mask-image: var(--mc-health-diagnostics);
}

.mc-fact:nth-child(3)::before {
  -webkit-mask-image: var(--mc-health-doctor);
  mask-image: var(--mc-health-doctor);
}

.mc-list li::before,
.mc-mini-list li::before {
  width: 18px;
  height: 18px;
  margin-top: .2em;
  color: var(--accent);
  -webkit-mask-image: var(--mc-icon-check);
  mask-image: var(--mc-icon-check);
}

.mc-route__item h3::before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  margin-bottom: 18px;
  background: var(--accent);
  -webkit-mask: var(--mc-health-records) center / contain no-repeat;
  mask: var(--mc-health-records) center / contain no-repeat;
}

.mc-route__item:nth-child(2) h3::before {
  -webkit-mask-image: var(--mc-health-doctor);
  mask-image: var(--mc-health-doctor);
}

.mc-route__item:nth-child(3) h3::before {
  -webkit-mask-image: var(--mc-health-diagnostics);
  mask-image: var(--mc-health-diagnostics);
}

.mc-route__item:nth-child(4) h3::before {
  -webkit-mask-image: var(--mc-health-medicines);
  mask-image: var(--mc-health-medicines);
}

.mc-route__item:nth-child(5) h3::before {
  -webkit-mask-image: var(--mc-health-hospitalized);
  mask-image: var(--mc-health-hospitalized);
}

.mc-related strong {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.mc-related strong::before {
  margin: .05em 0 0;
  -webkit-mask-image: var(--mc-health-records);
  mask-image: var(--mc-health-records);
}

.mc-related a:nth-child(2n) strong::before {
  -webkit-mask-image: var(--mc-health-telemedicine);
  mask-image: var(--mc-health-telemedicine);
}

.mc-related a:nth-child(3n) strong::before {
  -webkit-mask-image: var(--mc-health-doctor);
  mask-image: var(--mc-health-doctor);
}

.mc-related a:nth-child(4n) strong::before {
  -webkit-mask-image: var(--mc-health-hearing);
  mask-image: var(--mc-health-hearing);
}

.mc-note h3::before {
  -webkit-mask-image: var(--mc-health-diagnostics);
  mask-image: var(--mc-health-diagnostics);
}

.mc-note:nth-child(2n) h3::before {
  -webkit-mask-image: var(--mc-health-lab);
  mask-image: var(--mc-health-lab);
}

.mc-note:nth-child(3n) h3::before {
  -webkit-mask-image: var(--mc-health-search);
  mask-image: var(--mc-health-search);
}

.mc-note:nth-child(4n) h3::before {
  -webkit-mask-image: var(--mc-health-hospital);
  mask-image: var(--mc-health-hospital);
}

.mc-card:nth-child(2n) h3::before,
#services a:nth-child(2n) h3::before,
#service-lines a:nth-child(2n) h3::before {
  -webkit-mask-image: var(--mc-health-eye);
  mask-image: var(--mc-health-eye);
}

.mc-card:nth-child(3n) h3::before,
#services a:nth-child(3n) h3::before,
#service-lines a:nth-child(3n) h3::before {
  -webkit-mask-image: var(--mc-health-hearing);
  mask-image: var(--mc-health-hearing);
}

.mc-card:nth-child(4n) h3::before,
#services a:nth-child(4n) h3::before,
#service-lines a:nth-child(4n) h3::before {
  -webkit-mask-image: var(--mc-health-surgery);
  mask-image: var(--mc-health-surgery);
}

.mc-card:nth-child(5n) h3::before,
#services a:nth-child(5n) h3::before,
#service-lines a:nth-child(5n) h3::before {
  -webkit-mask-image: var(--mc-health-diagnostics);
  mask-image: var(--mc-health-diagnostics);
}

.mc-card:nth-child(6n) h3::before,
#services a:nth-child(6n) h3::before,
#service-lines a:nth-child(6n) h3::before {
  -webkit-mask-image: var(--mc-health-dermatology);
  mask-image: var(--mc-health-dermatology);
}

.mc-card:nth-child(7n) h3::before,
#services a:nth-child(7n) h3::before,
#service-lines a:nth-child(7n) h3::before {
  -webkit-mask-image: var(--mc-health-child);
  mask-image: var(--mc-health-child);
}

.mc-card:nth-child(8n) h3::before,
#services a:nth-child(8n) h3::before,
#service-lines a:nth-child(8n) h3::before {
  -webkit-mask-image: var(--mc-health-cochlear);
  mask-image: var(--mc-health-cochlear);
}

#care-path .rounded-2xl:nth-child(1) h3::before {
  -webkit-mask-image: var(--mc-health-records);
  mask-image: var(--mc-health-records);
}

#care-path .rounded-2xl:nth-child(2) h3::before {
  -webkit-mask-image: var(--mc-health-diagnostics);
  mask-image: var(--mc-health-diagnostics);
}

#care-path .rounded-2xl:nth-child(3) h3::before {
  -webkit-mask-image: var(--mc-health-medicines);
  mask-image: var(--mc-health-medicines);
}

#care-path .rounded-2xl:nth-child(4) h3::before {
  -webkit-mask-image: var(--mc-health-hospitalized);
  mask-image: var(--mc-health-hospitalized);
}

#care-path .rounded-2xl:nth-child(5) h3::before {
  -webkit-mask-image: var(--mc-icon-check);
  mask-image: var(--mc-icon-check);
}

#hearing-aids .font-medium::before,
#prices-preview .font-medium::before,
#location .font-medium::before,
#trust .font-medium::before {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  color: var(--accent);
}

#location .font-medium::before {
  -webkit-mask-image: var(--mc-icon-map);
  mask-image: var(--mc-icon-map);
}

#location .rounded-2xl:nth-child(2) .font-medium::before {
  -webkit-mask-image: var(--mc-icon-phone);
  mask-image: var(--mc-icon-phone);
}

#location .rounded-2xl:nth-child(3) .font-medium::before {
  -webkit-mask-image: var(--mc-icon-clock);
  mask-image: var(--mc-icon-clock);
}

#prices-preview .font-medium::before {
  -webkit-mask-image: var(--mc-icon-check);
  mask-image: var(--mc-icon-check);
}

#trust .font-medium::before {
  -webkit-mask-image: var(--mc-health-hospital);
  mask-image: var(--mc-health-hospital);
}

#trust .rounded-2xl:nth-child(2) .font-medium::before {
  -webkit-mask-image: var(--mc-health-doctor);
  mask-image: var(--mc-health-doctor);
}

#trust .rounded-2xl:nth-child(3) .font-medium::before {
  -webkit-mask-image: var(--mc-health-records);
  mask-image: var(--mc-health-records);
}

#diagnostics .mc-note:nth-child(1) h3::before,
#diagnostics .rounded-2xl:nth-child(1) h3::before {
  -webkit-mask-image: var(--mc-health-eye);
  mask-image: var(--mc-health-eye);
}

#diagnostics .mc-note:nth-child(2) h3::before,
#diagnostics .rounded-2xl:nth-child(2) h3::before {
  -webkit-mask-image: var(--mc-health-hearing);
  mask-image: var(--mc-health-hearing);
}

#diagnostics .mc-note:nth-child(3) h3::before,
#diagnostics .rounded-2xl:nth-child(3) h3::before {
  -webkit-mask-image: var(--mc-health-ent);
  mask-image: var(--mc-health-ent);
}

#diagnostics .mc-note:nth-child(4) h3::before,
#diagnostics .rounded-2xl:nth-child(4) h3::before {
  -webkit-mask-image: var(--mc-health-surgery);
  mask-image: var(--mc-health-surgery);
}

a[href*="otolaringologija"] h3::before,
a[href*="otolaringologija"] strong::before {
  -webkit-mask-image: var(--mc-health-ent);
  mask-image: var(--mc-health-ent);
}

a[href*="oftalmologija"] h3::before,
a[href*="oftalmologija"] strong::before {
  -webkit-mask-image: var(--mc-health-eye);
  mask-image: var(--mc-health-eye);
}

a[href*="diagnostyka-sluhu"] h3::before,
a[href*="sluhovi-aparati"] h3::before,
a[href*="surdolog"] h3::before,
a[href*="diagnostyka-sluhu"] strong::before,
a[href*="sluhovi-aparati"] strong::before,
a[href*="surdolog"] strong::before {
  -webkit-mask-image: var(--mc-health-hearing);
  mask-image: var(--mc-health-hearing);
}

a[href*="kohlearna-implantacija"] h3::before,
a[href*="kohlearna-implantacija"] strong::before {
  -webkit-mask-image: var(--mc-health-cochlear);
  mask-image: var(--mc-health-cochlear);
}

a[href*="hirurgichnyj-tsentr"] h3::before,
a[href*="operacii"] h3::before,
a[href*="hirurgichnyj-tsentr"] strong::before,
a[href*="operacii"] strong::before {
  -webkit-mask-image: var(--mc-health-surgery);
  mask-image: var(--mc-health-surgery);
}

a[href*="dermatologija"] h3::before,
a[href*="dermatologija"] strong::before {
  -webkit-mask-image: var(--mc-health-dermatology);
  mask-image: var(--mc-health-dermatology);
}

a[href*="ditjachij-oftalmolog"] h3::before,
a[href*="ditjachij-oftalmolog"] strong::before {
  -webkit-mask-image: var(--mc-health-child);
  mask-image: var(--mc-health-child);
}

a[href*="oftalmoplastika"] h3::before,
a[href*="blafaroplastika"] h3::before,
a[href*="oftalmoplastika"] strong::before,
a[href*="blafaroplastika"] strong::before {
  -webkit-mask-image: var(--mc-health-dry-eye);
  mask-image: var(--mc-health-dry-eye);
}

.mc-btn--dark::after,
.mc-btn--primary::after {
  content: "";
  width: 1em;
  height: 1em;
  background: currentColor;
  -webkit-mask: var(--mc-icon-phone) center / contain no-repeat;
  mask: var(--mc-icon-phone) center / contain no-repeat;
}

.mc-btn--primary[href*="cini"]::after,
.mc-btn--primary[href*="poslugi"]::after,
.mc-btn--primary[href*="contacts"]::after {
  -webkit-mask-image: var(--mc-icon-calendar);
  mask-image: var(--mc-icon-calendar);
}

@media (max-width: 680px) {
  .mc-card h3::before,
  #services h3::before,
  #care-path h3::before,
  #service-lines h3::before,
  #diagnostics h3::before {
    width: .95em;
    height: .95em;
    margin-right: .45em;
  }
}
