.breadcrumb__lista {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.breadcrumb__item {
  display: flex;
  align-items: center;
  padding-block: 1rem;
}

.breadcrumb__item + .breadcrumb__item::before {
  content: "";
  flex: none;
  width: 1.6rem;
  height: 1.6rem;
  margin-inline: 1rem;
  background-color: var(--laranja);
  -webkit-mask: url("../../img/icones/seta-breadcrumb.svg") center / contain no-repeat;
  mask: url("../../img/icones/seta-breadcrumb.svg") center / contain no-repeat;
}

/* O sublinhado cresce da esquerda para a direita em vez de aparecer de uma vez. */
.breadcrumb__link {
  background: linear-gradient(currentColor, currentColor) left bottom / 0 0.1rem no-repeat;
  transition: background-size 0.4s ease;
}

.breadcrumb__link:hover,
.breadcrumb__link:focus-visible {
  background-size: 100% 0.1rem;
}

.breadcrumb__link:focus-visible {
  outline: 0.2rem solid var(--branco);
  outline-offset: 0.4rem;
}

@media (prefers-reduced-motion: reduce) {
  .breadcrumb__link {
    transition: none;
  }
}

@media (max-width: 991px) {
  .breadcrumb__lista {
    justify-content: center;
  }
}
