/* #region Hero styles  */

.hero {
  height: 100vh;
  fill: var(--bm_white_fill);
  background: var(--bm_old_red_linear, linear-gradient(299deg, #5B0B35 11.47%, #7D003D 94.18%));
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}

.hero__logo {
  width: calc(100vw - 23px);
  max-width: 1100px;

  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  column-gap: 50px;
}

.hero__logo--years {
  fill: var(--bm_55jahre_fill);
  width: 354px;
  height: 345px;
}

.hero__logo--bultmann {
  fill: var(--bm_white_fill);
  margin: 55px 0 0 0;
  width: 358px;
  height: 120px;
}

/* #endregion hero styles */

/* #region intro styles */

.intro {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

/* intro copy styles */

.intro_copy {
  width: calc(100vw - 23px);
  max-width: 1100px;
  min-height: 600px;

  display: flex;
  flex-direction: column;
}

.intro_copy_01 {
  margin: 100px auto 0px;
}

.intro_copy_02 { 
  margin: 100px auto 100px;
}

.intro_copy h1 {
  max-width: 650px;

  font-family: "Noto Serif";
  font-size: 67px;
  font-style: normal;
  font-weight: 300;
  line-height: 67px;
}

.intro_copy p {
  max-width: 700px;
  margin: 134px 0 134px auto;

  font-family: "Noto Sans";
  font-size: 30px;
  font-style: normal;
  font-weight: 400;
  line-height: 38px;
}

/* intro grid styles */

.intro_gallery_grid {
  width: calc(100vw - 23px);
  max-width: 1100px;
  min-height: 600px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(max(300px, 100%/3), 1fr) );
  grid-template-rows: repeat(auto-fit, minmax(0, 1fr) );
  grid-auto-flow: row;
  grid-gap: 23px;
  }

  .intro_bento_01_03, .intro_bento_02, .intro_bento_04 {
    border-radius: var(--corners);
    width: 100%;
    height: 100%;
    object-position: center;
    object-fit: cover;
  }
  
.intro_bento_01_03 {
  grid-row: auto / span 2;
} 

#kitty {
  position: absolute;
  bottom: -17px;
  right: 25px;
  width: 100px;
  height: 100px;
}

/* #endregion intro styles */

/* #region jobs styles */

.jobs { 
  color: var(--bm_white_fill);
  margin: 0 0 200px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.jobs_bento_image {
  transition: all 400ms cubic-bezier(0.79,0.14,0.15,0.86);
}

.jobs_link:hover .jobs_bento_image {
  transform: scale(1.1) translateY(-18px) perspective(400px) rotate3d(1, -4, 0, 18deg);
}

.jobs_bento_actioncall {
  margin: 1.438rem;
  border-bottom: 4px solid var(--bm_background_fill);
  text-align: center;
}

.jobs_bento_illustration {
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-image: url("/assets/images/illustrations/team.svg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  mix-blend-mode: multiply;
}

.jobs_link {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.jobs_bento_careers_icon {
  width: 60%;
  fill: var(--bm_background_fill);
}

.jobs_bento_linkedin_icon {
  width: 30%;
  fill: var(--bm_background_fill);
}

.jobs_grid {
  width: calc(100vw - 23px);
  max-width: 1100px;
  height: 600px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(max(200px, 100%/4), 1fr) );
  grid-template-rows: repeat(auto-fit, minmax(0, 1fr) );
  grid-auto-flow: row;
  grid-gap: 23px;
  }
  
  .jobs_bento_main { 
    overflow: hidden;
    width: 100%;
    height: 100%;
    grid-area: span 2 / span 2;
    border-radius: var(--corners);
    background: var(--bm_accent_or_fill);
  }

  .jobs_bento_careers { 
    width: 100%;
    height: 100%;
    border-radius: var(--corners);
    background: var(--bm_accent_or_fill); 
  }

  .jobs_bento_linkedin {
    width: 100%;
    height: 100%;
    border-radius: var(--corners);
    background: #0D66C2; 
  }

/* #endregion jobs styles */

/* #region partners styles */

.partners {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;

  margin: 100px 0 200px 0;
}

/* partners copy styles */

.partners_intro {
  width: calc(100vw - 23px);
  max-width: 1100px;

  display: flex;
  flex-direction: column;
}

.partners_intro h1 {
  max-width: 470px;

  font-family: "Noto Serif";
  font-size: 67px;
  font-style: normal;
  font-weight: 300;
  line-height: 67px;
}

.partners_intro p {
  max-width: 735px;
  margin: 134px 0 134px auto;

  font-family: "Noto Sans";
  font-size: 30px;
  font-style: normal;
  font-weight: 400;
  line-height: 38px;
}

/* Partners grid styles  */

.partners_grid {
  width: calc(100vw - 23px);
  max-width: 1100px;
  min-height: 600px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(max(300px, 100%/4), 1fr) );
  grid-auto-rows: 1fr;
  grid-auto-flow: row;
  grid-gap: 23px;
}

.partners_marquee_1, .partners_headline, .partners_image, .partners_marquee_2 {
  width: 100%;
  height: 100%;
  border-radius: var(--corners);
  background: var(--bm_accent_wg_fill);

}

.partners_headline {
  display: flex;
  justify-content: center;
  align-items: center;
}

.partners_headline h3 {
  margin: 64px;
  text-align: left;
  font-family: "Noto Serif";
  font-size: 64px;
  font-style: normal;
  font-weight: 600;
  line-height: 105%; /* 67.2px */
}

.partners_image {
  object-position: center;
  object-fit: cover;
}

.partners_marquee_1, .partners_marquee_2 {
  grid-area: span 1 / span 2;
}

.partners_marquee_1 .marquee_row {
  animation-direction: reverse;
}

/* Partners marquee styles */

.marquee {
  display: flex;
	overflow: hidden;
  margin: 0;
  height: 100%;
  width: 100%;
  mask-image: linear-gradient(
  to right,
  hsl(0 0% 0% / 0),
  hsl(0 0% 0% / 1) 5%,
  hsl(0 0% 0% / 1) 95%,
  hsl(0 0% 0% / 0)  
  );
}

.marquee_item {
  flex-shrink: 0;
  height: 250px;
  width: 250px;
  margin: 0 23px;
}

.marquee_shown {
  display: flex;
  flex-shrink: 0;
}

.marquee_hidden {
  display: flex;
  flex-shrink: 0;
  overflow: visible;
  width: 0;
}

.marquee_row {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  transform-box: content-box;
  animation: marquee 120s linear infinite;
}

@keyframes marquee {
  0% { transform: translateX(0%);
  }
  100% { transform: translateX(-100%);
  }
}

/* #endregion partners styles */

/* About small styles */

.about_small {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  background: var(--bm_accent_wg_fill);
}

.about_small__copy {
  display: flex;
  flex-grow: 1;
  margin: 120px auto 0 68px;
}

.about_small__copy--headline {
  color: var(--bm_dark_fill, var(--bm_dark_fill, #242424));
  text-align: left;
  font-family: "Noto Serif";
  font-size: 68px;
  font-style: normal;
  font-weight: 300;
  line-height: 68px; /* 100% */
}

.as_bento_01_copy, .as_bento_02_copy, .as_bento_05_copy, .as_bento_08_09_copy {
  display: flex;
  flex-grow: 1;
  flex-shrink: 1;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: auto;
  padding: 23px;
  text-align: center;

  text-align: center;
  font-family: "Noto Serif";
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: 105%; 
}

.as_bento_01_copy > p {
  text-align: center;
  font-family: "Noto Serif";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 105%; 
  max-width: 250px;
  margin: 23px auto;
}

.as_bento_02_copy > p, .as_bento_05_copy > p, .as_bento_08_09_copy > p {
  text-align: center;
  font-family: "Noto Serif";
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 105%; 
  max-width: 180px;
  margin: 23px auto;
}

.as_bento_01_logo {
  margin: 0 auto 16px;
  padding: 16px;
}

/* About small grid styles */
.about_small__grid {
  width: calc(100vw - 23px);
  max-width: 1100px;
  
  min-height: 950px;

  display: grid;
  margin: 100px 0 200px 0;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(3, 1fr);
  grid-column-gap: 23px;
  grid-row-gap: 23px;
}

.as_bento_01, .as_bento_02, .as_bento_03_06, .as_bento_05, .as_bento_04_07, .as_bento_08_09 {
  border-radius: var(--corners);
  display: flex;
  flex-grow: 1;
  background: var(--bm_background_fill);
}

.as_bento_03_06, .as_bento_04_07 {
  border-radius: var(--corners);
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover;
}

.as_bento_01 {
  grid-area: 1 / 1 / 2 / 2;
}

.as_bento_02 {
  grid-area: 1 / 2 / 2 / 3;
}

.as_bento_03_06 {
  grid-area: 1 / 3 / 3 / 4;
}

.as_bento_05 {
  grid-area: 2 / 2 / 3 / 3;
}

.as_bento_04_07 {
  grid-area: 2 / 1 / 4 / 2;
}

.as_bento_08_09 {
  grid-area: 3 / 2 / 4 / 4;
  position: relative;
  overflow: hidden;
}

.gallery {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin: 200px 0;
}

/* Gallery styles */


.gallery_02 {
  width: calc(100vw - 23px);
  max-width: 1100px;
  max-height: 600px;
  display: block;
  overflow: hidden;
  border-radius: var(--corners);
}

.gallery_02 img {
  width: 100%;
  height: 100%;

  object-position: top;
  object-fit: cover;
}

.contact {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  margin: 100px 0;
}

/* Contact styles */

.contact_grid {
  width: calc(100vw - 23px);
  max-width: 1100px;

  display: grid;

  grid-template-columns: repeat(3, 1fr);
  grid-auto-rows: 1fr;

  grid-auto-flow: row;

  grid-gap: 23px;
}

.contact_bento_michaela, .contact_bento_peter, .contact_bento_header, .contact_bento_daniela, .contact_bento_rolf {
  width: 100%;
  height: 100%;
  border-radius: var(--corners);
  overflow: hidden;
  background: var(--bm_accent_wg_fill);
}

.contact_bento_michaela {
  display: flex;
  flex-direction: row;
  grid-column: span 3;
}


.contact_bento_peter {
  grid-row: span 3;

  display: flex;
  flex-direction: column;
}

.contact_bento_header {
  grid-row: span 3;

  display: flex;
  flex-direction: column;
  justify-content: space-evenly;

  background: linear-gradient(349deg, #00C7B1 33.82%, #33FFE8 148.18%);
}

.contact_bento_daniela {
  display: flex;
  flex-direction: column;
  grid-row: span 3;
}

.contact_bento_rolf {
  display: flex;
  flex-direction: row;
  grid-column: span 3;
}

/* Contact grid images */

.contact_img_michaela {
  height: 100%;
  aspect-ratio: 1 / 1;

  object-position: center;
  object-fit: cover;
}

.contact_img_peter {
  width: 100%;
  aspect-ratio: 1 / 1;
  
  object-position: center;
  object-fit: cover;
}

.contact_img_daniela {
  width: 100%;
  aspect-ratio: 1 / 1;

  object-position: center;
  object-fit: cover;
}

.contact_img_rolf {
  height: 100%;
  aspect-ratio: 1 / 1;  
  
  object-position: center;
  object-fit: cover;
}

/* Contact Grid contact infos */

/* outline the contact divs */

/* .contact * {
  outline: 2px solid lime;
} */

.contact_row {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 23px;
}

.contact_column {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 1;
  padding: 23px;
}

.contact_row_02 {
  display: flex;
  justify-content: end;
  align-items: end;
}

.contact_column_02 {
  display: flex;
  justify-content: end;
  align-items: flex-start;
}

.contact_name {
  display: block;

  /* Text Headline Card */
  font-family: "Noto Serif";
  font-size: 34px;
  font-style: normal;
  font-weight: 300;
  line-height: 34px;
}

.contact_line {
  padding: 0 0 23px 0;
  margin: 0 0 23px 0;
  border-bottom: 4px solid var(--bm_background_fill);
}

.contact_title {
  display: flex;
  justify-content: flex-start;
  font-family: "Noto Serif";
  font-size: 24px;
  font-style: normal;
  font-weight: 300;
  line-height: 34px; 
}

.contact_infos {
  display: flex;
  flex-direction: column;
  align-items: end;
  

  font-family: "Khand", sans-serif;
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.contact_infos a {
  margin-bottom: 4px;
}

.contact_infos svg {
  height: 32px;
}

.contact_tel {
  text-align: right;
  font-family: "Khand", sans-serif;
  font-size: 32px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.contact_illu {
  border-radius: var(--corners);
  /* width: 352px; */
  height: 100%;


}

.contact_illu {
  height: 50vw;
  background-image: url("/assets/images/illustrations/phone.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  mix-blend-mode: multiply;
}

.contact_bento_header h5 {
  text-align: center;
  font-size: clamp(1.5rem, 4rem, 5rem);
  color: var(--bm_white_fill);
}


/* Gallery 3x styles */

.gallery_grid {
  width: calc(100vw - 23px);
  max-width: 1100px;
  height: 600px;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(max(300px, 100%/4), 1fr) );
  grid-template-rows: repeat(auto-fit, minmax(0, 1fr) );
  grid-gap: 23px;
}

.bento_01_02, .bento_03_06, .bento_04, .bento_05 {
  border-radius: var(--corners);
  width: 100%;
  height: 100%;
  object-position: center;
  object-fit: cover;
}

.bento_01_02 {
  grid-area: span 1 / span 2;
}

.bento_03_06 {
  grid-area: span 2 / span 1;
}

/* Call to action styles */

.cta {
  margin: 100px auto 200px;
  color: var(--bm_white_fill);
  
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}

.cta_subline {
  margin-top: 48px;
  font-size: 38px;
}

.cta_card {
  width: calc(100vw - 23px);
  max-width: 1100px;

  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items: stretch;
  border-radius: var(--corners);

}

.cta_text {
  margin-top: 117px;
}

.cta_links {
  height: 234px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  text-align: center;
}

.cta_link {
  text-align: center;
  font-family: "Noto Sans";
  font-size: 26px;
  font-style: normal;
  font-weight: 500;
  line-height: 102%; 
}