@font-face{
    font-family:"Poppins";
    src:url(../fonts/Poppins-Regular.woff2) format("woff2"),url(../fonts/Poppins-Regular.woff) format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:"Poppins";
    src:url(../fonts/Poppins-Medium.woff2) format("woff2"),url(../fonts/Poppins-Medium.woff) format("woff");
    font-weight:500;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:"Poppins";
    src:url(../fonts/Poppins-Bold.woff2) format("woff2"),url(../fonts/Poppins-Bold.woff) format("woff");
    font-weight:bold;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:"Inter";
    src:url(../fonts/Inter18pt-Bold.woff2) format("woff2"),url(../fonts/Inter18pt-Bold.woff) format("woff");
    font-weight:bold;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:"Inter";
    src:url(../fonts/Inter18pt-Regular.woff2) format("woff2"),url(../fonts/Inter18pt-Regular.woff) format("woff");
    font-weight:normal;
    font-style:normal;
    font-display:swap
}
input,select,textarea,button{
    font-family:"Poppins",sans-serif
}
html{
    text-rendering:optimizeLegibility !important;
    -webkit-font-smoothing:antialiased !important
}
body{
    font-family:"Poppins",sans-serif;
    font-size:2rem;
    font-size:clamp(1.125rem,1.7777777778vw,2rem);
    line-height:1.53
}
h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5{
    font-weight:700;
    margin:0
}
.accordion .accordion-item .accordion-button {
    font-weight: 500;  /* Verringert von 700 */
}
h1,.h1{
    font-size:clamp(2.5rem,4.4444444444vw,5rem);
    line-height:1.06;
    margin:0
}
h2,.h2{
    font-size:clamp(1.76rem,3.5555555555vw,4rem); /* 20% reduziert - vorher: clamp(2.2rem,4.4444444444vw,5rem) */
    line-height:1.06;
    margin:0
}
h3,.h3,.accordion .accordion-item .accordion-button{
    font-size:clamp(1.65rem,3.2222222222vw,3.625rem);
    line-height:1;
    margin:0
}
h4,.h4{
    font-size:clamp(1.5rem,2.2222222222vw,2.5rem);
    line-height:1.25;
    margin:0 0 1.2rem
}
h5,.h5{
    font-size:clamp(1.25rem,1.7777777778vw,2rem);
    line-height:1;
    margin:0 0 1.2rem
}
*,*:before,*:after{
    box-sizing:border-box
}
html,body{
    width:100%
}
p,ul,ol{
    margin:0 0 1.2rem
}
figure{
    margin:0
}
img{
    display:block;
    width:100%;
    height:auto
}
body{
    background-color:#fff;
    color:#000;
    padding:0;
    margin:0
}
a{
    transition:all .25s;
    color:inherit
}
.container{
    margin-left:auto;
    margin-right:auto;
    width:100%;
    max-width:1806px;
    padding-left:calc(2rem*.5);
    padding-right:calc(2rem*.5)
}
@media(min-width: 1024px){
    .container{
        padding-left:calc(15rem*.2);
        padding-right:calc(15rem*.2)
    }
    .container--lg{
        padding-left:calc(6.5rem*.2);
        padding-right:calc(6.5rem*.2)
    }
    .container--sm{
        padding-left:calc(31.625rem*.2);
        padding-right:calc(31.625rem*.2)
    }
}
@media(min-width: 1400px){
    .container{
        padding-left:calc(15rem*.3);
        padding-right:calc(15rem*.3)
    }
    .container--lg{
        padding-left:calc(6.5rem*.3);
        padding-right:calc(6.5rem*.3)
    }
    .container--sm{
        padding-left:calc(31.625rem*.3);
        padding-right:calc(31.625rem*.3);
        max-width: 1200px!important; /* Begrenzung für große Bildschirme - verhindert zu große Elemente */
    }
}
@media(min-width: 1800px){
    .container{
        padding-left:calc(15rem*.5);
        padding-right:calc(15rem*.5)
    }
    .container--lg{
        padding-left:calc(6.5rem*.5);
        padding-right:calc(6.5rem*.5)
    }
    .container--sm{
        padding-left:calc(31.625rem*.3);
        padding-right:calc(31.625rem*.3);
        max-width: 1200px!important; /* Begrenzung für große Bildschirme - verhindert zu große Elemente */
    }
}
button{
    cursor:pointer;
    background:none;
    border:none;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none
}
.page-wrapper--home{
    --primary: #d8017e;
    --secondary: #00a0ff;
    --accent: #1f55b8;
    --header-bg: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(216, 1, 126, 0.25), rgba(216, 1, 126, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2))
}
.page-wrapper--theme-blue{
    --primary: #00aaff;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(0, 170, 255, 0.25), rgba(0, 170, 255, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(0, 170, 255, 0.25), rgba(0, 170, 255, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(0, 170, 255, 0.25), rgba(0, 170, 255, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(0, 170, 255, 0.25)
}
.page-wrapper--inner-page{
    --header-bg: var(--primary);
    --header-highlight: #fff
}
/* Höhere Berufsbildung (Blau) - Glaseffekt */
.page-wrapper--theme-blue.page-wrapper--glass{
    --header-bg: linear-gradient(rgba(0, 170, 255, 0.25), rgba(0, 170, 255, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
}
/* Höhere Berufsbildung (Blau) - Solid */
.page-wrapper--theme-blue.page-wrapper--inner-page{
    --header-bg: var(--primary);
}
/* Hochschule (Dunkelblau) - Glaseffekt */
.page-wrapper--theme-darkblue{
    --primary: #2260c0;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(34, 96, 192, 0.25);
}
.page-wrapper--theme-darkblue.page-wrapper--glass{
    --header-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
}
/* Hochschule (Dunkelblau) - Solid */
.page-wrapper--theme-darkblue.page-wrapper--inner-page{
    --header-bg: var(--primary);
    --header-highlight: #fff;
}
/* Services (Grün) - Glaseffekt */
.page-wrapper--theme-green{
    --primary: #3b7d23;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(59, 125, 35, 0.25);
}
.page-wrapper--theme-green.page-wrapper--glass{
    --header-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
}
/* Services (Grün) - Solid */
.page-wrapper--theme-green.page-wrapper--inner-page{
    --header-bg: var(--primary);
    --header-highlight: #fff;
}
/* Academy (Gelb) - Glaseffekt */
.page-wrapper--theme-yellow{
    --primary: #b1d348;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(177, 211, 72, 0.25);
}
.page-wrapper--theme-yellow.page-wrapper--glass{
    --header-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
}
/* Academy (Gelb) - Solid */
.page-wrapper--theme-yellow.page-wrapper--inner-page{
    --header-bg: var(--primary);
    --header-highlight: #fff;
}
/* Allgemeinen (Magenta) - Solid */
.page-wrapper--home.page-wrapper--solid{
    --header-bg: var(--primary);
    --header-highlight: #fff;
}
button{
    color:inherit
}
.btn{
    --btn-height: 80px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 1.875rem;
    height:var(--btn-height);
    font-size:inherit;
    font-weight:400;
    line-height:1.2;
    background-color:var(--btn-bg);
    color:var(--btn-color);
    box-shadow:none;
    border-radius:0;
    border:var(--btn-border-width) solid var(--btn-border);
    white-space:nowrap;
    transition:all .25s;
    text-align:center;
    text-decoration:none
}
.btn--primary{
    --btn-bg: var(--primary);
    --btn-color: white;
    --btn-border-width: 0
}
.btn--primary:hover{
    --btn-bg: var(--secondary)
}
.btn--download{
    --btn-color: var(--primary);
    --btn-bg: var(--btn-download-bg);
    --btn-border: var(--primary);
    --btn-border-width: 5px;
    padding:0
}
.btn--download .btn__icon{
    height:100%;
    min-width:2.5em;
    aspect-ratio:1/1;
    background-color:var(--primary);
    display:flex;
    align-items:center;
    justify-content:center;
    padding-left:var(--btn-border-width);
    overflow:hidden
}
.btn--download .btn__icon svg{
    display:block;
    height:65%;
    width:auto
}
.btn--download .btn__icon svg path{
    stroke:#fff
}
.btn--download .btn__text{
    display:inline-block;
    padding:0 2.75rem
}
.btn--download:hover .btn__icon svg{
    animation:arrowDown .4s both
}
@media(max-width: 1799.98px){
    .btn{
        --btn-height: 70px
    }
}
@media(max-width: 1023.98px){
    .btn{
        --btn-height: 60px
    }
}
@media(max-width: 767.98px){
    .btn{
        --btn-height: 48px
    }
}
@keyframes arrowDown{
    0%{
        transform:translate(0, 0);
        opacity:1
    }
    60%{
        transform:translate(0, 100%);
        opacity:0
    }
    60.1%{
        transform:translate(0, -100%);
        opacity:0
    }
    100%{
        transform:translate(0, 0);
        opacity:1
    }
}
.link-arrow{
    background-color:var(--primary);
    font-size:clamp(4rem,6vw,6.75rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden
}
.link-arrow--sm{
    font-size:clamp(4rem,4.4444444444vw,5rem)
}
.link-arrow img,.link-arrow svg{
    display:block;
    /* width:74%; */
    width:50%;
    height:auto;
    margin:auto
}
@media(min-width: 1024px){
    .link-arrow:hover svg,.link-arrow:hover img{
        animation:arrow .4s both
    }
}
@keyframes arrow{
    0%{
        transform:translate(0, 0);
        opacity:1
    }
    60%{
        transform:translate(100%, 0%);
        opacity:0
    }
    60.1%{
        transform:translate(-100%, 0%);
        opacity:0
    }
    100%{
        transform:translate(0, 0);
        opacity:1
    }
}
label,button{
    cursor:pointer
}
input:focus,textarea:focus,select:focus,button:focus{
    box-shadow:none;
    outline:none
}
.form-input,.form-select{
    display:block;
    width:100%;
    padding:.53125rem 1.375rem;
    font-size:clamp(1.125rem,1.7777777778vw,2rem);
    line-height:1.5;
    color:#000;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    background-color:#f5f5f5;
    border:solid #f5f5f5;
    border-width:2px;
    border-radius:0
}
.form-input::-webkit-input-placeholder,.form-select::-webkit-input-placeholder{
    color:#656565;
    opacity:1
}
.form-input:-moz-placeholder,.form-select:-moz-placeholder{
    color:#656565;
    opacity:1
}
.form-input::-moz-placeholder,.form-select::-moz-placeholder{
    color:#656565;
    opacity:1
}
.form-input:-ms-input-placeholder,.form-select:-ms-input-placeholder{
    color:#656565;
    opacity:1
}
.form-select{
    padding-right:2rem;
    background-image:url("data:image/svg+xml,%3csvg width=%2745%27 height=%2727%27 viewBox=%270 0 45 27%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M2.5 2.5L21.8684 22.5L42.2895 2.5%27 stroke=%27black%27 stroke-width=%275%27 stroke-linecap=%27round%27 /%3e%3c/svg%3e");
    background-position:right 20px top 50%;
    background-repeat:no-repeat;
    cursor:pointer
}
.form-select option{
    background-color:#fff;
    color:#000
}
@media(max-width: 1399.98px){
    .form-select{
        background-position:right 10px top 50%;
        background-size:20px auto
    }
}
.form__wrapper{
    display:flex;
    flex-wrap:wrap;
    margin-left:calc(1rem*-0.5);
    margin-right:calc(1rem*-0.5);
    margin-top:calc(1.5rem*-1)
}
.form__wrapper>div{
    padding-left:calc(1rem*.5);
    padding-right:calc(1rem*.5)
}
.form__wrapper>div{
    margin-top:1.5rem
}
.form__field{
    width:100%
}
.form__field--checkbox{
    display:flex;
    align-items:center
}
.form__field--checkbox input{
    background:none;
    border:none;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    width:24px;
    height:24px;
    background-color:#f5f5f5;
    cursor:pointer;
    margin:0 10px 0 0
}
.form__field--checkbox input:checked{
    background:var(--primary) url("data:image/svg+xml,%3csvg width=%2730%27 height=%2724%27 viewBox=%270 0 30 24%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3e%3cpath d=%27M2.5 7.5L13.209 19.5L27.2104 2.5%27 stroke=%27white%27 stroke-width=%275%27 stroke-linecap=%27round%27 /%3e%3c/svg%3e") 50%/50% no-repeat
}
.form__field--checkbox label{
    font-weight:400;
    font-size:clamp(.875rem,1.1666666667vw,1.3125rem);
    color:#656565
}
.form__footer{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.form__footer .btn{
    flex:0 0 auto
}
.form textarea{
    height:150px
}
@media(min-width: 768px){
    .form__field--half{
        width:50%
    }
    .form__field--checkbox input{
        width:43px;
        height:43px
    }
}
@media(min-width: 1400px){
    .form__wrapper{
        margin-left:calc(1.375rem*-0.5);
        margin-right:calc(1.375rem*-0.5);
        margin-top:calc(2.2rem*-1)
    }
    .form__wrapper>div{
        padding-left:calc(1.375rem*.5);
        padding-right:calc(1.375rem*.5)
    }
    .form__wrapper>div{
        margin-top:2.2rem
    }
    .form textarea{
        height:236px
    }
}
.main-nav{
    width:100%;
    position:relative
}
.main-nav .nav-indicator{
    background:var(--header-highlight);
    margin:-14px 0 0 -19px
}
.main-nav__list{
    display:flex;
    justify-content:space-between;
    list-style:none;
    margin:0;
    padding:0;
    font-weight:700;
    font-size:16px
}
.main-nav__list li{
    position:relative
}
.main-nav__list li a{
    position:relative;
    display:inline-block;
    text-decoration:none;
    color:#fff
}
.main-nav__list li .submenu{
    list-style:none;
    margin:0;
    padding:0
}
@media(min-width: 1024px){
    .main-nav__list li .submenu{
        position:absolute;
        left:0;
        top:100%;
        width:auto;
        min-width:220px;
        white-space:nowrap;
        padding:27px 0;
        margin:0;
        list-style:none;
        opacity:0;
        visibility:hidden;
        transform:scaleY(0);
        transform-origin:center 0;
        transition:transform .2s ease
    }
    .main-nav__list li .submenu li{
        margin:0 0 11px
    }
    .main-nav__list li .submenu li:last-child{
        margin:0
    }
    .main-nav__list li .submenu li a{
        font-size:18px
    }
    .main-nav__list li:hover>.submenu{
        opacity:1;
        visibility:visible;
        transform:scaleY(1)
    }
}
@media(max-width: 1799.98px){
    .main-nav .nav-indicator{
        margin:-9px 0 0 -14px
    }
    .main-nav__list li .submenu li a{
        font-size:inherit
    }
}
@media(max-width: 1399.98px){
    .main-nav__list{
        font-size:14px
    }
    .main-nav__list li a{
        font-weight:500;
        font-size:14px
    }
    .main-nav__list li .submenu{
        padding:16px 0
    }
    .main-nav__list li .submenu li{
        margin:0 0 5px
    }
}
@media(max-width: 1023.98px){
    .main-nav{
        position:absolute !important;
        left:0;
        top:100%;
        width:100%;
        height:calc(100dvh - 80px);
        padding:16px 0;
        opacity:0;
        transform:translateY(-150%);
        transition:all .01s
    }
    .main-nav.active{
        opacity:1;
        transform:translateY(0)
    }
    .main-nav.active .main-nav__list{
        opacity:1;
        transition-delay:.15s;
        transition-duration:.2s
    }
    .main-nav__list{
        height:100%;
        overflow:auto;
        display:block;
        padding:0 16px;
        opacity:0;
        transition:all .2s
    }
    .main-nav__list li{
        margin:0 0 15px
    }
    .main-nav__list li a{
        font-size:18px
    }
    .main-nav__list li .submenu{
        max-height:none;
        transition:none;
        overflow:visible;
        margin:0;
        padding:0 0 0 1rem;
        display:block
    }
    .main-nav__list li .submenu li a{
        font-size:16px
    }
    .main-nav__list li.is-opened .submenu{
        max-height:none
    }
}
.has-indicator{
    position:relative
}
.nav-indicator{
    position:absolute;
    top:0;
    left:0;
    width:19px;
    height:19px;
    background:var(--primary);
    pointer-events:none;
    opacity:0;
    transform:translate(0, 0);
    transition:transform .25s ease,opacity .15s ease
}
@media(max-width: 1799.98px){
    .nav-indicator{
        width:14px;
        height:14px
    }
}
.navbar-toggler{
    background:none;
    border:none;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    width:2.5rem;
    height:2.5rem;
    margin-left:1.25rem;
    position:relative;
    z-index:9
}
.navbar-toggler .navbar-toggler-icon{
    display:block;
    padding:0;
    width:1.5rem;
    position:relative;
    background-color:#fff;
    margin:auto;
    height:2px
}
.navbar-toggler .navbar-toggler-icon:before,.navbar-toggler .navbar-toggler-icon:after{
    content:"";
    position:absolute;
    left:0;
    width:100%;
    height:2px;
    background:#fff;
    transition:all .2s linear
}
.navbar-toggler .navbar-toggler-icon:before{
    top:-6px
}
.navbar-toggler .navbar-toggler-icon:after{
    bottom:-6px
}
.navbar-toggler.active .navbar-toggler-icon{
    background-color:rgba(0,0,0,0)
}
.navbar-toggler.active .navbar-toggler-icon:before{
    background-color:#fff;
    width:100%;
    transform:translateY(6px) rotate(45deg)
}
.navbar-toggler.active .navbar-toggler-icon:after{
    background-color:#fff;
    width:100%;
    transform:translateY(-6px) rotate(-45deg)
}
@media(min-width: 1024px){
    .navbar-toggler{
        display:none
    }
}
.languages{
    position:relative
}
.languages__toggler{
    font-weight:700;
    font-size:18px;
    color:#fff;
    padding:.5rem 0
}
.languages__drop{
    position:absolute;
    width:60px;
    margin-left:-30px;
    left:50%;
    top:100%;
    background-color:rgba(0,0,0,.5);
    opacity:0;
    visibility:hidden;
    transform:scaleY(0);
    transform-origin:center 0;
    transition:transform .2s ease
}
.languages__var{
    font-weight:700;
    font-size:18px;
    color:#fff;
    padding:.5rem 1rem
}
.languages.active .languages__drop{
    opacity:1;
    visibility:visible;
    transform:scaleY(1)
}
.section-header{
    /* margin:0 0 10.5rem */
    margin:0 0 6.5rem
}
.section-header h2{
    margin:0 0 2.5rem;
    max-width:10em
}
.section-header p{
    margin:0;
    max-width:36.25em
}
@media(max-width: 1399.98px){
    .section-header{
        margin:0 0 5rem
    }
    .section-header h2{
        margin:0 0 2rem
    }
}
@media(max-width: 767.98px){
    .section-header{
        margin:0 0 3rem
    }
    .section-header h2{
        margin:0 0 1.5rem
    }
}
.accordion{
    --border-wd: 2.5px  /* Verringert von 3px (unter 1400px) - vorher: 6px */
}
.accordion .accordion-item{
    border-top:var(--border-wd) solid #000
}
.accordion .accordion-item .accordion-button{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 0 0 1rem;
    color:#000;
    text-align:left
}
.accordion .accordion-item .accordion-button:after{
    content:"";
    font-size:clamp(3rem,6vw,84px);
    width:1em;
    flex:0 0 auto;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:var(--primary);
    background-image:url(../images/arrow-acc.svg);
    background-position:center;
    /* background-size:74%; */
    background-size:50%;
    background-repeat:no-repeat;
    margin-left:1.5rem;
    transition:transform .2s
}
.accordion .accordion-item .accordion-body{
    height:0;
    overflow:hidden;
    transition:height .2s
}
.accordion .accordion-item .accordion-body .inner{
    padding:0 1rem 1rem
}
.accordion .accordion-item.active .accordion-button:after{
    transform:scaleY(-1)
}
@media(max-width: 1399.98px){
    .accordion{
        --border-wd: 2.5px  /* Verringert von 3px - wird auch für > 1400px verwendet */
    }
}
@media(max-width: 767.98px){
    .accordion .accordion-item .accordion-button{
        padding:0;
        font-size:1.125rem
    }
    .accordion .accordion-item .accordion-body .inner{
        padding:1rem 0
    }
}
.card{
    display:block;
    position:relative;
    text-decoration:none
}
.card figure{
    display:block;
    position:relative;
    padding-top:175.3%
}
.card figure img{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover;
    -o-object-position:center;
    object-position:center
}
.card__buttons{
    position:absolute;
    right:0;
    bottom:100%;
    display:flex
}
.card__overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    -webkit-backdrop-filter:blur(50px);
    backdrop-filter:blur(50px);
    background:var(--card-bg);
    font-size:clamp(1rem,1.6111111111vw,1.8125rem);
    padding:1.375rem 1.375rem 1.2rem;
    color:#fff
}
.card__overlay h3{
    margin:0 0 1rem
}
.card__overlay h5{
    margin:.8rem 0 1rem
}
.card__overlay p{
    margin:0;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.card__overlay a{
    text-decoration:none
}
.card__overlay a:hover{
    text-decoration:underline
}
.card__info{
    font-size:clamp(1rem,1.1111111111vw,1.25rem)
}
.card__subtitle{
    font-weight:500;
    margin:0 0 1.3rem
}
.card__label{
    -webkit-backdrop-filter:blur(50px);
    backdrop-filter:blur(50px);
    background:var(--card-bg);
    font-size:clamp(4rem,4.4444444444vw,5rem);
    width:1em;
    aspect-ratio:1/1
}
.card__label-inner{
    border:5px solid var(--primary);
    font-family:"Inter",sans-serif;
    font-size:clamp(1.125rem,1.7777777778vw,2rem);
    line-height:1;
    text-transform:uppercase;
    color:var(--primary);
    padding:.1em;
    display:flex;
    align-items:center;
    justify-content:center;
    height:100%
}
.card--team .card__overlay{
    padding-bottom:1.9rem
}
@media(max-width: 1799.98px){
    .card--team .card__overlay{
        padding-bottom:1rem
    }
}
@media(max-width: 1023.98px){
    .card__overlay{
        padding:1rem
    }
    .card__overlay h3{
        margin:0 0 .5rem
    }
    .card__overlay p{
        line-height:1.25
    }
}
@media(max-width: 767.98px){
    .card figure{
        display:block;
        position:relative;
        padding-top:150%
    }
    .card figure img{
        position:absolute;
        left:0;
        top:0;
        width:100%;
        height:100%;
        -o-object-fit:cover;
        object-fit:cover;
        -o-object-position:center;
        object-position:center
    }
}
.tabs{
    --border-wd: 6px
}
.tabs .tabs-menu{
    border-bottom:var(--border-wd) solid #000
}
.tabs .tabs-menu .nav-indicator{
    width:1.125em;
    height:1.125em;
    margin:-0.75em 0 0 -1.125em
}
.tabs .tabs-menu ul{
    margin:0;
    padding:0;
    list-style:none;
    display:flex;
    justify-content:space-between
}
.tabs .tabs-menu .tab-link{
    display:block;
    padding:0 0 1.4rem;
    font-weight:700;
    color:#000;
    cursor:pointer;
    transition:.3s;
    text-align:left;
    font-size:inherit
}
.tabs .tabs-content{
    padding:6.25rem 0 0;
    overflow:hidden;
    position:relative
}
.tabs .tabs-content .tab-content{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .3s ease;
    position:absolute;
    inset:0
}
.tabs .tabs-content .tab-content.active{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    position:relative
}
@media(max-width: 1399.98px){
    .tabs{
        --border-wd: 3px
    }
    .tabs .tabs-content{
        padding:4rem 0 0
    }
}
@media(max-width: 767.98px){
    .tabs .tabs-menu{
        overflow:auto;
        width:100%;
        padding:14px 0 0 20px
    }
    .tabs .tabs-menu ul{
        display:inline-flex;
        gap:1.5rem;
        white-space:nowrap
    }
    .tabs .tabs-menu .tab-link{
        font-size:1rem;
        padding:0 0 1rem
    }
    .tabs .tabs-content{
        padding:3rem 0 0
    }
}
.category-filter{
    padding:2.1rem 0 3.25rem 0;
    display:flex;
    justify-content:space-between
}
.category-filter__item-title{
    margin:0 0 3.3rem
}
/* Desktop ab 1515px: Prozentuale Verteilung der Filter-Items */
@media(min-width: 1515px){
    .category-filter{
        justify-content:flex-start;
        gap:2rem;
        flex-wrap:wrap
    }
    .category-filter__item{
        flex:0 0 auto!important;
    }
    .category-filter__item:nth-child(1){
        width: 18%;
    }
    .category-filter__item:nth-child(2){
        width: 30%;
    }
    .category-filter__item:nth-child(3){
        width: 20%;
    }
    .category-filter__item:nth-child(4){
        width: 25%;
    }
}
.category-filter__item-list{
    display:grid;
    gap:.8125rem
}
.category-filter__item-checkbox{
    display:flex;
    align-items:start;
}
.category-filter__item-checkbox input{
    background:none;
    border:none;
    padding:0;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border:3px solid var(--primary);
    width:25px;
    height:25px;
    background-color:#fff;
    cursor:pointer;
    margin:0 15px 0 0
}
.category-filter__item-checkbox input:checked{
    background-color:var(--primary)
}
.category-filter__item-checkbox label{
    font-weight:400;
    font-size:clamp(.875rem,1.1111111111vw,1.25rem);
    color:#000;
    margin:0;
    line-height:1.2
}
@media(max-width: 1799.98px){
    .category-filter{
        padding:2rem 0 1rem
    }
}
@media(max-width: 1514.98px){
    .category-filter__item{
        flex: initial!important;
    }
}
@media(max-width: 1399.98px){
    .category-filter{
        flex-wrap:wrap;
        justify-content:flex-start
    }
    .category-filter__item{
        flex: initial!important;
        width:33.3333%;
        margin:0 0 2rem
    }
    .category-filter__item-title{
        margin:0 0 1rem
    }
}
@media(max-width: 767.98px){
    .category-filter__item{
        width:50%
    }
    .category-filter__item-title{
        margin:0 0 .5rem
    }
}
.product{
    display:flex;
    flex-direction:column;
    text-decoration:none;
    position:relative;
    color:var(--primary);
    padding:5.6% 5%;
    font-size:clamp(1rem,1.6111111111vw,1.8125rem)
}
.product::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background-color:var(--primary);
    opacity:.25;
    z-index:-1
}
.product--coming{
    color:#fff;
    pointer-events:none
}
.product--coming::before{
    opacity:1
}
.product__info{
    font-size:clamp(1rem,1.1111111111vw,1.25rem)
}
.product h4{
    margin:1.5rem 0
}
.product p{
    margin:0 0 1.5rem;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden
}
.product__footer{
    display:flex;
    align-items:center;
    justify-content:space-between;
    height:73px;
    margin-top:auto
}
.product__footer figure img{
    max-width:167px;
    max-height:73px;
    width:auto;
    height:auto
}
.product__footer .link-arrow{
    background:none
}
.product__footer .link-arrow svg path{
    stroke:var(--primary)
}
.product__coming{
    display:block;
    font-size:clamp(1.5rem,2.2222222222vw,2.5rem);
    text-align:right;
    max-width:5em;
    font-family:"Inter",sans-serif;
    line-height:1.2;
    margin-left:auto
}
.header{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:999;
    -webkit-backdrop-filter:blur(50px);
    backdrop-filter:blur(50px);
    background:var(--header-bg);
    transition:all .2s ease;
    color:#fff
}
.header .container{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center
}
.header__logo{
    width:27.3vw;
    flex:0 0 auto;
    padding:50px 0;
    transition:all .2s
}
.header__logo a{
    display:block;
    width:281px
}
.header__controls{
    width:12.8vw;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    margin:0
}
.header .search-toggler{
    margin-left:4rem
}
.header.headroom--not-top .header__logo{
    padding:16px 0
}
@media(max-width: 1799.98px){
    .header__logo{
        width:27.3vw;
        padding:25px 0
    }
    .header__logo a{
        width:200px
    }
    .header__controls{
        width:auto;
        margin:0 0 0 3rem
    }
    .header .search-toggler{
        margin-left:2rem
    }
}
@media(max-width: 1399.98px){
    .header__logo{
        width:200px;
        margin:0 4rem 0 0
    }
    .header__logo a{
        width:100%
    }
}
@media(max-width: 1023.98px){
    .header .container{
        height:80px
    }
    .header__logo{
        margin:0;
        padding:0
    }
    .header__controls{
        margin:0 0 0 auto
    }
    .header .search-toggler{
        margin-left:1.25rem
    }
    .header.nav-opened{
        padding-bottom:calc(100dvh - 80px)
    }
    .header.headroom--not-top .header__logo{
        padding:0
    }
}
@media(max-width: 767.98px){
    .header__logo a{
        width:160px
    }
}
.hero{
    position:relative;
    height:180vh
}
.hero__bg{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%
}
.hero__bg img{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
/* Hero Mobile Background Image */
.hero__bg-mobile{
    display:none!important;
}
.hero--has-mobile-bg .hero__bg-desktop{
    display:block
}
@media(max-width: 767.98px){
    .hero--has-mobile-bg .hero__bg-desktop{
        display:none
    }
    .hero--has-mobile-bg .hero__bg-mobile{
        display:block!important;
    }
}
.hero__bg::after{
    content:"";
    background:linear-gradient(to left, rgba(0, 0, 0, 0) 0%, black 100%);
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    opacity:.2
}
.hero__content{
    position:relative;
    z-index:2;
    color:#fff
}
.hero__content-text{
    height:100vh;
    padding:0 0 89px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end
}
.hero__content-text h1{
    max-width:10em;
    margin:0 0 .25em
}
.hero__content-text p{
    max-width:40em;
    margin:0
}
.hero__content-text .btn{
    margin-top:2rem
}
.hero__content-cards{
    height:80vh;
    padding:0 0 176px;
    display:flex;
    flex-direction:column;
    justify-content:center
}
.hero__content-cards .container{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:41px
}
.hero__content-card{
    --card-bg-c2: rgba(0, 0, 0, 0.2);
    border:5px solid var(--card-border);
    background:linear-gradient(var(--card-bg-c1), var(--card-bg-c1)),linear-gradient(var(--card-bg-c2), var(--card-bg-c2));
    color:var(--card-color);
    display:flex;
    flex-direction:column;
    aspect-ratio:1/1;
    text-decoration:none;
    padding:13.6% 12.1% 12%;
    justify-content:space-between;
    font-family:"Inter",sans-serif;
    font-weight:700;
    font-size:clamp(1.5rem,2.2222222222vw,2.5rem);
    -webkit-backdrop-filter:blur(50px);
    backdrop-filter:blur(50px)
}
.hero__content-card .link-arrow{
    align-self:flex-end;
    background:none
}
.hero__content-card .link-arrow svg path{
    stroke:var(--card-color)
}
.hero__content-card .text-soon{
    align-self:flex-end;
    font-weight:400;
    text-align:right;
    max-width:5em;
    display:block;
    line-height:1.2
}
.hero__content-card:nth-child(1){
    --card-border: #0af;
    --card-color: #cdebf9;
    --card-bg-c1: rgba(0, 170, 255, 0.25)
}
.hero__content-card:nth-child(2){
    --card-border: #2260c0;
    --card-color: #d2e0f1;
    --card-bg-c1: rgba(34, 96, 192, 0.25)
}
.hero__content-card:nth-child(3){
    --card-border: #3b7d23;
    --card-color: #d8e6d5;
    --card-bg-c1: rgba(59, 125, 35, 0.25)
}
.hero__content-card:nth-child(4){
    --card-border: #b1d348;
    --card-color: #f1f5db;
    --card-bg-c1: rgba(177, 211, 72, 0.25)
}
.hero__content-card--inactive{
    pointer-events:none
}
/* Card Text Größen */
.hero__content-card .card-text{
    display:block;
    line-height:1.2
}
.hero__content-card .card-text--large{
    font-size:clamp(1.5rem,2.2222222222vw,2.5rem)
}
.hero__content-card .card-text--small{
    font-size:clamp(0.875rem,1.2962962963vw,1.125rem);
    font-weight:600
}
/* Spezifischere Regel für logo-title Modus */
.hero__content-card.hero__content-card--logo-title .card-text--small,
.hero__content-card--logo-title .card-text.card-text--small{
    font-size:clamp(1.125rem,1.66666666665vw,1.40625rem) !important
}
/* Card Logo Größen */
.hero__content-card .card-logo{
    display:block;
    width:auto;
    height:auto;
    object-fit:contain
}
.hero__content-card .card-logo--large{
    max-width:100%;
    max-height:100%;
    width:auto;
    height:auto;
    margin-bottom:auto
}
.hero__content-card .card-logo--small{
    max-width:40%;
    max-height:30%;
    margin-top:auto;
    align-self:flex-end
}
/* Anzeigemodus-spezifische Layouts */
.hero__content-card--title-logo{
    gap:1rem
}
.hero__content-card--title-logo .card-text--large{
    margin-bottom:auto;
    min-height:calc(2 * 1.2 * clamp(1.5rem,2.2222222222vw,2.5rem))
}
.hero__content-card--title-logo .card-logo--small{
    max-width:75%;
    max-height:60%;
    margin-top:0;
    margin-bottom:auto;
    align-self:flex-start
}
.hero__content-card--logo-title{
    gap:1rem
}
.hero__content-card--logo-title .card-logo--large{
    margin-bottom:auto
}
.hero__content-card--logo-title .card-text--small{
    margin-top:0;
    margin-bottom:auto
}
@media(max-width: 1399.98px){
    .hero__content-cards .container{
        gap:20px
    }
    .hero__content-card{
        border:3px solid var(--card-border);
        padding:8%
    }
}
@media(max-width: 1023.98px){
    .hero{
        min-height:100vh;
        height:auto
    }
    .hero__content-text{
        height:auto;
        padding:200px 0 100px
    }
    .hero__content-cards{
        height:auto
    }
    .hero__content-cards .container{
        grid-template-columns:repeat(2, 1fr);
        padding:0 4rem
    }
}
@media(max-width: 767.98px){
    .hero__content-cards .container{
        padding:0 2.5rem
    }
}
@media(max-width: 575.98px){
    .hero__content-text{
        height:auto;
        padding:150px 0 60px
    }
    .hero__content-cards .container{
        grid-template-columns:repeat(1, 1fr)
    }
    .hero__content-card{
        aspect-ratio:unset;
        padding:1.25rem
    }
    .hero__content-card .card-text{
        display:block;
        margin:0 0 1.25rem
    }
}
.intro{
    position:relative;
    z-index:8
}
.intro .container{
    display:flex;
    align-items:flex-start
}
.intro__image{
    align-self:flex-end;
    margin:46.6% 0 0;
    position:relative;
    aspect-ratio:1/1
}
.intro__image::before{
    content:"";
    font-size:clamp(4.5rem,6vw,6.75rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:var(--intro-bg);
    position:absolute;
    left:0;
    bottom:100%
}
.intro__image img{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
.intro__text{
    width:61.15%;
    flex:0 0 auto;
    aspect-ratio:1/1;
    background-color:var(--primary);
    padding:5% 8.3%;
    color:#fff;
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative
}
.intro__text .link-arrow{
    position:absolute;
    right:2%;
    bottom:2%
}
.intro__text h2{
    max-width:10em;
    margin:0 0 .5em
}
.intro__text p{
    max-width:26em;
    margin:0 0 1.6em
}
.intro--home{
    --intro-bg: #a8cd3f;
    margin-top:-138px
}
.intro--home .intro__text::before{
    content:"";
    font-size:clamp(4.5rem,6vw,6.75rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:var(--secondary);
    position:absolute;
    left:0;
    top:138px;
    transform:translateX(-100%)
}
.intro--category{
    --intro-bg: var(--secondary);
    margin-top:-410px
}
.intro--category .intro__image{
    margin:51.3% 0 0
}
@media(max-width: 1023.98px){
    .intro--home{
        margin-left:50px
    }
    .intro--category{
        margin-top:-200px
    }
}
@media(max-width: 767.98px){
    .intro .container{
        flex-direction:column
    }
    .intro__image{
        margin:0 !important;
        width:100%
    }
    .intro__image::before{
        display:none
    }
    .intro__text{
        width:100%;
        padding:1.25rem
    }
    .intro__text h2{
        max-width:none
    }
    .intro--home{
        margin-left:0
    }
    .intro--home .intro__text::before{
        display:none
    }
}
.text-images{
    /* margin-top:-106px; */
    position:relative;
    z-index:9
}
.text-images__visual{
    display:flex
}
.text-images__visual figure{
    aspect-ratio:1/1;
    position:relative
}
.text-images__visual figure img{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
.text-images__visual-col:first-child{
    width:38.92%;
    flex:0 0 auto
}
.text-images__visual-col:first-child figure::after{
    content:"";
    font-size:clamp(4.5rem,6vw,6.75rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:#347220;
    position:absolute;
    right:0;
    top:100%
}
.text-images__visual-col:last-child{
    width:100%;
    display:flex;
    flex-direction:column;
    margin-top: 12%;
}
.text-images__visual-col:last-child .link-arrow{
    align-self:flex-end
}
@media(max-width: 1399.98px){
    .text-images{
        margin-top:-50px
    }
}
@media(max-width: 767.98px){
    .text-images{
        margin-top:6rem
    }
}
.faqs{
    /* padding:12.9375rem 0 14rem */
    padding:4.5rem 0 4.5rem;

}
.faqs .section-header{
    /* margin:0 0 7rem */
    margin:0 0 0rem;

}
.faqs .section-header p{
    max-width:none
}
@media(max-width: 1399.98px){
    .faqs{
        padding:8rem 0
    }
    .faqs .section-header{
        margin:0 0 5rem
    }
}
@media(max-width: 767.98px){
    .faqs{
        padding:6rem 0
    }
    .faqs .section-header{
        margin:0 0 3rem
    }
}
.text-image-cols{
    /* margin:0 0 13.7rem */
    margin:0 0 2.5rem;

}
.text-image-cols .container{
    display:flex;
    align-items:flex-start
}
.text-image-cols__image{
    position:relative;
    aspect-ratio:1/1
}
.text-image-cols__image::after{
    content:"";
    font-size:clamp(4rem,4.4444444444vw,5rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:var(--accent);
    position:absolute;
    left:0;
    top:100%
}
.text-image-cols__image img{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
.text-image-cols__text{
    width:61.15%;
    flex:0 0 auto;
    aspect-ratio:1/1;
    background-color:var(--primary);
    padding:5% 8.3%;
    color:#fff;
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    margin-top:7.8rem
}
.text-image-cols__text .link-arrow{
    position:absolute;
    right:2%;
    bottom:2%
}
.text-image-cols__text h2{
    max-width:10em;
    margin:0 0 .5em;
    -webkit-hyphens:auto;
    /*hyphens:auto*/
}
.text-image-cols__text p{
    max-width:26em;
    margin:0
}
.text-image-cols--sq-lg .text-image-cols__image{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
.text-image-cols--sq-lg .text-image-cols__image::after{
    font-size:clamp(4.5rem,6vw,6.75rem);
    width:1em;
    aspect-ratio:1/1;
    display:flex;
    align-items:center;
    justify-content:center
}
.text-image-cols--sq-lg .text-image-cols__text{
    margin-top:6.5rem
}
.text-image-cols--reversed .container{
    flex-direction:row-reverse
}
.text-image-cols--reversed .text-image-cols__image::after{
    left:auto;
    right:0
}
.text-image-cols--reversed .text-image-cols__text{
    margin-top:18.5rem
}
@media(max-width: 1399.98px){
    .text-image-cols{
        margin:0 0 8rem
    }
    .text-image-cols--reversed .text-image-cols__text{
        margin-top:8rem
    }
}
@media(max-width: 767.98px){
    .text-image-cols{
        margin:0 0 6rem
    }
    .text-image-cols .container{
        flex-direction:column
    }
    .text-image-cols__image{
        margin:0;
        width:100%
    }
    .text-image-cols__image::after{
        display:none !important
    }
    .text-image-cols__text{
        margin:0;
        aspect-ratio:unset;
        width:100%;
        padding:1.25rem 1.25rem 5rem
    }
    .text-image-cols__text p{
        margin:0
    }
    .text-image-cols--reversed .text-image-cols__text{
        margin-top:0
    }
}
.cards .section-header{
    margin:0 0 4.5rem
}
.cards .section-header p{
    max-width:40.5em
}
.cards__grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:6.75rem 1.5rem
}
.cards .btn-wrap{
    padding:7.2rem 0 0;
    text-align:center
}
.cards--news{
    margin:0 0 12.8rem
}
.cards--team{
    /* margin:0 0 20.5rem */
    margin:0 0 6.5rem;

}
.cards--team .section-header h2{
    max-width:none;
    margin:0 0 3rem
}
.cards--offers{
    margin:0 0 19.2rem
}
@media(max-width: 1799.98px){
    .cards--news,.cards--team,.cards--offers{
        margin:0 0 12rem
    }
}
@media(max-width: 1399.98px){
    .cards .btn-wrap{
        padding:4rem 0 0
    }
    .cards--news,.cards--team,.cards--offers{
        margin:0 0 8rem
    }
}
@media(max-width: 1023.98px){
    .cards__grid{
        gap:1rem
    }
    .cards--team .cards__grid,.cards--offers .cards__grid{
        grid-template-columns:1fr 1fr
    }
}
@media(max-width: 767.98px){
    .cards__grid{
        grid-template-columns:1fr 1fr
    }
    .cards--news,.cards--team,.cards--offers{
        margin:0 0 6rem
    }
}
@media(max-width: 575.98px){
    .cards__grid{
        grid-template-columns:1fr
    }
    .cards--team .cards__grid,.cards--offers .cards__grid{
        grid-template-columns:1fr
    }
}
.events{
    margin:0 0 11.9rem
}
.events__item{
    display:flex;
    align-items:center;
    margin:0 0 2.2rem
}
.events__item:last-child{
    margin:0
}
.events__item-date{
    aspect-ratio:1/1;
    width:15.125rem;
    flex:0 0 auto;
    margin:0 4.7rem 0 0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    flex-direction:column;
    background-color:var(--primary);
    color:#fff
}
.events__item-day{
    font-weight:700;
    font-size:clamp(2.2rem,4.4444444444vw,5rem);
    line-height:1.25;
    margin:0 0 0 .2em
}
.events__item-month{
    font-weight:700;
    transform:translateY(-0.3em)
}
.events__item-text h3{
    margin:0 0 1.5rem
}
.events__item-text p{
    line-height:134%;
    margin:0
}
@media(max-width: 1399.98px){
    .events{
        margin:0 0 8rem
    }
    .events__item-date{
        width:12rem;
        margin:0 5rem 0 0;
        display:flex;
        align-items:center;
        justify-content:center;
        text-align:center;
        flex-direction:column;
        background-color:var(--primary);
        color:#fff
    }
    .events__item-day{
        font-weight:700;
        font-size:clamp(2.2rem,4.4444444444vw,5rem);
        line-height:1.25;
        margin:0 0 0 .2em
    }
    .events__item-month{
        font-weight:700;
        transform:translateY(-0.3em)
    }
    .events__item-text h3{
        margin:0 0 1.5rem
    }
    .events__item-text p{
        line-height:134%;
        margin:0
    }
}
@media(max-width: 1023.98px){
    .events__item-date{
        margin:0 3rem 0 0
    }
}
@media(max-width: 767.98px){
    .events{
        margin:0 0 6rem
    }
    .events__item{
        flex-direction:column
    }
    .events__item-date{
        aspect-ratio:unset;
        width:100%;
        padding:1rem 0;
        margin:0 0 2rem
    }
}
.page-wrapper--home .events__item:nth-child(4n+1) .events__item-date{
    background-color:#d30473
}
.page-wrapper--home .events__item:nth-child(4n+2) .events__item-date{
    background-color:#1f55b8
}
.page-wrapper--home .events__item:nth-child(4n+3) .events__item-date{
    background-color:#a8cd3f
}
.page-wrapper--home .events__item:nth-child(4n+4) .events__item-date{
    background-color:#00a0ff
}
.contact-form{
    margin:0 0 10.5rem
}
.contact-form h2{
    margin:0 0 4.7rem
}
.contact-form p{
    margin:0
}
.contact-form__grid{
    display:grid;
    grid-template-columns:32.4% auto;
    gap:9.7rem
}
.contact-form__form{
    padding:1rem 0 0
}
@media(max-width: 1799.98px){
    .contact-form__grid{
        gap:6rem
    }
}
@media(max-width: 1399.98px){
    .contact-form{
        margin:0 0 8rem
    }
    .contact-form h2{
        margin:0 0 2rem
    }
}
@media(max-width: 1023.98px){
    .contact-form__grid{
        grid-template-columns:1fr;
        gap:3rem
    }
}
@media(max-width: 767.98px){
    .contact-form{
        margin:0 0 6rem
    }
    .contact-form__grid{
        gap:2rem
    }
}
.footer{
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    position:relative
}
.footer__bg{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%
}
.footer__bg img{
    display:block;
    width:100%;
    height:100%;
    -o-object-fit:cover;
    object-fit:cover
}
.footer__content{
    -webkit-backdrop-filter:blur(50px);
    backdrop-filter:blur(50px);
    background:var(--footer-bg);
    color:#fff;
    font-size:1.125rem;
    line-height:1.5;
    padding:8.3rem 0 2.9rem
}
.footer__wrapper{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap
}
.footer__left{
    width:50%
}
.footer__right{
    width:50%;
    display:flex;
    justify-content:flex-end
}
.footer__logo{
    width:280px;
    margin:0 0 2.1rem
}
.footer__text{
    margin:0 0 5.2rem
}
.footer__text p{
    margin:0;
    max-width:35em
}
.footer__socials{
    display:flex;
    margin:0 0 2.1rem
}
.footer__socials a{
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .25s;
    margin:0 35px 0 0;
    border-radius:4px;
    border:1px solid #e0e6eb;
    width:57px;
    height:57px
}
.footer__socials a svg{
    display:block
}
.footer__socials a svg path{
    transition:all .25s
}
.footer__socials a:hover{
    background-color:#fff
}
.footer__socials a:hover svg path{
    fill:var(--primary)
}
.footer__nav .nav-indicator{
    margin:-14px 0 0 -19px
}
.footer__nav ul{
    margin:0;
    padding:0;
    list-style:none
}
.footer__nav ul li{
    margin:0 0 2.5rem
}
.footer__nav ul li:last-child{
    margin:0
}
.footer__nav ul a{
    text-decoration:none;
    font-weight:700
}
.footer__contact{
    padding:3px 2rem 0 0;
    margin-left:6.4rem
}
.footer__contact address{
    font-style:normal
}
.footer__contact address p{
    margin:0 0 1.4rem;
    font-weight:700;
    line-height:129%
}
.footer__contact address p:last-child{
    margin:0
}
.footer__contact address a{
    text-decoration:underline;
    text-decoration-color:rgba(0,0,0,0);
    text-underline-offset:3px;
    text-decoration-thickness:2px
}
.footer__contact address a:hover{
    text-decoration-color:var(--primary)
}
.footer__nav-inline ul{
    margin:0;
    padding:0;
    list-style:none;
    display:flex;
    justify-content:flex-end
}
.footer__nav-inline ul li{
    margin:0 0 0 1.7rem
}
.footer__nav-inline ul li:first-child{
    margin:0
}
.footer__nav-inline ul a{
    text-decoration:underline;
    text-decoration-color:rgba(0,0,0,0);
    text-underline-offset:3px;
    text-decoration-thickness:2px
}
.footer__nav-inline ul a:hover{
    text-decoration-color:var(--primary)
}
@media(max-width: 1799.98px){
    .footer__nav .nav-indicator{
        margin:-10px 0 0 -14px
    }
}
@media(max-width: 1399.98px){
    .footer__content{
        font-size:1rem;
        line-height:1.35;
        padding:4rem 0 2rem
    }
    .footer__text{
        margin:0 0 3rem
    }
    .footer__contact{
        padding:0;
        margin-left:3rem
    }
}
@media(max-width: 1023.98px){
    .footer__content{
        font-size:.875rem
    }
    .footer__left{
        padding-right:1rem
    }
}
@media(max-width: 767.98px){
    .footer{
        height:auto;
        padding-top:50vh
    }
    .footer__wrapper{
        flex-direction:column;
        flex-wrap:nowrap
    }
    .footer__left{
        width:100%
    }
    .footer__right{
        width:100%;
        flex-direction:column;
        justify-content:unset
    }
    .footer__logo{
        width:200px;
        margin:0 0 1.5rem
    }
    .footer__text{
        margin:0 0 1.5rem
    }
    .footer__socials{
        margin:0 0 3rem
    }
    .footer__socials a{
        margin:0 20px 0 0
    }
    .footer__nav{
        margin:0 0 3rem
    }
    .footer__nav ul li{
        margin:0 0 1rem
    }
    .footer__contact{
        padding:0;
        margin:0 0 3rem
    }
    .footer__copyright{
        text-align:center;
        font-size:.75rem;
        margin:0 0 1.5rem
    }
    .footer__nav-inline ul{
        justify-content:center;
        font-size:.75rem
    }
    .footer__nav-inline ul li,.footer__nav-inline ul li:first-child{
        margin:0 .5rem
    }
}
.category-list{
    margin:15rem 0
}
.category-list .tabs .tabs-menu ul{
    margin:0 6.5rem 0 5.5rem
}
.category-list .tabs .tabs-content{
    padding:2.5rem 0 0
}
.category-list .accordion-item{
    border:none
}
.category-list .accordion-item .accordion-button{
    border-bottom:var(--border-wd) solid #000;
    font-size:clamp(1.125rem,1.7777777778vw,2rem);
    padding-left: 0;
}
.category-list .accordion-item .accordion-button::after{
    font-size:clamp(4rem,4.4444444444vw,5rem)
}
.category-list .accordion-item .accordion-body .inner{
    padding:0
}
.category-list__grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1.25rem
}
.category-list .btn-wrap{
    padding:6.9rem 0 0;
    text-align:center
}
@media(max-width: 1799.98px){
    .category-list{
        margin:12rem 0
    }
    .category-list .tabs .tabs-menu ul{
        margin:0
    }
    .category-list .accordion-item .accordion-button{
        padding-left:0
    }
}
@media(max-width: 1399.98px){
    .category-list{
        margin:8rem 0
    }
    .category-list .btn-wrap{
        padding:5rem 0 0
    }
}
@media(max-width: 1023.98px){
    .category-list__grid{
        grid-template-columns:repeat(2, 1fr)
    }
}
@media(max-width: 767.98px){
    .category-list{
        margin:6rem 0
    }
    .category-list__grid{
        grid-template-columns:1fr
    }
    .category-list .btn-wrap{
        padding:3rem 0 0
    }
}
.product-details{
    padding:16.1rem 0 0;
    /* margin:0 0 11.7rem */
    margin:0 0 4.5rem;

}
.product-details .section-header{
    /* margin:0 0 6.5rem */
    margin:0 0 4.5rem;
    
}
.product-details .section-header h1{
    margin:0 0 2.5rem
}
.product-details .section-header p{
    max-width:none
}
.product-details .section-header p a{
    color:var(--primary);
    white-space: nowrap;
}
.product-details__wrapper{
    display:flex;
    align-items:stretch; /* Beide Divs gleich hoch */
    margin:0 -4.2rem 0 0;
    gap: 0; /* Kein Gap zwischen den Divs */
}
.product-details__wrapper ul{
    margin:4.2rem 0 0;
    padding:0;
    list-style:none;
    line-height:1.38
}
.product-details__wrapper ul li{
    display:flex
}
.product-details__wrapper ul li span{
    width:30%;
    flex:0 0 auto;
    margin:0 1rem 0 0
}
.product-details__image{
    width:40.6%;
    display:flex;
    align-items:stretch;
    flex-shrink: 0; /* Verhindert Schrumpfen */
}
.product-details__image figure{
    width:100%;
    height:100%;
    display:flex;
    align-items:stretch;
    margin: 0; /* Margin zurücksetzen */
}
.product-details__image figure img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.product-details__text{
    width:59.4%;
    padding-left:3.5rem;
    display:flex;
    flex-direction:column;
    min-height:100%; /* Mindestens so hoch wie das Bild */
}
/* Hauptinhalt-Gruppe: Alle Elemente außer Downloads */
.product-details__text > *:not(.product-details__downloads) {
    flex-shrink: 0;
}
/* Spacer zwischen Hauptinhalt und Downloads */
.product-details__text > *:not(.product-details__downloads):last-of-type {
    margin-bottom: auto; /* Push Downloads nach unten */
}
.product-details__downloads{
    margin-top:auto; /* Wird nach unten geschoben */
    flex-shrink: 0;
    overflow:auto;
    display:grid;
    grid-template-rows:repeat(2, 1fr);
    grid-auto-flow:column;
    gap:1rem;
    padding:0 0 0rem;
    scrollbar-width:thin;
    scrollbar-color:var(--primary) rgba(0,0,0,0)
}
.product-details__downloads::-webkit-scrollbar{
    width:5px;
    height:5px
}
.product-details__downloads::-webkit-scrollbar-track{
    background:rgba(0,0,0,0)
}
.product-details__downloads::-webkit-scrollbar-thumb{
    background-color:var(--primary)
}
@media(max-width: 1799.98px){
    .product-details{
        padding:12rem 0 0
    }
    .product-details__wrapper{
        margin:0
    }
    .product-details__wrapper ul{
        margin:2rem 0
    }
    .product-details__image figure{
        height:100%
    }
    .product-details__image figure img{
        display:block;
        width:100%;
        height:100%;
        -o-object-fit:cover;
        object-fit:cover
    }
}
@media(max-width: 1399.98px){
    .product-details{
        margin:0 0 8rem
    }
}
@media(max-width: 1023.98px){
    .product-details{
        padding:10rem 0 0;
        margin:0 0 6rem
    }
    .product-details .section-header{
        margin:0 0 3rem
    }
    .product-details__text{
        padding-left:1rem
    }
    .product-details__wrapper ul{
        font-size:.875rem
    }
}
@media(max-width: 767.98px){
    .product-details{
        padding:8rem 0 0
    }
    .product-details .section-header{
        margin:0 0 3rem
    }
    .product-details__image{
        width:100%;
        margin:0 0 2rem
    }
    .product-details__text{
        width:100%;
        padding-left:0
    }
    .product-details__wrapper{
        flex-direction:column
    }
}
.product-description{
    /* margin:0 0 11.7rem */
    margin:0 0 4.5rem;

}
.product-description h2{
    margin:0 0 2.5rem
}
.product-description p{
    /* max-width:46em */
}
@media(max-width: 1399.98px){
    .product-description{
        margin:0 0 8rem
    }
}
@media(max-width: 1023.98px){
    .product-description{
        margin:0 0 6rem
    }
}
.product-programm{
    /* margin:0 0 11.5rem */
    margin:0 0 4.5rem;

}
.product-programm h2{
    /* margin:0 0 5.8rem */
    margin:0 0 2.5rem;
}
.product-programm .accordion-item .accordion-button{
    padding:0
}
@media(max-width: 1399.98px){
    .product-programm{
        margin:0 0 8rem
    }
}
@media(max-width: 1023.98px){
    .product-programm{
        margin:0 0 6rem
    }
}
/**
 * SIAL - Custom Font Sizes
 * Überschreibt die Schriftgrößen aus styles.css
 * Ziel: Einheitlichere Texte mit klarer Hierarchie
 */

/* ============================================
   BASE TEXT SIZE (Body)
   14-16px → 17-19px (+3px)
   ============================================ */
body {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* 17-19px */
}

/* ============================================
   HEADINGS - Alle +8px größer
   ============================================ */

/* H1 - Hauptüberschrift
   Vorher: 32-48px
   Neu: 40-56px (+8px) */
h1, .h1 {
    font-size: clamp(2.5rem, 4vw, 3.5rem);
}

/* H2 - Sekundäre Überschrift
   Vorher: 28-40px
   Neu: 36-48px (+8px) */
h2, .h2 {
    font-size: clamp(1.8rem, 2.8vw, 2.4rem); /* 20% reduziert - vorher: clamp(2.25rem, 3.5vw, 3rem) */
}

/* Teaser/Hero Headlines - gleich groß wie H1 (reduzierte Größe aus custom.css) */
/* CSS-Variable setzen, damit sie in header.php verwendet werden kann */
:root {
    --teaser-title-size: clamp(2.5rem, 4vw, 3.5rem);
}


/* Hero Button Wrapper - feste Höhe für konsistente Text-Position */
.hero__button-wrapper {
    min-height: 6.5rem;
    margin-top: calc(1rem - 10px);  /* 1rem minus 10px */
}
.hero__button-wrapper:empty {
    min-height: 6.5rem;
}

/* H3 - Tertiäre Überschrift
   Vorher: 24-32px
   Neu: 32-40px (+8px) */
h3, .h3 {
    font-size: clamp(2rem, 3vw, 2.5rem);
}

/* Accordion Buttons - 11px kleiner als H3 (vorher -6px, dann -3px, jetzt nochmals -2px) */
.accordion .accordion-item .accordion-button,
.accordion-button__number,
.accordion-button__text,
.product-programm .accordion-button,
.product-programm .accordion-item .accordion-button,
.product-details .accordion .accordion-item .accordion-button {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body (Standard Font Size) - von unter 1400px übernommen */
}

/* Accordion Icon width */
.accordion .accordion-item .accordion-button::after {
    width: 0.8em !important;
}



/* Dropdown Pfeil halbieren + Placeholder-Farbe */
.form-select {
    background-size: 22.5px 13.5px !important;  /* Original: 45x27, halbiert */
}

/* Selectbox Placeholder-Farbe (wenn nichts ausgewählt) */
.form-select,
.form-select option[value=""],
.form-select[value=""] {
    color: #656565 !important;  /* Gleiche Farbe wie Input-Platzhalter */
}

/* Wenn eine Option ausgewählt wurde, normale Textfarbe */
.form-select:not([value=""]) option:not([value=""]),
select.form-select option:checked:not([value=""]) {
    color: #000 !important;
}

@media(max-width: 1399.98px){
    .form-select {
        background-size: 10px auto !important;  /* Original: 20px, halbiert */
    }
    
    /* Accordion Buttons - Standard Font Size bei kleiner als 1400px */
    .accordion .accordion-item .accordion-button,
    .accordion-button__number,
    .accordion-button__text,
    .product-programm .accordion-button,
    .product-programm .accordion-item .accordion-button,
    .product-details .accordion .accordion-item .accordion-button,
    .category-list .accordion-button {
        font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body (Standard Font Size) */
    }
}

/* H4 - Kleine Überschrift
   Vorher: 20-28px
   Neu: 28-36px (+8px) */
h4, .h4 {
    font-size: clamp(1.75rem, 2.5vw, 2.25rem);
}

/* H5 - Mini Überschrift
   Vorher: 18-24px
   Neu: 26-32px (+8px) */
h5, .h5 {
    font-size: clamp(1.625rem, 2.2vw, 2rem);
}

/* ============================================
   COMPONENTS - Small Text (+3px)
   ============================================ */

/* Form Inputs & Selects
   Vorher: 14-16px
   Neu: 17-19px (+3px) */
.form-input,
.form-select {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Form Checkbox Labels
   Vorher: 13-15px
   Neu: 16-18px (+3px) */
.form__field--checkbox label {
    font-size: clamp(1rem, 1.3vw, 1.125rem);
}

/* Cards - Overlay Text = Body */
.card__overlay {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Cards - Info Text = Body */
.card__info {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Card Label = Body */
.card__label-inner {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Product Overlay = Body */
.product__overlay {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Product Info = Body */
.product__info {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Product Title - H4 */
.product__title {
    font-size: clamp(1.75rem, 2.5vw, 2.25rem);  /* = H4 */
}

/* Accordion Button in Category List - 11px kleiner (vorher -6px, dann -3px, jetzt nochmals -2px) */
.category-list .accordion-button {
    font-size: clamp(1.3125rem, 2.1vw, 1.8125rem);  /* 21-29px (vorher 23-31px, -2px) */
}

/* Accordion Body Text = Body */
.accordion-body,
.accordion-body .inner,
.accordion-body p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* ============================================
   KURSE / PRODUCTS - Schriftgrößen
   ============================================ */

/* Kurs Kacheln - Grid Ansicht (Standard) */
.product__info {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body */
}
.product h4 {
    font-size: clamp(1.76rem, 3.5555555555vw, 4rem) !important;  /* = H2 (gleiche Größe wie H2) */
}
.product p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body */
}

/* Kurs Listenansicht - Desktop */
.category-list__grid.view-list .product__info {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body */
}
.category-list__grid.view-list .product h4 {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body */
}
/* Listenansicht: Hintergrundfarbe für ganze Kachel mit ::after */
.category-list__grid.view-list .product::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--primary);
    opacity: 0.25;
    z-index: -2; /* Hinter dem Bild */
    pointer-events: none;
}
/* Bilder in Listenansicht quadratisch darstellen, nicht beschneiden */
.category-list__grid.view-list .product::before {
    content: "" !important; /* Wichtig: content muss gesetzt sein */
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    aspect-ratio: 1 / 1 !important; /* Quadratisch */
    width: auto !important;
    height: 100% !important;
    max-width: 120px; /* Maximale Breite für das Bild */
    background-color: transparent !important; /* Keine Hintergrundfarbe, nur Bild */
    background-size: contain !important; /* Nicht beschneiden */
    background-position: center !important;
    background-repeat: no-repeat !important;
    z-index: -1; /* Über der Hintergrundfarbe, aber unter dem Content */
    opacity: 1 !important; /* Volle Deckkraft für das Bild */
}

/* Kurs Listenansicht - Mobile */
@media (max-width: 767px) {
    .category-list__grid.view-list .product__info {
        font-size: clamp(0.875rem, 1.2vw, 1rem) !important;  /* Etwas kleiner auf Mobile */
    }
    .category-list__grid.view-list .product h4 {
        font-size: clamp(0.875rem, 1.2vw, 1rem) !important;  /* Etwas kleiner auf Mobile */
    }
}

/* ============================================
   CONTENT PAGES - Layout Builder Styles
   ============================================ */

/* Content H1 - Gleich wie Hero/Startseite (H2-Größe) */
.conent_h1 {
    font-size: clamp(2.25rem, 3.5vw, 3rem);  /* = H2 - ursprüngliche Größe wiederhergestellt */
    line-height: 1.25;
    margin: 0 0 2.5rem;
    /* Deutsche Silbentrennung - optimiert für zusammengesetzte Wörter */
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    -webkit-hyphenate-limit-chars: 8 3 3;
    hyphenate-limit-chars: 8 3 3;
    -webkit-hyphenate-limit-lines: 2;
    hyphenate-limit-lines: 2;
    word-break: normal;
    overflow-wrap: break-word;
}

/* Content H2-H6 - Alle gleich groß wie Accordion */
.conent_h2,
.conent_h3,
.conent_h4,
.conent_h5,
.conent_h6 {
    font-size: clamp(1.3125rem, 2.1vw, 1.8125rem);  /* = Accordion (21-29px) */
    line-height: 1.3;
    font-weight: 700;
    /* Deutsche Silbentrennung - optimiert für zusammengesetzte Wörter */
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    -webkit-hyphenate-limit-chars: 8 3 3;
    hyphenate-limit-chars: 8 3 3;
    -webkit-hyphenate-limit-lines: 2;
    hyphenate-limit-lines: 2;
    word-break: normal;
    overflow-wrap: break-word;
}

/* Individuelle Margins beibehalten */
.conent_h2 { margin: 3.5rem 0 0; }
.conent_h3 { margin: 3rem 0 0; }
.conent_h4 { margin: 2.5rem 0 0; }
.conent_h5 { margin: 2rem 0 0; }
.conent_h6 { margin: 1.5rem 0 0; }

/* Content Paragraphs */
.conent_p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body (17-19px) */
    line-height: 1.5;
    margin: 1.5rem 0 0;
}

/* Content Lists */
.conent_list {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body (17-19px) */
    line-height: 1.5;
    margin: 1.5rem 0 0;
}
.conent_list ul {
    padding-left: 21px;
}

/* ============================================
   EVENTS / KALENDER - Titel
   ============================================ */

/* Event Titel - Gleich wie Accordion */
.events__item h4,
.events__item h3,
.events__item h2 {
    font-size: clamp(1.3125rem, 2.1vw, 1.8125rem) !important;  /* = Accordion (21-29px) */
    line-height: 1.3 !important;
}

/* Subpages Headline - H4 */
.subpages-list .subpages__headline {
    font-size: clamp(1.75rem, 2.5vw, 2.25rem);  /* = H4 */
}

/* Page Intro Headline - H2 */
.page-intro__content h1,
.hero__content-text h1 {
    font-size: clamp(2.25rem, 3.5vw, 3rem);  /* H1 - ursprüngliche Größe wiederhergestellt */
}

/* Teaser Text = Body */
.teaser-card__overlay p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Card Text / Card Description = Body */
.card__text,
.card-text,
.card p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Footer
   Vorher: 14px
   Neu: 17px (+3px) */
.footer__content {
    font-size: 1.0625rem;  /* 17px */
}

/* Footer Copyright/Nav
   Vorher: 12px
   Neu: 15px (+3px) */
.footer__copyright,
.footer__nav-inline ul {
    font-size: 0.9375rem;  /* 15px */
}

/* Tabs
   Vorher: 14px
   Neu: 17px (+3px) */
.tabs .tabs-menu .tab-link {
    font-size: 1.0625rem;  /* 17px */
}

/* Buttons */
.btn {
    font-size: inherit;  /* Use body font-size */
}

/* Hero Button */
.hero__content-text .btn {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* Hero Content Cards (Hauptbereiche Karten) */
.hero__content-card {
    font-size: clamp(1.3125rem, 2vw, 2.3125rem) !important;  /* 21-37px (vorher 24-40px, -3px) */
    line-height: 1.3 !important;
}

/* Hero Content Card Title (card-text span) */
.hero__content-card .card-text {
    font-size: clamp(1.3125rem, 2vw, 2.3125rem) !important;  /* 21-37px (vorher 24-40px, -3px) */
    line-height: 1.3 !important;
}

/* Product Details Downloads Button - Standard font size */
.product-details__downloads .btn {
    font-size: inherit;  /* Standard font size */
}

/* Product Details Downloads Button - Nicht 100% breit */
.product-details__downloads {
    display: block !important;  /* Grid entfernen, damit Button nicht 100% breit ist */
}
.product-details__downloads .btn--download {
    width: auto !important;
    display: inline-flex !important;
}

/* ============================================
   TEASER KOMPONENTE - 50/50 Layout
   ============================================ */

/* Teaser: Textbereich verkleinern (50% statt 61.15%) und Bild vergrößern */
.intro__text,
.text-image-cols__text {
    width: 50% !important;  /* Vorher: 61.15% */
}

/* Bildbereich: Explizite Breite für volle Nutzung des Rasters */
.intro__image,
.text-image-cols__image {
    width: 50% !important;  /* Explizite Breite, damit Bild die volle Breite nutzt */
    flex: 0 0 50% !important;  /* Flex-Basis für konsistente Breite */
}

/* Bild nach oben schieben - Margin auf 33.6% setzen */
.intro__image {
    margin-top: 33.6% !important;  /* Vorher: 46.6%, jetzt reduziert für bessere Positionierung */
}

.intro--category .intro__image {
    margin-top: 34.5% !important;  /* Vorher: 51.3%, proportional reduziert */
}

/* Text-Bereich bei text-image-cols nach oben schieben */
.text-image-cols__text {
    margin-top: 15rem !important;  /* Vorher: 13.8rem, deutlich reduziert */
}

.text-image-cols--sq-lg .text-image-cols__text {
    margin-top: 18rem !important;  /* Vorher: 6.5rem, reduziert */
}

/* Responsive: Mobile bleibt unverändert (bereits 100% in styles.css) */
@media (max-width: 767.98px) {
    .intro__text,
    .text-image-cols__text {
        width: 100% !important;  /* Mobile: volle Breite beibehalten */
    }
    .intro__image,
    .text-image-cols__image {
        width: 100% !important;  /* Mobile: volle Breite beibehalten */
    }
    .intro__image {
        margin-top: 0 !important;  /* Mobile: Margin zurücksetzen */
    }
    .intro--category .intro__image {
        margin-top: 0 !important;  /* Mobile: Margin zurücksetzen */
    }
    .text-image-cols__text {
        margin-top: 0 !important;  /* Mobile: Margin zurücksetzen */
    }
    .text-image-cols--sq-lg .text-image-cols__text {
        margin-top: 0 !important;  /* Mobile: Margin zurücksetzen */
    }
}

/* ============================================
   DOZENTEN KOMPONENTE - PROFESSIONELLE ANPASSUNGEN
   ============================================ */

/* 1. Auf Content-Seiten: Titel und Text wie bei Team */
/* cards--team .section-header h2 hat bereits max-width: none in styles.css */
/* Titel links bündig (wie Team) */
.cards--team .section-header h2 {
    text-align: left !important;
}
/* Text: max-width wie bei .cards .section-header p (40.5em) */
.cards--team .section-header p,
.cards--team .section-header .conent_p {
    max-width: 40.5em !important;  /* Wie bei Team / .cards .section-header p */
}

/* 2. Auf Kurs-Detailseiten: Text bis an den Rand (analog Zulassung Titel) */
/* .product-details .section-header p hat bereits max-width: none in styles.css */
/* Aber cards--team ist nicht in .product-details, daher eigene Regel nötig */
.page-wrapper--inner-page section.cards--team .section-header p,
.page-wrapper--inner-page section.cards--team .section-header .conent_p {
    max-width: none !important;  /* Text bis an den Rand, wie bei Zulassung */
}

/* Product Details List = Body */
.product-details__wrapper ul,
.product-details__wrapper table,
.product-details__wrapper td,
.product-details__wrapper th {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem) !important;  /* = Body (17-19px) */
}

/* Mehr Abstand zwischen Kursdetail-Zeilen */
.product-details__wrapper ul li {
    margin-bottom: 10px !important;
}

/* Product Details H1 - Gleich wie Content/Hero H1 */
.product-details .section-header h1 {
    font-size: clamp(2.25rem, 3.5vw, 3rem) !important;  /* H1 - ursprüngliche Größe wiederhergestellt */
    line-height: 1.25 !important;
}

/* Text Image Columns
   Vorher: 14-16px
   Neu: 17-19px (+3px) */
.text-image-cols__text p {
    font-size: clamp(1.0625rem, 1.35vw, 1.1875rem);  /* = Body */
}

/* ============================================
   RESPONSIVE ADJUSTMENTS
   ============================================ */

@media (max-width: 1399.98px) {
    .footer__content {
        font-size: 1rem;  /* 16px */
    }
}

@media (max-width: 1023.98px) {
    .footer__content {
        font-size: 0.9375rem;  /* 15px */
    }
}

@media (max-width: 767.98px) {
    /* Mobile adjustments */
    body {
        font-size: 1.0625rem;  /* 17px fix auf Mobile */
    }
    
    .product-details__wrapper ul {
        font-size: 0.9375rem;  /* 15px */
    }
    
    /* Accordion-Text nicht bold auf kleinen Screens */
    .accordion .accordion-item .accordion-button,
    .accordion-button__number,
    .accordion-button__text,
    .product-programm .accordion-button,
    .product-programm .accordion-item .accordion-button,
    .product-details .accordion .accordion-item .accordion-button {
        font-weight: normal !important;
    }
    
    /* Accordion: Abstand zur Zahl reduzieren auf kleinen Screens */
    .accordion-button__number {
        margin-right: 0rem !important;  /* Reduziert von 0.75rem auf 0.5rem */
    }
}

/* ============================================
   NOTES / DOCUMENTATION
   ============================================ */

/**
 * SCHRIFTGRÖSSEN-HIERARCHIE (Desktop):
 * 
 * H1: 56px (Haupttitel)
 * H2: 48px (Sektions-Titel)
 * H3: 40px (Untertitel / Accordion)
 * H4: 36px (Klein-Titel / Downloads Button)
 * H5: 32px (Mini-Titel)
 * Body: 19px (Standard-Text)
 * Small: 17px (Kleintext / Tabs)
 * Tiny: 15px (Footer, Copyright)
 * 
 * ANPASSUNGEN vom User:
 * - Titel alle +8px größer (für bessere Hierarchie)
 * - Body/Small/Tiny +3px größer (für bessere Lesbarkeit)
 * - Einheitliche Größen über alle Komponenten
 */




.hero__content-text {
    height: 70vh;
    min-height: 500px;  /* Mindesthöhe, damit Titel nicht abgeschnitten wird */
    justify-content: flex-start !important;  /* Überschreibt flex-end */
    padding-top: 25vh !important;  /* Titel weiter unten positionieren */
    padding-bottom: 89px !important;
}


@media (min-width: 1400px) {

.hero {
    height: 160vh;
}

.hero-small {
    height: 125vh;
}

/* Verhindert Abschneiden des Titels auf großen Screens */

    .hero__content-text {
        padding-top: calc(15vh + 40px) !important;  /* Mehr Abstand auf großen Screens */
        padding-bottom: calc(89px + 40px) !important;
    }
}

/* ============================================
   KURSKARTEN-FARBEN BASIEREND AUF TYP
   ============================================ */

/* Höhere Berufsbildung - Blau */
.product--berufsbildung::before {
    background-color: #00aaff !important;
    opacity: .25 !important;
}
/* Listenansicht: Hintergrundfarbe für Berufsbildung */
.category-list__grid.view-list .product--berufsbildung::after {
    background-color: #00aaff !important;
    opacity: .25 !important;
}
.product.product--berufsbildung {
    color: #00aaff !important;
}
.product.product--berufsbildung h4 {
    color: #00aaff !important;
}
.product.product--berufsbildung .product__info {
    color: #00aaff !important;
}
.product.product--berufsbildung .product__footer .link-arrow svg path {
    stroke: #00aaff !important;
}

/* Hochschule - Dunkelblau */
.product--hochschule::before {
    background-color: #2260c0 !important;
    opacity: .25 !important;
}
/* Listenansicht: Hintergrundfarbe für Hochschule */
.category-list__grid.view-list .product--hochschule::after {
    background-color: #2260c0 !important;
    opacity: .25 !important;
}
.product.product--hochschule {
    color: #2260c0 !important;
}
.product.product--hochschule h4 {
    color: #2260c0 !important;
}
.product.product--hochschule .product__info {
    color: #2260c0 !important;
}
.product.product--hochschule .product__footer .link-arrow svg path {
    stroke: #2260c0 !important;
}

/* Pfeil nach rechts verschieben, wenn kein Partnerlogo vorhanden */
/* Standard: Pfeil rechts */
.product__footer .link-arrow {
    margin-left: auto !important;
}
/* Wenn ein figure (Partnerlogo) vorhanden ist, Pfeil zurücksetzen */
.product__footer:has(figure) .link-arrow {
    margin-left: 0 !important;
}



/* ============================================
   NAVIGATION-THEMES
   ============================================ */

/* Hochschule - Dunkelblau (Alias für darkblue, damit beide Namen funktionieren) */
.page-wrapper--theme-dunkelblau,
.page-wrapper--theme-darkblue {
    --primary: #2260c0;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(34, 96, 192, 0.25), rgba(34, 96, 192, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(34, 96, 192, 0.25);
}

/* Teaser mit dunkelblau-solid: Sicherstellen, dass Hintergrund korrekt ist */
/* Diese Regel wird durch die inline-Styles im Teaser-Snippet überschrieben, 
   aber dient als Fallback falls die inline-Styles nicht geladen werden */
[class*="teaser-"] .intro__text[style*="background-color: #2260c0"],
[class*="teaser-"] .text-image-cols__text[style*="background-color: #2260c0"] {
    background-color: #2260c0 !important;
    background: #2260c0 !important;
}

/* Services - Grün */
.page-wrapper--theme-gruen {
    --primary: #3b7d23;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(59, 125, 35, 0.25), rgba(59, 125, 35, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(59, 125, 35, 0.25);
}

/* Academy - Gelb */
.page-wrapper--theme-gelb {
    --primary: #b1d348;
    --secondary: #d8017e;
    --accent: #d8017e;
    --header-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --header-highlight: var(--primary);
    --footer-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --card-bg: linear-gradient(rgba(177, 211, 72, 0.25), rgba(177, 211, 72, 0.25)), linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    --btn-download-bg: rgba(177, 211, 72, 0.25);
}

.page-wrapper--theme-darkblue.page-wrapper--inner-page,
.page-wrapper--theme-dunkelblau.page-wrapper--inner-page,
.page-wrapper--theme-gruen.page-wrapper--inner-page,
.page-wrapper--theme-gelb.page-wrapper--inner-page {
    --header-bg: var(--primary);
    --header-highlight: #fff;
}

/* ============================================
   FILTER CHECKBOXEN - NICHT ZERDRÜCKEN
   ============================================ */
.category-filter__item-checkbox {
    flex-shrink: 0 !important;
    min-width: 0 !important;
}
.category-filter__item-checkbox input {
    flex-shrink: 0 !important;
    min-width: 25px !important;
    width: 25px !important;
}
.category-filter__item-checkbox label {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* ============================================
   INLINE CSS FROM HEADER.PHP (STATIC PARTS)
   ============================================ */

@media (min-width: 1700px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1806px; /* Default, wird durch PHP-Variable überschrieben */
    }
}

/* Header Fix für große Screens - Logo und Controls begrenzen */
@media (min-width: 1800px) {
    .header__logo {
        width: 490px; /* statt 27.3vw */
    }
    .header__controls {
        width: 230px; /* statt 12.8vw */
    }
    .languages__toggler {
        padding: 1.5rem;
    }
}

/* Blog Hero Styles */
.hero--blog .hero__date {
    font-size: 1rem;
    opacity: 0.9;
    margin-bottom: 0.5rem;
    display: block;
    font-weight: 500;
    letter-spacing: 0.05em;
}
.hero--blog .hero__intro {
    font-size: 1.25rem;
    max-width: 800px;
}
.hero--blog h1 {
    margin-bottom: 1rem;
}

/* Card Overlay - Einheitliche Höhe für Titel + Text */
.cards--offers .card__overlay {
    display: flex;
    flex-direction: column;
}
.cards--offers .card__overlay h4 {
    min-height: 2.5em; /* Platz für 2 Zeilen */
    line-height: 1.25;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cards--offers .card__overlay p {
    flex: 1;
    min-height: 5.6em; /* Platz für 4 Zeilen */
}

/* Video Block - 100% Breite (nur für figure mit video/iframe) */
figure.video,
figure:has(iframe),
figure:has(video) {
    width: 100%;
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
    margin: 0;
}
figure.video iframe,
figure:has(iframe) iframe,
figure:has(video) video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Zulassung & Studienablauf Sektion */
.product-zulassung {
    /* padding: 0 0 10rem 0; */
    padding: 0 0 2.5rem 0;

}
.product-zulassung h2 {
    margin-bottom: 2rem;
}
.product-zulassung p {
    margin-bottom: 1.5rem;
}
.zulassung-links {
    list-style: none;
    padding: 0;
    margin: 0;
}
.zulassung-links li {
    margin-bottom: 0.25rem;
}
.zulassung-links a {
    color: var(--primary, #00b4d8);
    text-decoration: underline;
}
.zulassung-links a:hover {
    text-decoration: none;
}

/* Accordion auf Kurs-Detailseite - gleiche Schriftgröße wie Content-Seiten */
.product-programm .accordion-button {
    font-size: clamp(2.2rem, 2.2vw, 3rem) !important;
}

/* Berufsbildung: Abstand vor Filter reduzieren */
.page-wrapper--theme-blue .category-list {
    margin-top: 7.5rem;
}

/* Footer: Kontaktdaten nicht bold */
.footer__contact,
.footer__contact address,
.footer__contact address p,
.footer__contact address strong,
.footer__contact address b {
    font-weight: normal !important;
}

/* Footer: Schrift unten kleiner */
.footer__copyright,
.footer__nav-inline,
.footer__nav-inline ul {
    font-size: calc(1.125rem - 3px);
}

/* Einheitliche Kachel-Titel Grösse */
.card h3,
.card h4,
.card--team .card__overlay h3,
.cards--news .card__overlay h3,
.cards--offers .card__overlay h4,
.product h4 {
    font-size: var(--card-title-size) !important;
    line-height: 1.3 !important;
    hyphens: auto;
}

/* Subseiten Grid - H4 auf H2-Größe (höhere Spezifität, kommt nach allgemeiner Regel) */
/* .subseiten-grid .product h4 {
    font-size: clamp(1.8rem, 2.8vw, 2.4rem)!important;
    line-height: 1.3 !important;
} */

@media(min-width: 1300px){
    .cards__grid {
        grid-template-columns: repeat(4, 1fr);
    }
    .card.card--team figure {
        background-color: rgba(0, 0, 0, 0.75);
    }
    .card__overlay h5{
        font-size: clamp(1.625rem, 1.3vw, 2rem) !important;
    }
}
@media(min-width: 1024px){
    .card__overlay h5{
        font-size: clamp(1.125rem, 1.3vw, 1.25rem) !important;
    }
    .card.card--team figure img{
        height:75%;
    }
}

/* RESPONSIVE STYLES */
@media(max-width: 575.98px){
    .form__field--checkbox label {
        font-size: clamp(.7rem, 1.3vw, 1.125rem);
    }
    
    /* Product Details: Liste untereinander anzeigen */
    .product-details__text ul li {
        flex-direction: column !important;
    }
    
    /* Product Details: Span font-weight 500 */
    .product-details__text ul li span {
        font-weight: 500;
        width: 100% !important;
        margin: 0 0 0.5rem 0 !important;
    }

    .product-details__wrapper ul li {
        margin-bottom: 15px !important;
    }
    
    /* Button: Text umbrechen erlauben */
    .btn {
        white-space: normal !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
}