.search-hero {
  background-color: rgb(var(--color-background));
}

.search-hero__title {
  margin: 0 0 1.2rem;
}

.search-hero__title:last-child {
  margin-block-end: 0;
}

.search-hero__title > span {
  display: block;
  position: relative;
}

.search-hero__title span:last-child {
  display: inline-block;
}

.search-hero__title small {
  position: absolute;
  display: block;
  inset-block-start: 0;
  inset-inline-start: calc(100% + 0.8rem);
  font-size: var(--font-size-static-lg);
  line-height: var(--line-height-static-sm);
  opacity: .75;
  min-width: 3rem;
  letter-spacing: 0;
}

.search-hero__title-small.h4 {
  text-transform: uppercase;
  margin-block-end: 1.6rem;
  font-size: var(--font-size-static-sm);
  letter-spacing: 0.24rem;
  line-height: var(--line-height-static-sm);
}

.search-hero__input {
  margin-block-start: 3.6rem;
}

.search-hero__input .field--search .field__input {
  border: 0.1rem solid rgba(var(--color-border), var(--alpha-border));
  padding: 1.6rem;
  font-size: var(--font-size-static-md);
  text-transform: capitalize;
  border-radius: var(--input-border-radius);
}

.search-hero__input .search__button {
  inset-block-start: 50%;
  inset-inline-start: unset;
  inset-inline-end: 0;
  transform: translate(0, -50%);
}

.search-hero__input .search__button svg {
  width: 2.8rem;
  height: 2.8rem;
}

.search-hero__input .search__button.search__button--clear {
  inset-inline-end: 4.8rem;
}

.search-hero__input .search__body {
  display: none;
}

@media screen and (max-width: 749px) {
  .search-hero__title {
    line-height: var(--line-height-static-sm);
  }
}

@media screen and (min-width: 750px) {

  .search-hero__title {
    margin-block-start: 4.8rem;
  }

  .search-hero__breadcrumbs ul {
    justify-content: center;
  }
}
