:root {
  --accent-color: #e94e26;
  --secondary-color: #ffa76d;
  --eyebrow-color: #a81d05;
  --background-dg-color: #535353;
  --background-lg-color: #f0ecec;
  --background-btn-lg-color: #f0f0f0;
  --text-color: #000;
  --headline-color: #121212;
  --step--2: clamp(0.7813rem, 0.7747rem + 0.0326vw, 0.8rem);
  --step--1: clamp(0.9375rem, 0.9158rem + 0.1087vw, 1rem);
  --step-0: clamp(1.125rem, 1.0815rem + 0.2174vw, 1.25rem);
  --step-1: clamp(1.35rem, 1.2761rem + 0.3696vw, 1.5625rem);
  --step-2: clamp(1.62rem, 1.5041rem + 0.5793vw, 1.9531rem);
  --step-3: clamp(1.944rem, 1.771rem + 0.8651vw, 2.4414rem);
  --step-4: clamp(2.3328rem, 2.0827rem + 1.2504vw, 3.0518rem);
  --step-5: clamp(2.7994rem, 2.4462rem + 1.7658vw, 3.8147rem);
}
/* Fonts */
body {
  font-size: calc(15px + 0.5vw);
  line-height: calc(22px + 0.7vw);
  overflow-x: hidden;
}
@font-face {
  font-family: "Visby Light";
  src: url("/assets/fonts/visby/VisbyLight.ttf") format("truetype");
}
@font-face {
  font-family: "Visby Regular";
  src: url("/assets/fonts/visby/VisbyRegular.ttf") format("truetype");
}
@font-face {
  font-family: "Visby Medium";
  src: url("/assets/fonts/visby/VisbyMedium.ttf") format("truetype");
}
@font-face {
  font-family: "Visby SemiBold";
  src: url("/assets/fonts/visby/VisbySemibold.ttf") format("truetype");
}
@font-face {
  font-family: "Visby Bold";
  src: url("/assets/fonts/visby/VisbyBold.ttf") format("truetype");
}
@font-face {
  font-family: "Visby Heavy";
  src: url("/assets/fonts/visby/VisbyHeavy.ttf") format("truetype");
}
h1,
h2 {
  font-family: Visby Heavy, sans-serif;
  font-size: 2.9rem !important;
  line-height: 130%;
  color: var(--accent-color);
}
@media all and (max-width: 767px) {
  h1,
  h2 {
    font-size: 2rem !important;
    line-height: 115%;
  }
}
h6 {
  font-family: Visby Heavy, sans-serif;
  font-size: 1.2rem !important;
  line-height: 140%;
  color: var(--accent-color);
}
p,
li {
  font-family: Visby Medium, sans-serif;
  font-size: 1.1rem;
  line-height: 150%;
  color: var(--text-color);
}
.icon-list {
  padding-left: 0 !important;
}
p.feature-title {
  font-family: Visby Heavy, sans-serif;
  font-size: 1.2rem;
  line-height: 130%;
  color: var(--text-color);
}
p.eyebrow {
  font-family: Visby Heavy, sans-serif;
  font-size: 1.2rem;
  line-height: 160%;
  color: var(--eyebrow-color);
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
/* End Fonts */
/* Navigation */
.navlink_wrapper {
  display: flex;
  gap: 40px;
}
a.navlink {
  font-family: Visby Bold, sans-serif;
  color: #000;
  font-size: 1.1rem;
}
/* End Navigation */
/* Footer */
.navlink-f_wrapper {
  display: flex;
  justify-content: center;
  gap: 40px;
}
@media all and (max-width: 767px) {
  .navlink-f_wrapper {
    flex-direction: column;
    gap: 4px;
  }
}
a.navlink-f {
  font-family: Visby Regular, sans-serif;
  color: #000;
  font-size: 1.1rem;
}
.legal-container {
  display: flex;
  justify-content: space-between;
  padding-bottom: 25px;
}
@media all and (max-width: 767px) {
  .legal-container {
    flex-direction: column;
    gap: 8px;
  }
}
.legal-l_wrapper {
  display: flex;
  gap: 24px;
}
@media all and (max-width: 767px) {
  .legal-l_wrapper {
    flex-direction: column;
    gap: 2px;
  }
}
a.navlink-legal-l {
  font-family: Visby Regular, sans-serif;
  color: #000;
  font-size: 0.9rem;
  text-decoration: underline;
}
.legal-r_wrapper > p {
  font-family: Visby Medium, sans-serif;
  color: #000;
  font-size: 0.9rem;
}
/* End Footer */
/* Buttons */
.cta-kontakt {
  background: var(--secondary-color);
  color: var(--text-color);
  border: none !important;
  border-radius: 20px;
  font-family: Visby Bold, sans-serif;
  font-size: 1rem;
  padding: 4px 20px 4px 20px;
  display: inline-flex; /* flex für Icon + Text */
  align-items: center; /* vertikal mittig */
  text-decoration: none; /* Standard-Underline bei <a> raus */
  gap: 10px; /* Abstand Text ↔ Pfeil */
}
.cta-kontakt::after {
  content: "";
  display: inline-block;
  width: 1em; /* Größe des Icons */
  height: 1em;
  background: url("../icons/btn-icon.svg") no-repeat center;
  background-size: contain; /* Icon an Button-Größe anpassen */
}
/* Hover (Desktop) */
.cta-kontakt:hover {
  background: #00000040;
}

/* Focus (Barrierefreiheit) */
.cta-kontakt:focus {
  background: #00000040;
  outline: 2px solid #f97316; /* kontrastreicher Rahmen */
  outline-offset: 2px;
}

/* Active (Desktop + Mobile Touch) */
.cta-kontakt:active {
  background: var(--eyebrow-color);
  color: #fff;
  transform: scale(0.98); /* kleiner gedrückt-Effekt */
}
/* Bilder */
.header-image span.et_pb_image_wrap {
  width: 100%;
}
.header-image span.et_pb_image_wrap > img {
  width: 100%;
}
/* End Bilder */
/* Akkordeon */
/* 1) Divi-Standardicon neben dem Titel verbergen */
.sr-accordion .et_pb_toggle_title:before {
  display: none !important;
}

/* 2) Eigener Pfeil: Grundzustand (geschlossen) – zeigt nach unten */
.sr-accordion .et_pb_toggle_title {
  position: relative;
  padding-right: 2rem; /* Platz für den Pfeil rechts */
  cursor: pointer;
}

.sr-accordion .et_pb_toggle_title::after {
  content: "";
  position: absolute;
  right: 0.5rem;
  top: 50%;
  width: 10px;
  height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-50%) rotate(45deg); /* ↘︎ = Pfeil nach unten */
  transition: transform 200ms ease;
  opacity: 0.9;
  margin-right: 20px;
}

/* 3) Geöffnet: Pfeil nach oben (Rotation) */
.sr-accordion .et_pb_toggle_open .et_pb_toggle_title::after {
  transform: translateY(-50%) rotate(-135deg); /* ↖︎ = Pfeil nach oben */
}
h5.et_pb_toggle_title {
  font-family: Visby Medium, sans-serif;
  font-size: 1.1rem !important;
  line-height: 150%;
  color: var(--text-color);
  padding: 20px !important;
}
/* Akkordeon mit eigener Klasse */
.sr-acc-color .et_pb_toggle {
  border: 1p solid #eee;
  overflow: hidden;
  margin-bottom: 12px;
  background: transparent !important; /* Divi-Default ausschalten */
}
.et_pb_toggle_close {
  padding: 0;
}
.et_pb_toggle_open {
  padding: 0;
}
/* Titelzeile (geschlossen & geöffnet identisch) */
.sr-acc-color .et_pb_toggle_title {
  display: block;
  background: #eeeeee; /* Hintergrund Titel */
  color: #000000; /* Textfarbe Titel */
  padding: 16px 20px;
  position: relative;
  transition: background-color 0.2s ease; /* sanfter Übergang */
}

/* Hover-Effekt für die Titelzeile */
.sr-acc-color .et_pb_toggle_title:hover {
  background: #e0e0e0; /* etwas dunkleres Grau bei Hover */
  cursor: pointer;
}

/* Inhaltspanel (nur sichtbar, wenn geöffnet) */
.sr-acc-color .et_pb_toggle_content {
  background: #ffffff; /* Hintergrund Inhalt */
  color: #000000; /* Textfarbe Inhalt */
  padding: 16px 20px 20px;
  border-top: 1px solid #ddd;
}

/* End Akkordeon */
/* Counter */
.counter-value {
  font-family: Visby Heavy, sans-serif;
  font-size: 2.25rem !important;
  line-height: 130%;
  color: var(--text-color);
}
.counter-value sup {
  font-size: 1rem;
  bottom: 0.9rem;
}
.counter-label {
  font-family: Visby Medium, sans-serif;
  font-size: 1.25rem !important;
  line-height: 130%;
  color: var(--text-color);
  margin-top: -20px;
}
/* End Counter */
/* Listen */
/* Grundstil der Liste */
.icon-list {
  list-style: none; /* Standardpunkte aus */
  margin: 0;
  padding: 0;
}

/* Jeder LI wird zweispaltig: Icon | Text */
.icon-list li {
  --icon-size: 1.4rem; /* Größe des Icons */
  --gap: 0.6rem; /* Abstand Icon–Text */

  display: grid;
  grid-template-columns: var(--icon-size) 1fr;
  align-items: start;
  column-gap: var(--gap);

  /* optional: vertikaler Abstand zwischen Punkten */
  margin-block: 0.35rem;
}

/* Das „Bullet“-Icon */
.icon-list li::before {
  content: "";
  width: var(--icon-size);
  aspect-ratio: 1;
  margin-top: 0.1em; /* kleine optische Korrektur bei mehrzeiligem Text */

  /* Icon nur einfärben */
  background: #14a59d; /* gewünschte Icon-Farbe */
  -webkit-mask: url("/assets/icons/check.svg") no-repeat center / contain;
  mask: url("/assets/icons/check.svg") no-repeat center / contain;

  /* Deko → für Screenreader ignorieren */
  aria-hidden: true;
}
ul.icon-list {
  padding-top: 20px;
  padding-bottom: 30px;
}
/* End Listen */
/* Flex Boxen 1 */
.challange-container,
.mission-container {
  display: flex;
  gap: 24px;
}
@media all and (max-width: 767px) {
  .challange-container,
  .mission-container {
    flex-wrap: wrap;
  }
}
.challange-item-wrapper {
  display: flex;
  gap: 16px;
  flex-wrap: nowrap;
}
.mission-item-wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
p.content-header {
  font-family: Visby Heavy, sans-serif;
  font-size: 1.2rem !important;
  line-height: 130%;
  color: var(--text-color);
}
.challange-item-img > img,
.mission-item-wrapper > img {
  width: 50px;
  max-width: 50px;
  height: auto;
}
.mission-item-wrapper > img {
  margin-bottom: -40px;
}
/* End Flex Boxen 1 */
/* Testimonial */
.testimonial-wrapper {
  display: flex;
  gap: 15px;
}
@media all and (max-width: 767px) {
  .testimonial-wrapper {
    flex-wrap: wrap;
  }
}
.testimonial-img > img {
  width: 350px;
  height: auto;
}
.testimonial-custom > img {
  float: left;
  padding: 10px 20px 10px 0;
}
/* End Testimonial */
/* Formular */
.cf7-form-wrapper {
  max-width: 100%;
  margin: 0 auto;
}
.cf7-button-wrapper > p {
  text-align: left !important;
}
.wpcf7-submit {
  background: var(--secondary-color);
  color: var(--text-color);
  border: none !important;
  border-radius: 17px;
  font-family: Visby Bold, sans-serif;
  font-size: 1rem;
  padding: 10px 34px 10px 20px;
  border: none !important;
}
.cf7-form-wrapper input {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1rem;
  background: #eeeeee;
  border: 1px solid #cccccc;
  border-radius: 15px;
  padding-left: 8px;
  height: 48px;
  width: 100%;
}
span.wpcf7-form-control-wrap,
.custom-upload-wrapper p {
  width: 100%;
}
.cf7-row {
  margin-bottom: 20px;
}
.cf7-row > p {
  width: 100%;
}
.cf7-input,
.cf7-textarea,
.wpcf7-select,
.wpcf7-file,
.wpcf7-date,
.wpcf7-email {
  width: 100%;
  padding: 10px;
  border: 1px solid #cccccc;
  border-radius: 15px;
  color: var(--text-color);
  background: #eeeeee;
  font-size: 16px;
  box-sizing: border-box;
  padding-top: 2px;
  padding-bottom: 2px;
}

.cf7-input::placeholder,
.cf7-textarea::placeholder {
  color: #aaa;
  background: #eeeeee;
  opacity: 1;
}
input.wpcf7-file {
  color: var(--accent-color);
  padding-top: 8px;
}
.cf7-textarea {
  height: 150px;
  resize: vertical;
}

.cf7-icon-row {
  position: relative;
}

.cf7-icon-envelope {
  position: absolute;
  left: 10px;
  top: 50%;
  font-size: 18px;
  color: var(--accent-color);
  z-index: 9;
  pointer-events: none;
}
.cf7-icon-phone {
  position: absolute;
  left: 10px;
  top: 50%;
  font-size: 18px;
  color: var(--accent-color);
  z-index: 9;
  pointer-events: none;
}

.cf7-icon-row .cf7-input {
  padding-left: 30px;
}

.cf7-rechtstext {
  font-size: 1rem;
  color: var(--text-color);
  margin: 20px 0 10px;
}

.cf7-button-wrapper > p {
  text-align: center;
}
input.cf7-submit {
  font-family: OpenSans Regular, sans-serif;
  font-size: 1rem;
  color: white;
  background: var(--accent-color);
  border: 1px solid var(--accent-color);
  border-radius: 100px;
  padding: 10px 24px;
  cursor: pointer;
  width: auto;
  height: auto;
  transition: background-color 0.2s ease;
}
p.cf7-rechtstext {
  text-align: left;
}
.cf7-submit:hover {
  background: var(--secondary-color) !important;
  border: 1px solid var(--accent-color) !important;
}
/* End Formular */
/* Abstände */
/*** Responsive Styles Tablet Only ***/
.border-row-left {
  padding-left: clamp(0px, calc((100vw - 1440px) / 2), 9999px);
}
@media all and (min-width: 768px) and (max-width: 1500px) {
  .row-border {
    padding-left: 10%;
    padding-right: 10%;
  }
  .border-row-left {
    padding-left: 10%;
    padding-right: 10% !important;
  }
}
/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
  .row-border {
    padding-left: 5%;
    padding-right: 5%;
  }
  .border-row-left {
    padding-left: 5%;
    padding-right: 5% !important;
  }
}
/* End Abstände */
/* Menü */
#menu-main {
  align-items: center;
}
#menu-main > li > a {
  font-family: Visby Bold, sans-serif;
  color: #000;
  font-size: 1.1rem;
  padding-bottom: 0;
}
.nav-btn {
  padding: 14px 20px !important;
}
@media all and (max-width: 980px) {
  .nav-btn {
    padding: 0px 15px !important;
    border-radius: 25px !important;
  }
}
/* End Menü */
/* Mobiles Menu */
/*changing the Divi hamburger menu to X*/
.mobile_nav.opened .mobile_menu_bar:before {
  content: "\4d";
}
/*rotating the Divi Menu icon*/

.mobile_menu_bar:before {
  transition: all 0.4s ease;
  transform: rotate(0deg);
  display: block;
}

/*rotate the Divi Menu icon on click*/

.mobile_nav.opened .mobile_menu_bar::before {
  transition: all 0.4s ease;
  transform: rotate(90deg);
  display: block;
}

/* Remove the top line in the mobile menu*/
.et_mobile_menu {
  border-top: 0;
}

/*making the Divi Menu full width*/
.et_pb_menu .et_mobile_menu {
  min-width: 105vw;
  padding-top: 5% !important;
  margin-left: -85vw;
  margin-top: 25px;
}

/*removing the line from the menu items and adding line height*/

.et_mobile_menu li a {
  padding: 10px 20px !important;
  border-bottom: 1px solid var(--secondary-color) !important;
}
/*removing padding of the social media icons*/
.et_mobile_menu li li {
  padding-left: 0% !important;
}
#mobile_menu2 > li:nth-child(odd) > a {
  background: var(--quaternary-color);
}
@media (max-width: 980px) {
  .et_pb_menu .et_mobile_menu,
  .et_pb_menu .et_mobile_menu ul {
    text-align: center;
  }
}
/* End Mobiles Menu */