/*
 * DO NOT EDIT THIS FILE.
 * It's generated automatically by 'yarn build' command.
 * @preserve
 */

.o-mosaic {
  color: var(--color-primary-white);
}

.o-mosaic [data-contextual-id] {
  display: none;
}

.o-mosaic__container {
  position: relative;
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(3, 1fr);
  aspect-ratio: 1;
}

.o-mosaic__container::after {
  position: relative;
  z-index: 2;
  grid-row: 1;
  grid-column: 1 / -1;
  content: '';
  pointer-events: none;
  background-image: url('./borders.svg');
  background-size: cover;
  aspect-ratio: 1 / 1;
}

.p-page--in-white .o-mosaic__container::after {
  filter: invert(100%);
}

.o-mosaic__first {
  grid-row: 1;
  grid-column: 1 / 3;
}

.o-mosaic__second {
  overflow: hidden;
  grid-row: 1;
  grid-column: 2 / -1;
  aspect-ratio: 2 / 2;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 100%, 50% 50%, 0 50%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 100%, 50% 50%, 0 50%);
}

.o-mosaic__third {
  grid-row: 1;
  grid-column: 1;
  aspect-ratio: 1 / 1;
  align-self: flex-end;
}

.o-mosaic__fourth {
  grid-row: 1;
  grid-column: 3;
  align-self: flex-end;
  justify-self: flex-end;
  aspect-ratio: 1 / 1;
}

.o-mosaic__section > .paragraph,
.o-mosaic__section > .paragraph > .m-teaser__media,
.o-mosaic__section > .paragraph > .m-teaser__media *,
.o-mosaic__section > .paragraph > .o-paragraph__content,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser__media,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser__media *,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media
  *,
.o-mosaic__section > .paragraph > .m-teaser,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media *,
.o-mosaic__section > .m-teaser,
.o-mosaic__section > .m-teaser > .m-teaser__media,
.o-mosaic__section > .m-teaser > .m-teaser__media * {
  width: 100%;
  height: 100%;
}

.o-mosaic__section > .paragraph img,
.o-mosaic__section > .paragraph video,
.o-mosaic__section > .paragraph > .m-teaser__media img,
.o-mosaic__section > .paragraph > .m-teaser__media video,
.o-mosaic__section > .paragraph > .m-teaser__media * img,
.o-mosaic__section > .paragraph > .m-teaser__media * video,
.o-mosaic__section > .paragraph > .o-paragraph__content img,
.o-mosaic__section > .paragraph > .o-paragraph__content video,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser__media img,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser__media
  video,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser__media
  *
  img,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser__media
  *
  video,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser img,
.o-mosaic__section > .paragraph > .o-paragraph__content > .m-teaser video,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media
  img,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media
  video,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media
  *
  img,
.o-mosaic__section
  > .paragraph
  > .o-paragraph__content
  > .m-teaser
  > .m-teaser__media
  *
  video,
.o-mosaic__section > .paragraph > .m-teaser img,
.o-mosaic__section > .paragraph > .m-teaser video,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media img,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media video,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media * img,
.o-mosaic__section > .paragraph > .m-teaser > .m-teaser__media * video,
.o-mosaic__section > .m-teaser img,
.o-mosaic__section > .m-teaser video,
.o-mosaic__section > .m-teaser > .m-teaser__media img,
.o-mosaic__section > .m-teaser > .m-teaser__media video,
.o-mosaic__section > .m-teaser > .m-teaser__media * img,
.o-mosaic__section > .m-teaser > .m-teaser__media * video {
  max-width: none;
  object-fit: cover;
}