.title {
  font-size: var(--big-text);
}

.paragraph {
  font-size: var(--body-text);
}

.subtitle {
  font-size: var(--medium-text);
  line-height: 1;
}

.eyebrow {
  font-size: var(--small-text);
  padding-bottom: 1.25rem;
  font-weight: 900;
}

.illustration-wrap {
  position: relative;
  top: var(--page-space);
  right: 0;
  height: 55vh;
  display: flex;
}

@media screen and (min-width: 1200px) {
  .illustration-wrap {
    position: absolute;
    right: 24vw;
    height: 75vh;
    border-right: 2px solid var(--light);
    margin-right: initial;
  }
}

@media screen and (min-width: 1800px) {
  .illustration-wrap {
    margin-right: -5px;
  }
}

@media screen and (min-width: 2100px) {
  .illustration-wrap {
    margin-right: -10px;
  }
}

.illustration {
  display: block;
  width: 90%;
  height: calc(75% + var(--page-space));
  object-position: right center;
  object-fit: contain;
  margin: auto 0;
  margin-left: auto;
}

@media screen and (min-width: 1200px) {
  .illustration {
    width: 100%;
    object-position: right center;
    object-fit: contain;
    margin: auto 0;
    margin-left: initial;
  }
  
}

.text {
  position: relative;
  left: 0;
  padding: 0 0 calc(var(--page-space) * 2.5) calc(var(--page-space));
  border-left: 2px solid var(--light);
  width: calc(100% - var(--page-space) * 4);
  font-size: var(--small-text);
}

@media screen and (min-width: 1200px) {
  .text {
    position: absolute;
    left: 0;
    padding: 0 0 calc(var(--page-space) * 2) calc(var(--page-space) * 2);
    bottom: var(--page-space);
    width: 50%;
    font-size: var(--medium-text);
  }
}

#pochi-sprechi .illustration-wrap {
  right: 0;
}

.visible-desktop {
  display: none !important;
}

@media screen and (min-width: 1200px) {
  .visible-desktop {
    display: block !important;
  }
}

.visible-mobile {
  display: block !important;
}

@media screen and (min-width: 1200px) {
  .visible-mobile {
    display: none !important;
  }
}

svg {
  fill: #000000;
}

.bold{
  font-weight: bold;
}
