/* Converted from src/components/site/business/PageHeadline.module.css (CSS Module): local classes are prefixed "business-page-headline__". */
/* Page headline with a background picture (theme "page-headline .bg-image"). Fixed at every
   width, like the original and the sector / profile heroes: on phones the picture covers the
   viewport and stays put while the page scrolls (iOS ignores fixed backgrounds, as it did on the
   original). */

.business-page-headline__headline {
  position: relative;
  background-color: var(--color-fill);
  background-image: var(--headline-image);
  background-position: var(--headline-position);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

/* Title in the brand face (overrides the PageHeader title: element + class specificity). */
.business-page-headline__header h1 {
  font-family: var(--font-display);
  font-weight: 400;
}

.business-page-headline__light .business-page-headline__header h1 {
  color: #fff;
}

@media (max-width: 1180px) {
  /* Rounded top edge of the content overlapping the picture */
  .business-page-headline__headline::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1rem;
    background-color: var(--color-bg);
    border-radius: 1rem 1rem 0 0;
  }
}