/**
 * @file
 * text paragraph
 * Use in paragraph--text.html.twig
 */


.text > span {
  font-family: var(--font-fraunces);
  font-size: var(--font-size-s);
  color: var(--color-neutral--1);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 0.5rem;
}
.text > span::before {
  content: '';
  display: block;
  width: 25px;
  height: 1px;
  background-color: var(--color-neutral--1);
}
.section--color-primary-1 .text > span {
  color: var(--color-neutral--6);
}
.section--color-primary-1 .text > span::before {
  background-color: var(--color-neutral--6);
}
.text .title-xl {
  font-size: var(--font-size-l);
}
@media all and (min-width: 768px) {
  .text > span {
    font-size: var(--font-size-xs);
  }
  .text > span::before {
    width: 38px;
  }
  .text .title-xl {
    font-size: var(--title-xl);
  }
  .text .text-xl {
    font-size: var(--font-size-xl);
  }
}