/* =======================
    HEADER - NAVIGATION
======================= */
header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    z-index: 10;
}

header .container,
header .top_inner,
header .main_inner {
    height: 100%;
}

header .header_area {
    width: 100%;
    transition: var(--transition-base);
}

header .vz_header_top {
    height: var(--header-top-height);
    background: var(--color-primary-main);
}

header .top_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header .top_column {
    width: auto;
}

header .top_right_column {
    display: flex;
    gap: var(--spacing-xl);
}

.contact_data_container a,
.contact_data_container.location {
    display: flex;
    gap: var(--spacing-xs);
}

.location,
.location *,
.tel,
.tel *
.email,
.email *,
footer .footer_inner.bottom p,
footer .footer_inner.bottom span, 
footer .footer_inner.bottom a,
.copyright, .signature {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-md);
    transition: var(--transition-short);
}

header .vz_header_top a:hover,
footer .footer_inner.bottom a:hover {
    text-shadow: 0 0 #fff;
    color: #fff;
}

header .contact_data_container a:hover svg {
    stroke: #fff;
    stroke-width: 2.5px;
}

header .vz_header_main {
    height: var(--header-main-height);
    position: relative;
    background: #fff;
    box-shadow: var(--shadow-md);
    z-index: 4;
    transform: var(--transition-base);
}

header.menu_open .vz_header_main {
    box-shadow: none;
}

header.fixed .vz_header_main {
    position: fixed;
    top: 0;
    left: 0;
}

header .main_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

header nav.desktop {
    display: flex;
    align-items: center;
}

header nav.desktop ul {
    /* gap: var(--spacing-xl); */
    gap: 8rem;
}

@media screen and (max-width: 1599px) {
    .contact_data_container a, 
    .contact_data_container.location {
        gap: var(--spacing-xxs);
    }
}

@media screen and (max-width: 1280px) {
    header .top_right_column {
        gap: var(--spacing-lg);
    }
    
    header nav.desktop ul {
        gap: 6rem;
    }
    
    header nav.desktop ul li a {
        font-size: var(--font-size-base);
    }
}

@media screen and (max-width: 1024px) {
    header {
        position: fixed;
    }
    
    header .vz_header_top {
        display: none;
    }
    
    header .nav_container.desktop {
        display: none;
    }
}

/* =======================
    MOBILE MENU
======================= */

@media screen and (min-width: 1025px) {
    header .burger_menu_container,
    .mobile_menu {
        display: none;
    }
}

@media screen and (max-width: 1024px) {
    .visuallyHidden {
        display: none;
    }
    
    .burger_menu_container {
        display: flex;
        align-items: center;
    }

    .burger_menu_container label {
        margin: 0;
    }

    .burger_menu {
        width: 30px;
        height: 20px;
        position: relative;
        cursor: pointer;
    }
    
    .burger_menu .bar {
        width: 30px;
        height: 2px;
        background-color: var(--color-dark-6);
        display: block;
        border-radius: 4px;
        transition: all 0.4s ease-in-out;
        position: absolute; 
    }
    
    .bar1 {
        top: 0;
    }

    .bar2,
    .bar3 {
        top: 50%;
        transform: translateY(-50%);
    }
    
    .bar3 {
        right: 0;
    }
    
    .bar4 {
        bottom: 0;
    }

    header.menu_open .burger_menu_input + label > .burger_menu_item > .bar1{
        transform: translateX(40px);
        background-color: transparent;
    }
    
    header.menu_open .burger_menu_input + label > .burger_menu_item > .bar2{
        transform: rotate(45deg);
    }
    
    header.menu_open .burger_menu_input + label > .burger_menu_item > .bar3{
        transform: rotate(-45deg);
    }
    
    header.menu_open .burger_menu_input + label > .burger_menu_item > .bar4{
        transform: translateX(-40px);
        background-color: transparent;
    }

    .mobile_menu {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        
        background: #fff;
        width: 100vw;
        height: 100dvh;
        position: fixed;
        top: 0;
        left: 0;
        padding-top: var(--header-main-height);
        z-index: 3;
        transition: .55s ease-out;
    }

    .mobile_menu:not(.open) {
        left: -100vw;
    }

    .mobile_menu.open {
        left: 0;
    }

    .mobile_menu .mm_top {
        height: 100%;
        background: #fff;
    }

    .mobile_menu .mm_bottom {
        height: auto;
    }

    .mobile_menu .mm_top_container,
    .mobile_menu .mm_top .mm_container_inner,
    .mobile_menu .mm_nav_container_main,
    .mobile_menu .menu-mobiles-menue-container {
        height: 100%;
    }

    .mobile_menu .mm_top .mm_container_inner {
        padding: var(--spacing-lg) 0;
    }
    
    .mobile_menu .menu-mobiles-menue-container {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .mobile_menu .mm_nav_container_main ul {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 100%;
        height: 100%;
    }

    .mobile_menu .mm_nav_container_main ul li {
        display: flex;
        width: 100%;
        position: relative;
    }

    .mobile_menu .mm_nav_container_main ul li::before {
        content: '';
        background: url('../../img/icon-chevron-right-black.svg');
        background-repeat: no-repeat;
        background-size: contain;
        background-origin: center center;
        width: 30px;
        height: 30px;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        transition: var(--transition-short);
    }

    .mobile_menu .mm_nav_container_main ul li a {
        text-align: left;
        font-size: var(--font-size-md);
        display: block;
        width: 100%;
        padding: var(--spacing-sm) 0 var(--spacing-sm) var(--spacing-xs);
        border-bottom: 1px solid var(--color-dark-2);
    }

    .mobile_menu .mm_nav_container_main ul li:last-child a {
        border-bottom: none;
    }

    .mobile_menu .contact_container {
        display: none;
    }

    .mobile_menu .mm_bottom {
        padding: var(--spacing-sm) 0;
    }

    .mobile_menu .mm_bottom .mm_container_inner {
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: var(--spacing-xs);
    }

    .mobile_menu .mm_bottom .nav_container,
    .mobile_menu .copyright_signature_container {
        width: 100%;
    }

    .mobile_menu .mm_bottom ul {
        gap: var(--spacing-md);
        display: flex;
        justify-content: center;
    }


    .mobile_menu .mm_bottom ul li a,
    .mobile_menu .copyright, .mobile_menu .signature {
        font-size: var(--font-size-xs);
        color: var(--color-light-4);
        font-weight: var(--font-weight-light);   
    }

    .mobile_menu .copyright_signature_container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .mobile_menu .copyright, .mobile_menu .signature {
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
    .mobile_menu .mm_nav_container_main ul li a {
        font-size: var(--font-size-nav);
    }

    .mobile_menu .mm_nav_container_main ul li::before {
        width: 25px;
        height: 25px;
    }

    .mobile_menu .mm_bottom ul li a,
    .mobile_menu .copyright, .mobile_menu .signature {
        font-size: var(--font-size-xxs);
    }
}

@media screen and (max-width: 480px) {
    .burger_menu {
        width: 24px;
        height: 16px;
    }

    .burger_menu .bar {
        width: 24px; 
    }
    
    .mobile_menu .mm_nav_container_main ul li a {
        padding: var(--spacing-font-base) 0 var(--spacing-font-base) var(--spacing-xs);
        font-size: var(--font-size-base);
    }

    .mobile_menu .mm_nav_container_main ul li::before {
        width: 20px;
        height: 20px;
    }

    .mobile_menu .mm_bottom ul {
        justify-content: flex-start;
    }

    .mobile_menu .copyright_container, 
    .mobile_menu .signature_container {
        justify-content: flex-start;
    }

    .mobile_menu .copyright, .mobile_menu .signature {
        text-align: left;
    }
}



/* =======================
    A1 - TEXT
======================= */
section.a1_text[data-column="one_column"] .text_container {
    column-count: 1;
}

section.a1_text[data-column="two_column"] .text_container {
    column-count: 2;
    column-gap: calc(var(--spacing-xl) * 2);
}

section.a1_text .container_inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

section.a1_text .button_container {
    display: flex;
    justify-content: center;
}

@media screen and (min-width: 768px) {
    section.a1_text[data-column="one_column"] .container_inner {
        align-items: center;
    }
    
    section.a1_text[data-column="one_column"] .title,
    section.a1_text[data-column="one_column"] .text_container {
        text-align: center;
    }
}

@media screen and (max-width: 767px) {
    section.a1_text .button_container {
        justify-content: flex-start;
    }
}

/* =======================
    A2 - TEXT AND IMAGE
======================= */
section.a2_text_and_image .container_inner {
    display: flex;
}

section.a2_text_and_image[data-alignment="image_left_text_right"] .container_inner {
    flex-direction: row-reverse;
}

section.a2_text_and_image .content_container,
section.a2_text_and_image .image_container {
    width: 50%;
}

section.a2_text_and_image .content_container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

section.a2_text_and_image[data-alignment="text_left_image_right"] .content_container,
section.a2_text_and_image[data-alignment="image_left_text_right"] .image_container {
    padding-right: var(--spacing-lg);
}

section.a2_text_and_image[data-alignment="image_left_text_right"] .content_container,
section.a2_text_and_image[data-alignment="text_left_image_right"] .image_container {
    padding-left: var(--spacing-lg);
}

section.a2_text_and_image .subtitle_container,
section.a2_text_and_image .title_container {
    max-width: 80%;
}

section.a2_text_and_image .image {
    max-height: 600px;
    height: 100%;
}

@media screen and (max-width: 1599px) {
    section.a2_text_and_image[data-alignment="text_left_image_right"] .content_container,
    section.a2_text_and_image[data-alignment="image_left_text_right"] .image_container {
        padding-right: var(--spacing-md);
    }

    section.a2_text_and_image[data-alignment="image_left_text_right"] .content_container,
    section.a2_text_and_image[data-alignment="text_left_image_right"] .image_container {
        padding-left: var(--spacing-md);
    }

    section.a2_text_and_image .image {
        max-height: 500px;
    }
}

@media screen and (max-width: 1280px) {
    section.a2_text_and_image .subtitle_container, 
    section.a2_text_and_image .title_container {
        max-width: 100%;
    }
}

@media screen and (max-width: 1024px) {
    section.a2_text_and_image[data-alignment="text_left_image_right"] .content_container,
    section.a2_text_and_image[data-alignment="image_left_text_right"] .image_container {
        padding-right: var(--spacing-sm);
    }

    section.a2_text_and_image[data-alignment="image_left_text_right"] .content_container,
    section.a2_text_and_image[data-alignment="text_left_image_right"] .image_container {
        padding-left: var(--spacing-sm);
    }

    section.a2_text_and_image .content_container,
    section.a2_text_and_image .image_container {
        width: 100%;
    }
}

@media screen and (max-width: 767px) {
    section.a2_text_and_image[data-alignment="text_left_image_right"] .container_inner {
        flex-direction: column;
    }
    
    section.a2_text_and_image[data-alignment="image_left_text_right"] .container_inner {
        flex-direction: column-reverse;
    }

    section.a2_text_and_image[data-alignment="text_left_image_right"] .content_container,
    section.a2_text_and_image[data-alignment="image_left_text_right"] .image_container {
        padding-right: 0;
    }

    section.a2_text_and_image[data-alignment="image_left_text_right"] .content_container,
    section.a2_text_and_image[data-alignment="text_left_image_right"] .image_container {
        padding-left: 0;
    }

    section.a2_text_and_image .container_inner {
        gap: var(--spacing-md);
    }

    section.a2_text_and_image .image {
        max-height: 400px;
    }
}

@media screen and (max-width: 480px) {
    section.a2_text_and_image .image {
        max-height: 70vw;
    }
}

/* =======================
    A4 - PRODUCTS
======================= */

section.a4_products .heading_of_content .title,
section.a4_products .heading_of_content .text_container * {
    color: #fff;
}

section.a4_products .all_products {
    padding: var(--spacing-section) 0;
    position: relative;
    background-color: transparent;
    z-index: 1;
}

section.a4_products .all_products::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    /* background: linear-gradient( 
        to bottom right, 
        rgb(0, 100, 50) 0%, 
        rgb(0, 100, 50) 40%, 
        rgb(0, 100, 50) 100% 
    ); */
    /* background: linear-gradient( 
        to bottom right, 
        rgb(0, 100, 50) 0%, 
        rgb(3, 121, 62) 40%, 
        rgb(9, 133, 71) 100% 
    ); */

    background: linear-gradient( 
                    to bottom right, 
                    rgb(16, 115, 65) 0%, 
                    rgb(11, 129, 70) 40%, 
                    rgb(9, 103, 56) 100% 
                );
    height: 100%;
}


section.a4_products .products_container {
    position: relative;
    z-index: 1;
}

section.a4_products .items_container { 
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-sm);
}

/* Cards */
section.a4_products .item { 
    flex-grow: 1; /* Items in einer Reihe wachsen, um verbleibenden Platz dieser Reihe zu füllen */
    flex-shrink: 1; /* Bei kleineren Viewports schrumpfen die Cards */
    min-width: 0; /* verhindert Overflow bei langen Inhalten */
    max-width: calc( 66.6667% - var(--spacing-sm));
    border-radius: var(--border-radius-sm);
}

section.a4_products[data-column="four"] .item {
    flex-basis: calc( (100% - 3 * var(--spacing-sm)) / 4 ); /* 3x Zwischenraum und 4x Items */
}

section.a4_products[data-column="three"] .item {
    flex-basis: calc( (100% - 2 * var(--spacing-sm)) / 3 ); /* 2x Zwischenraum und 3x Items */
}

section.a4_products[data-column="two"] .item {
    flex-basis: calc( (100% - 1 * var(--spacing-sm)) / 2 ); /* 1x Zwischenraum und 2x Items */
}

section.a4_products[data-column="one"] .item {
    flex: 1 1 100%;
}

section.a4_products .item_teaser {
    border-bottom: 3px solid var(--color-dark-6);  
    overflow: hidden; 
    display: flex; 
    flex-direction: column; 
    transition: var(--transition-base); 
    cursor: pointer;
    background: #fff;
    box-shadow: var(--shadow-md);
}

section.a4_products .item_teaser_image_container {
    overflow: hidden;
}

section.a4_products .item.active { 
    border-color: var(--color-primary-main); 
}

section.a4_products .item_teaser_image_container {
    height: 330px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-primary-1);
}

section.a4_products .item_teaser_head img { 
    max-height: 100%;
    width: 100%;  
    object-fit: cover;
    transition: var(--transition-long);
}

section.a4_products .item_teaser_body_inner { 
    display: flex; 
    flex-direction: column;
    justify-content: space-between;
    padding: var(--spacing-md);
}

section.a4_products .item_teaser_heading_container {
    display: flex;
    flex-direction: column;
}

section.a4_products .item_teaser_title_container {
    display: flex;
    align-items: center;
}

section.a4_products .item_teaser_title {
    transition: var(--transition-short);
}

section.a4_products .item_teaser_title {
    font-size: var(--font-size-nav);
    color: var(--color-dark-6);
    
}

section.a4_products .item_teaser_description_container {
    margin-top: var(--spacing-font-base);
}

section.a4_products[data-background="light"] .item_teaser_description {
    color: var(--color-dark-5);
}

section.a4_products .button.tertiary {
    color: var(--color-primary-main);
}

section.a4_products .item:hover .item_teaser_title,
section.a4_products .item.active .item_teaser_title,
section.a4_products .item.active .button.tertiary,
section.a4_products .item:hover .button.tertiary,
section.a4_products .item .button.tertiary:hover {
    color: var(--color-primary-6);
}

section.a4_products .item:hover .item_teaser_title,
section.a4_products .item.active .item_teaser_title {
    text-shadow: 0 0 .5px var(--color-primary-6);
}

section.a4_products .button.tertiary svg {
    stroke: var(--color-primary-main);
}

section.a4_products .item.active .button.tertiary svg,
section.a4_products .item:hover .button.tertiary svg,
section.a4_products .item .button.tertiary:hover svg {
    stroke: var(--color-primary-6);
    transform: rotate(90deg);
}

section.a4_products[data-background="dark"] .item_teaser_description {
    color: #fff;
}

section.a4_products[data-background="colored"] .item_teaser_description {
    color: #fff;
}

section.a4_products .items_container {
    position: relative;
}

section.a4_products .details_height_wrapper {
    height: 0;
    transition: .4s ease;
}

section.a4_products .item_details_box {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: .4s ease;
    z-index: 10;

    padding: var(--spacing-xl) 0;
    border-radius: var(--border-radius-sm); 
    border: 1px solid var(--color-light-2); 
    background: #fff;
    box-shadow: var(--shadow-lg);
    overflow: hidden; 
    margin-top: var(--spacing-xl);
}

section.a4_products .item_details_box.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

section.a4_products .item_details_box_inner {
    display: flex;
}


section.a4_products .item_details_content_container,
section.a4_products .item_details_image_container { 
    flex: 1; 
}

section.a4_products .item_details_content_container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: var(--spacing-lg);
}

section.a4_products .item_details_heading_container {
    padding-bottom: var(--spacing-md);
}

section.a4_products .item_details_title_container {
    margin-bottom: var(--spacing-font-base);
}

section.a4_products .item_details_title {
    font-size: var(--font-size-md-fluid);
    font-weight: var(--font-weight-extrabold);
    color: var(--color-primary-main);
}

section.a4_products .item_details_description {
    font-size: var(--font-size-nav);
    font-weight: var(--font-weight-semibold);
}

section.a4_products .item_details_text_container {
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--color-dark-1);
}

section.a4_products .item_details_image_container {
    margin-left: var(--spacing-lg);
    display: flex;
    align-items: center;
}

section.a4_products .item_details_image_container .swiper-slide {
    display: flex;
    align-items: center;
}

section.a4_products .item_details_box img {
    height: 100%;
    /* min-height: 550px; */
    max-height: 550px;
    object-fit: contain;
}

section.a4_products .image_container .overlay {
    /* background: rgba(0, 0, 0, 0.45); */
	background: rgba(0, 0, 0, 0);
}


@media screen and (min-width: 1025px) {
    section.a4_products .item_details_box {
        display: block;
    }
    
    section.a4_products .item_accordeon_content { 
        display: none; 
    }

    section.a4_products .item:focus img.item_teaser_image, 
    section.a4_products .item:hover img.item_teaser_image { 
        transform: scale(1.10);
    }

    section.a4_products .item_accordeon_image_container svg {
        display: none;
    }
}

@media screen and (max-width: 1599px) {
    section.a4_products[data-column="four"] .item {
        flex-basis: calc( (100% - 2 * var(--spacing-sm)) / 3 ); /* 2x Zwischenraum und 3x Items */
    }
    
    section.a4_products .item_teaser_image_container {
        height: 250px;
    }

    section.a4_products .item_details_box {
        padding: var(--spacing-section) 0;
    }

    section.a4_products .item_details_box img {
        min-height: 450px;
        max-height: 535px
    }
}

@media screen and (max-width: 1280px) {
    section.a4_products .item_teaser_image_container {
        height: 220px;
    }
    
    section.a4_products .item_teaser_body_inner{
        padding: var(--spacing-sm);
    }

    section.a4_products .item_teaser_title {
        font-size: var(--font-size-base);
        font-weight: var(--font-weight-semibold)
    }

    section.a4_products .item_teaser_description_container {
        margin-top: var(--spacing-xs);
    }

    section.a4_products .item_details_content_container {
        margin-right: var(--spacing-md);
    }

    section.a4_products .item_details_image_container {
        margin-left: var(--spacing-md);
    }
}

/* Responsive */
@media screen and (max-width: 1024px) {
    section.a4_products .all_products::before {
        height: calc(100%);
    }

    section.a4_products .item { 
        flex-basis: calc( (100% - 1 * var(--spacing-sm)) / 2 ); /* 1x Zwischenraum und 2x Items */
        background: transparent;
    }

    section.a4_products[data-column="four"] .item {
        flex-basis: calc( (100% - 1 * var(--spacing-sm)) / 2 ); /* 1x Zwischenraum und 2x Items */
    }

    section.a4_products[data-column="three"] .item {
        flex-basis: calc( (100% - 1 * var(--spacing-sm)) / 2 ); /* 1x Zwischenraum und 2x Items */
    }

    section.a4_products .item_teaser_body_inner {
        padding: var(--spacing-md);
        padding-bottom: var(--spacing-sm);
    }
    
    section.a4_products .item_details_box {
        display: none;
    }
    
    section.a4_products .item_accordeon_content {
        display: none;
    }

    section.a4_products .item_accordeon_content_inner {
        display: flex;
    }    

    section.a4_products .item_teaser_image_container {
        height: 415px;
    }

    section.a4_products .item.active .item_accordeon_content {
        pointer-events: auto;
    }

    section.a4_products .item_accordeon_content_inner {
        flex-direction: column;
        padding: 0 var(--spacing-md) var(--spacing-md) var(--spacing-md);
    }

    section.a4_products .item_details_content_container,
    section.a4_products .item_details_image_container {
        width: 100%;
    }

    section.a4_products .item_details_content_container {
        margin-right: 0;
    }

    section.a4_products .item_details_image_container {
        margin-left: 0;
    }

    section.a4_products .item_details_heading_container,
    section.a4_products .item_details_image_container {
        display: none;
    }

    section.a4_products .item_details_text_container {
        padding: var(--spacing-sm) 0 var(--spacing-md) 0;
    }

    section.a4_products .item_details_description,
    section.a4_products .item_details_text_container * {
        font-size: var(--font-size-sm);
        color: var(--color-dark-6);
    }

    section.a4_products .item_accordeon_content .button_container {
        margin-top: 0;
    }

    section.a4_products .item[data-background="light"] .button.primary { 
        border-color: var(--color-primary-main);
        background: var(--color-primary-main);
        color: #fff;
    }

    section.a4_products .item[data-background="light"] .button.primary:hover { 
        border-color: var(--color-primary-6);
        background: var(--color-primary-6);
        color: #fff;
        text-shadow: 0 0 .5px #fff;
    }

    section.a4_products .item[data-background="light"] .button.primary:hover svg {
        stroke: #fff;
    }

    section.a4_products .item_accordeon_image_container svg {
        display: block;
        pointer-events: none;

        position: absolute;
        right: var(--spacing-lg);
        bottom: var(--spacing-md);
        object-fit: contain;
        width: 40px;
        height: 40px;
        z-index: 2;
    }
}

@media screen and (max-width: 767px) {
    section.a4_products .item {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }

    section.a4_products .item_teaser_image_container {
        height: 325px;
    }
}

@media screen and (max-width: 480px) {
    section.a4_products .item_teaser_image_container {
        max-height: 75dvh;
        height: auto;
        aspect-ratio: 1 / 1;
    }

    section.a4_products .item_teaser_body_inner {
        padding: var(--spacing-sm);
    }

    section.a4_products .item_teaser_title {
        font-size: var(--font-size-sm);
    }

    section.a4_products .item_teaser_description_container {
        margin-top: var(--spacing-xxs);
    }

    section.a4_products .item_accordeon_content_inner {
        padding: 0 var(--spacing-sm) var(--spacing-md) var(--spacing-sm);
    }
    
    section.a4_products .item_details_description_container {
        margin-top: var(--font-size-base);
    }

    section.a4_products .item_details_text_container {
        padding-bottom: var(--spacing-sm);
    }

    section.a4_products .item_details_description,
    section.a4_products .item_details_text_container * {
        font-size: var(--font-size-xs);
    }

    section.a4_products .item_accordeon_image_container svg {
        right: var(--spacing-md);
        width: 35px;
        height: 35px;
    }
}

/* =======================
    A6 - USPS
======================= */
section.a6_usps {
    z-index: 2;
    margin-top: -100px;
}

section.a6_usps .container_inner {
    padding: calc(var(--spacing-section) / 2) 0;
    background: #fff;
    box-shadow: var(--shadow-md);
}

section.a6_usps .item { 
    flex-grow: 1; /* Items in einer Reihe wachsen, um verbleibenden Platz dieser Reihe zu füllen */
    flex-shrink: 1; /* Bei kleineren Viewports schrumpfen die USPs */
    min-width: 0; /* verhindert Overflow bei langen Inhalten */
    max-width: calc( 66.6667% - var(--spacing-xl));
    border-radius: var(--border-radius-sm);
    display: flex;
    flex-direction: column;
    align-items: center;
}

section.a6_usps[data-column="three"] .item {
    flex-basis: calc( (100% - 2 * var(--spacing-xl)) / 3 ); /* 2x Zwischenraum und 3x Items */
}

section.a6_usps[data-column="two"] .item {
    flex-basis: calc( (100% - 1 * var(--spacing-xl)) / 2 ); /* 1x Zwischenraum und 2x Items */
}

section.a6_usps[data-column="one"] .item {
    flex: 1 1 100%;
}

section.a6_usps .items_container_inner {
    display: flex;
    justify-content: space-between;
    gap: var(--spacing-xl);
    flex-wrap: wrap;
}

section.a6_usps .item_description_container {
    margin-top: var(--spacing-xxs);
}

section.a6_usps .item_title,
section.a6_usps .item_description {
    text-align: center;
}

section.a6_usps svg,
section.a6_usps img {
    width: 50px;
    height: auto;
    margin-bottom: var(--spacing-sm);
}

section.a6_usps svg {
    stroke-width: 1.25px;
    stroke: var(--color-primary-main);
}

@media screen and (max-width: 1599px) {
    section.a6_usps {
        margin-top: -75px;
    }

    section.a6_usps svg, section.a6_usps img {
        width: 43px;
        margin-bottom: var(--spacing-font-base);
    }
}

@media screen and (max-width: 1280px) {
    section.a6_usps {
        margin-top: 0;
    }

    section.a6_usps[data-spacing="spacing_top_and_bottom"],
    section.a6_usps[data-spacing="bottom"] {
        padding-bottom: 0 !important;
    }

    section.a6_usps .container[data-container="large"] {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
}

@media screen and (max-width: 1024px) {
    section.a6_usps .items_container_inner {
        gap: var(--spacing-lg);
        justify-content: center;
    }

    section.a6_usps[data-column="three"] .item {
        flex-basis: calc( (100% - 1 * var(--spacing-lg)) / 2 ); /* 1x Zwischenraum und 2x Items */
    }
    
    section.a6_usps[data-column="two"] .item {
        flex-basis: calc( (100% - 1 * var(--spacing-lg)) / 2 ); /* 1x Zwischenraum und 2x Items */
    }
    
    section.a6_usps svg, section.a6_usps img {
        width: 40px;
    }
}

@media screen and (max-width: 767px) {
    section.a6_usps .container_inner {
        padding: var(--spacing-section) 0;
    }    

    section.a6_usps .items_container_inner {
        flex-wrap: wrap;
    }

    section.a6_usps .item {
        flex-direction: row;
        align-items: flex-start;
        gap: var(--spacing-md);
    }
    
    section.a6_usps .item {
        flex: 1 1 100% !important;
        width: 100%;
        max-width: 100%;
    }

    section.a6_usps svg, section.a6_usps img {
        margin-bottom: 0;
    }

    section.a6_usps .item_content_container {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: calc(100% - var(--spacing-md));
    }

    section.a6_usps .item_title, 
    section.a6_usps .item_description {
        text-align: left;
    }
}

@media screen and (max-width: 480px) {
    section.a6_usps .item {
        flex-direction: column;
        gap: 10px;
    }
    
    section.a6_usps svg, section.a6_usps img {
        width: 30px;
    }

    section.a6_usps .item_content_container {
        width: auto;
    }
}

/* =======================
    A7 - CONTACT
======================= */
section.a7_contact {
    position: relative;
}


section.a7_contact .image {
    min-height: 400px;
    max-height: 650px;
}



section.a7_contact .a7_contact_inner {
    position: relative;
}

section.a7_contact .a7_contact_container,
section.a7_contact .a7_contact_inner,
section.a7_contact .contact_content_container,
section.a7_contact .contact_content_inner,
section.a7_contact .background,
section.a7_contact .image {
    height: 100%;
}

section.a7_contact .background {
    position: relative;
    z-index: 1;
}

section.a7_contact .contact_content_container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 2;
}

section.a7_contact .contact_content_inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: var(--spacing-lg) 0;
}

section.a7_contact .content_container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: var(--spacing-md);
}

section.a7_contact .title,
section.a7_contact .text,
section.a7_contact .contact_data {
    color: #fff;
    text-align: center;
}

section.a7_contact .contact_data,
section.a7_contact .text {
    font-family: var(--font-heading);
    letter-spacing: var(--letter-spacing-md);
    font-size: var(--font-size-nav);
    font-weight: var(--font-weight-semibold);
}

section.a7_contact .contact_data_container a {
    display: flex;
    gap: var(--spacing-xs);
}

section.a7_contact .contact_data_container svg {
    width: 25px;
    height: auto;
    stroke: #fff;
    stroke-width: 1.75px;
}

section.a7_contact .contact_data_container a:hover {
    color: var(--color-primary-main);
}

section.a7_contact .contact_data_container a:hover svg {
    stroke: var(--color-primary-main);
}

section.a7_contact .title,
section.a7_contact .tel_container .contact_data {
    font-size: var(--font-size-xl);
}

section.a7_contact .text {
    font-weight: var(--font-weight-regular);
}

section.a7_contact .tel_container .contact_data {
    font-weight: var(--font-weight-extrabold);
}

section.a7_contact .email_container {
    margin-top: var(--spacing-sm);
}

@media screen and (max-width: 1599px) {
    section.a7_contact .image {
        min-height: 350px;
        max-height: 550px;
    }
    
    section.a7_contact .title,
    section.a7_contact .tel_container .contact_data {
        font-size: var(--font-size-lg);
    }
}

@media screen and (max-width: 1024px) {
    section.a7_contact .image {
        min-height: 300px;
        max-height: 500px;
    }
    
    section.a7_contact .title,
    section.a7_contact .tel_container .contact_data {
        font-size: var(--font-size-lg);
    }

    section.a7_contact .email_container {
        margin-top: var(--font-size-sm-fluid);
    }

    section.a7_contact .contact_data, 
    section.a7_contact .text {
        font-size: var(--font-size-sm-fluid);
    }

    section.a7_contact .contact_data_container a {
        gap: 10px;
    }

    section.a7_contact .contact_data_container svg {
        width: 18px;
        margin-top: 1px;
    }
}

@media screen and (max-width: 767px) {
    section.a7_contact .image {
        min-height: 450px;
        max-height: 650px;
    }

    section.a7_contact .content_container,
    section.a7_contact .contact_content_inner {
        align-items: flex-start;
    }

    section.a7_contact .title, 
    section.a7_contact .text, 
    section.a7_contact .contact_data {
        text-align: left;
    }
}

@media screen and (max-width: 480px) {
    section.a7_contact .image {
        min-height: auto;
        max-height: 100%;
        height: 565px;
    }

    section.a7_contact .title { 
        font-size: clamp(2rem, 6.5vw, 3rem); 
    }

    section.a7_contact .content_container {
        margin-bottom: var(--spacing-sm);
    }

    section.a7_contact .tel_container .contact_data {
        font-size: var(--font-size-md);
    }

    section.a7_contact .email_container {
        margin-top: 10px;
    }

    section.a7_contact .text {
        font-size: var(--font-size-xs);
        font-weight: var(--font-weight-light)
    }

    section.a7_contact .contact_data {
        font-size: var(--font-size-sm);
    }
}

/* =======================
    A20 - HERO
======================= */
section.a20_hero {
    height: 100dvh;
    position: relative;
}

section.a20_hero .hero_container,
section.a20_hero .hero_inner,
section.a20_hero .background,
section.a20_hero .image {
    height: 100%;
}

section.a20_hero .background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

section.a20_hero .hero_inner {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
}

section.a20_hero .content_container {
    width: 70%;
}

section.a20_hero .content_inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

section.a20_hero .title,
section.a20_hero .text_container * {
    color: #fff;
}

section.a20_hero .text_container * {
    font-size: var(--font-size-nav);
    font-weight: var(--font-weight-regular);
}

section.a20_hero .button.secondary {
    color: #fff;
}

section.a20_hero .button.secondary .arrow {
    stroke: #fff;
}

@media screen and (min-width: 1600px) {
    section.a20_hero {
        height: calc(100dvh - var(--header-full-height));
        margin-top: var(--header-full-height);
    }
}

@media screen and (max-width: 1599px) {
    section.a20_hero .hero_inner {
        padding-top: 135px;
    }

    section.a20_hero .content_container {
        width: 80%;
    }
}

@media screen and (max-width: 1024px) {
    section.a20_hero {
        height: auto;
        min-height: 80dvh;
        max-height: 100dvh;
        display: flex;
        align-items: flex-end;
    }

    section.a20_hero .hero_inner {
        padding-bottom: var(--spacing-xl);
    }
    
    section.a20_hero .content_container {
        width: auto;
    }

    
    section.a20_hero .title_container {
        margin-bottom: var(--spacing-md);
    }

    section.a20_hero .text_container * {
        font-size: var(--font-size-base);
    }
}

@media screen and (max-width: 480px) {
    section.a20_hero .title_container {
        margin-bottom: var(--spacing-xs);
    }
    
    section.a20_hero .text_container * {
        font-size: var(--font-size-sm);
        font-weight: var(--font-weight-light);
    }
}




/* =======================
    FOOTER
======================= */

footer {
    padding-top: var(--spacing-section);
}

footer .container_inner {
    display: flex;
    justify-content: space-between;
}

footer .footer_inner.top {
    padding-bottom: var(--spacing-xl);
}

footer .footer_block,
footer nav ul,
footer .contact_container {
    display: flex;
    flex-direction: column;
}

footer .left_column {
    padding-right: var(--spacing-lg);
    max-width: 465px;
    width: 100%;
}

footer .right_column {
    padding-left: var(--spacing-lg);
    max-width: calc(100% - 465px);
    width: 60%;
}

footer .logo_container {
    display: flex;
    justify-content: flex-start;
    margin-bottom: var(--spacing-md);
}

footer .logo {
    height: 105px;
}

footer .info_text_container {
    padding-right: var(--spacing-xl);
}

footer .info_text {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-light);
    color: var(--color-dark-5);
}


footer .right_column_inner {
    display: flex;
    justify-content: space-between;
    gap: var(--spacing-xl);
}

footer .right_column_inner .footer_block {
    display: flex;
    flex-direction: column;
    min-width: max-content;
}

footer .block_heading {
    margin-bottom: var(--spacing-font-base);
}

footer nav ul li, 
footer .footer_contact_item {
    margin-bottom: 10px;
}

footer nav ul li:last-child, 
footer .footer_contact_item:last-child {
    margin-bottom: 0;
}

footer nav ul li a,
footer .location, footer .location *,
footer .tel, footer .tel *,
footer .email, footer .email * {
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-regular);
    letter-spacing: var(--letter-spacing-md);
}

.contact_data_container.location {
    align-items: flex-start;
}

.contact_data_container.location svg, .contact_data_container.location img {
    margin-top: 2px;
}

footer .street_pc_city_data {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

footer .footer_inner.bottom {
    padding: var(--spacing-sm) 0;
    border-top: 1px solid var(--color-dark-2);
}

footer .footer_inner.bottom .copyright,
footer .footer_inner.bottom .signature {
    color: var(--color-dark-3);
    font-weight: var(--font-weight-light);
}

@media screen and (max-width: 1599px) {
    footer nav ul li a,
    footer .location, footer .location *,
    footer .tel, footer .tel *,
    footer .email, footer .email *,
    footer .font-sm, footer .font-xs,
    .mobile_menu  .font-sm, .mobile_menu .font-xs {
        font-size: var(--font-size-xs);
    }

    footer .logo {
        height: 90px;
    }

    footer .block_heading {
        margin-bottom: var(--spacing-xs);
    }
}

@media screen and (max-width: 1440px) {
    footer .left_column {
        max-width: 365px;
    }

    footer .right_column {
        max-width: calc(100% - 365px);
        width: 100%;
    }

    footer .info_text_container {
        padding-right: 0;
    }
}

@media screen and (max-width: 1280px) {
    footer .left_column {
        max-width: 30%;
        width: auto;
    }

    footer .right_column {
        max-width: 70%;
        width: auto;
    }
}

@media screen and (max-width: 1024px) {
    footer .footer_inner.top {
        padding-bottom: var(--spacing-md);
    }
    
    footer .logo,
    footer .block_two.footer_block {
        height: 80px;
    }

    footer .left_column {
        max-width: 35%;
        padding-right: var(--spacing-lg);
    }

    footer .right_column {
        max-width: 65%;
        padding-left: var(--spacing-lg);
    }
    
    footer .right_column_inner {
        flex-wrap: wrap;
        gap: inherit;
    }

    footer .block_two.footer_block {
        width: 100%;
        height: auto;
        padding-bottom: var(--spacing-sm);
        margin-bottom: var(--spacing-sm);
        border-bottom: 1px solid var(--color-dark-2);
    }

    footer .block_three.footer_block,
    footer .block_four.footer_block {
        width: calc(50% - var(--spacing-lg));
    }

    footer .block_heading {
        display: none;
    }

    footer nav.main ul {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: var(--spacing-sm);
    }

    footer nav ul li, footer .footer_contact_item {
        margin-bottom: 0;
    }

    footer nav.legal ul,
    footer .contact_container {
        gap: var(--spacing-xs);
    }
    
    footer nav.main ul li {
        width: calc(33.33333% - var(--spacing-sm));
        display: block;
    }

    footer nav.main ul li {
        margin-bottom: 0;
    }

    footer nav.main ul li a {
        font-size: var(--font-size-sm-fluid);
    }

    footer nav.legal ul li a {
        color: var(--color-dark-3);
        font-style: italic;
    }

    .contact_data_container a, .contact_data_container.location {
        gap: var(--spacing-xs);
    }
    
    footer nav.legal ul li a,
    footer .location, footer .location *, 
    footer .tel, footer .tel *, 
    footer .email, footer .email * {
        font-size: var(--font-size-xs);
        font-weight: var(--font-weight-light);
    }
    
    footer .font-sm, footer .font-xs,
    .mobile_menu .font-sm, .mobile_menu .font-xs {
        font-size: var(--font-size-xxs);
        font-weight: var(--font-weight-light);
    }
}

@media screen and (max-width: 767px) {
    footer .container_inner {
        flex-wrap: wrap;
    }

    footer .left_column,
    footer .right_column {
        max-width: 100%;
        width: 100%;
    }

    footer .left_column {
        padding-right: 0;
    }

    footer .right_column {
        padding-left: 0;
    }

    footer .right_column_inner {
        gap: 0 var(--spacing-md);
    }

    footer .logo_container {
        margin-bottom: var(--spacing-lg);
    }

    footer .logo {
        height: 120px;
    }

    footer .info_text_container {
        display: none;
    }

    footer .footer_block, 
    footer nav ul, 
    footer .contact_container {
        align-items: center;
    }

    footer nav.main,
    footer nav.main ul {
        width: 100%;
    }

    footer nav.main ul {
        justify-content: space-between;
        gap: var(--spacing-xs);
    }

    footer nav.main ul li {
        width: auto;
    }

    footer nav.main ul li a {
        font-size: var(--font-size-xs-fluid);
    }

    footer .right_column_inner .footer_block {
        min-width: auto;
    }

    footer .block_two.footer_block {
        padding-bottom: var(--spacing-md);
        margin-bottom: var(--spacing-md);
    }
    
    footer .block_three.footer_block {
        margin-bottom: var(--spacing-md);
    }
    
    footer .block_three.footer_block, 
    footer .block_four.footer_block {
        width: auto;
    }

    footer nav.legal ul {
        flex-direction: row;
        justify-content: flex-start;
        gap: var(--spacing-md);
    }

    footer .contact_container {
        align-items: flex-start;
    }

    footer .bottom .container_inner,
    .mobile_menu .copyright_signature_container {
        gap: var(--spacing-xxs);
    }
}

@media screen and (max-width: 480px) {
    footer nav.legal ul li a,
    footer .location, footer .location *, 
    footer .tel, footer .tel *, 
    footer .email, footer .email * {
        font-size: var(--font-size-xs);
    }

    footer .font-sm, footer .font-xs,
    .mobile_menu .font-sm, .mobile_menu .font-xs {
        font-size: var(--font-size-xxs);
    }

    footer .logo_container {
        margin-bottom: var(--spacing-md);
    }

    footer .logo {
        height: 90px;
    }

    footer nav.main ul {
        justify-content: center;
        gap: var(--spacing-sm);
    }

    footer nav.main ul li {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    footer nav.main ul li a {
        font-size: var(--font-size-sm-fluid);
        text-align: center;
    }

    footer .block_two.footer_block {
        padding-bottom: var(--spacing-sm);
        margin-bottom: var(--spacing-sm);
    }

    footer .block_three.footer_block,
    footer .block_four.footer_block {
        width: 100%;
    }

    footer .contact_container {
        align-items: center;
    }

    footer .street_pc_city_data {
        align-items: center;
    }

    footer .contact_container * {
        text-align: center;
    }

    footer .bottom .container_inner,
    .mobile_menu .copyright_signature_container {
        gap: 2px;
    }

    .copyright_container,
    .signature_container {
        display: flex;
        justify-content: flex-start;
        width: 100%;
    }
}


/* =======================
    A20 - HERO
======================= */

body.page-id-303 section.a1_text,
body.page-id-3 section.a1_text {
    margin-top: var(--header-full-height);
}

body.page-id-303 section.a1_text .container_inner,
body.page-id-3 section.a1_text .container_inner {
    align-items: flex-start;
}

body.page-id-303 section.a1_text[data-column="one_column"] .title, 
body.page-id-303 section.a1_text[data-column="one_column"] .text_container,
body.page-id-3 section.a1_text[data-column="one_column"] .title, 
body.page-id-3 section.a1_text[data-column="one_column"] .text_container {
    text-align: left;
}

body.page-id-303 section.a1_text ul, body.page-id-3 section.a1_text ul {padding-left: 2rem; margin-bottom: var(--spacing-font-base);}