:root {
  --v-maxwidth: 1250px;
  /* var(--v-maxwidth); */
  /* var(); */

  --v-standard-margin: 2.5rem;
  /* var(--v-standard-margin); */

  --v-omw-card-margin: 2.5rem;
  /* var(--v-omw-card-margin); */

  /* Spezielles Padding Anfang */
  --pt-omw-special-minimal: 0rem;
  --pt-omw-special-variable: (-1.56rem + 7.8vw);
  --pt-omw-special-maximal: 7.8rem;
  /* Spezielles Padding Ende */

  /* Footer Margin Top Anfang */
  --mt-footer-minimal: 6.25rem;
  --mt-footer-variable: (4.375rem + 9.375vw);
  --mt-footer-maximal: 15.625rem;
  /* Spezielles Padding Ende */
}

/* Grid Template Areas definieren */
.omw-gat {
  display: grid;
  grid-template-areas: none;
  grid-auto-columns: auto;
  gap: 1.25rem;
  margin: 1.25rem auto;
  max-width: var(--v-maxwidth);
}

/* Grid Template Areas Bildzugehörigkeit definieren */
.omw-gat-item {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 620 / 350;
}

@media screen and (min-width: 768px) {
  .omw-gat {
    grid-template-areas:
      "img1 img1 img1 img2 img2 img2"
      "img3 img3 img4 img4 img5 img5";
    gap: 2.5rem;
    margin: auto;
    margin-top: var(--v-standard-margin);
    margin-bottom: var(--v-standard-margin);
  }

  .omw-gat-item.img1 {
    grid-area: img1;
  }

  .omw-gat-item.img2 {
    grid-area: img2;
  }

  .omw-gat-item.img3 {
    grid-area: img3;
  }

  .omw-gat-item.img4 {
    grid-area: img4;
  }

  .omw-gat-item.img5 {
    grid-area: img5;
  }
}

/* --- */
.omw-fsb {
  display: flex;
  justify-content: space-between;
}

.omw-fsb > article {
  flex: 1 0 50%;
  padding-right: 2.5rem;
}

.omw-fsb > article ~ div {
  flex: 0 0 400px;
}

article {
  margin: 0;
}

section {
  margin-bottom: 2.5rem;
}

/* --- Standard Image/Text-Boxen / Bild links, Text rechts --- */
.omw-card {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--v-maxwidth);
  margin: 2.5rem auto;
  align-items: center;
  gap: 0 2.5rem;
}

/* Tablet-Ansicht */
@media screen and (min-width: 768px) {
  .omw-card {
    margin: auto;
    margin-top: var(--v-standard-margin);
    margin-bottom: var(--v-standard-margin);
    gap: 0 3.125rem;
  }
}

/* Desktop-Ansicht */
@media screen and (min-width: 1260px) {
  .omw-card {
    margin: auto;
    margin-top: var(--v-standard-margin);
    margin-bottom: var(--v-standard-margin);
    gap: 0 6.25rem;
  }
}

/* --- Bild auf der anderen Seite / Text links, Bild rechts --- */
.omw-card.omw-reverse,
.omw-card:nth-of-type(even) {
  flex-direction: row-reverse;
}

.omw-card.omw-reverse .content-text,
.omw-card:nth-of-type(even) .content-text,
.omw-card.omw-reverse .content-subhead-red-frkout,
.omw-card:nth-of-type(even) .content-subhead-red-frkout {
  text-align: right;
}

.omw-image {
  flex: 1 1 384px; /* mindestens benötigte Weite auf Smartphones */
  /* aspect-ratio: 1 / 1; */ /* Quadratische Bilder, wer es mag */
  position: relative;
}

.omw-image img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

.omw-image .omw-image-title,
.omw-image .omw-image-copyright {
  background: rgba(255, 255, 255, 0.5);
  position: absolute;
  padding: 0.5rem;
  color: rgba(0, 0, 0, 0.5);
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

.omw-image .omw-image-title {
  top: 0;
  left: 0;
  border-radius: 0 0 0.5rem 0;
  opacity: 0;
}

.omw-image .omw-image-copyright {
  bottom: 0;
  right: 0;
  border-radius: 0.5rem 0 0 0;
  opacity: 0.5;
}

.omw-image:hover .omw-image-title,
.omw-image:hover .omw-image-copyright {
  opacity: 1;
}

.omw-content {
  flex: 1 1 384px; /* mindestens benötigte Weite auf Smartphones - nicht gebunden an Bildangabe */
}

/* --- Standard Image/Text-Boxen / Bild links, Text rechts --- */
/* --- ENDE --- */

/* --- Standard News-Boxen / Bild oben, Anreissertext unten - dreispaltig --- */
.omw-news-card {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--v-maxwidth);
  margin: 2.5rem auto;
  align-items: center;
  gap: 0 2.5rem;

  justify-content: space-between;
}

.omw-news-card .omw-card {
  display: flex;
  flex-wrap: wrap;
  flex: 1 1 384px;
  max-width: auto;
  margin: 0 auto 2.5rem;
  align-items: center;
  gap: 0 2.5rem;
  flex-direction: column;
  position: relative;
}

.omw-news-card .omw-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 1 / 1;
}

.omw-news-card .omw-content {
  flex: 1 1 auto;
}

.omw-news-card .omw-content .content-text {
  margin: 15px 0 30px;
}

.omw-news-card .omw-content a.pure-button {
  position: absolute;
  bottom: -1.5rem;
  left: -1px;
  border-radius: 0 5px 5px 5px;
}
/* --- Standard News-Boxen / Bild oben, Anreissertext unten - dreispaltig --- */
/* --- ENDE --- */

/* --- Einfache Titel-Bild-Link-Boxen - dreispaltig --- */
.omw-image-cards {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-content: space-between;
  gap: 1rem;
}

.omw-image-card {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  width: auto;
}

.omw-image-card > img {
  object-fit: cover;
  max-height: 305px;
  aspect-ratio: 3 / 4;
  margin: 1rem 0;
}

.omw-image-card a {
  width: fit-content;
  padding: 0.5rem 2rem;
  border-radius: 0;
}

.omw-uppercut {
  text-transform: uppercase;
}

.omw-special-spacing {
  padding: 0;
  padding-top: var(--pt-omw-special-minimal);
  padding-top: clamp(
    var(--pt-omw-special-minimal),
    var(--pt-omw-special-variable),
    var(--pt-omw-special-maximal)
  );
  @supports not (
    margin-top:
      clamp(
        var(--pt-omw-special-minimal),
        var(--pt-omw-special-variable),
        var(--pt-omw-special-maximal)
      )
  ) {
    padding-top: min(
      max(var(--pt-omw-special-minimal), var(--pt-omw-special-variable)),
      var(--pt-omw-special-maximal)
    );
  }
  padding-bottom: 0.5rem;
}
/* --- Einfache Titel-Bild-Link-Boxen - dreispaltig --- */
/* --- ENDE --- */

/* --- An die News-Boxen angelehnte Referenz-Boxen / Bild oben, Anreissertext unten - zweispaltig --- */
.omw-reference-card {
  display: flex;
  flex-wrap: wrap;
  max-width: var(--v-maxwidth);
  margin: 2.5rem auto;
  align-items: flex-start;
  gap: 0 2.5rem;
  justify-content: space-between;
}

.omw-reference-card .omw-card {
  display: flex;
  flex-wrap: wrap;
  flex: 1 1 575px;
  max-width: auto;
  margin: 0 auto 2.5rem;
  align-items: center;
  gap: 0 2.5rem;
}

.omw-reference-card .omw-card {
  display: flex;
  flex-direction: column;
  position: relative;
}

.omw-reference-card .omw-image {
  z-index: 1;
}

.omw-reference-card .omw-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  aspect-ratio: 575 / 360;
}

.omw-reference-card .omw-content {
  flex: 1 1 auto;
  /* margin-top: -2.625rem; */
  margin-top: -2.5625rem;
  z-index: 2;
}

.omw-reference-card .omw-content .content-header {
  display: flex;
  justify-content: center;
}

.omw-reference-card .omw-content .content-header .content-inner-header {
  text-align: center;
  min-width: 367px;
  width: auto;
  background-color: rgba(196, 196, 196, 0.9);
}

.omw-reference-card .content-header .content-toggle {
  /* display: grid; */
  display: none;
  grid-template-areas: "toggle";
  cursor: pointer;
  padding: 10px 10px;
}

/* Transition Part 1 */
.omw-reference-card .content-header .content-toggle span {
  grid-area: toggle;
  transition: opacity 600ms ease-out;
}

.omw-reference-card .content-header .content-toggle span:nth-of-type(1) {
  opacity: 1;
}

.omw-reference-card .content-header .content-toggle span:nth-of-type(2) {
  opacity: 0;
}

/* .omw-reference-card
  .omw-content:is(:hover, :focus, :active)
  .content-header
  .content-toggle
  span:nth-of-type(1) {
  opacity: 0;
}

.omw-reference-card
  .omw-content:is(:hover, :focus, :active)
  .content-header
  .content-toggle
  span:nth-of-type(2) {
  opacity: 1;
} */

.omw-reference-card .omw-content .content-header h2 {
  text-align: center;
  padding: 10px 10px 0;
}

.omw-reference-card .omw-content a.pure-button {
  position: absolute;
  bottom: -1rem;
  left: -1px;
  border-radius: 0 5px 5px 5px;
}

/* Transition Part 2 */
.omw-reference-card .omw-content .content-text {
  display: none;
  background-color: rgba(247, 219, 220, 1);
  opacity: 0;
  height: 0;
  padding: 0 1.25rem;
  margin: 0;
  line-height: 0;
  transition: opacity 600ms ease-out, height 600ms ease-out,
    padding 600ms ease-out, line-height 600ms ease-out;
}

.omw-reference-card .omw-content .content-text p {
  margin: 0;
}

.omw-reference-card .omw-content:is(:hover, :focus, :active) .content-text {
  opacity: 1;
  height: 100%;
  padding: 1.25rem 1.25rem;
  line-height: inherit;
}

/* Unterseite Über uns Chronikboxen */
.omw-chronics {
  display: flex;
  justify-content: space-between;
  gap: 3vw 7vw;
}

.omw-chronics article {
  flex: 1 1 320px;
}

/* Unterseite Über uns Teambilder */
.omw-team-card {
}

.omw-team-card .omw-card {
  gap: 0 3.75rem;
  margin: 3.75rem 0 0;
}

.omw-team-card .omw-image {
  flex: 0 0 270px;
}

.omw-team-card .omw-image img {
 /* box-shadow: 3px 3px 3px 1px rgb(184, 184, 184);*/
  object-fit: contain;
}


/* Unterseite Über uns Stellenangebote */
.omw-career-card {
}

.omw-career-card .omw-card {
}

.omw-career-card .omw-image {
}

.omw-career-card .omw-image img {
}

/* Unterseite Über uns Zertifikate */
.omw-cartificates {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  width: 100%;
}

.omw-cartificates > div {
  flex: 0 1 auto;
  margin: 0;
  width: auto;
}

@media screen and (max-width: 1023px) {
  .omw-cartificates {
    justify-content: space-evenly;
  }

  .omw-cartificates > div {
    margin: 0 auto;
  }
}

.omw-cartificates .seal-box {
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.omw-cartificates .long-button {
  font-family: "Roboto", normal;
  font-weight: 400;
  font-size: 18px;
  margin: 10px 0;
}

.omw-cartificates .pure-img-responsive {
  margin: 10px 0;
}

.omw-cartificates ul {
  padding: 0;
}

.omw-cartificates ul > li {
  list-style-type: none;
  list-style-position: inside;
}

.omw-cartificates ul > li a {
  text-decoration: none;
  color: var(--v-standard-dunkelgrau);
}

.omw-same-card {
  font-family: "Roboto", normal;
  font-weight: 300;
  /* font-size: 1.875rem; */
  line-height: 160%;
  font-style: normal;
  font-size: 18px;
  gap: 2.5rem;
}

.omw-same-card :is(div, span, a) {
  color: var(--v-standard-dunkelgrau);
  text-decoration: none;
}

.omw-same {
  flex: 1 1 auto;
}

.omw-same .content-subhead {
  margin-bottom: 1.125rem;
}

/* Leaflet Map */
#map {
  width: 100%;
  height: auto;
  min-height: 260px;
  aspect-ratio: 9 / 3;
}

main.impressum,
main.datenschutz {
  top: initial;
  margin-top: 6.25rem;
}

.content-center.pure-g.references-header {
  text-align: center;
}

/* Footer Rebuild Beginn */
footer {
  background-image: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.66) 0%,
      rgba(255, 255, 255, 0.66) 100%
    ),
    url("../../public/images/footer_texture-background.webp");

  margin-top: var(--mt-footer-minimal);
  margin-top: clamp(
    var(--mt-footer-minimal),
    var(--mt-footer-variable),
    var(--mt-footer-maximal)
  );
  @supports not (
    margin-top:
      clamp(
        var(--mt-footer-minimal),
        var(--mt-footer-variable),
        var(--mt-footer-maximal)
      )
  ) {
    margin-top: min(
      max(var(--pt-omw-special-minimal), var(--mt-footer-variable)),
      var(--mt-footer-maximal)
    );
  }
}

footer > div {
  display: grid;
  grid-template-areas: none;
  grid-auto-columns: auto;
  gap: 1.25rem;
  margin: 1.25rem auto;
  max-width: var(--v-maxwidth);
}

.content-wrapper footer > div.content-center {
  margin: 0 auto;
  padding: 0;
}

footer section:nth-of-type(1) .content-subhead {
  font-family: "Roboto", normal;
  font-weight: 700;
  /* font-size: 1.75rem; */
  line-height: inherit;
}

footer section:nth-of-type(1),
footer section:nth-of-type(2) {
  margin: 2.1rem 0;
}

footer section:nth-of-type(4) {
  margin: 3rem 0 0;
}

footer section:nth-of-type(1) .content-subhead:nth-of-type(1) {
  color: var(--v-standard-rot);
}

footer section:nth-of-type(1).content-subhead:nth-of-type(2) {
  color: var(--v-standard-dunkelgrau);
}

footer section:nth-of-type(3) {
  display: grid;
}

footer section:nth-of-type(3) img {
  height: 40px;
}

footer section :where(a:not(.superuser), nav) {
  text-transform: uppercase;
  text-decoration: none;
  color: var(--v-standard-dunkelgrau);
}

footer section address {
  font-style: normal;
}

footer section address .footer-address-font a,
footer section a.superuser {
  text-decoration: none;
  color: var(--v-standard-dunkelgrau);
}

footer section nav,
footer .footer-legal-font {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  gap: 1.25rem;
  margin-top: 1.25rem;
  color: var(--v-standard-dunkelgrau);
}

footer .footer-legal-font {
  gap: 0;
}

footer address dd:before {
  display: grid;
  margin-right: 10px;
}

footer address dd:nth-of-type(1):before {
  /* content: url("/assets/logos/standort.svg"); */
  content: url("/assets/logos/footer_map.svg");
}

footer address dd:nth-of-type(2):before {
  /* content: url("/assets/logos/telefon_footer.svg"); */
  content: url("/assets/logos/footer_phone.svg");
}

footer address dd:nth-of-type(3):before {
  /* content: url("/assets/logos/Fax.svg"); */
  content: url("/assets/logos/footer_fax.svg");
}

footer address dd:nth-of-type(4):before {
  /* content: url("/assets/logos/email_footer.svg"); */
  content: url("/assets/logos/footer_email.svg");
}

footer address dd:nth-of-type(5):before {
  content: url("/assets/logos/footer_instagram.svg");
}

footer address .footer-address-font {
  display: flex;
  align-items: center;
  margin: 0.625rem 0;
  color: var(--v-standard-dunkelgrau);
}

footer address dd::before {
  transform: translateY(-10%) scale(80%);
}

/* 768px */
@media screen and (min-width: 768px) {
  footer > div {
    grid-template-areas:
      "solutions solutions contact"
      "logo logo address"
      "copyright copyright links";
    gap: 2.5rem;
    margin: auto;
    margin-top: var(--v-standard-margin);
    margin-bottom: var(--v-standard-margin);
  }

  footer section {
    margin-top: 0;
    margin-bottom: 0;
  }

  footer section:nth-of-type(1) {
    grid-area: solutions;
  }

  footer section:nth-of-type(1) .content-subhead {
    /* font-size: 1.5rem; */
  }

  footer section:nth-of-type(2) {
    grid-area: contact;
    display: flex;
    align-self: center;
  }

  footer section:nth-of-type(3) {
    grid-area: logo;
  }

  footer section:nth-of-type(4) {
    grid-area: address;
  }

  footer section:nth-of-type(5) {
    grid-area: copyright;
  }

  footer section:nth-of-type(6) {
    grid-area: links;
  }

  footer section nav,
  footer .footer-legal-font {
    flex-direction: initial;
    gap: 0 1.25rem;
    align-items: flex-end;
  }

  footer .super .footer-legal-font {
    gap: 0;
  }
}

/* 1024px */
@media screen and (min-width: 1024px) {
  footer section:nth-of-type(1) .content-subhead {
    /* font-size: 2.5rem; */
  }
}

/* 1260px */
@media screen and (min-width: 1260px) {
  footer {
    background-image: radial-gradient(
        at 68% 23%,
        rgba(255, 0, 0, 0.125) 5%,
        rgba(255, 255, 255, 0) 25%
      ),
      linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.5) 43%,
        rgba(200, 15, 20, 1) 43%,
        rgba(200, 15, 20, 1) 44%,
        rgba(255, 255, 255, 0) 44%,
        rgba(255, 255, 255, 0) 45%,
        rgba(255, 255, 255, 0.75) 45%
      ),
      url("../../public/images/footer_texture-background.webp");
    background-position: center top;
    background-repeat: no-repeat;
  }

  footer section:nth-of-type(1) .content-subhead {
    /* font-size: 3.125rem; */
  }

  footer section:nth-of-type(1) {
    margin: 4.2rem 0;
  }

  footer section:nth-of-type(3) {
    margin: 4.2rem 0 0;
  }

  footer section:nth-of-type(3) img {
    height: 52px;
  }

  footer address dd::before {
    transition-property: transform;
    transition-duration: 500ms;
    transition-timing-function: ease-out;
    transform: translateY(-10%) scale(80%);
  }

  footer address dd:is(:active, :hover, :focus)::before {
    transform: translateY(-5%) scale(90%);
  }
}

/* Grid Template Areas Bildzugehörigkeit definieren */
.omw-gat-item {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 620 / 350;
}

@media screen and (max-width: 767px) {
  .content-wrapper footer > div.content-center {
    display: flex;
    flex-direction: column;
  }

  footer section:nth-of-type(2) {
    margin-top: 0;
    margin-bottom: 4.2rem;
  }

  footer section:nth-of-type(3) {
    background: rgba(180, 180, 180, 0.25);
    margin: 0 -1.25rem;
    padding: 2.5rem 1.25rem;
  }

  footer section:nth-of-type(5) {
    order: 1;
  }
}

@media screen and (min-width: 768px) and (max-width: 1259px) {
  footer section:nth-of-type(3),
  footer section:nth-of-type(4) {
    background: rgba(180, 180, 180, 0.25);
    margin: 0 -1.25rem;
    padding: 2.5rem 1.25rem;
  }
}

/* Footer Rebuild End */

/* Header Sidebar Rebuild Anfang */
.omw-button-header-reference {
  position: relative;
}

.omw-header-button {
  position: absolute;
  right: 0;
  top: 6.25rem;
  top: clamp(6.25rem, 5rem + 6.25vw, 12.5rem);
  @supports not (top: clamp(6.25rem, 5rem + 6.25vw, 12.5rem)) {
    top: min(max(6.25rem, 5rem + 6.25vw), 12.5rem);
  }
  width: auto;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.omw-header-button a {
  display: flex;
  width: auto;
  align-items: center;
  justify-content: flex-end;
  color: var(--v-standard-weiss);
  text-decoration: none;
  font-family: Roboto, normal;
  font-weight: 400;
  font-size: var(--f-header-buttons-minimal);
  font-size: clamp(
    var(--f-header-buttons-minimal),
    var(--f-header-buttons-variable),
    var(--f-header-buttons-maximal)
  );
  @supports not (
    font-size:
      clamp(
        var(--f-header-buttons-minimal),
        var(--f-header-buttons-variable),
        var(--f-header-buttons-maximal)
      )
  ) {
    font-size: min(
      max(var(--f-header-buttons-minimal), var(--f-header-buttons-variable)),
      var(--f-header-buttons-maximal)
    );
  }
}

.omw-header-button a > div {
  background: var(--v-standard-rot);
  padding: 1.25rem;
}

.omw-header-button a > div:nth-of-type(2) {
  display: none;
  background: var(--v-standard-rot);
  align-self: stretch;
  align-items: center;
  padding: 1.25rem;
  width: 0;
}

.omw-header-button a:hover > div:nth-of-type(2) {
  display: flex;
  width: auto;
}

.omw-header-button .omw-image {
  max-width: 1.75rem;
  max-width: clamp(1.75rem, 1.6rem + 0.75vw, 2.5rem);
  @supports not (max-width: clamp(1.75rem, 1.6rem + 0.75vw, 2.5rem)) {
    max-width: min(max(1.75rem, 1.6rem + 0.75vw), 2.5rem);
  }

  aspect-ratio: 1 / 1;
}

.omw-header-button .omw-btn:nth-of-type(2) .omw-image {
  filter: brightness(0) invert(1);
}

/* Page Leistungen Serviceleistung Rebuild Anfang */
.omw-service-cards {
  display: flex;
  flex-wrap: wrap;
  align-content: space-between;
  justify-content: space-between;
  max-width: 1250px;
  margin: 0 auto;
  gap: 1.25rem 3.125rem;
  gap: clamp(1.25rem, 1rem + 1.25vw, 2.5rem)
    clamp(3.125rem, 2.25rem + 4.375vw, 7.5rem);
}

.omw-service-cards .omw-service-card {
  flex: 1 1 320px;
}
/* Page Leistungen Serviceleistung Rebuild Ende */

/* Page Leistungen Balcony Anfang */

:is(.omw-stairway-cards, .omw-carports-cards, .omw-balcony-cards, .omw-news-cards, .omw-infothek-cards)
  .omw-card {
  /* align-items: flex-start; */
  align-items: center;
  gap: 2.5rem 6.25rem;
}

:is(.omw-stairway-cards, .omw-carports-cards, .omw-balcony-cards, .omw-news-cards, .omw-infothek-cards)
  .content-subhead-red {
  margin-top: 0;
}
/* Page Leistungen Balcony Ende */

.pure-menu-list a {
  text-transform: uppercase;
}

.omw-partnerbox {
  display: block;
  /* flex-wrap: wrap;
  flex: 0 1 auto;
  gap: 2rem;
  align-content: stretch; */
  width: 100%;
  margin-bottom: 2rem;
}

.omw-partnerbox > div:nth-of-type(1) {
  font-weight: bold;
  /* flex: 0 1 auto; */
  margin-bottom: 0.25rem;
}

.omw-partnerbox > div:nth-of-type(2) {
  /* flex: 1 1 auto; */
}
