/*
Theme Name: Concept49
Description: Concept49
Author: Concept49
Version: 1.0
*/


@font-face {
  font-family: "Aldrich";
  src: url("../fonts/Aldrich-Regular.woff2") format("woff2"), url("../fonts/Aldrich-Regular.woff") format("woff"),;
  font-weight: normal;
  font-style: normal;
}
.logo_col {
  z-index: -2;
}
.open {
  min-height: 600px;
}

.list-reset {
  padding: 0;
  margin: 0;
  list-style-type: none;
}

a {
  text-decoration: none; /* Entfernt die Unterstreichung */
  color: inherit; /* Übernimmt die Textfarbe vom umgebenden Element */
}

h3 {
  text-transform: uppercase;
  font-weight: 800;
}

body {
  font-family: "Aldrich", sans-serif;
  color: white;
  background-color: black;
}

.nav {
  padding: 25px 0;
}

.nav_item span {
  position: relative;
}

.nav_item span::before {
  content: ""; /* Псевдо-элемент не отображает текст */
  position: absolute;
  bottom: 0;
  width: 0; /* Начальная ширина - 0 */
  height: 2px; /* Толщина подчеркивания */
  background-color: #ffffff; /* Цвет подчеркивания */
  transition: width 0.3s ease; /* Плавное расширение подчеркивания */
}

.nav_item span:hover::before {
  width: 100%; /* При наведении подчеркивание растягивается на всю ширину ссылки */
}

.main_logo {
  max-width: 400px;
}

.family_image {
  max-width: 100%;
}

.circle {
  margin: 0 auto;
  display: block;
  overflow: visible;
  width: 200px;
  font-size: 17px;
  fill: white;
  animation: rotate 10s linear infinite;
}

.circle path {
  fill: none;
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.vertical-hr {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  width: 2px;
  height: 100%;
  background-color: white;
  border: none;
  opacity: unset;
}

.section_title {
  padding: 25px 0;
}

.why_image_wrapper {
  position: relative;
  max-width: 300px;
}

.why_image,
.dienstleistungen_img {
  max-width: 300px;
}

.produkte_img {
  max-height: 300px;
}

.dienstleistungen_img-wrapper {
  position: relative; /* Необходимо, чтобы псевдоэлементы правильно позиционировались */
  display: inline-block;
}

/* Верхняя правая линия */
.dienstleistungen_img-wrapper::before {
  content: "";
  position: absolute;
  top: 5px;
  right: 0px;
  width: 305px;
  height: 3px;
  background: white;
}

/* Левая верхняя линия */
.dienstleistungen_img-wrapper::after {
  content: "";
  position: absolute;
  top: -5px;
  left: 5px;
  width: 3px;
  height: 305px;
  background: white;
}

.why_image_wrapper::after {
  content: "";
  position: absolute;
  top: -10px; /* Сдвиг вверх */
  right: -10px; /* Сдвиг вправо */
  width: 100%;
  height: 100%;
  border: 3px solid white; /* Белая рамка */
  z-index: -1; /* Отправляем рамку за картинку */
}

.why_text_wrapper,
.dienstleistungen_text_wrapper {
  margin-top: 25px;
  padding-right: 50px;
  margin-bottom: 25px;
}

.horizontal-short-hr {
  height: 2px;
  background-color: white;
  opacity: unset;
  width: 50%;
}

.horizontal-long-hr {
  height: 2px;
  width: 100%;
  background-color: white;
  opacity: unset;
  margin: 45px 0;
}

.circle_col {
  position: absolute;
}
.circle {
  position: relative;
  left: -50px;
  top: 360px;
}
.family_col {
  position: absolute;
}
.family_image_wrapper {
  position: relative;
  left: 320px;
  bottom: 15px;
  z-index: -1;
}
.kind {
  margin-bottom: 25px;
}
.produkt {
  margin-bottom: 25px;
}
.footer {
  margin-bottom: 35px;
}

.footer_logo {
  max-width: 200px;
}

.location {
  padding: 15px 0;
  text-decoration: underline;
}

.phone {
  padding: 15px 0;
  text-decoration: underline;
}

.phone-list, .location-list {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

@media (max-width: 992px) {
  .phone-list {
    height: 100%;
  }

  .produkte_img {
    max-width: 200px;
  }
  .footer_logo {
    margin: 15px;
  }
  .open {
    min-height: 400px;
  }

  .family_image_wrapper {
    position: static;
    margin-top: -25px;
  }
  .circle {
    position: static;
    width: 150px;
    margin-top: -50px;
    margin-bottom: 25px;
  }
  .circle_col {
    order: 2;
    position: static;
  }
  .family_col {
    position: static;
  }
  .main_logo {
    max-width: 300px;
  }
  .why_image,
  .dienstleistungen_img {
    max-width: 200px;
  }
  .why_image_wrapper {
    max-width: 200px;
  }
  .why_image_wrapper::after {
    content: "";
    position: absolute;
    top: -10px; /* Сдвиг вверх */
    right: -10px; /* Сдвиг вправо */
    width: 100%;
    height: 100%;
    border: 3 px solid white; /* Белая рамка */
    z-index: -1; /* Отправляем рамку за картинку */
  }
  /* Верхняя правая линия */
  .dienstleistungen_img-wrapper::before {
    content: "";
    position: absolute;
    top: 5px;
    right: 0px;
    width: 205px;
    height: 3px;
    background: white;
  }

  /* Левая верхняя линия */
  .dienstleistungen_img-wrapper::after {
    content: "";
    position: absolute;
    top: -5px;
    left: 5px;
    width: 3px;
    height: 205px;
    background: white;
  }
}