@charset "UTF-8";
.steps .wrapper {
  display: flex;
  justify-content: space-between;
  position: relative; }
  .steps .wrapper:after {
    content: "";
    width: 100%;
    height: 1px;
    min-height: 1px;
    background-color: var(--secondary-bg);
    position: absolute;
    top: 66px;
    width: 80%; }
.steps .icon {
  width: 215px;
  min-width: 215px;
  height: 123px;
  background-color: var(--primary-bg);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2; }
  .steps .icon h3 {
    font-size: 100rem;
    color: var(--element1-color);
    font-weight: 900;
    color: transparent;
    /* brak wypełnienia */
    -webkit-text-stroke: 1px blue;
    /* niebieski kontur */
    text-stroke: 1px var(--element1-color);
    /* dla kompatybilności */
    margin: 0; }
.steps .foto {
  width: 110px;
  min-width: 110px;
  height: 110px;
  border-radius: 50%;
  background-color: var(--primary-bg);
  border: 6px solid var(--element1-color);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: -22px;
  right: -35px; }
  .steps .foto img {
    max-width: 51px;
    max-height: 51px;
    object-fit: contain; }
  .steps .foto figure {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center; }
.steps .one-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 33.33%; }
.steps .wrapper {
  justify-content: space-around; }
.steps .text {
  padding: 0 30px; }
  .steps .text h4 {
    font-size: 21rem;
    text-align: center;
    font-weight: 800;
    margin: 0px;
    color: var(--element1-color); }
  .steps .text .subtitle {
    font-size: 21rem;
    text-align: center;
    font-weight: 800;
    margin-bottom: 20px;
    color: var(--primary-text); }
  .steps .text p {
    font-size: 17rem;
    text-align: center;
    color: var(--transparent-color1); }

@media (max-width: 575.5px) {
  .steps .wrapper {
    flex-wrap: wrap; }
    .steps .wrapper:after {
      width: 1px;
      height: 100%;
      top: 0; }
  .steps .one-step {
    width: 100%;
    margin-bottom: 75px; }
    .steps .one-step:last-child {
      margin-bottom: 0; }
    .steps .one-step .text {
      background-color: var(--primary-bg);
      position: relative;
      z-index: 2; } }
@media (min-width: 576px) and (max-width: 767.5px) {
  .steps .wrapper {
    flex-wrap: wrap; }
    .steps .wrapper:after {
      width: 1px;
      height: 100%;
      top: 0; }
  .steps .one-step {
    width: 100%;
    margin-bottom: 75px; }
    .steps .one-step:last-child {
      margin-bottom: 0; }
    .steps .one-step .text {
      background-color: var(--primary-bg);
      position: relative;
      z-index: 2; } }
@media (min-width: 768px) and (max-width: 991.5px) {
  .steps .text {
    padding: 0 11px; }
    .steps .text .subtitle {
      font-size: 18rem; }
    .steps .text p {
      font-size: 13px; }
  .steps .icon {
    width: 170px;
    min-width: 170px; } }

/*# sourceMappingURL=steps.css.map */