/** Projektkram Main CSS */
/*************fonts*************/

@font-face {
  font-family: 'Safiro';
  src: url('/assets/fonts/safiro-medium-webfont.woff2') format('woff2'),
  url('/assets/fonts/safiro-medium-webfont.eot') format('eot'),
  url('/assets/fonts/safiro-medium-webfont.ttf') format('ttf'),
  url('/assets/fonts/safiro-medium-webfont.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}



/* dm-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 300;
  src: url('/assets/fonts/dm-sans-v15-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  src: url('/assets/fonts/dm-sans-v15-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 400;
  src: url('/assets/fonts/dm-sans-v15-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  src: url('/assets/fonts/dm-sans-v15-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 500;
  src: url('/assets/fonts/dm-sans-v15-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  src: url('/assets/fonts/dm-sans-v15-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 600;
  src: url('/assets/fonts/dm-sans-v15-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  src: url('/assets/fonts/dm-sans-v15-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 700;
  src: url('/assets/fonts/dm-sans-v15-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 800;
  src: url('/assets/fonts/dm-sans-v15-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-800italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 800;
  src: url('/assets/fonts/dm-sans-v15-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 900;
  src: url('/assets/fonts/dm-sans-v15-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* dm-sans-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'DM Sans';
  font-style: italic;
  font-weight: 900;
  src: url('/assets/fonts/dm-sans-v15-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



:root {
  /**********primitives*********/
  /*****colors*******/
  --green: #96E2A4;
  --dark-green: #5b8f65;
  --black: #010E19;
  --white: #ffffff;
  --shade-light:#F3F5F6;
  --shade-medium: #F9FAFB;
  --light-grey:#f2f5f8;
  --medium-grey:#3d4e66;
  --light-text-color:#A6B1BD;
  --dark-grey:#475569;
  --dark-blue:#011C2B;
  --medium-blue:#042637;
  --light-blue:#062F43;
  --light-border:#ffffff0a;
 
 
  /*************colors**************/
  --background:var(--white);
  --background-medium: var(--shade-medium);
  --background-light:var(--white);
  --card:var(--light-grey);
  --white-text: var(--white);
  --headline-color:var(--black);
  --text-color:var(--dark-grey);
  --border-color: var(--light-grey);
  --text-color: var(--medium-grey);

/**********************numbers**************/
--base-value: 8px;
/******padding*****/
--padding-20: calc(20 * var(--base-value));
  --padding-15: calc(15 * var(--base-value));
  --padding-10: calc(10 * var(--base-value));
  --padding-5: calc(5 * var(--base-value));
  --padding-4: calc(4 * var(--base-value));
  --padding-3: calc(3 * var(--base-value));
  --padding-2-5: calc(2.5 * var(--base-value));
  --padding-2: calc(2 * var(--base-value));
  --padding-1-5: calc(1.5 * var(--base-value));
  --padding-1: calc(1 * var(--base-value));
  --padding-0-5: calc(0.5 * var(--base-value));
  /*****padding funktion******/
  --section-padding:var( --padding-20);
  --layout-padding:var( --padding-5);
 /***********border-radius*******/
 --br-0:0px;
 --br-4:4px;
 --br-8:8px;
 --br-12:12px;
 --br-16:16px;
 --br-20:20px;

  /********************schrift-größen**************/
  --base-font: 8px;
  /***********/
  
}
/*************darkmode***********/
@media (prefers-color-scheme: dark) {
  :root {
    
    --background:var(--dark-blue);
    --background-medium: var(--medium-blue);
    --background-light: var(--light-blue);
    --headline-color:var(--white);
    --text-color:var(--light-text-color);
    --border-color: var(--light-border);
    --card:var(--medium-blue);
  }

  .accordion{
    background:#112E3E!important;
  }
}



/*********************************/

html {
  width: 100vw;
  overflow-x: hidden;
  scroll-behavior: smooth !important;
  font-family: 'DM Sans';
  height:100%;
  max-width:100vw;
  scroll-behavior: smooth;
}



body {
  width: 100vw;
  height: auto;
  overflow: hidden;
  margin: 0;
  color: var(--text-color);
  background:var(--background);
  font-family: 'DM Sans';
  font-weight: 400;
  max-width:100vw;
}

main {
  display: flex;
  flex-direction: column;
  gap: var(--section-padding) 0;
}

body.no_scroll {
  overflow: hidden;
  height: 100%;
}

ul{
  padding-left:0;
}


::-moz-selection {
  /* Code for Firefox */
  color: var(--black);
  background: var(--green);
}

::selection {
  color: var(--black);
  background: var(--green);
}


 img {
  max-width: 100%;
  width: 100%;
}
.svg_wrapper svg, .img_wrapper {
  height: auto;
  width: 100%;
}
/*****font styles***********************************************************************************************/

p {
  font-size: 18px;
  line-height: 1.6;
  font-weight: 400;
 margin:0;
 color:var(--text-color);
  letter-spacing: 0px;

}



p.large_text {
  font-size: 28px;
  line-height: 1.4;
  margin:0;
}


h1 {
  font-family: 'Safiro';
  font-size: 72px;
  line-height: 1.2;
  font-weight: 500;
  color: var(--white-text);
  letter-spacing: 0px;
  visibility: inherit;
  text-align: inherit;
  border-width: 0px;
  margin: 0px;
  padding: 0px;
  min-height: 0px;
  min-width: 0px;
  max-width: 1000px;
  opacity: 1;
}

h1.small_headline{
  font-size: 64px;
}



h2 {
  font-size: 44px;
  font-weight: 500;
  line-height: 1.2;
  margin: 0 0 16px 0;
  letter-spacing: 0px;
  position:relative;
font-family:'Safiro';
color: var(--headline-color);
max-width: 900px;
}



h3 {
  font-size: 24px;
  line-height: 1.3;
  margin: 0;
  padding-bottom: var(--padding-2);
  font-weight: 500;
font-family: 'Safiro';
color: var(--headline-color);
transition: all 0.3s ease-in-out;
}


h4 {
  font-size: 20px;
  line-height: 1.4;
  margin: 0;
  padding-bottom: var(--padding-2);
  font-weight: 600;
  color: var(--headline-color);
  text-transform: uppercase;
}



a {
  color: var(--text-color);
  text-underline-offset: 2px;
  font-size: 14px;
  line-height: 1.6;
  font-weight: 400;
  margin: 0;
  transition: all 0.2s ease-in-out;
}

a:hover {
  color: var(--dark-green);
  transition: all 0.2s ease-in-out;
}


p.section_headline {
  width: fit-content;
  color: var(--headline-color) !important;
  font-size: 17px;
  display: flex;
  margin-bottom: 12px;
  font-weight: 600;
  text-transform: uppercase;
}

.header_dark p.section_headline , .dark_bg p.section_headline{
  color: var(--white-text) !important;
  border: 1px solid var(--border-color);
}
/* p.section_headline:before {
content: "";
position: relative;
display: inline-block;
background: var(--green);
height: 16px;
width: 16px;
border-radius: 4px;

} */

/*******style set up***********/
.my_white,
.my_white h1,
.my_white h2,
.my_white h3,
.my_white h4,
.my_white h5,
.my_white h6,
.my_white p,
.my_white li,
.my_white div,
.my_white .style-simple blockquote,
.my_white .blockquote p.author span,
.my_white .counter .desc_wrapper .number-wrapper {
  color: var(--white-text) !important;
}
.my_green,
.my_green h1,
.my_green h2,
.my_green h3,
.my_green h4,
.my_green h5,
.my_green h6,
.my_green p,
.my_green li,
.my_green div {
  color: var(--green) !important;
}

/**********menu****************************************************************************************************************************/

.menu {
  padding: 0 var(--padding-5);
  transition: all 0.2s ease-in-out;
  position: fixed;
  z-index: 999;
  width: 100%;
  background: none;
  box-sizing: border-box;
  align-items: center;
  padding: var( --padding-1-5) 0 var( --padding-1-5) 0;
}


.menu_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1380px;
    align-items: center;
    transition: all 0.5s ease-in-out;
    border: transparent;
}



.menu_cta_btn .btn {
  margin-top: 0;
}

.menu_links {
  display: block;
  position: relative;
  align-self: center;
}

.menu svg {
  display: block;
  transition: all 0.4s ease-in-out;
}

.menu ul {
  list-style: none;
  display: flex;
  justify-content: space-between;
  margin:0;
  gap: var(--padding-2);
}

a.action_btn {
  border-radius: 7px;
  background: #224E4D;
  padding: 8px 16px;
  color: var(--green)!important;
  transition: all 0.5s ease-in-out;
  width: fit-content;
  margin-left: auto;
  box-sizing: border-box;
  display: flex !important;
  gap: 12px;
  width:198px;
  overflow: hidden;
}

.action_btn path{
 stroke: var(--green);
}


.sticky a.action_btn {
  transition: all 0.5s ease-in-out;
  width:40px;
  height: 40px;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

span.action_btn-text{
  transition: all 0.5s ease-in-out;
  white-space: nowrap;
  width:190px;
  overflow: hidden;
}
.sticky span.action_btn-text{
width:0;
overflow: hidden;
display:none;
transition-delay: display 0.5s;
}

.menu a {
  color: var(--white-text);
  text-decoration: none;
  font-weight: 400;
  letter-spacing: 1.1px;
  font-size: 16px;
  position:relative;
  display:block;
}

.logo_wrapper a:before{
  display:none!important;
}
.logo_wrapper {
  height:30px;
  width: 190px;
  transition: all 0.5s ease-in-out;
}
.logo_wrapper img {
  height:var(--padding-10);
}


.menu a:hover {
  cursor: pointer;

  color:var(--green);
}



.menu a.active{
    color: var(--green);
}


.menu ul{
  padding-inline-start: 0px;
}

ul.main_menu {
  background:var(--dark-blue);
  padding: 4px;
  border-radius: 12px;
}


/***************list-styling************/
.text_wrapper ul{
  padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 20px;
}

.text_wrapper li {
  list-style: none;
  margin: 0;
  padding: 0;
  color: var(--headline-color);
  display: flex;
  font-size: 16px;
  align-items: flex-start;
  font-weight: 600;
}

.text_wrapper li:before {
  content: "";
  height: 24px;
  width: 24px;
  display: inline-block;
  position: relative;
  margin-right: 8px;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background: url(/assets/img/check_full.svg);
  flex-shrink: 0;
}

.dark_bg .text_wrapper li:before, .header_dark .text_wrapper li:before {
  background: url(/assets/img/check.svg);
}

/********************Submenu****************/
.menu_item_link{
 position: relative; 
    border-radius: 8px;
}
li.menu_item_link.has_submenu:hover{
border-radius: 8px 8px 0 0 ;
}
.has_submenu .menu_lvl1_link{
  pointer-events: none!important;
}
.submenu img {
  height: 16px;
  width: 16px;
}.submenu a {
  display: flex;
  gap: 12px;
  align-items: center;
}

li.menu_item_link.active {
  border: 1px solid var(--green);
  border-radius: 8px;
}
li.menu_item_link.has_submenu.active:hover {
  border-color: var(--black);
  background-color: var(--black);
}
li.menu_item_link.has_submenu.active:hover .menu_lvl1_link {
color: var(--green);
}

.menu_item_link:hover .submenu{
display:block;
}

.menu_item_link:hover {
z-index: 55;
background:var(--black);
border-radius: 8px;
cursor:pointer;

  }
  .menu_item_link:hover a.menu_lvl1_link{
    color:var(--white-text);
    transition: none;
  }
  a.menu_lvl1_link.active{
    color:var(--green)
  }
  a.menu_lvl1_link.active:hover{
    color:var(--green)
  }
  .menu_item_link.active:hover{
    background: none;
  }

  .menu_item_link a{
    color:var(--light-text-color);
  }

  .menu_item_link a.menu_lvl1_link{
    padding: 4px 12px;
    transition: none;
    
  }

.submenu li {

  border-radius: 4px;
  transition: all 0.2s ease-in-out;
}
.submenu li a{
  color:var(--light-text-color);
  padding: 8px 16px;
  font-size: 14px;
}

.submenu li:hover{
  background: rgba(255, 255, 255, 0.050);
  transition: all 0.2s ease-in-out;
} 
.submenu li:hover a{
  color:var(--white-text)!important;
} 

ul.submenu{
  display: flex;
  flex-direction: column;
  position: absolute;
  left: 0;
  padding:12px;
  border-radius:0 8px 8px 8px;
  background:var(--black);
  border:1px solid var(--black);
  width: 100%;
  display: none;
  height: auto;
  width: fit-content;
  white-space: nowrap;
}
.submenu a{
  color:var(--white-text);
}
.submenu a.active{
  color: var(--green)!important;
}

/**********sticky menu***********/
.menu .content_wrapper{
  display:flex;
  justify-content: center;
}

.menu.sticky {
  transition: all 0.2s ease-in-out;
}

.sticky .menu_flex {
  background: var(--dark-blue); 
  transition: all 0.5s ease-in-out;
  width: 940px;
  padding: 2px 4px 2px 8px;
  border-radius: 11px;
 
}
.sticky .main_menu{
  transition: all 0.2s ease-in-out;
}
.sticky .content_wrapper{
  display:flex;
  justify-content: center;
  transition: all 0.5s ease-in-out;
}

.menu.sticky  g#word{
 opacity:0; 
transition:all 0.5s ease-in-out;
}
.menu g#word{
 opacity:1; 
  transition:all 0.5s ease-in-out;
  }

.menu.sticky  .logo_wrapper {
  height: 30px;
  width: 30px;
  overflow: hidden;
  transition:all 0.5s ease-in-out;
}


/**********sticky menu***********/

/***********buttons****************************************************************************************************************/

a.btn {
  padding: 12px 24px;
  text-decoration: none;
  transition: all 0.2s ease-in;
  font-size: 16px;
  font-weight: 600;
  border-radius:50px;
  position:relative;
  width: fit-content;
  color: var(--headline-color);
  display: flex;
  justify-content: center;
  background: var(--green);
}


a.btn:hover {
  background: var(--dark-green);
  border: 2px solid var(--dark-green);
  transition: all 0.2s ease-in;
  cursor: pointer;
}


a.btn_secondary {
  padding: 12px 24px;
  text-decoration: none;
  transition: all 0.2s ease-in;
  font-size: 14px;
  border-radius:8px;
  position:relative;
  width: fit-content;

  color: var(--headline-color);
  display: flex;
  justify-content: center;
  background: var(--background-light);
  border: 1px solid var(--border-color);
}

a.btn_secondary:hover {
  background: var(--dark-green);
  color: var(--text-dark);
  border: 1px solid var(--dark-green);
  transition: all 0.2s ease-in;
}


/***********layout*************************************************************************************************************************************************/
.section_wrapper {
padding: 0;
background-size: 100%;
    background-repeat: no-repeat!important;
    max-width: 100vw;
    position: relative;
    background-position: center center!important;
}

.section_wrapper.white_bg{
  background:var(--background-light);
}
.dark_bg{
  background: rgb(17, 46, 62);
  background: linear-gradient(247deg, rgb(15 68 96), rgba(0, 34, 51, 1) 100%);
  position: relative;
  z-index: 1;
  }

.section_wrapper.dark_bg , .section_wrapper.white_bg{
  padding: var(--section-padding) 0;
}

.dark_bg:before{
  content:"";
  display: block;
  top: 0;
  left: 0;
  position: absolute;
  height: 100%;
  width: 100%;
  background-image: url(/assets/img/noise.png);
  background-repeat: repeat;
  background-size: 130px 130px;
  z-index: -1;
}

.content_wrapper {
  max-width: 1440px;
  width: 100%;
  margin: auto;
  padding:0 var(--layout-padding);
  box-sizing: border-box;
}

.column_wrapper, .grid_container  {
  display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 24px;
width: 100%;
box-sizing: border-box;
}


.column_6 {
 grid-column: span 6;
}

.column_4 {
  grid-column: span 4;
}
.column_2 {
  grid-column: span 2;
}
.column_3 {
  grid-column: span 3;
}
.column_8 {
  grid-column: span 8;
}
.column_12 {
  grid-column: span 12;
}
.my_max_width {
  max-width: 800px;
}

/*********content**********************************************************************************************************************************************/

/***********Form**********************/
.honeypot {
  position: absolute;
  left: -9999px;
}

/***************************akkordion*************************/

  
  /****knöpfe +-*******/
 
  .accordion__intro:after {
    content: "+";
    font-size: 26px;
    font-weight:400;
    color: var(--text-dark);
    background: none;
    border-radius: 5px;
    margin-left: 50px;
    text-align: center;
    line-height: 0;
    transition: all 0.2s ease-in;
    right: 0;
  }
  .mobile_menu .accordion__intro:after {
    color: var(--text-dark);
    position: absolute;
    right: 16px;
}
  
  
  .accordion__active .accordion__intro:after {
    background: none;
    text-align: center;
    vertical-align: middle;
    transition: all 0.2s ease-in;
    transform: rotate(45deg);
    color: var(--green);
  }

  .accordion__active .accordion__intro_btn p, .accordion:hover .accordion__intro_btn p{
  color:var(--dark-green);
  }
  
  

  
  .accordion {
    width: 100%;
border-radius: 10px;
    overflow: hidden;
    margin-top: 10px;
    background-color: var(--background);
  }
  
    .accordion__intro {
      position: relative;
      padding: 20px;
      cursor: pointer;
      color:var(--text-dark);
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  
    .accordion__content {
      padding: 0 40px 00px 20px;
      max-height: 0;
      overflow: hidden;
      will-change: max-height;
      transition: all 0.25s ease-out;
      color: var(--text-dark);
    }
    .accordion__active .accordion__content {
      padding: 0 40px 20px 20px;
      transition: all 0.25s ease-out;
    }
    
    .accordion__intro img {
      height: 20px;
      width: 20px;
      margin-right: 10px;
  }
  .accordion__intro_btn{
    display: flex;
    align-items: center;
  }
  



/********footer***********************************/

ul.widget_menu li a:before {
  content: "";
  display: inline-block;
  position: relative;
  height: 20px;
  width: 20px;
  background: url(/assets/img/arrow_footer.svg);
  background-size: contain !important;
  top: 2px;
  margin-right: 8px;
}

footer {
  padding: 80px 0!important;
}
#scrolltop {
  position: fixed;
  right: 40px;
  bottom: 40px;
  z-index: 30;
  opacity: 0;
  transition: all .3s ease;
}
#scrolltop.vis{
  opacity: 1;
  visibility: unset;
  transition: all .3s ease;
}
#scrolltop a{
  width: 60px;
  height: 60px;
  font-weight: normal;
  line-height: 60px;
  text-align: center;
  background-color:#0d232e;
  font-size: 38px;
  color: rgba(255, 255, 255, 1);
  transition: all .3s ease;
  border-radius: 10px;
  text-decoration: none;
  display:block;
}

#scrolltop a:hover {
background:var(--green);
}


.copyright svg {
  height: 25px;
  width: fit-content;
}



/*copy***/
.footer_copy_wrapper {
  display: flex;
  justify-content: center;
  padding: 10px 20px;
  color: var(--light-text-color);
  width:100%;
  align-items: center;
  box-sizing: border-box;
  flex-wrap: nowrap;
}

.footer_copy {
padding:20px 0;
background:none;
}

.footer_copy_wrapper p,
.footer_copy_wrapper a {
  font-size: 15px;
  color: var(--light-text-color);
  font-weight:500;
}

.footer_copy_wrapper a:hover {
  color: var(--green);
}
/******widgets****/


footer{
  padding-bottom:0!important;
  border-radius: 0!important;
}

a.big_mail {
  text-decoration: none;
  color: var(--white-text);
  font-size: 32px;
  font-family: 'Safiro';
}

p.widget_headline {
  color: var(--light-text-color);
}
ul.widget_menu {
  padding: 0;
}
ul.widget_menu li {
list-style: none;
}


ul.widget_menu li a{
text-decoration: none;
color:var(--white-text);
font-size:16px;
}

ul.widget_menu li a:hover{
color: var(--green);
  }



/************fonts************************************************************************************************/

/******nav-icon**************************/



#nav-icon4 {
  width: 30px;
  height: 22px;
  position: relative;
  /* margin: 20px; */
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  cursor: pointer;
  display:block;
}

#nav-icon4 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: var(--white-text);
  border-radius: 0px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

#nav-icon4:hover span{
  background:var(--green);
}

#nav-icon4 span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(2) {
  top: 10px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(3) {
  top: 20px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -2px;
  left: 3px;
}

#nav-icon4.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

#nav-icon4.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 19px;
  left: 3px;
}

#nav-icon4.open span, div#nav-icon4.white-menu.open span{
  background:var(--green);
}

div#nav-icon4.white-menu span {
  background: var(--white-text);
}


/*****************************1440*****************************************************************************************/

@media only screen and (max-width: 1440px) {
}
/*****************************969*****************************************************************************************/

@media only screen and (max-width: 969px) {
  .text_wrapper li {
    font-size: 16px;
  }
}
/*****************************767*****************************************************************************************/

@media only screen and (max-width: 767px) {
  .header {
    padding-top: 120px !important;
}
}
/*****************************569*****************************************************************************************/

@media only screen and (max-width: 569px) {
}




@media screen and (max-width:1440px){

  h1.small_headline {
    font-size: 64px;
}

  h2 {
    font-size: 44px;
  }
}

  @media screen and (max-width:1280px){

    a.action_btn {
      width:40px;
      height: 40px;
      overflow: hidden;
      display: flex;
      justify-content: center;
      align-items: center;
    }
    
    .action_btn path{
     stroke: var(--green);
    }
    .sticky span.action_btn-text {
      white-space: nowrap;
      width: 190px;
      overflow: hidden;
      display: block;
  }
  span.action_btn-text {
    width: 0;
    overflow: hidden;
    display: none;
}
    
    .sticky a.action_btn {
      width: fit-content;
      display: flex !important;
      gap: 12px;
      width:198px;
      overflow: hidden;
    }

    li.menu_item_link.active {
      border: none!important;
  }

    .header_start h1 {
      font-size: 90px;
  }
  }

    @media screen and (max-width:969px){

      .section_wrapper.header_animate.vis {
        border-radius: 8px;
      }
      h1 {
        font-size: 64px!important;
    }

      p {
        font-size: 16px;
      }
      h2 {
        font-size: 40px;
      }
      h3 {
        font-size: 32px;
        padding-bottom: 8px;
    }

    }

      @media screen and (max-width:767px){

        a.btn_secondary, a.btn {
          font-size: 16px;
        }
      
        .leistungskachel {
          padding: 24px;
      }
        h1 {
          font-size: 48px!important;
      }
      h2 {
        font-size: 36px;
      }
      h3 {
        font-size: 28px;
        padding-bottom: 8px;
    }
      }



@media screen and (max-width:569px){
  :root{
    --section-padding:var( --padding-5);
    --layout-padding:var( --padding-2);
  }
 
  
  
  
  p.large_text {
    font-size: 22px;
  }
  
  
  h1 {
    font-size: 36px!important;
  }
  
  h1.small_headline{
    font-size: 36px;
  }
  
  
  
  h2 {
    font-size: 28px;
  }
  
  
  
  h3 {
    font-size: 22px;
    padding-bottom: 8px;
}
  
  
  h4 {
    font-size: 20px;
  }
}


/* =================== Glide Slideshow – Grundlayout =================== */
.glide {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem 0;
  text-align: center;
}

.glide__slide {
  text-align: center;
  box-sizing: border-box;
}

.glide-slide-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.glide-slide-image {
  width: 100%;
  max-width: 200px;
  margin: 0 auto;
}

.glide-slide-image img {
  display: block;
  width: 100%;
  height: auto;
  filter: grayscale(100%);
  transition: filter 0.4s ease, transform 0.3s ease;
}

.glide__slide:hover .glide-slide-image img {
  filter: grayscale(0%);
  transform: scale(1.02);
}

.glide-slide-caption {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #444;
  text-align: center;
  max-width: 90%;
}

/* Nur für images_caption */
.images_caption .glide-slide-caption {
  font-size: 0.9rem;
  color: #666;
}

/* Nur für images_text */
.images_text .glide-slide-caption {
  font-size: 1rem;
  color: #222;
}
/* =================== Navigation =================== */
.glide__arrows {
  display: flex;
  justify-content: center;
  gap: 1rem;
  margin-top: 1rem;
}

.glide__arrow {
  background: transparent;
  border: 1px solid #aaa;
  padding: 0.5rem 1rem;
  font-size: 1.5rem;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.glide__arrow:hover {
  background-color: #eee;
}

/* =================== Bullets =================== */
.glide__bullets {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
  width: 100%;
}

.glide__bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ccc;
  border: none;
  cursor: pointer;
  transition: background 0.3s ease;
}

.glide__bullet:hover,
.glide__bullet:focus {
  background: #888;
}

.glide__bullet--active {
  background: var(--green, #3a7); /* oder #000 im Dark Mode */
}

/* Optional: Dark Mode Styling */
.dark_bg .glide__bullet {
  background: #444;
}

.dark_bg .glide__bullet--active {
  background: #fff;
}



/* =================== Dark Mode Styles =================== */
.dark_bg .glide {
  background-color: #111;
  color: #f0f0f0;
  padding: 2rem 0;
}

.dark_bg .glide__arrow {
  background-color: transparent;
  border: 1px solid #555;
  color: #eee;
}

.dark_bg .glide__arrow:hover {
  background-color: #333;
  color: #fff;
}

.dark_bg .glide-slide-caption {
  color: #ddd;
}

.dark_bg .glide-slide-image img {
  filter: grayscale(100%);
}

.dark_bg .glide__slide:hover img {
  filter: grayscale(0%);
  transform: scale(1.02);
}

/* =================== Responsive Design =================== */
@media screen and (max-width: 1024px) {
  .glide-slide-image {
    max-width: 160px;
  }
}

@media screen and (max-width: 768px) {
  .glide-slide-image {
    max-width: 140px;
  }
  .glide__arrow {
    padding: 0.3rem 0.7rem;
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 480px) {
  .glide-slide-image {
    max-width: 120px;
  }
}
/* =================== ENDE Glide Slideshow – Grundlayout =================== */