/* Breakpoints
---------------------------------------------------------------------------------------------------- */
/* Transitions
---------------------------------------------------------------------------------------------------- */
/* Border radius
---------------------------------------------------------------------------------------------------- */
/* Fonts
---------------------------------------------------------------------------------------------------- */
/* Typography mixins
---------------------------------------------------------------------------------------------------- */
/* Block margins
---------------------------------------------------------------------------------------------------- */
/* Box mixins
---------------------------------------------------------------------------------------------------- */
/* Icon mixins
---------------------------------------------------------------------------------------------------- */
/* Button mixins
---------------------------------------------------------------------------------------------------- */
/* Card mixins
---------------------------------------------------------------------------------------------------- */
/* Pagination mixins
---------------------------------------------------------------------------------------------------- */
/* Form mixins
---------------------------------------------------------------------------------------------------- */
/* Popup mixins
---------------------------------------------------------------------------------------------------- */
/* Admin mixins
---------------------------------------------------------------------------------------------------- */
body > header {
  position: relative;
}
body > header .header-bg {
  position: relative;
}
body > header .header-bg img {
  max-height: 750px;
  object-fit: cover;
  width: 100vw;
}
@media (min-width: 860px) {
  body > header .header-bg:before {
    background: linear-gradient(80deg, rgba(0, 0, 0, 0.5) 30%, rgba(0, 0, 0, 0) 88%);
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60%;
  }
}
body > header .header-content {
  align-items: flex-start;
  flex-direction: column;
  z-index: 1;
}
body > header .header-content .header-content-inner {
  display: flex;
  flex-direction: column-reverse;
  row-gap: 16px;
  padding: 40px 30px;
  width: 100%;
}
@media (max-width: 599px) {
  body > header .header-content .header-content-inner {
    padding-left: 20px;
    padding-right: 20px;
  }
}
body > header .header-content .header-content-inner .breadcrumbs a {
  color: var(--default);
}
body > header .header-content .header-content-inner .breadcrumbs a:hover, body > header .header-content .header-content-inner .breadcrumbs a:focus-visible {
  color: var(--accent);
  text-decoration: none;
}
@media (min-width: 860px) {
  body > header .header-content:not(.no-image) {
    max-width: calc(100vw - 60px);
    position: absolute;
    left: 30px;
    top: calc(50% + 36px);
    transform: translateY(-50%);
  }
  body > header .header-content:not(.no-image) .header-content-inner {
    padding: 0;
  }
  body > header .header-content:not(.no-image) .header-content-inner .breadcrumbs a {
    color: var(--white);
  }
  body > header .header-content:not(.no-image) .header-content-inner .breadcrumbs a:hover, body > header .header-content:not(.no-image) .header-content-inner .breadcrumbs a:focus-visible {
    color: var(--accent);
    text-decoration: none;
  }
  body > header .header-content:not(.no-image) h1,
  body > header .header-content:not(.no-image) .caption {
    color: var(--white);
    margin: 0;
  }
  body > header .header-content:not(.no-image) h1 {
    width: 500px;
  }
}
@media (min-width: 1350px) {
  body > header .header-content:not(.no-image) {
    left: calc((100vw - 1350px) / 2 + 30px);
  }
}/*# sourceMappingURL=banner.css.map */