.o-hero {
  --min-height: 25rem;
  --columns: [full-start image-start content-start video-start] 1fr [video-end
    image-end content-end full-end];
  --rows: [full-start image-start video-start] auto [video-end image-end
    content-start] auto [content-end full-end];
  --bg-area: content;
  --text-area: content;
  --image-area: image;
  --video-area: video;
  --text-pos: start;
  --text-alignment: start;
  --content-max-width: 100%;
  position: relative;
  overflow: clip;
}
.o-hero--has-modal {
  --min-height: 45rem;
}
.o-hero.section--first {
  margin-block-start: 0 !important;
}
.o-hero[data-image-pos=full] {
  --rows: [full-start image-start video-start content-start] auto [video-end
    image-end content-end full-end];
}
.o-hero[data-styled-image] {
  --bg-area: full !important;
}
@media screen and (min-width: 990px) {
  .o-hero {
    --columns: [full-start content-start] 1fr [content-end image-start
      video-start] 1fr [video-end image-end full-end];
    --rows: [full-start image-start video-start content-start] auto [video-end
      image-end content-end full-end];
    --text-pos: end;
    --img-pos: start;
    --content-max-width: calc(var(--layout-container-width) / 2);
    --image-max-width: calc(var(--layout-container-width) / 2);
  }
  .o-hero[data-image-pos=left] {
    --columns: [full-start image-start video-start] 1fr [video-end image-end
      content-start] 1fr [content-end full-end];
    --text-pos: start;
    --img-pos: end;
  }
  .o-hero[data-image-pos=full] {
    --columns: [full-start image-start video-start] 1fr [video-end
      content-start] 1fr [content-end image-end full-end];
    --text-pos: start;
  }
  .o-hero[data-image-pos=full][data-text-pos=left] {
    --columns: [full-start image-start content-start] 1fr [content-end
      video-start] 1fr [video-end image-end full-end];
    --text-pos: end;
  }
  .o-hero[data-image-pos=full][data-text-pos=center] {
    --columns: [full-start image-start video-start content-start] 1fr
      [video-end image-end content-end full-end];
    --text-pos: center;
    --content-max-width: 100%;
    --content-position: center;
  }
}
.o-hero--has-video {
  --rows: [full-start image-start video-start] auto [video-end image-end
    content-start] auto [content-end full-end];
}
@media screen and (min-width: 990px) {
  .o-hero--has-video {
    --rows: [full-start image-start video-start content-start] auto [video-end
      image-end content-end full-end];
  }
}
.o-hero--has-video[data-image-pos=full] {
  --rows: [full-start image-start video-start] auto [video-end
    content-start] auto [content-end full-end image-end];
}
@media screen and (min-width: 990px) {
  .o-hero--has-video[data-image-pos=full] {
    --rows: [full-start image-start video-start content-start] auto
      [video-end image-end content-end full-end];
  }
}
@media screen and (min-width: 990px) {
  .o-hero--has-video[data-image-pos=full][data-text-pos=center] {
    --columns: [full-start image-start content-start] 1fr [video-start]
      1fr [video-end image-end content-end full-end];
  }
}
.o-hero .u-text-center {
  --text-alignment: center;
}
.o-hero .u-text-right {
  --text-alignment: end;
}
@media screen and (min-width: 990px) {
  .o-hero__size--small {
    --min-height: 25rem;
  }
  .o-hero__size--small-plus {
    --min-height: 32rem;
  }
  .o-hero__size--medium {
    --min-height: 42rem;
  }
  .o-hero__size--large {
    --min-height: 100vh;
  }
}
.o-hero__mobile-size--large .o-hero__content-inner {
  --base-padding: var(--spacing-xxl);
}
.o-hero__inner {
  position: relative;
  z-index: 1;
  min-height: var(--min-height);
  display: grid;
  grid-template-columns: var(--columns);
  grid-template-rows: var(--rows);
}
.o-hero div:has(> .o-hero__image) {
  position: relative;
}
.o-hero__image-wrapper {
  grid-area: var(--image-area);
  position: relative;
  z-index: -1;
  display: grid;
}
@media screen and (min-width: 990px) {
  .o-hero__image-wrapper {
    margin-inline: unset;
  }
}
.o-hero__image {
  position: relative;
}
.o-hero__image:not(.o-hero__image--styled) {
  height: 100%;
}
.o-hero__image:not(.o-hero__image--styled):not(.o-hero__image--full) {
  height: 18rem;
}
@media screen and (min-width: 990px) {
  .o-hero__image:not(.o-hero__image--styled):not(.o-hero__image--full) {
    height: auto;
  }
}
@media screen and (min-width: 990px) {
  .o-hero__image:not(.o-hero__image--styled) {
    height: auto;
    position: absolute;
    inset: 0;
  }
}
.o-hero__image:not(.o-hero__image--styled) img {
  position: absolute;
  inset-block: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.o-hero__image--styled {
  --styled-img-width: var(--img-mobile-width);
  --styled-img-border-width: var(--img-border-mobile-width);
  --styled-img-pos: center;
  --styled-img-padding: var(--spacing-md);
  justify-self: var(--img-pos);
  display: flex;
  align-items: center;
  justify-content: var(--styled-img-pos);
  width: 100%;
  padding: var(--styled-img-padding);
}
@media screen and (min-width: 990px) {
  .o-hero__image--styled {
    --styled-img-padding: 0 var(--spacing-xl);
    --styled-img-pos: var(--img-pos);
    --styled-img-width: var(--img-width);
    --styled-img-border-width: var(--img-border-width);
    max-width: var(--image-max-width);
  }
}
.o-hero__image--styled .o-hero__image-inner {
  transform: rotate(var(--img-rotation, 0deg));
  justify-self: var(--img-pos);
  width: var(--styled-img-width, 400px);
  max-width: 90%;
  border: var(--styled-img-border-width, 1rem) solid var(--color-white);
}
.o-hero__image--styled img {
  position: relative;
  width: 100%;
  height: auto;
  display: block;
}
.o-hero__stamp {
  max-width: var(--spacing-xxl);
  position: absolute;
  bottom: var(--spacing-sm);
  right: var(--spacing-sm);
  filter: invert(1) brightness(2);
}
.o-hero__video-trigger {
  position: relative;
  z-index: 10;
  pointer-events: none;
  grid-area: var(--video-area);
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  height: 20rem;
  padding-top: 12rem;
  max-width: var(--image-max-width);
}
@media screen and (min-width: 990px) {
  .o-hero__video-trigger {
    --first-section-padding: var(--section-top-padding);
    --base-padding: var(--spacing-xl);
    padding-top: 0;
    height: auto;
    padding-block: calc(var(--first-section-padding) + var(--base-padding)) var(--base-padding);
    padding-inline: var(--layout-site-padding);
  }
}
.o-hero__overlay {
  position: absolute;
  inset: 0;
  background: rgba(var(--color-black), 0.2);
  border-radius: var(--border-radius);
}
.o-hero__content-wrapper {
  grid-area: var(--text-area);
  isolation: isolate;
  position: relative;
  height: 100%;
  display: flex;
  justify-content: var(--text-pos);
}
.o-hero__content {
  height: 100%;
  max-width: var(--content-max-width);
  width: 100%;
  display: flex;
  justify-content: var(--content-position);
}
.o-hero__content p:first-child {
  margin-top: 0;
}
.o-hero__content p:last-child {
  margin-bottom: 0;
}
.o-hero__content-inner {
  --first-section-padding: 0px;
  --base-padding: var(--spacing-md);
  width: 100%;
  height: 100%;
  padding-block: calc(var(--first-section-padding) + var(--base-padding)) var(--base-padding);
  display: flex;
  flex-direction: column;
  justify-content: var(--text-v-pos);
  gap: var(--spacing-md);
  padding-inline: var(--layout-site-padding);
}
@media screen and (min-width: 990px) {
  .o-hero__content-inner {
    --first-section-padding: var(--section-top-padding);
    --base-padding: var(--spacing-xl);
    max-width: var(--max-width);
  }
}
.o-hero__content-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  justify-content: var(--text-alignment);
  align-items: center;
}
.o-hero .m-breadcrumbs {
  --breadcrumb-base-color: rgb(var(--color-text));
  --breadcrumb-color: rgb(var(--color-text-60));
  --breadcrumb-color-alt: rgb(var(--color-text));
  --margin-block: 0;
}
.o-hero .m-breadcrumbs__list {
  justify-content: var(--text-alignment);
}
.o-hero__background {
  opacity: var(--opacity, 1);
  grid-area: var(--bg-area);
  z-index: -1;
  background-color: rgb(var(--color-background));
  isolation: isolate;
  position: relative;
}
@media screen and (min-width: 990px) {
  .o-hero__background {
    inset: 0;
  }
}
.o-hero__background img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  mix-blend-mode: var(--blend);
}
.o-hero__image-gallery {
  display: grid;
  justify-content: center;
  margin-bottom: var(--spacing-lg);
}
.o-hero__image-gallery-inner.o-producer-images__inner {
  width: calc(100vw + var(--spacing-lg));
  padding: 0;
}
@media screen and (min-width: 1100px) {
  .o-hero__image-gallery-inner.o-producer-images__inner {
    width: calc(100vw + var(--spacing-xl));
  }
}
.o-hero__modal-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  right: 0;
  z-index: 1;
}
@media screen and (min-width: 990px) {
  .o-hero__modal-container {
    z-index: -1;
  }
}
.o-hero__modal {
  width: 100%;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  margin-left: auto;
  border-radius: var(--border-radius-24);
}
@media screen and (min-width: 990px) {
  .o-hero__modal {
    width: 50%;
  }
}
.o-hero__modal-inner {
  position: relative;
  padding: var(--spacing-md) var(--spacing-sm);
}
@media screen and (min-width: 990px) {
  .o-hero__modal-inner {
    padding: var(--spacing-lg) var(--spacing-md);
  }
}
.o-hero__modal-header {
  display: flex;
  gap: var(--spacing-md);
  align-items: flex-start;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.o-hero__modal-header-close {
  background-color: rgb(var(--color-white-rgb));
}
.o-hero__modal-info {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-md);
}
.o-hero__modal-info-item {
  display: flex;
  gap: var(--spacing-md);
  align-items: center;
}
.o-hero__modal-info-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}
@media screen and (min-width: 990px) {
  .o-hero.o-section--transparent-header.o-section--first .o-hero__modal {
    top: calc(var(--header-mid-height) + var(--header-main-height) + (100% - (var(--header-mid-height) + var(--header-main-height))) / 2);
  }
}
