/*
Theme Name: SSV-Kroschke
Template: Divi
*/

:root {
  /* Schriftfamilie */
  --global--font-primary: Interstate;
  --global--font-secondary: Interstate;

  /* Farben */
  --primary: #e4032e;
  --secondary: #026798;
  --anthrazit: #4a4949;
  --black: #000;
  --gray: #f5f5f5;
}

/* Allgemein Styles */

body {
  font-weight: 400;
}

h1 {
  padding-top: 8px;
}

#main-content p a:not([class*="et-"]),
.download-text {
  text-decoration: none;
  border-bottom: 2px solid var(--primary);
}

.text-primary {
  color: var(--primary);
}

#main-menu .et_pb_button_module_wrapper {
  display: none;
}

/* Header */
#main-header {
  box-shadow: none;
  -webkit-box-shadow: none;
}
@media (min-width: 981px) {
  #main-header.et-fixed-header {
    -webkit-box-shadow: 0px 0px 12px 0px rgba(7, 6, 5, 0.1);
    box-shadow: 0px 0px 12px 0px rgba(7, 6, 5, 0.1);
  }

  #main-menu .et_pb_button_module_wrapper {
    display: block;
  }
}

#top-menu-nav > ul > li > a:hover {
  opacity: 1;
}

/* Footer */
footer address {
  font-style: normal;
}

/* Blog */

.et_pb_post .post-meta a {
  border-bottom-width: 4px !important;
}

.et_pb_post a {
  overflow: hidden;
}
.et_pb_post img {
  transform: scale(1.1);
  transition: transform 350ms ease-in-out;
}

.et_pb_post img:hover {
  transform: scale(1.02);
  transition: transform 350ms ease-in-out;
}

/* Download Button (in Blog) */
.download-text {
  color: black;
  font-weight: 700;
  transition: color 350ms ease-in-out, border-color 350ms ease-in-out;
}

.download-text:hover {
  color: var(--primary);
  border-bottom-width: 4px;
  transition: color 350ms ease-in-out, border-color 350ms ease-in-out;
}

.download-text::after {
  margin-left: 3px;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 640 512'%3E%3C!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --%3E%3Cpath d='M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-167l80 80c9.4 9.4 24.6 9.4 33.9 0l80-80c9.4-9.4 9.4-24.6 0-33.9s-24.6-9.4-33.9 0l-39 39V184c0-13.3-10.7-24-24-24s-24 10.7-24 24V318.1l-39-39c-9.4-9.4-24.6-9.4-33.9 0s-9.4 24.6 0 33.9z'/%3E%3C/svg%3E");
}

.et_pb_post_content a.download-text {
  margin-top: 1em;
  display: inline-block;
}

.arrow-list ul,
.square-list ul {
  padding-left: 0px;
}

.arrow-list ul li::marker,
.square-list ul li::marker {
  content: none;
}

.arrow-list ul li,
.square-list ul li {
  padding-left: 30px;
  margin-left: 20px;
  margin-bottom: 5px;
  position: relative;
}

.arrow-list ul li::before {
  position: absolute;
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='14' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23e4032e' d='M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z'/%3E%3C/svg%3E");
  left: 0;
  color: #e4032e;
  display: block;
  font-family: "Font Awesome 5 Pro";
  font-weight: 400;
  margin-top: 2px;
}

.square-list ul li::before {
  position: absolute;
  content: '▪';
  top: -4px;
  left: 0;
  color: #e4032e;
  display: block;
  font-family: "Font Awesome 5 Pro";
  font-weight: 400;
  font-size: 30px;
  margin-top: 2px;
}

.square-list-white ul li::before {
  color: #fff;
}

/* Style angaben für HTML Buttons ENDE */
.float-buttons a:not(:last-child) {
  margin-right: 12px;
}
.float-buttons .et_pb_button_module_wrapper {
  display: inline-block;
}
.float-buttons .et_pb_button_module_wrapper {
  margin-right: 12px;
}
/* Buttons Ende */

.read-more-arrow .et_pb_blog_grid .post-content-inner p::after {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='19' width='21' viewBox='0 0 448 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23e4032e' d='M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z'/%3E%3C/svg%3E");
  transform: translate(3px, 4px);
  display: inline-flex;
}

.et_pb_blog_grid .et_pb_post {
  padding: 1.2rem;
}

.et_pb_blog_grid .et_pb_image_container {
  margin: -19px -19px 1.2rem;
}

/* Menü nicht einklappen */
.no-collapse .et_pb_menu__menu {
  display: block;
}

.no-collapse .et_pb_menu__wrap {
  justify-content: flex-start;
}

.no-collapse .et_mobile_nav_menu {
  display: none;
}

/* Zitat / Blockquote */

.zitat-icon::before {
  content: none;
}
.zitat-icon .et_pb_testimonial_description_inner::before {
  content: url("data:image/svg+xml,%3Csvg width='36' viewBox='0 0 14 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.65 7V7.35H2H4C4.90983 7.35 5.65 8.09017 5.65 9V11C5.65 11.9098 4.90983 12.65 4 12.65H2C1.09017 12.65 0.35 11.9098 0.35 11V10V9V6.75C0.35 4.87142 1.87142 3.35 3.75 3.35H4C4.35983 3.35 4.65 3.64017 4.65 4C4.65 4.35983 4.35983 4.65 4 4.65H3.75C2.59108 4.65 1.65 5.59108 1.65 6.75V7ZM9.65 7V7.35H10H12C12.9098 7.35 13.65 8.09017 13.65 9V11C13.65 11.9098 12.9098 12.65 12 12.65H10C9.09017 12.65 8.35 11.9098 8.35 11V10V9V6.75C8.35 4.87142 9.87142 3.35 11.75 3.35H12C12.3598 3.35 12.65 3.64017 12.65 4C12.65 4.35983 12.3598 4.65 12 4.65H11.75C10.5911 4.65 9.65 5.59108 9.65 6.75V7Z' stroke='%23E4032E' stroke-width='0.7'/%3E%3C/svg%3E%0A");
  position: absolute;
  background: transparent;
  height: 32px;
  width: 36px;
  top: -32px;
  left: calc(-36px + -8px);
}
.zitat-icon .et_pb_testimonial_description_inner::after {
  content: url("data:image/svg+xml,%3Csvg width='36' viewBox='0 0 14 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.35 9V8.65H12H10C9.09017 8.65 8.35 7.90983 8.35 7V5C8.35 4.09017 9.09017 3.35 10 3.35H12C12.9098 3.35 13.65 4.09017 13.65 5V6V7V9.25C13.65 11.1286 12.1286 12.65 10.25 12.65H10C9.64017 12.65 9.35 12.3598 9.35 12C9.35 11.6402 9.64017 11.35 10 11.35H10.25C11.4089 11.35 12.35 10.4089 12.35 9.25V9ZM4.35 9V8.65H4H2C1.09017 8.65 0.35 7.90983 0.35 7V5C0.35 4.09017 1.09017 3.35 2 3.35H4C4.90983 3.35 5.65 4.09017 5.65 5V6V7V9.25C5.65 11.1286 4.12858 12.65 2.25 12.65H2C1.64017 12.65 1.35 12.3598 1.35 12C1.35 11.6402 1.64017 11.35 2 11.35H2.25C3.40892 11.35 4.35 10.4089 4.35 9.25V9Z' stroke='%23E4032E' stroke-width='0.7'/%3E%3C/svg%3E%0A");
  position: absolute;
  visibility: visible;
  height: 32px;
  width: 36px;
  right: calc(-36px + -8px);
}

/* Icons */
.mail-icon a[href^="mailto:"]::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' viewBox='0 0 512 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23000000' d='M64 112c-8.8 0-16 7.2-16 16v22.1L220.5 291.7c20.7 17 50.4 17 71.1 0L464 150.1V128c0-8.8-7.2-16-16-16H64zM48 212.2V384c0 8.8 7.2 16 16 16H448c8.8 0 16-7.2 16-16V212.2L322 328.8c-38.4 31.5-93.7 31.5-132 0L48 212.2zM0 128C0 92.7 28.7 64 64 64H448c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z'/%3E%3C/svg%3E");
  transform: translateY(2px);
  display: inline-block;
  margin-right: 5px;
}
.phone-icon a[href^="tel:"]::before {
  content: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_762_113)'%3E%3Cpath d='M13.672 0.773582L13.6717 0.773496C13.3671 0.69028 13.0513 0.834919 12.9141 1.11253L12.8953 1.15758L11.4891 4.53243L11.489 4.53273C11.3777 4.79947 11.4542 5.10691 11.6793 5.29095C11.6793 5.29096 11.6793 5.29096 11.6793 5.29097L13.4124 6.70769L13.8665 7.07888L13.6157 7.60906C12.3709 10.2408 10.2408 12.3709 7.60905 13.6157L7.07954 13.8662L6.70826 13.4131L5.28801 11.68L5.288 11.68L5.28538 11.6767C5.1065 11.456 4.79779 11.3769 4.52921 11.489L4.52891 11.4891L1.15406 12.8953L1.15247 12.896C0.848993 13.0216 0.686377 13.3528 0.773497 13.6717L0.773582 13.672L1.61672 16.7635C1.61682 16.7639 1.61692 16.7642 1.61702 16.7646C1.69708 17.0529 1.95824 17.25 2.25069 17.25C10.5338 17.25 17.25 10.5338 17.25 2.25069C17.25 1.95815 17.0528 1.69693 16.7643 1.61695C16.7641 1.61687 16.7638 1.6168 16.7635 1.61672L13.672 0.773582Z' stroke='black' stroke-width='1.5'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_762_113'%3E%3Crect width='18' height='18' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  transform: translateY(2px);
  display: inline-block;
  margin-right: 5px;
}

.custom-mail-override a::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' viewBox='0 0 512 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23e4032e' d='M64 112c-8.8 0-16 7.2-16 16v22.1L220.5 291.7c20.7 17 50.4 17 71.1 0L464 150.1V128c0-8.8-7.2-16-16-16H64zM48 212.2V384c0 8.8 7.2 16 16 16H448c8.8 0 16-7.2 16-16V212.2L322 328.8c-38.4 31.5-93.7 31.5-132 0L48 212.2zM0 128C0 92.7 28.7 64 64 64H448c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z'/%3E%3C/svg%3E") !important;
}

.custom-mail-override a:hover::before {
  content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' viewBox='0 0 512 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23000000' d='M64 112c-8.8 0-16 7.2-16 16v22.1L220.5 291.7c20.7 17 50.4 17 71.1 0L464 150.1V128c0-8.8-7.2-16-16-16H64zM48 212.2V384c0 8.8 7.2 16 16 16H448c8.8 0 16-7.2 16-16V212.2L322 328.8c-38.4 31.5-93.7 31.5-132 0L48 212.2zM0 128C0 92.7 28.7 64 64 64H448c35.3 0 64 28.7 64 64V384c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V128z'/%3E%3C/svg%3E") !important;
}

.red-marker li::marker {
  color: var(--primary) !important;
}

.et_mobile_menu li a:hover,
.nav ul li a:hover {
  background-color: transparent;
}

.et_mobile_menu {
  max-height: 80dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Kontaktformular */

.wpcf7-form .default-contact-structure {
  display: grid;
  gap: 8px;
  grid-template-columns: 100%;
}

.wpcf7-form p {
  padding-bottom: 1.2em;
}

.wpcf7-form .col-6 {
  width: 50%;
}

.wpcf7-form label {
  font-weight: 500;
  font-size: 20px;
}

.wpcf7-form input,
.wpcf7-form textarea {
  border-color: #000;
  color: #000;
  padding: 12px 22px;
  background-color: white;
  border-width: 1px;
  border-radius: 6px;
  font-size: 18px;
  width: 100%;
}

.wpcf7-form input:focus {
  border-color: var(--primary);
  background-color: #f5f5f5;
}

.wpcf7-form .wpcf7-not-valid-tip {
  font-size: 0.8em;
  color: var(--primary);
  padding-top: 6px;
}

.wpcf7 input[type="submit"] {
  background-color: var(--primary);
  color: #fff;
  border-radius: 2px;
  border: 0px;
  padding: 16px 30px;
  font-size: 20px;
  font-weight: 600;
  cursor: pointer;
  width: fit-content;
  transition: background-color 150ms ease-in-out;
}

.wpcf7 input[type="submit"]:hover {
  background-color: #000;
  transition: background-color 150ms ease-in-out;
}

#main-menu ul.sub-menu li {
  padding: 2px 5px!important;
}

#main-menu ul.sub-menu li a:hover,
#main-menu ul.sub-menu li.current-menu-item a {
    background: #fff;
  }

/* Bootstrap-Breakpoints */

@media (min-width: 576px) {
}

@media (min-width: 768px) {
}

@media (min-width: 992px) {
  .et_pb_blog_grid .et_pb_post {
    padding: 2rem;
  }

  .et_pb_blog_grid .et_pb_image_container {
    margin: -32px -32px 2rem;
  }

  /* Kontaktformular */

  .wpcf7-form .default-contact-structure {
    display: grid;
    gap: 20px;
  }

  .wpcf7-form .default-contact-structure {
    display: grid;
    gap: 0 20px;
    grid-template-columns: 1fr 1fr;
  }

  .wpcf7-form .default-contact-structure p:nth-child(1) {
    grid-column-start: 1;
    grid-column-end: 2;
  }

  .wpcf7-form .default-contact-structure p:nth-child(2) {
    grid-column-start: 2;
    grid-column-end: 2;
  }

  .wpcf7-form .default-contact-structure p {
    grid-column-start: 1;
    grid-column-end: 3;
  }

  .wpcf7-form input,
  .wpcf7-form textarea {
    border-color: #000;
    color: #000;
    padding: 14px 14px;
    background-color: white;
    border-width: 1px;
    border-radius: 0px;
    font-size: 18px;
    width: 100%;
  }

  .wpcf7-form input[type="checkbox"] {
    position: absolute;
    left: -40px;
    width: auto;
    top: 2px;
  }

  .wpcf7-list-item {
    margin: 0 0 0 2em!important;
  }

}

@media (min-width: 1200px) {
  .et_pb_blog_grid .et_pb_post {
    padding: 2rem;
  }

  .et_pb_blog_grid .et_pb_image_container {
    margin: -32px -32px 2rem;
  }
}

@media (min-width: 1400px) {
}

/* Spalten */
@media only screen and (max-width: 479px) {
  .m-col-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 20px;
  }
  .m-col-2 .et_pb_column.et-last-child {
    margin-bottom: 30px !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 980px) {
  .t-col-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 20px;
    row-gap: 20px;
  }
  .t-col-2 .et_pb_column {
    margin-bottom: calc(36px * 0.5);
  }

  .t-col-2 .zitat-icon .et_pb_testimonial_description_inner::after {
    right: 0px;
  }
}

@media only screen and (min-width: 981px) {
  .d-col-1 {
    grid-template-columns: 100%;
  }
  /* Menü auf Desktop überschreiben */
  #main-menu ul.sub-menu {
    border: 1px solid var(--primary);
  }
  #main-menu ul.sub-menu li a {
    font-weight: 700;
    width: auto;
    font-size: 16px;
    padding: 6px 0px 6px 16px;
  }
  #main-menu ul.sub-menu li {
    padding: 2px 5px 2px 10px;
  }
  ul#menu-hauptmenue ul.sub-menu {
    width: 340px;
    column-count: 1;
  }
  ul#menu-hauptmenue > li {
    padding-left: 15px;
    padding-right: 15px;
  }
  .et-menu .menu-item-has-children > a {
    padding-right: 0px !important;
  }
  /* Hauptmenüpunkt einfärben, auch wenn "nur" sub-element aktiv ist */
  ul#menu-hauptmenue > li.current-page-ancestor > a {
    color: var(--primary) !important;
  }
  ul#menu-hauptmenue li.menu-item.et-hover {
    color: black !important;
  }
  ul#menu-hauptmenue > li > a:hover {
    opacity: 1;
  }
  ul#menu-hauptmenue > li > a::before {
    content: "";
    display: block;
    width: 100%;
    height: 6px;
    background-color: #e4032e;
    opacity: 0;
    bottom: 30%;
    position: absolute;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
  ul#menu-hauptmenue > li.current-page-ancestor > a::before {
    opacity: 1;
    bottom: 10%;
  }
  ul#menu-hauptmenue > li:hover > a::before {
    opacity: 1;
    bottom: 10%;
  }
  ul#menu-hauptmenue ul.sub-menu li {
    width: 100%;
  }

  /*ul#menu-hauptmenue .d-col-2 > ul.sub-menu {
    width: 620px;
    column-count: 2;
    left: 0;
    right: 0;
    transform: translateX(-50%);
  }*/

  ul#menu-hauptmenue .d-col-2:hover li ul.sub-menu {
    visibility: visible;
  }

  ul#menu-hauptmenue .d-col-2 li ul.sub-menu {
    opacity: 1;
    position: initial;
    border: none;
    width: auto;
    padding: 0px;
    box-shadow: none;
  }

  ul#menu-hauptmenue .d-col-2 li ul.sub-menu li a {
    font-weight: 500;
    padding: 1px 1px 0px 16px;
  }

  ul#menu-hauptmenue .menu-item-has-children a::after {
    content: none;
  }

  ul#menu-hauptmenue
    ul.sub-menu
    ul.sub-menu
    > li.current_page_item:not(.menu-item-has-children)
    a,
  ul#menu-hauptmenue
    ul.sub-menu
    > li.current_page_item:not(.menu-item-has-children)
    a {
    color: black !important;
  }
}

/* begin collapse mobile menu submenus */
.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
  background-color: transparent;
  position: relative;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after,
#main-header .et_mobile_menu .menu-item-has-children > a:after {
  font-family: "ETmodules";
  text-align: center;
  speak: none;
  font-weight: 600;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  font-size: 18px;
  content: "\4c";
  top: 11px;
  right: 13px;
}

.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
  content: "\4d";
}

.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
  display: none !important;
  visibility: hidden !important;
  transition: all 1.5s ease-in-out;
}

.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db
  #et-boc
  .et-l
  .et_pb_fullwidth_menu
  .et_mobile_menu
  li.visible
  > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
  display: block !important;
  visibility: visible !important;
}

.et_builder_inner_content > .et_pb_column_4_4 .et_pb_image_0 {
  max-height: 700px;
}
/* Animation der Navigation ausblenden */
#main-menu .et_pb_menu__wrap *:not(a) {
  transition: none !important;
}
#main-menu .menu-item .et_pb_menu__wrap *:not(a) {
  font-size: 18px;
}
#main-menu {
  padding-top: 30px;
    padding-bottom: 30px;
}

#main-menu .menu-item.current-menu-item a::before {
  opacity: 1;
    bottom: 10%;
}


/* BLOG */

.et_pb_module .et_pb_all_tabs .et_pb_tab {
  padding-left: 0;
  padding-right: 0;
}

.et_pb_module .et_pb_post {
  position: relative;
  padding-bottom: 110px;
}

.et_pb_module .et_pb_post .post-meta {
  margin-bottom: 20px;
}

.et_pb_module .et_pb_post .post-meta a {
  font-weight: 600!important;
}

.et_pb_module .et_pb_post .entry-title {
  padding-bottom: 20px;
}

.et_pb_module .et_pb_post .post-content .more-link {
  color: #E4032E !important;
  border-width: 2px !important;
  border-color: #e4032e;
  border: 2px solid #e4032e;
  border-radius: 0px;
  font-size: 15px;
  font-weight: 700 !important;
  background-color: #FFFFFF;
  padding: 10px;
  position: absolute;
  bottom: 2rem;
  left: 2rem;
  transition: all 300ms ease 0ms;
}

.et_pb_module .et_pb_post .post-content .more-link:hover {
  color: #ffffff !important;
  background-color: #E4032E;
}



/* Custom CSS 2026 */


@media only screen and (min-width: 981px) {
  ul#menu-hauptmenue ul.sub-menu {
    column-count: 1;
    width: 340px;
  }
  ul#menu-hauptmenue ul.sub-menu li ul.sub-menu {
    display: none;
    visibility: hidden;
  }
  ul#menu-hauptmenue ul.sub-menu li {
    padding-right: 40px;
  }
  ul#menu-hauptmenue ul.sub-menu li.menu-item-has-children:after {
    content:'>';
    color:#fff;
    font-size: 22px;
    position: absolute;
    top:50%;
    right: 20px;
    transform: translateY(-50%);
  }
  ul#menu-hauptmenue ul.sub-menu li:hover ul.sub-menu {
    display: block;
    visibility: visible;
    position: absolute;
    top:0;
    left:100%;
    width: 340px;
    padding: 20px 0;
    opacity: 0.9;
  }
}


/*
  ============================================================
  KROSCHKE FORMULARE – Gemeinsames Stylesheet
  Gilt für: .fn-form  .fd-form  .fp-form
  Einbinden: Divi → Theme Customizer → Zusätzliches CSS
  ============================================================
*/

/* ===== CSS-Variablen (einmal definiert, überall gültig) ===== */
.fn-form, .fd-form, .fp-form {
  --ssv-red:    #e4032e;
  --ssv-red-dk: #b8001a;
  --ssv-red-lt: #fdecea;
  --ssv-red-md: #f5b3bb;
  --ssv-dark:   #1a1a1a;
  --ssv-gray:   #f4f4f4;
  --ssv-border: #ddd;
  --ssv-text:   #1a1a1a;
  --ssv-muted:  #666;
}

.fn-form *,  .fn-form *::before,  .fn-form *::after,
.fd-form *,  .fd-form *::before,  .fd-form *::after,
.fp-form *,  .fp-form *::before,  .fp-form *::after {
  box-sizing: border-box;
}

.fn-form, .fd-form, .fp-form {
  font-family: inherit;
  max-width: 1920px;
  margin: 0 auto;
  color: var(--ssv-text);
}

.wpcf7-form .fn-form label,
  .wpcf7-form .fd-form label,
  .wpcf7-form .fp-form label {
    font-weight: 500;
    font-size: 20px;
    position: relative;
}


/* ============================================================
   FORTSCHRITTSLEISTE
   Klassen: .fn-progress-wrap / .fd-progress-wrap / .fp-progress-wrap
   → zusammengefasst als [class*="-progress-wrap"] etc.
   ============================================================ */

[class$="-progress-wrap"] {
  margin: 0 0 48px;
}

[class$="-progress-nav"] {
  display: flex;
  justify-content: space-between;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
}

[class$="-progress-nav"] li {
  font-size: 1.2rem;
  color: var(--ssv-muted);
  font-weight: 400;
  transition: color 0.25s;
}

[class$="-progress-nav"] li.fn-active,
[class$="-progress-nav"] li.fd-active,
[class$="-progress-nav"] li.fp-active {
  color: var(--ssv-red);
  font-weight: 700;
}

[class$="-progress-track"] {
  height: 4px;
  background: #e5e5e5;
  border-radius: 2px;
  overflow: hidden;
}

[class$="-progress-bar"] {
  height: 100%;
  background: var(--ssv-red);
  border-radius: 2px;
  transition: width 0.4s ease;
}


/* ============================================================
   SCHRITT-CONTAINER + ANIMATION
   ============================================================ */

.fn-step, .fd-step, .fp-step {
  display: none;
}

.fn-step.fn-active,
.fd-step.fd-active,
.fp-step.fp-active {
  display: block;
  animation: kfFadeIn 0.22s ease;
}

@keyframes kfFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}


/* ============================================================
   TITEL & UNTERTITEL
   ============================================================ */

[class$="-question"] {
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--ssv-dark);
  margin: 0 0 8px;
  line-height: 1.35;
  padding-bottom: 0 !important;
}

[class$="-question-sub"] {
  font-size: 1.2rem;
  color: var(--ssv-muted);
  margin: 0 0 26px;
}


/* ============================================================
   SEKTIONEN & SECTION-TITEL
   ============================================================ */

[class$="-section"] {
  margin-bottom: 28px;
}

[class$="-section-title"] {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ssv-red);
  margin: 0 0 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ssv-border);
}


/* ============================================================
   MEHRFACHAUSWAHL-BADGE
   ============================================================ */

[class$="-multi-badge"] {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.74rem;
  font-weight: 600;
  color: var(--ssv-red);
  /*background: rgba(0, 0, 0, 0.04);*/
  /*border: 1px solid rgba(0, 0, 0, 0.1);*/
  /*border-radius: 3px;*/
  /*padding: 3px 8px;*/
  margin-bottom: 14px;
}

[class$="-multi-badge"] i {
  display: none;
}


/* ============================================================
   HAUPTAUSWAHL-KARTEN (Schritt 1, fn-form)
   ============================================================ */

.fn-main-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 32px;
}

.fn-main-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 22px;
  border: 2px solid var(--ssv-border);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 700;
  color: var(--ssv-dark);
  gap: 12px;
  transition: border-color 0.2s, background 0.2s, box-shadow 0.2s;
  user-select: none;
  position: relative;
  background: #fff;
}

.fn-main-card input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }

.fn-main-card .fn-card-icon {
  width: 60px; height: 60px;
  background: transparent;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s;
}
.fn-main-card .fn-card-icon i {
  font-size: 2rem;
  color: var(--ssv-red);
  transition: color 0.2s;
}
.fn-main-card .fn-card-desc {
  font-size: 0.82rem;
  font-weight: 400;
  color: var(--ssv-muted);
  line-height: 1.5;
  margin-top: -4px;
}
.fn-main-card:hover {
  border-color: var(--ssv-red);
  box-shadow: 0 2px 12px rgba(226,0,26,0.1);
}
.fn-main-card:has(input:checked) {
  border-color: var(--ssv-red);
  background: var(--ssv-red-lt);
  box-shadow: 0 2px 16px rgba(226,0,26,0.12);
}
/*.fn-main-card:has(input:checked) .fn-card-icon { background: var(--ssv-red); }*/
.fn-main-card:has(input:checked) .fn-card-icon i { color: #fff; }

.fn-main-card .fn-check-mark {
  position: absolute; top: 14px; right: 14px;
  width: 20px; height: 20px;
  border: 2px solid var(--ssv-border); border-radius: 50%;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.2s, border-color 0.2s;
}
.fn-main-card .fn-check-mark i { font-size: 9px; color: #fff; display: none; }
.fn-main-card:has(input:checked) .fn-check-mark { background: var(--ssv-red); border-color: var(--ssv-red); }
.fn-main-card:has(input:checked) .fn-check-mark i { display: block; }


/* ============================================================
   RADIO-KARTEN (Einzelauswahl)
   ============================================================ */

.fn-card-grid, .fp-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 10px;
}

.fn-radio-card {
  display: flex; align-items: center;
  padding: 13px 14px;
  background: #fff;
  border: 1.5px solid var(--ssv-border);
  cursor: pointer;
  font-size: 0.87rem; font-weight: 500;
  color: var(--ssv-text); line-height: 1.4;
  transition: border-color 0.18s, background 0.18s;
  user-select: none; position: relative;
  min-height: 50px; gap: 10px;

  display:block;
  text-align: center;
}
.fn-radio-card input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }

.fn-radio-card .fn-dot {
  width: 16px; height: 16px; flex-shrink: 0;
  border: 2px solid var(--ssv-border); border-radius: 50%;
  background: #fff; transition: border-color 0.18s;
  display: flex; align-items: center; justify-content: center;
  display:none;
}
.fn-radio-card .fn-dot::after {
  content: '';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--ssv-red);
  display: none;
}
.fn-radio-card:hover { border-color: var(--ssv-red); }
.fn-radio-card:has(input:checked) {
  border-color: var(--ssv-red); background: var(--ssv-red-lt);
  color: var(--ssv-dark); font-weight: 600;
}
.fn-radio-card:has(input:checked) .fn-dot { background: var(--ssv-red); border-color: var(--ssv-red); }
.fn-radio-card:has(input:checked) .fn-dot::after { display: block; }


/* ============================================================
   CHECKBOX-KARTEN (Mehrfachauswahl)
   Gilt für: .fn-check-card  .fd-leistung-card  .fp-check-card  .fp-loesung-card
   ============================================================ */

.fn-check-grid, .fp-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 10px;
}

.fn-check-card,
.fd-leistung-card,
.fp-check-card,
.fp-loesung-card {
  display: flex; align-items: center; gap: 11px;
  padding: 14px 13px;
  background: #fff;
  border: 1.5px solid var(--ssv-border);
  cursor: pointer;
  font-size: 0.88rem; font-weight: 500;
  color: var(--ssv-text); line-height: 1.4;
  transition: border-color 0.18s, background 0.18s;
  user-select: none; position: relative; min-height: 54px;

  text-align: center;
  justify-content: center;
}

.fn-check-card input[type="checkbox"],
.fd-leistung-card input[type="checkbox"],
.fp-check-card input[type="checkbox"],
.fp-loesung-card input[type="checkbox"] {
  position: absolute; opacity: 0; width: 0; height: 0;
}

.fn-check-card .fn-chk,
.fd-leistung-card .fd-chk,
.fp-check-card .fp-chk,
.fp-loesung-card .fp-chk {
  width: 17px; height: 17px; flex-shrink: 0; margin-top: 1px;
  border: 2px solid var(--ssv-border); border-radius: 3px;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.18s, border-color 0.18s;

  display:none;
}

.fn-check-card .fn-chk i,
.fd-leistung-card .fd-chk i,
.fp-check-card .fp-chk i,
.fp-loesung-card .fp-chk i {
  font-size: 9px; color: #fff; display: none;
}

.fn-check-card:hover,
.fd-leistung-card:hover,
.fp-check-card:hover,
.fp-loesung-card:hover { border-color: var(--ssv-red); }

.fn-check-card:has(input:checked),
.fd-leistung-card:has(input:checked),
.fp-check-card:has(input:checked),
.fp-loesung-card:has(input:checked) {
  border-color: var(--ssv-red); background: var(--ssv-red-lt);
  color: var(--ssv-dark); font-weight: 600;
}

.fn-check-card:has(input:checked) .fn-chk,
.fd-leistung-card:has(input:checked) .fd-chk,
.fp-check-card:has(input:checked) .fp-chk,
.fp-loesung-card:has(input:checked) .fp-chk {
  background: var(--ssv-red); border-color: var(--ssv-red);
}

.fn-check-card:has(input:checked) .fn-chk i,
.fd-leistung-card:has(input:checked) .fd-chk i,
.fp-check-card:has(input:checked) .fp-chk i,
.fp-loesung-card:has(input:checked) .fp-chk i { display: block; }

/* "Etwas anderes" gestrichelt */
.fd-leistung-card.fd-andere,
.fp-check-card.fp-andere { border-style: dashed; }
.fd-leistung-card.fd-andere:has(input:checked),
.fp-check-card.fp-andere:has(input:checked) { border-style: solid; }

/* Versteckte Lösungskarten (fp) */
.fp-loesung-card[data-hidden="true"] { display: none; }

/* Lösungs-Grid */
.fp-loesung-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 10px;
}

/* Dienstleistungs-Grid */
.fd-leistung-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin-bottom: 8px;
}

/* Kein-Ergebnis-Hinweis */
.fp-no-loesung {
  display: none;
  font-size: 0.9rem; color: var(--ssv-muted);
  padding: 16px; border: 1.5px dashed var(--ssv-border);
  grid-column: 1 / -1;
}
.fp-no-loesung.fp-visible { display: block; }


/* ============================================================
   BEDINGTE UNTERABSCHNITTE
   ============================================================ */

.fn-sub, .fd-andere-feld, .fp-andere-feld {
  display: none;
  margin-top: 24px;
}
.fn-sub.fn-visible { display: block; animation: kfFadeIn 0.2s ease; }
.fd-andere-feld.fd-visible { display: block; animation: kfFadeIn 0.2s ease; }
.fp-andere-feld.fp-visible { display: block; animation: kfFadeIn 0.2s ease; }

.fn-sub-inner {
  border-left: 3px solid var(--ssv-red);
  padding-left: 18px;
}

/* Freitextfeld-Labels */
.fd-andere-feld label,
.fp-andere-feld label {
  display: block;
  font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--ssv-dark); margin-bottom: 6px;
}

/* Freitextfeld-Textarea */
.fd-andere-feld textarea,
.fd-andere-feld .wpcf7-form-control-wrap textarea,
.fp-andere-feld textarea,
.fp-andere-feld .wpcf7-form-control-wrap textarea {
  width: 100%; padding: 10px 13px;
  border: 1.5px solid var(--ssv-border); font-size: 0.9rem;
  color: var(--ssv-text); background: var(--ssv-gray);
  transition: border-color 0.2s, background 0.2s;
  font-family: inherit; border-radius: 0;
  resize: vertical; min-height: 100px;
}
.fd-andere-feld textarea:focus,
.fd-andere-feld .wpcf7-form-control-wrap textarea:focus,
.fp-andere-feld textarea:focus,
.fp-andere-feld .wpcf7-form-control-wrap textarea:focus {
  outline: none; border-color: var(--ssv-red); background: #fff;
  box-shadow: 0 0 0 3px rgba(226,0,26,0.1);
}
.fd-andere-feld .wpcf7-form-control-wrap,
.fp-andere-feld .wpcf7-form-control-wrap { display: block; }


/* ============================================================
   KONTAKTFORMULAR-BOX
   ============================================================ */

.fn-contact-box, .fd-contact-box, .fp-contact-box {
  background: #fff;
  border: 1.5px solid var(--ssv-border);
  padding: 32px;
  border-top: 4px solid var(--ssv-red);
}

.fn-form-grid, .fd-form-grid, .fp-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.fn-full, .fd-full, .fp-full { grid-column: 1 / -1; }

/* Field-Labels */
.fn-field label, .fd-field label, .fp-field label {
  display: block;
  font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--ssv-dark); margin-bottom: 6px;
}

/* CF7 Wrapper */
.fn-field .wpcf7-form-control-wrap,
.fd-field .wpcf7-form-control-wrap,
.fp-field .wpcf7-form-control-wrap { display: block; }

/* Inputs & Textarea */
.fn-field input[type="text"],
.fn-field input[type="email"],
.fn-field input[type="tel"],
.fn-field textarea,
.fn-field .wpcf7-form-control-wrap input,
.fn-field .wpcf7-form-control-wrap textarea,
.fd-field input[type="text"],
.fd-field input[type="email"],
.fd-field input[type="tel"],
.fd-field textarea,
.fd-field .wpcf7-form-control-wrap input,
.fd-field .wpcf7-form-control-wrap textarea,
.fp-field input[type="text"],
.fp-field input[type="email"],
.fp-field input[type="tel"],
.fp-field textarea,
.fp-field .wpcf7-form-control-wrap input,
.fp-field .wpcf7-form-control-wrap textarea {
  width: 100%;
  padding: 10px 13px;
  border: 1.5px solid var(--ssv-border);
  font-size: 0.9rem;
  color: var(--ssv-text); background: var(--ssv-gray);
  transition: border-color 0.2s, background 0.2s;
  font-family: inherit; border-radius: 0;
}

.fn-field input:focus, .fn-field textarea:focus,
.fn-field .wpcf7-form-control-wrap input:focus,
.fn-field .wpcf7-form-control-wrap textarea:focus,
.fd-field input:focus, .fd-field textarea:focus,
.fd-field .wpcf7-form-control-wrap input:focus,
.fd-field .wpcf7-form-control-wrap textarea:focus,
.fp-field input:focus, .fp-field textarea:focus,
.fp-field .wpcf7-form-control-wrap input:focus,
.fp-field .wpcf7-form-control-wrap textarea:focus {
  outline: none;
  border-color: var(--ssv-red); background: #fff;
  box-shadow: 0 0 0 3px rgba(226,0,26,0.1);
}

.fn-field textarea, .fn-field .wpcf7-form-control-wrap textarea,
.fd-field textarea, .fd-field .wpcf7-form-control-wrap textarea,
.fp-field textarea, .fp-field .wpcf7-form-control-wrap textarea {
  resize: vertical; min-height: 90px;
}

/* CF7 Validierungsfehler */
.fn-field .wpcf7-not-valid,
.fd-field .wpcf7-not-valid,
.fp-field .wpcf7-not-valid { border-color: var(--ssv-red) !important; }

.fn-field .wpcf7-not-valid-tip,
.fd-field .wpcf7-not-valid-tip,
.fp-field .wpcf7-not-valid-tip {
  font-size: 0.76rem; color: var(--ssv-red);
  margin-top: 4px; display: block;
}

/* Datenschutz */
.fn-datenschutz, .fd-datenschutz, .fp-datenschutz {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 0.82rem; color: var(--ssv-muted); line-height: 1.55;
}
.fn-datenschutz input[type="checkbox"],
.fn-datenschutz .wpcf7-acceptance input,
.fd-datenschutz input[type="checkbox"],
.fd-datenschutz .wpcf7-acceptance input,
.fp-datenschutz input[type="checkbox"],
.fp-datenschutz .wpcf7-acceptance input {
  margin-top: 3px; flex-shrink: 0; accent-color: var(--ssv-red);
}
.fn-datenschutz a, .fd-datenschutz a, .fp-datenschutz a {
  color: var(--ssv-red); text-decoration: none; font-weight: 500;
}
.fn-datenschutz a:hover, .fd-datenschutz a:hover, .fp-datenschutz a:hover {
  text-decoration: underline;
}
.fn-datenschutz .wpcf7-form-control-wrap,
.fd-datenschutz .wpcf7-form-control-wrap,
.fp-datenschutz .wpcf7-form-control-wrap { display: contents; }


/* ============================================================
   BUTTONS
   ============================================================ */

.fn-nav, .fd-nav, .fp-nav {
  display: flex; gap: 12px; margin-top: 30px;
  flex-wrap: wrap; align-items: center;
}

.fn-btn, .fd-btn, .fp-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 18px 26px;
  font-size: 0.88rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  cursor: pointer; border: 2px solid transparent;
  transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s;
  line-height: 1; font-family: inherit; border-radius: 0;
}
.fn-btn:hover, .fd-btn:hover, .fp-btn:hover { transform: translateY(-1px); }
.fn-btn:active, .fd-btn:active, .fp-btn:active { transform: translateY(0); }

.fn-btn-back, .fd-btn-back, .fp-btn-back {
  background: transparent; color: var(--ssv-muted); border-color: var(--ssv-border);
}
.fn-btn-back:hover, .fd-btn-back:hover, .fp-btn-back:hover {
  border-color: var(--ssv-dark); color: var(--ssv-dark);
}

.fn-btn-next, .fd-btn-next, .fp-btn-next {
  background: var(--ssv-red); color: #fff; border-color: var(--ssv-red);
}
.fn-btn-next:hover, .fd-btn-next:hover, .fp-btn-next:hover {
  background: var(--ssv-red-dk); border-color: var(--ssv-red-dk);
}
.fn-btn-next:disabled, .fd-btn-next:disabled, .fp-btn-next:disabled {
  background: #e8aaaa; border-color: #e8aaaa;
  color: #fff; cursor: not-allowed; transform: none; opacity: 0.55;
}

/* CF7 Submit */
.fn-contact-box input[type="submit"],
.fd-contact-box input[type="submit"],
.fp-contact-box input[type="submit"],
.fn-btn-submit, .fd-btn-submit, .fp-btn-submit {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 18px 26px;
  font-size: 0.88rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em;
  cursor: pointer;
  border: 2px solid var(--ssv-red);
  background: var(--ssv-red); color: #fff;
  transition: background 0.2s, border-color 0.2s, transform 0.15s;
  font-family: inherit; border-radius: 0; line-height: 1;
}
.fn-contact-box input[type="submit"]:hover,
.fd-contact-box input[type="submit"]:hover,
.fp-contact-box input[type="submit"]:hover,
.fn-btn-submit:hover, .fd-btn-submit:hover, .fp-btn-submit:hover {
  background: var(--ssv-red-dk); border-color: var(--ssv-red-dk);
  transform: translateY(-1px);
}


/* ============================================================
   RESPONSIVE TYPOGRAFIE
   Desktop:  Basis (alles oben definiert)
   Tablet:   ≤ 900px
   Mobil:    ≤ 580px
   ============================================================ */

/* ----- Tablet (≤ 900px) ----- */
@media (max-width: 900px) {

  [class$="-progress-nav"] li {
    font-size: 1.1rem;
  }

  [class$="-question"] {
    font-size: 1.3rem;
  }

  [class$="-question-sub"] {
    font-size: 1rem;
  }

  [class$="-section-title"] {
    font-size: 0.88rem;
  }

  .fn-main-card {
    font-size: 0.95rem;
    padding: 18px 16px;
  }

  .fn-check-card,
  .fd-leistung-card,
  .fp-check-card,
  .fp-loesung-card,
  .fn-radio-card {
    font-size: 0.85rem;
    padding: 12px 12px;
  }

  .fn-btn, .fd-btn, .fp-btn,
  .fn-contact-box input[type="submit"],
  .fd-contact-box input[type="submit"],
  .fp-contact-box input[type="submit"] {
    font-size: 0.82rem;
    padding: 14px 20px;
  }

  .fn-field label, .fd-field label, .fp-field label {
    font-size: 0.74rem;
  }

  .fn-field input[type="text"],
  .fn-field input[type="email"],
  .fn-field input[type="tel"],
  .fn-field textarea,
  .fd-field input[type="text"],
  .fd-field input[type="email"],
  .fd-field input[type="tel"],
  .fd-field textarea,
  .fp-field input[type="text"],
  .fp-field input[type="email"],
  .fp-field input[type="tel"],
  .fp-field textarea {
    font-size: 0.88rem;
  }

  .fn-contact-box, .fd-contact-box, .fp-contact-box {
    padding: 22px;
  }
}

/* ----- Mobil (≤ 580px) ----- */
@media (max-width: 580px) {

  .wpcf7-form .fn-form label,
  .wpcf7-form .fd-form label,
  .wpcf7-form .fp-form label {
      font-weight: 500;
      font-size: 14px;
  }

  [class$="-progress-nav"] li {
    font-size: 0.82rem;
  }

  [class$="-question"] {
    font-size: 1.1rem;
  }

  [class$="-question-sub"] {
    font-size: 0.88rem;
    margin: 0 0 18px;
  }

  [class$="-section-title"] {
    font-size: 0.78rem;
  }

  .fn-main-grid {
    grid-template-columns: 1fr;
  }

  .fn-main-card {
    font-size: 0.9rem;
    padding: 16px 14px;
  }
  .fn-main-card .fn-card-desc { font-size: 0.78rem; }

  .fn-check-card,
  .fd-leistung-card,
  .fp-check-card,
  .fp-loesung-card,
  .fn-radio-card {
    font-size: 0.82rem;
    padding: 11px 11px;
  }

  .fn-btn, .fd-btn, .fp-btn,
  .fn-contact-box input[type="submit"],
  .fd-contact-box input[type="submit"],
  .fp-contact-box input[type="submit"] {
    font-size: 0.78rem;
    padding: 12px 16px;
    letter-spacing: 0.03em;
  }

  .fn-field label, .fd-field label, .fp-field label {
    font-size: 0.7rem;
  }

  .fn-field input[type="text"],
  .fn-field input[type="email"],
  .fn-field input[type="tel"],
  .fn-field textarea,
  .fd-field input[type="text"],
  .fd-field input[type="email"],
  .fd-field input[type="tel"],
  .fd-field textarea,
  .fp-field input[type="text"],
  .fp-field input[type="email"],
  .fp-field input[type="tel"],
  .fp-field textarea {
    font-size: 0.85rem;
    padding: 9px 11px;
  }

  .fn-form-grid, .fd-form-grid, .fp-form-grid {
    grid-template-columns: 1fr;
  }

  .fn-contact-box, .fd-contact-box, .fp-contact-box {
    padding: 16px;
  }

  [class$="-multi-badge"] {
    font-size: 0.68rem;
  }

  .fn-datenschutz, .fd-datenschutz, .fp-datenschutz {
    font-size: 0.76rem;
  }
}



/* ============================================================
   FORMULAR 3 – "VOM PROBLEM ZUR LÖSUNG"
   3-Spalten Situationsauswahl + Farbpunkte
   ============================================================ */

/* 3-Spalten Grid für Kategorien */
.fp-kategorien-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

@media (max-width: 900px) {
  .fp-kategorien-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 580px) {
  .fp-kategorien-grid {
    grid-template-columns: 1fr;
  }
}

/* Kategorie-Titel (Beschaffung / PSA / Weiteres) */
.fp-kategorie-titel {
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ssv-red);
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid var(--ssv-border);
}

/* Situationsliste innerhalb einer Spalte */
.fp-situation-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Kachel-Layout mit Text + Farbpunkten */
.fp-situation-list .fp-check-card {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  padding: 12px 12px;
  min-height: 48px;
}

.fp-card-text {
  flex: 1;
  line-height: 1.35;
}

/* Farbpunkte rechts in der Kachel */
.fp-farb-dots {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
  align-items: center;

  display:none;
}

.fp-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;

  display:none;
}

.fp-dot-blau   { background-color: #2196f3; }
.fp-dot-orange { background-color: #ff9800; }
.fp-dot-rot    { background-color: #e2001a; }
.fp-dot-gruen  { background-color: #4caf50; }
.fp-dot-lila   { background-color: #9c27b0; }
.fp-dot-gelb   { background-color: #ffc107; }


/* Progress Nav klickbar */
[class$="-progress-nav"] li a {
  color: inherit;
  text-decoration: none;
  cursor: default;
  pointer-events: none;
}

[class$="-progress-nav"] li.fn-visited a,
[class$="-progress-nav"] li.fd-visited a,
[class$="-progress-nav"] li.fp-visited a {
  cursor: pointer;
  pointer-events: auto;
  text-decoration: none;
}

[class$="-progress-nav"] li.fn-visited a:hover,
[class$="-progress-nav"] li.fd-visited a:hover,
[class$="-progress-nav"] li.fp-visited a:hover {
  color: var(--ssv-red);
}

[class$="-progress-nav"] li.fn-active a,
[class$="-progress-nav"] li.fd-active a,
[class$="-progress-nav"] li.fp-active a {
  cursor: default;
  pointer-events: none;
  text-decoration: none;
}

/* mmenu */

.mmenu-drawer__logo {
    background: #e4032e;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.mmenu-drawer__logo a {
    display: inline-block;
}

.mmenu-drawer__logo .mmenu-logo {
    max-height: 50px;
    width: auto;
    display: block;
}

.mmenu-drawer__logo .mmenu-logo__text {
    font-size: 1.2rem;
    font-weight: 700;
}


/*

Accordion

*/

[class*="et_pb_accordion_"].et_pb_accordion .et_pb_toggle {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1)!important;
  margin-bottom: 10px;
}

[class*="et_pb_accordion_"].et_pb_accordion h5.et_pb_toggle_title {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    padding: 16px 32px 16px 0px !important;
}

[class*="et_pb_accordion_"].et_pb_accordion .et_pb_toggle .et_pb_toggle_content {
    padding: inherit !important;
    margin-bottom:10px;
}

[class*="et_pb_accordion_"].et_pb_accordion .et_pb_toggle_title:before {
    position: absolute !important;
    left: auto !important;
    right:15px!important;
    display: inline-block !important;
    margin-left: 10px;
    transition: all 0.3s ease-in-out;
}

[class*="et_pb_accordion_"].et_pb_accordion .et_pb_toggle_close .et_pb_toggle_title:before {
    content: %22%92e046%22 !important;
}

[class*="et_pb_accordion_"].et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title:before {
    content: %22%92e044%22 !important;
}