#rekrutacja h4 a { color: var(--bs-body-color); text-decoration: none; }

#rekrutacja h4 a:hover,
#rekrutacja h4 a:focus { text-decoration: underline; }

#rekrutacja .tel .ico svg { fill: var(--bs-body-black); width: auto; height: 26px; }
#rekrutacja .email .ico svg { fill: var(--bs-body-black); width: auto; height: 17px; }

#rekrutacja .ico { width: 26px; display: flex; justify-content: center; align-items: center; }

.step .ico-wrapper { aspect-ratio: 163 / 162; max-height: 162px; position: relative; display: flex; justify-content: center; align-items: center; }

.element .ico-wrapper { aspect-ratio: 112 / 118; max-height: 118px; position: relative; display: flex; justify-content: center; align-items: flex-end; }

.step .counter-wrapper { position: relative; display: flex; justify-content: center; align-items: center; }

.step .counter-wrapper .counter,
.step .ico-wrapper .counter { display: inline-block; line-height: 1; background-color: var(--first); position: absolute; }

.step .ico-wrapper .counter { width: calc(75px * .725); height: calc(75px * .725); left: calc(-75px * .725 / 2); top: calc(-75px * .725 / 2); border-radius: calc(75px * .725 / 2); }

.step .counter-wrapper .counter { width: calc(75px * .725); height: calc(75px * .725); border-radius: calc(75px * .725 / 2); }

body.page-template-rekrutacja #rekrutacja .step h4 + .description { font-weight: 700; }

@media (min-width: 576px) {
    .step .ico-wrapper .counter { width: 75px; height: 75px; left: calc(-75px / 2); top: calc(-75px / 2); border-radius: calc(75px / 2); }
    .step .counter-wrapper .counter { width: 75px; height: 75px; border-radius: calc(75px / 2); }
}

@media (min-width: 768px) {
    body.page-template-rekrutacja #rekrutacja .step h4 { min-height: 108px; }
}

@media (min-width: 1200px) {
    body.page-template-rekrutacja #rekrutacja .step h4 { min-height: 56.4px; }
}

@media (min-width: 1400px) {
    body.page-template-rekrutacja #rekrutacja .step h4 { min-height: 66px; }
}