.paragraph--type--big-counter {
  width: 100%;
  background-color: var(--big-counter-bg-color);
  background-repeat: no-repeat;
  background-image: var(--big-counter-bg-image);
  background-size: cover;
  background-position: center;
  /* translate: -0.75rem 0; */
  color: var(--big-counter-text-color);
}

.paragraph--type--big-counter {
  /* --margin-lr: 0;
  margin-left: var(--margin-lr);
  margin-right: var(--margin-lr);
  width: 100vw; */
  margin: 1rem 0;
  padding: 1rem 0;
}

/* @media (min-width: 260px) {
  .paragraph--type--big-counter {
    --margin-lr: 0;
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 576px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(576px / 2) - 3.4%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 768px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(768px / 2) - 3.4%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 992px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(992px / 2) - 1.8%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 1200px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(1200px / 2) - 2.7%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 1400px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(1400px / 2) - 3.1%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media(min-width: 1920px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-50vw + calc(1920px / 2) - 10.4%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 100vw;
  }
} */

/* @media (min-width: 2560px) {
  .paragraph--type--big-counter {
    --margin-lr: calc(-1280px + calc(1920px / 2) - 10.4%);
    margin-left: var(--margin-lr);
    margin-right: var(--margin-lr);
    width: 2560px !important;
  }
} */

/* .paragraph--type--big-counter>div {} */

.paragraph--type--big-counter>div>* {
  height: fit-content;
  width: fit-content;
}

.paragraph--type--big-counter>div>.field {
  margin: 0 auto;
  width: fit-content;
}

.paragraph--type--big-counter>div>.field--name-field-p-title {
  font-size: calc(1.375rem + 1.5vw);
  padding: 1rem 0;
}

.paragraph--type--big-counter>div>.field--name-field-paragraph-desc {
  width: 100%;
  padding: 1rem 0;
}

.paragraph--type--big-counter>div>.field--name-field-paragraph-items {
  display: flex;
  justify-content: center;
  align-content: stretch;
  justify-items: stretch;
  align-items: stretch;
  width: 100%;
  flex-wrap: wrap;
}

.paragraph--type--big-counter>div>.field--name-field-paragraph-items>.field__item {
  width: 25%;
  padding: 1rem;
}

@media (max-width: 1400px) {
  .paragraph--type--big-counter>div>.field--name-field-paragraph-items>.field__item {
    width: 33.333%;
    padding: 1rem;
  }
}

@media (max-width: 1000px) {
  .paragraph--type--big-counter>div>.field--name-field-paragraph-items>.field__item {
    width: 50%;
    padding: 1rem;
  }
}

@media (max-width: 770px) {
  .paragraph--type--big-counter>div>.field--name-field-paragraph-items>.field__item {
    width: 100%;
    padding: 0.5rem;
  }
}

.paragraph--type--big-counter>div>.field--name-field-paragraph-items>.field__item>.paragraph--type--counter-element {
  width: 100%;
  height: 100%;
  color: inherit;
}


.paragraph--type--counter-element {
  border-style: solid;
  border-width: 2px;
  border-top-width: 0;
  border-left-width: 0;
  /* border-radius: 0.15rem; */
  border-radius: 0;
  border-color: var(--big-counter-text-color);
  padding: 1rem;
  position: relative;
}

.paragraph--type--counter-element:after,
.paragraph--type--counter-element:before {
  position: absolute;
  content: '';
  display: block;
  border-style: solid;
  border-width: 2px;
  /* border-radius: 0.15rem; */
  border-radius: 0;
  border-color: var(--big-counter-text-color);
  background-color: var(--big-counter-text-color);
}

.paragraph--type--counter-element:after {
  top: 0;
  left: 50%;
  width: 50%;
  height: 0;
  border-width: 2px 0 0 0;
}

.paragraph--type--counter-element:before {
  left: 0;
  top: 75%;
  height: 25%;
  width: 0;
  border-width: 0 0 0 2px;
}

s .paragraph--type--counter-element {
  display: grid;
  grid-auto-flow: column;
  grid-auto-rows: 1fr;
  grid-template-columns: min-content auto;
  grid-template-rows: auto auto;
  gap: 1ch 1ch;
  grid-template-areas:
    "number suffix"
    "desc desc";
  justify-content: stretch;
  align-content: stretch;
  justify-items: stretch;
  align-items: stretch;
}

.paragraph--type--counter-element>.field--name-field__paragraph-number-float3,
.paragraph--type--counter-element>.field--name-field-paragraph-number-suffix {
  font-size: 3rem;
  font-weight: 700;
}

.paragraph--type--counter-element>.field--name-field__paragraph-number-float3 {
  grid-area: number;
}

.paragraph--type--counter-element>.field--name-field-paragraph-number-suffix {
  grid-area: suffix;
}

.paragraph--type--counter-element>.field--name-field-paragraph-label {
  grid-area: desc;
  font-size: 1.071rem;
  font-weight: 400;
}
