/*!
Theme Name: Zackstark
Theme URI: http://underscores.me/
Author: IN4OUT
Author URI: https://in4out.ch
Description: WordPress Theme for Zackstark
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: zackstark
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/

:root {
    --app-height: 100%;
}

html {
    font-family: "DM Sans", sans-serif;
    font-weight: 400;
    font-size: 16px;
    scroll-behavior: smooth;
    color: #092f2f;
}

body {
    margin: 0;
    outline: 0;
    width: 100%;
    overflow-x: hidden;
}

.site {
    width: 100%;
}

img {
    max-width: 100%;
    height: auto;
    margin: 0;
}

figure {
    margin: 0;
}

a {
    text-decoration: none;
    color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 800;
    margin: 0;
}

p {
    margin: 0;
    line-height: 140%;
}

ul,
ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
    line-height: 140%;
}

.content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 36px;
    margin-left: 0;
}

.content ul li::before {
    content: " ";
    display: block;
    position: absolute;
    left: 0;
    top: 11px;
    width: 20px;
    height: 3px;
    background: #c9dfa7;
}

.half-blocks .content ul li::before {
    background: #ffffff;
    top: 17px;
}

.content ol li {
    list-style-type: decimal;
    margin-left: 16px;
    text-indent: 3px;
}

.wrap {
    width: 90%;
    margin: 0 auto;
    max-width: 1060px;
}

.fullscreen-toggled {
    overflow: hidden;
}

.fullscreen-content {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.4);
    overflow: auto;
    display: none;
    z-index: 11;
}

.fullscreen-content.optin-success,
.fullscreen-content.show {
    display: block;
}

.fullscreen-wrapper {
    background: #ffffff;
    position: relative;
    width: 90%;
    max-width: 960px;
    padding: 60px 0;
    box-sizing: border-box;
    margin: 50px auto;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2), 0 4px 20px 0 rgba(0, 0, 0, 0.19);
}

.fullscreen-wrapper > .close {
    display: block;
    width: 16px;
    height: 16px;
    background-image: url(inc/img/close.svg);
    background-size: 100% auto;
    background-repeat: no-repeat;
    position: absolute;
    top: 15px;
    right: 15px;
    cursor: pointer;
}

.fullscreen-wrapper .content {
    text-align: center;
    margin-bottom: 30px;
    padding: 0 8%;
}

.fullscreen-wrapper .content h2 {
    font-size: 35px;
    line-height: 120%;
    margin-bottom: 30px;
}

.fullscreen-wrapper .content p {
    font-size: 18px;
    font-weight: 400;
    margin-bottom: 20px;
}

.fullscreen-wrapper .content a:not(.button) {
    font-size: 18px;
    color: #6e4589;
    font-weight: 700;
    line-height: 160%;
    max-width: 280px;
    display: block;
    margin: 0 auto;
}

.optin-success .fullscreen-wrapper .content a:not(.button) {
    text-decoration: underline;
    margin-bottom: 30px;
}

.fullscreen-wrapper form {
    padding: 0 8%;
}

.fullscreen-wrapper .importing form {
    padding: 0;
}

.fullscreen-wrapper .field,
.admin-page .form-container .field {
    margin-bottom: 15px;
    position: relative;
    overflow: hidden;
}

.fullscreen-wrapper div[data-id="nicotine-conditional"] .field {
    margin-bottom: 0;
}

.fullscreen-wrapper .password-field-toggle > span {
    display: block;
    position: relative;
}

.form-container .password-field sub {
    margin: 20px 0;
}

.fullscreen-wrapper label,
.admin-page .form-container label {
    font-size: 14px;
    font-weight: 400;
    display: block;
    z-index: 2;
    position: relative;
}

.form-container .field.password-field label,
.form-container .field.text-field label,
.form-container .field.dropdown-field label {
    position: absolute;
    top: 100%;
    transform: translateY(calc(-100% + 4px));
}

.field.checkbox-field label {
    font-size: 18px;
    height: auto;
}

.form-container select,
.form-container input[type="text"],
.form-container input[type="password"],
.form-container input[type="email"],
.form-container input[type="tel"],
.form-container input[type="url"],
.form-container input[type="number"],
.form-container textarea,
input[type="search"] {
    width: 100%;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 0;
    padding: 5px 50px 2px 0;
    outline: 0;
    border-bottom: 1px solid #092f2f;
    font-weight: 400;
    display: block;
    font-family: "DM Sans", sans-serif;
    font-size: 18px;
    line-height: 160%;
    background-color: #ffffff;
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
    box-shadow: 0 0 0px 1000px #ffffff inset !important;
    color: #092f2f;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

::-webkit-input-placeholder {
    color: #092f2f;
    opacity: 1;
}
::-moz-placeholder {
    color: #092f2f;
    opacity: 1;
}
:-ms-input-placeholder {
    color: #092f2f;
    opacity: 1;
}
:-moz-placeholder {
    color: #092f2f;
    opacity: 1;
}

.lernendedaten input[type="search"] {
    margin-bottom: 20px;
}

.form-container textarea {
    height: 120px;
}

.form-container select {
    background-image: url(inc/img/dropdown.png);
    background-size: 9px 5px;
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-color: #ffffff;
    color: #092f2f;
}

.fullscreen-wrapper label.moves,
.admin-page .form-container label.moves {
    transition: transform 0.15s linear, font-size 0.15s linear;
}

.form-container .input-wrapper {
    position: relative;
    height: 44px;
    display: block;
    width: 100%;
}

.form-container .static .input-wrapper {
    height: auto;
}

.form-container .static label {
    position: relative !important;
    top: auto !important;
    transform: none !important;
    font-size: 18px !important;
    font-weight: 400 !important;
}

.form-container .input-wrapper > * {
    width: 100%;
}

.fullscreen-wrapper .field:not(.static) .input-wrapper:has(~ span input:not(:focus):placeholder-shown) label.moves,
.admin-page .form-container .field:not(.static) .input-wrapper:has(~ span input:not(:focus):placeholder-shown) label.moves {
    font-size: 18px;
    line-height: 160%;
    font-weight: 400;
    transform: translateY(calc(-100% + 36px));
    left: 0;
    pointer-events: none;
    white-space: nowrap;
}

.form-container .field br {
    display: none;
    visibility: hidden;
}

.password-selection,
.radio-field .wpcf7-list-item-label {
    display: flex;
    align-items: center;
    gap: 0 20px;
    font-size: 18px;
    line-height: 160%;
    margin-bottom: 10px;
    cursor: pointer;
}

div[data-class="wpcf7cf_group"] .wpcf7-checkbox .wpcf7-list-item.last,
div[data-class="wpcf7cf_group"] .wpcf7-checkbox .wpcf7-list-item.last .wpcf7-list-item-label {
    margin-bottom: 0;
}

div[data-class="wpcf7cf_group"] .wpcf7-checkbox .wpcf7-list-item {
    margin: 0 0 0 36px;
}

div[data-class="wpcf7cf_group"] .wpcf7-checkbox .wpcf7-list-item .wpcf7-list-item-label {
    margin: 0;
}

.password-selection::before,
.field input[type="radio"] + .wpcf7-list-item-label::before {
    display: block;
    content: " ";
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid #092f2f;
    border-radius: 50%;
    position: relative;
    top: -1px;
}

.password-selection.active::before,
.field input[type="radio"]:checked + .wpcf7-list-item-label::before {
    background: #092f2f;
}

.password-field-toggle.generate,
.radio-field input {
    display: none;
}

.password-field-toggle > span {
    margin-bottom: 25px;
    display: block;
}

.form-container sub {
    display: block;
    font-size: 14px;
    margin-top: 6px;
}

.form-container .wpcf7-acceptance {
    display: block;
    width: 100%;
    height: auto;
    cursor: pointer;
    margin: 20px 0;
}

.form-container span:has(.wpcf7-acceptance) + br {
    display: none;
}

.form-container .wpcf7-acceptance label {
    font-size: 18px;
    line-height: 160%;
}

.form-container .wpcf7-acceptance input,
.field.checkbox-field input {
    display: none;
    visibility: hidden;
}

.field.checkbox-field .wpcf7-list-item,
.field.radio-field .wpcf7-list-item {
    display: block;
    margin: 10px 0;
}

.form-container .wpcf7-acceptance span.wpcf7-list-item-label,
.field.checkbox-field .wpcf7-list-item-label {
    display: block;
    position: relative;
    padding-left: 36px;
}

.form-container .wpcf7-acceptance span.wpcf7-list-item-label::before,
.field input[type="checkbox"] + .wpcf7-list-item-label::before {
    display: block;
    content: " ";
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid #092f2f;
    margin-right: 20px;
    position: absolute;
    top: 2px;
    left: 0;
}

.form-container .wpcf7-acceptance span.wpcf7-list-item-label::before {
    top: 5px;
}

.form-container .wpcf7-list-item {
    margin: 0;
}

.form-container .wpcf7-acceptance input:checked + span.wpcf7-list-item-label::before,
.field input[type="checkbox"]:checked + span.wpcf7-list-item-label::before {
    background: #092f2f;
}

.form-container .wpcf7-acceptance a {
    text-decoration: underline;
}

.fullscreen-wrapper .button,
.admin-page .form-container .button,
.importing input[type="submit"],
.text-section .button {
    padding: 20px;
    background-color: #c9dfa7;
    color: #35323d;
    font-size: 24px;
    height: 64px;
    box-sizing: border-box;
}

.fullscreen-wrapper .disclaimer .button {
    max-width: none;
    background: #35323d;
    color: #fff;
    width: auto;
    display: inline-flex;
    text-decoration: none;
}

.fullscreen-wrapper .disclaimer a {
    color: #35323d;
    font-size: 26px;
    text-decoration: underline;
    font-weight: 500;
}

.fullscreen-wrapper .button:hover,
.admin-page .form-container .button:hover,
.importing input[type="submit"]:hover {
    background-color: #6e4589;
    color: #ffffff;
}
.fullscreen-wrapper .disclaimer .button:hover {
    background: #6e4589;
    color: #ffffff;
}

.fullscreen-wrapper form > p:last-of-type,
.admin-page .form-container form > p:last-of-type {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 60px;
    flex-wrap: wrap;
    gap: 20px;
}

.form-container form > p {
    width: 100%;
    margin-bottom: 20px;
    font-size: 18px;
}

.fullscreen-wrapper .wpcf7-spinner,
.admin-page .form-container .wpcf7-spinner {
    margin-right: -48px;
}

.fullscreen-wrapper .initial-form-data,
.form-wrapper .initial-form-dropdown {
    display: none;
    visibility: hidden;
}

.fullscreen-wrapper input::-webkit-outer-spin-button,
.fullscreen-wrapper input::-webkit-inner-spin-button,
.admin-page .form-container input::-webkit-outer-spin-button,
.admin-page .form-container input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

.form-container input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.fullscreen-content .content.success {
    display: none;
}

.login-section {
    margin: 100px 0;
}

.login-section h1 {
    font-size: 26px;
    margin-bottom: 20px;
}

.login-section label {
    color: #092f2f;
    font-size: 18px;
    line-height: 133%;
    display: block;
    margin-bottom: 5px;
}

.button,
.importing input[type="submit"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-family: "DM Sans", sans-serif;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    transition: background-color 0.15s linear, color 0.15s linear;
    border: none;
    cursor: pointer;
    -webkit-border-radius: 0;
    border-radius: 0;
    box-sizing: border-box;
    height: 64px;
    font-weight: 700;
    line-height: 100%;
}

.button.unsubscribe {
    margin-left: auto;
}

.login-section .button {
    padding: 15px;
    background-color: #c9dfa7;
    color: #35323d;
    font-size: 18px;
    margin: 20px 0 60px;
}
.login-section .button:hover,
.text-section .button:hover {
    background: #6e4589;
    color: #ffffff;
}

.login-section input[type="text"],
.login-section input[type="password"],
.login-section input[type="email"],
.login-section input[type="tel"],
.login-section input[type="url"],
.login-section input[type="number"] {
    margin-bottom: 25px;
    height: 47px;
}

.login-section .wrap > p {
    font-size: 18px;
    line-height: 160%;
}

.login-section .wrap > p + .wpcf7 {
    margin-top: 30px;
}

.login-section p a {
    color: #6e4589;
}

.login-section input[type="checkbox"] {
    display: none;
}

.login-section label:has(input[type="checkbox"]) {
    position: relative;
    padding-left: 36px;
}

.login-section label:has(input[type="checkbox"])::before {
    display: block;
    content: " ";
    width: 16px;
    height: 16px;
    box-sizing: border-box;
    border: 1px solid #092f2f;
    margin-right: 20px;
    position: absolute;
    top: 4px;
    left: 0;
}

.form-container .wpcf7-list-item {
    margin: 0;
}

.login-section label:has(input[type="checkbox"]:checked)::before {
    background: #092f2f;
}

.password-field-toggle.manual {
    gap: 0 30px;
    flex-wrap: wrap;
}

.admin-page {
    margin: 100px 0;
}

.admin-page .content {
    text-align: center;
    margin: 0 auto 60px;
    max-width: 850px;
}

.admin-page h1 {
    margin-bottom: 30px;
}

.admin-page .content p {
    font-size: 24px;
    line-height: 133%;
}

.admin-selection .selection {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    justify-content: center;
}

.admin-link {
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    box-sizing: border-box;
    max-width: 400px;
    background-color: #c9dfa7;
    color: #ffffff;
}

.admin-link a {
    padding: 45px 35px 50px;
    display: block;
}

.admin-link figure {
    display: block;
    width: 70px;
    margin: 0 auto 30px;
}

.admin-link img {
    display: block;
}

.admin-link .title {
    font-size: 20px;
    margin-bottom: 66px;
    font-weight: 500;
    color: #35323d;
}

.admin-link .button {
    background: #6e4589;
    font-size: 24px;
    padding: 20px;
    color: #fff;
    border: 2px solid #6e4589;
}

.admin-link .button:hover {
    background: transparent;
    color: #35323d;
    border: 2px solid #35323d;
}

.admin-selection .wrap {
    max-width: 800px;
}
.betriebsdaten .wrap {
    max-width: 1060px;
}

.return {
    width: 90%;
    max-width: 1100px;
}

.return:first-child {
    margin: 40px auto 0;
}
.return:last-child {
    margin: 0 auto 40px;
}

a.back {
    font-weight: 700;
    font-size: 16px;
    position: relative;
    padding-left: 40px;
}

a.back::before {
    display: block;
    content: "";
    width: 33px;
    height: 22px;
    background-image: url(inc/img/back_button.svg);
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateX(0) translateY(-50%);
    transition: transform 0.15s linear;
}

a.back:hover::before {
    transform: translateX(-10px) translateY(-50%);
}

.admin-page .betrieb-data {
    visibility: hidden;
    display: none;
}

.field.hide-this {
    display: none;
    visibility: hidden;
}

.data-list li {
    display: flex;
    background: #6e4589;
    color: #ffffff;
    padding: 10px 20px;
    font-size: 16px;
    line-height: 144%;
    margin-bottom: 20px;
    position: relative;
    align-items: center;
    gap: 10px;
    font-weight: 500;
    width: 100%;
    min-width: 640px;
    box-sizing: border-box;
}

.data-list li.labels {
    background: #35323d;
    margin-top: 40px;
}

.data-list li.labels .data span {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0 10px;
    color: #ffffff;
}

.data-list li .data {
    display: flex;
    max-width: calc(100% - 100px);
}

.data-list li .data span {
    width: 200px;
}

.data-list li.labels .data span::after {
    display: block;
    content: " ";
    width: 12px;
    height: 8px;
    background-image: url(inc/img/sort.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    transition: transform 0.15s linear;
}

.data-list li.labels .data span.ascending::after {
    transform: rotate(-180deg);
}

.data-list li .data span.ausbildung {
    width: 350px;
}

ul.data-list {
    max-width: 1060px;
    margin: 0 auto 100px;
    width: 100%;
    overflow: auto;
}

ul.data-list + .buttons,
.buttons:has(~ .data-list) {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin: 60px 0;
}
ul.data-list + .buttons:has(.button + .button),
.buttons:has(~ .data-list):has(.button + .button) {
    justify-content: space-between;
}

ul.data-list + .buttons .button,
.buttons:has(~ .data-list) .button {
    background: #c9dfa7;
    color: #35323d;
    padding: 20px;
    font-size: 18px;
}

ul.data-list + .buttons .button:hover,
.buttons:has(~ .data-list) .button:hover {
    background: #6e4589;
    color: #ffffff;
}

.data-list .edit,
.data-list .remove,
.data-list .upload {
    display: block;
    width: 30px;
    height: 30px;
    cursor: pointer;
    background-size: 100%;
    background-repeat: no-repeat;
    flex-shrink: 0;
}

.data-list .edit {
    background-image: url(inc/img/zackstark-iconset_bearbeiten.svg);
    margin-left: auto;
}

.data-list .upload {
    background-image: url(inc/img/zackstark-iconset_pdf.svg);
    margin-left: auto;
}

.data-list .remove {
    background-image: url(inc/img/zackstark-iconset_delete.svg);
}

.benutzer .remove {
    margin-left: auto;
}

.form-container .disclaimer {
    background-color: #c9dfa7;
    color: #35323d;
    padding: 30px;
    font-size: 20px;
    line-height: 150%;
}

.form-container .disclaimer ul li {
    padding-left: unset;
}

.form-container .disclaimer ul li::before {
    content: " ";
    display: unset;
    position: unset;
    left: 0;
    top: unset;
    width: unset;
    height: unset;
    background: unset;
}

.form-container h4 {
    font-size: 27px;
    margin-bottom: 30px;
}

.form-container .disclaimer li {
    list-style-type: none;
    margin: 0 0 20px;
}

.form-container .extra {
    padding: 0 8%;
    font-size: 18px;
    margin-bottom: 40px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px;
}

.form-container .extra .existing {
    display: none;
}

.form-container .extra a {
    text-decoration: underline;
    color: inherit;
    font-weight: inherit;
}

.form-container input[type="file"] {
    font-family: "DM Sans", sans-serif;
    font-size: 18px;
}

.form-container .importing {
    margin-top: 60px;
}

.form-container .importing form {
    display: flex;
    align-items: center !important;
    gap: 30px;
    justify-content: space-between;
}

.content-section.admin-page .content p,
.content-section.admin-page .content ul,
.content-section.admin-page .content ol {
    margin-bottom: 20px;
}

.content-section .content p a {
    text-decoration: underline;
}

.hero-section {
    background: #c9dfa7;
    color: #35323d;
    height: calc(var(--app-height) - 40px);
    position: relative;
    z-index: 4;
}

.hero-section .hero-logo {
    z-index: 2;
    position: absolute;
    width: 27.66vmin;
    left: 5vmin;
    top: 5vmin;
    max-width: 282px;
}

.hero-slider {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.hero-slider .hero-content {
    position: absolute;
    z-index: 2;
    padding: 0 10% 20px;
    box-sizing: border-box;
    bottom: 0;
    left: 0;
    width: 100%;
    color: #ffffff;
}

.hero-slider .swiper-slide {
    background: #c9dfa7;
}

.hero-image {
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* object-position: top; */
}

.hero-title {
    font-weight: 700;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    width: 85%;
}

.hero-title .text {
    font-size: 36px;
    line-height: 110%;
}

.hero-slider .swiper-pagination {
    z-index: 3 !important;
    position: relative;
    bottom: 0 !important;
    margin-bottom: 10px;
}

.hero-slider > .swiper-pagination {
    display: none;
}

.hero-slider .swiper-pagination-bullet {
    height: 12px;
    width: 12px;
    margin: 0 5px !important;
    background: transparent;
    opacity: 1;
    border: 2px solid #ffffff;
}

.hero-slider .swiper-pagination-bullet-active {
    background: #ffffff;
}

.hero-slider .swiper-wrapper + .swiper-pagination-bullets {
    bottom: 20px;
}

.flexible-content {
    text-align: center;
    font-size: 20px;
    margin: 40px 0;
}

section {
    scroll-margin: 40px;
}

.text-section .wrap {
    max-width: 980px;
}

.flexible-content h1,
.flexible-content h2 {
    font-size: 30px;
    margin-bottom: 20px;
}

.flexible-content .content p,
.flexible-content .content ul,
.flexible-content .content ol {
    margin-bottom: 20px;
}

.text-section .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
}

.hero-section {
    min-height: 500px;
}

.hero-section .button {
    font-size: 18px;
    color: #35323d;
    background: #c9dfa7;
    font-weight: 700;
    height: 46px;
    padding: 0 20px;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    line-height: 100%;
}

.hero-section .button:hover {
    color: #ffffff;
    background: #6e4589;
}

hr {
    display: block;
    border: 0;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    background: #092f2f;
    height: 4px;
    margin-bottom: 40px;
}

.flexible-content h1:has(+ hr),
.flexible-content h2:has(+ hr) {
    margin-bottom: 6px;
}

.flexible-content .content a:not(.button),
.content .toggle-trigger {
    text-decoration: underline;
    transition: color 0.15s linear;
    cursor: pointer;
}

.flexible-content .content a:not(.button):hover,
.content .toggle-trigger:hover {
    color: #6e4589;
}

.link-blocks {
    text-align: center;
}

.link-blocks .wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 34px;
    justify-content: center;
}

.link-block {
    display: flex;
    width: 100%;
    max-width: 488px;
    overflow: hidden;
    transition: transform 0.25s linear;
}

.link-block a {
    padding: 30px;
    box-sizing: border-box;
    display: flex;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-color: #c9dfa7;
    color: #35323d;
    transition: color 0.25s linear, background-color 0.25s linear;
    height: 100%;
}

.link-block:hover {
    transform: scale(1.04, 1.04);
}

.link-block a:hover {
    background-color: #6e4589;
    color: #ffffff;
}

.link-block h4 {
    font-size: 26px;
    font-weight: 700;
}

.link-block h4:not(:last-child) {
    margin-bottom: 14px;
}

.link-block p {
    flex-grow: 1;
    font-size: 20px;
}

.half-blocks.has-background .left {
    background: #6e4589;
    color: #ffffff;
}

.half-blocks.has-background .right {
    background: #c9dfa7;
    color: #35323d;
}

.half-blocks.has-background > div {
    text-align: center;
    padding: 40px 5% 60px;
}

.flexible-content.half-blocks h1,
.flexible-content.half-blocks h2,
.cta-section h1,
.cta-section h2 {
    font-size: 30px;
    line-height: 100%;
    margin-bottom: 30px;
}

.half-blocks h1 img,
.half-blocks h2 img {
    margin-top: 20px;
}

.half-blocks .content {
    max-width: 560px;
    margin: 0 auto;
}

.flexible-content .button {
    font-weight: 700;
    font-size: 18px;
    height: 46px;
    display: inline-flex;
    align-items: center;
}

.flexible-content .button,
.text-section .buttons .button:first-child:hover {
    background: #c9dfa7;
    color: #35323d;
}

.flexible-content .button:hover,
.text-section .buttons .button:first-child {
    background: #6e4589;
    color: #ffffff;
}

.text-section .buttons {
    margin-top: 40px;
}

.flexible-content iframe {
    width: 394px;
    height: 251px;
    max-width: 90vw;
    max-height: 57vw;
}

.flexible-content p > .button {
    margin: 10px auto 30px;
}

.flexible-content p,
.flexible-content ol,
.flexible-content ul {
    margin-bottom: 20px;
}

main:has(.hero-section) .site-header:first-child {
    display: none;
}

.site-header {
    position: sticky;
    top: 0;
    padding: 12px 0;
    z-index: 4;
    background: #c9dfa7;
    color: #35323d;
}

.home .site-header,
body:has(.admin-page) .site-header,
.page-template-page-login .site-header {
    background: #6e4589;
    color: #ffffff;
}

.hero-section + .site-header {
    margin-top: -6px;
}

.main-navigation a {
    text-transform: uppercase;
    font-weight: 700;
}

.main-navigation a {
    font-size: 20px;
}

.site-header .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: none;
}

.betrieb-section .wrap {
    max-width: 1460px;
}

.betrieb-listings {
    color: #ffffff;
    font-weight: 400;
    position: relative;
    padding: 40px 0;
}

.betrieb-listings::after {
    content: " ";
    display: block;
    background-color: #6e4589;
    position: absolute;
    width: 100vw;
    height: 100%;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

.betrieb-listings li {
    position: relative;
    z-index: 2;
    line-height: 95%;
}

.betrieb-listings a {
    text-decoration: underline;
    transition: opacity 0.15s linear;
}

.betrieb-listings a:hover {
    opacity: 0.5;
}

.betrieb-section .filter {
    margin: 40px 0;
}

.betrieb-section .filter p {
    font-weight: 700;
    margin-bottom: 20px;
}

.betrieb-section .filter .button {
    background-color: rgba(255, 255, 255, 0);
    border: 2px solid #092f2f;
    padding: 0 22px;
}
.betrieb-section .filter .button.active,
.betrieb-section .filter .button:hover {
    background: #6e4589;
    border: 2px solid #6e4589;
    color: #ffffff;
}

.betrieb-section .filter .buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
}

.site-footer {
    background: #35323d;
    padding: 40px 0;
    color: #ffffff;
}

main:has(section.admin-page) .site-footer {
    background: #c9dfa7;
    color: #35323d;
}

.page-template-page-verwaltungsbereich .site-footer,
.page-template-page-login .site-footer,
.page-template-page-lernender .site-footer,
.page-template-page-betriebsdaten .site-footer,
.page-template-page-infos .site-footer,
.page-template-page-belohnungen .site-footer,
.page-template-page-auszahlungssystem .site-footer {
    background: #35323d !important;
    color: #fff !important;
}

.site-footer .wrap {
    max-width: none;
}

.site-footer .logo {
    filter: grayscale(100) contrast(0) brightness(40%);
    width: 224px;
    margin-bottom: 40px;
    display: none;
}

.site-footer .columns {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 18px;
    width: 100%;
}

.site-footer .column {
    width: calc(50% - 10px);
}

.site-footer .columns ul {
    line-height: 150%;
}

.site-footer .title {
    font-size: 20px;
    margin-bottom: 16px;
    font-weight: 700;
}

.site-footer a {
    transition: opacity 0.15s linear;
    width: 100%;
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
}

.site-footer a:hover {
    opacity: 0.5;
}

.flexible-content.betrieb-section {
    margin-bottom: 0;
}

.flexible-content.betrieb-section ul {
    margin-bottom: 0;
}

.logo-gallery .gallery-inner {
    width: 100%;
    overflow: hidden;
}

.logo-carousel {
    padding: 20px 0;
    position: relative;
}

.logo-carousel.static .swiper-wrapper {
    justify-content: center;
    pointer-events: none;
}

.logo-carousel::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    background: #c9dfa7;
}

.logo-carousel figure {
    width: 240px;
    box-sizing: border-box;
    border-radius: 30px;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 30px 40px;
    height: auto;
}

.logo-carousel a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.logo-carousel img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: auto;
}

.logo-carousel .swiper-wrapper {
    transition-timing-function: linear;
}

.flexible-content .align-left {
    text-align: left;
}

.interview-section .interview-image {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 30px;
}

.interview-section .interview-image img {
    display: block;
    width: 100%;
}

.interview-section .interview-title {
    font-size: 28px;
    margin-bottom: 10px;
}

.interview-section .interview-name {
    font-size: 18px;
    font-weight: 500;
}

.interview-section .interview {
    margin-top: 40px;
}

.cta-section {
    background: #c9dfa7;
    color: #35323d;
    padding: 50px 0;
}

.cta-section .icon {
    width: 80px;
    margin: 0 auto 20px;
}

.cta-section p {
    line-height: 200%;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.cta-section .button {
    border: 2px solid #6e4589;
    background-color: #6e4589;
    color: #ffffff;
    padding: 0 24px;
}
.cta-section .button:hover {
    border: 2px solid #35323d;
    color: #35323d;
    background-color: #c9dfa7;
}

.faq-section .question {
    font-size: 26px;
    color: #092f2f;
    padding-left: 38px;
    position: relative;
    cursor: pointer;
    margin-bottom: 20px;
}

.faq-section .answer {
    display: none;
    padding-left: 38px;
}

.faq-section .accordion {
    margin-bottom: 28px;
}

.flexible-content.faq-section .content p,
.flexible-content.faq-section .content ul,
.flexible-content.faq-section .content ol {
    margin: 0;
    padding-bottom: 15px;
}

.faq-section .accordion .toggle {
    width: 24px;
    height: 15px;
    display: block;
    position: absolute;
    background-image: url(inc/img/faq.svg);
    background-size: 100%;
    left: 0;
    top: 9px;
    transition: transform 0.15s linear;
}

.faq-section .accordion:not(.open) .toggle {
    transform: rotate(-90deg);
}

.map-section .content {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.map-section svg {
    width: 100%;
    height: auto;
}

.map-section svg path.active {
    transition: fill 0.15s linear;
    cursor: pointer;
}

.map-section svg path.active:hover {
    fill: #c9dfa7;
}

.map-section .kanton-links {
    display: none;
    visibility: hidden;
}

.content ul li {
    list-style-type: none;
    position: relative;
    padding-left: 36px;
    margin-left: 0;
}

.content ul li::before {
    content: " ";
    display: block;
    position: absolute;
    left: 0;
    top: 11px;
    width: 20px;
    height: 3px;
    background: #6e4589;
}

.menu-toggle {
    width: 50px;
    height: 50px;
    display: block;
    background-image: url(inc/img/zackstark-iconset_profil.svg);
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    z-index: 2;
}

.admin-navigation {
    display: none;
    position: absolute;
    background: #092f2f;
    top: 100%;
    right: 5%;
    transform: translateX(20px);
}

.menu-open .admin-navigation {
    display: block;
}

.admin-navigation a {
    display: block;
    border-bottom: 2px solid #ffffff;
    font-size: 18px;
    padding: 10px 15px;
    font-weight: 800;
    transition: color 0.15s linear;
    background: #c9dfa7;
    color: #35323d;
}

.admin-navigation a:hover {
    background: #6e4589;
    color: #ffffff;
}

.admin-navigation li:last-child a {
    border-bottom: 0;
}

.betrieb-selection-dropdown,
.flexible-content .mandant-dropdown {
    height: 40px;
    position: relative;
    cursor: pointer;
    font-size: 18px;
    font-weight: 500;
    max-width: 450px;
    margin: 0 0 40px;
    box-sizing: border-box;
    background-color: #ffffff;
    z-index: 3;
}

.flexible-content .mandant-dropdown {
    margin: 0 auto 40px;
}

.betrieb-selection-dropdown::after,
.mandant-dropdown::after {
    display: block;
    content: " ";
    width: 9px;
    height: 5px;
    background-image: url(inc/img/dropdown.png);
    background-size: 9px 5px;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.15s linear;
}

.betrieb-selection-dropdown.open::after,
.mandant-dropdown.open::after {
    transform: translateY(-50%) rotate(-180deg);
}

.betrieb-selection-dropdown li {
    height: 40px;
    padding: 0 10px;
    align-items: center;
    display: none;
    box-sizing: border-box;
    background-color: #ffffff;
    border: 1px solid #092f2f;
    border-collapse: collapse;
}

.mandant-dropdown li {
    height: 40px;
    align-items: center;
    display: none;
    background-color: #ffffff;
    border: 1px solid #092f2f;
    border-collapse: collapse;
}

.mandant-dropdown li a {
    width: 100%;
    display: flex;
    height: 40px;
    box-sizing: border-box;
    text-align: left;
    align-items: center;
    padding: 0 10px;
}

.betrieb-selection-dropdown li:not(:first-child),
.mandant-dropdown li:not(:first-child) {
    margin-top: -1px;
}

.betrieb-selection-dropdown.open li,
.betrieb-selection-dropdown li.active,
.mandant-dropdown.open li,
.mandant-dropdown li.active {
    display: flex;
}

.betrieb-selection-dropdown.open li.active,
.mandant-dropdown.open li.active {
    background-color: #edf8f7;
}

.form-container:not(.login-section:not(:has(.initial-form-data))) .wpcf7 .sent .wpcf7-response-output {
    display: none;
    visibility: hidden;
}

.form-container .wpcf7 .wpcf7-spinner,
.initial-button-text,
.loading-button-text {
    display: none !important;
    visibility: hidden !important;
}

.fullscreen-wrapper .button.submitting,
.not-verified .button.submitting,
body .button.submitting {
    pointer-events: none;
    filter: grayscale(100);
    padding-right: 44px;
    position: relative;
    transition: padding 0.15s linear;
}

.submitting::after {
    display: block;
    animation: loadingdots steps(1, end) 2s infinite;
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    left: calc(100% - 40px);
    text-align: left;
}

.button.disabled {
    cursor: initial;
    pointer-events: none;
}

.login-section form p {
    max-width: 350px;
}

@keyframes loadingdots {
    0% {
        content: "";
    }
    25% {
        content: ".";
    }
    50% {
        content: "..";
    }
    75% {
        content: "...";
    }
    100% {
        content: "";
    }
}

.mandant-navigation {
    position: relative;
    margin: 0 30px 0 auto;
    z-index: 2;
    cursor: pointer;
}

.mandant-navigation .toggle {
    width: 50px;
    height: 50px;
    display: block;
    background-color: #ffffff;
    background-image: url(inc/img/arrow-down.svg);
    background-size: 30px auto;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    z-index: 2;
    border-radius: 50%;
}

.mandant-navigation ul {
    display: none;
    position: absolute;
    background: #092f2f;
    top: 100%;
    left: 50%;
    transform: translateX(-63%) translateY(7px);
}

.mandant-navigation.open ul {
    display: block;
}

.mandant-navigation a {
    display: block;
    font-size: 18px;
    padding: 10px 15px;
    font-weight: 800;
    transition: color 0.15s linear;
    border-bottom: 2px solid #fff;
}

.mandant-navigation a,
.home .mandant-navigation a:hover,
body:has(.admin-page) .mandant-navigation a:hover,
.page-template-page-login .mandant-navigation a:hover {
    background: #6e4589;
    color: #ffffff;
}

.mandant-navigation a:hover,
.home .mandant-navigation a,
body:has(.admin-page) .mandant-navigation a,
.page-template-page-login .mandant-navigation a {
    background: #c9dfa7;
    color: #35323d;
}

.mandant-navigation .current-mandant {
    display: none;
}

.menu-logo img {
    width: 91px;
}

.wpcf7 form.sent .wpcf7-response-output,
.not-verified .success {
    border: 0;
    background: #6e4589;
    color: #ffffff;
    padding: 33px 30px;
    font-size: 18px;
    box-sizing: border-box;
    margin: 0;
    padding-left: 70px;
    background-image: url(inc/img/check.svg);
    background-repeat: no-repeat;
    background-size: 36px auto;
    background-position: left 20px top 34px;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.members-login-notice.members-login-error {
    border: 0;
    background: #e38600;
    background-position-x: 0%;
    background-position-y: 0%;
    background-repeat: repeat;
    background-image: none;
    background-size: auto;
    color: #ffffff;
    padding: 33px 50px;
    padding-left: 50px;
    font-size: 18px;
    box-sizing: border-box;
    margin: 30px 0;
    padding-left: 105px;
    background-image: url(inc/img/validation-invalid.svg);
    background-repeat: no-repeat;
    background-size: 35px auto;
    background-position: left 40px center;
}

.importing #import-status:empty {
    display: none;
}

.importing #import-status {
    border: 0;
    background: #6e4589;
    color: #ffffff;
    padding: 20px;
    font-size: 20px;
    box-sizing: border-box;
    margin: 40px auto 0;
    text-align: center;
}

.not-verified .button,
.not-verified .success {
    margin-top: 40px;
}

.not-verified .success {
    display: none;
}
.unscrolled + .site-header .mandant-navigation ul {
    top: auto;
    bottom: 100%;
    transform: translateX(-63%) translateY(-13px);
}

.unscrolled + .site-header .mandant-navigation ul li:last-child a {
    border-bottom: 0;
}

.wpcf7-not-valid-tip {
    color: #e38600 !important;
}

.form-container select.wpcf7-not-valid,
.form-container input[type="text"].wpcf7-not-valid,
.form-container input[type="password"].wpcf7-not-valid,
.form-container input[type="email"].wpcf7-not-valid,
.form-container input[type="tel"].wpcf7-not-valid,
.form-container input[type="url"].wpcf7-not-valid,
.form-container input[type="number"].wpcf7-not-valid,
.form-container textarea.wpcf7-not-valid {
    border-bottom: 1px solid #e38600;
    color: #e38600 !important;
}

.wpcf7-not-valid::-webkit-input-placeholder {
    color: #e38600;
    opacity: 1;
}
.wpcf7-not-valid:-moz-placeholder {
    color: #e38600;
    opacity: 1;
}
.wpcf7-not-valid:-ms-input-placeholder {
    color: #e38600;
    opacity: 1;
}
.wpcf7-not-valid:-moz-placeholder {
    color: #e38600;
    opacity: 1;
}

.text-field:has(.wpcf7-not-valid) label {
    color: #e38600;
}

@media all and (max-width: 767px) {
    .main-navigation {
        position: absolute;
        top: 100%;
        color: #ffffff;
        right: 0;
        box-sizing: border-box;
        z-index: 1;
        display: none;
    }

    .site-header {
        padding: 9px 0;
    }

    .site-header .wrap {
        width: 94%;
    }

    .unscrolled + .site-header .main-navigation {
        top: auto;
        bottom: 100%;
    }
    .unscrolled + .site-header .mandant-navigation ul {
        transform: translateX(-63%) translateY(-7px);
    }
    .menu-open .main-navigation {
        display: block;
    }
    .main-navigation li {
        display: block;
        line-height: 100%;
    }
    .main-navigation a {
        display: block;
        font-size: 18px;
        padding: 10px 15px;
        font-weight: 800;
        transition: color 0.15s linear;
        border-bottom: 2px solid #fff;
        background: #6e4589;
        color: #ffffff;
    }
    .home .main-navigation a,
    .page-template-page-login .main-navigation a {
        background: #c9dfa7;
        color: #35323d;
    }

    .mandant-navigation {
        margin: 0 10px 0 auto;
    }
    .mandant-navigation .toggle {
        width: 25px;
        height: 25px;
        background-size: 15px auto;
    }
    .menu-logo {
        width: 46px;
    }
    .menu-icon {
        display: flex;
        width: 27px;
        height: 11px;
        justify-content: space-between;
        flex-direction: column;
        cursor: pointer;
    }
    .menu-icon span {
        display: block;
        width: 100%;
        height: 3px;
        background: #35323d;
        transition: opacity 0.15s linear, transform 0.15s linear;
        position: relative;
    }

    .home .menu-icon span,
    .page-template-page-login .menu-icon span {
        background: #ffffff;
    }

    .menu-open .menu-icon span:first-child {
        transform: translateY(4px) rotate(45deg);
    }
    .menu-open .menu-icon span:last-child {
        transform: translateY(-4px) rotate(-45deg);
    }
    .menu-logo,
    .menu-icon {
        position: relative;
        z-index: 2;
    }
    .betrieb-listings li {
        margin-bottom: 15px;
    }
    .admin-return {
        display: none;
    }

    .hero-slider .swiper-pagination-bullet {
        height: 8px;
        width: 8px;
    }
    .hero-content .swiper-pagination {
        margin-top: 20px;
        margin-bottom: 10px;
    }
}

@media all and (min-width: 480px) {
    .hero-title .text {
        font-size: 42px;
    }
}

@media all and (min-width: 600px) {
    .fullscreen-wrapper form,
    .admin-page .form-container form {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        justify-content: space-between;
    }
    .fullscreen-wrapper .field,
    .admin-page .form-container .field,
    body .form-container div[data-class="wpcf7cf_group"] {
        width: calc(50% - 15px);
        max-width: 450px;
    }

    .fullscreen-wrapper .field-full {
        width: 100%;
        max-width: 100%;
    }

    .fullscreen-wrapper .content h2 {
        font-size: 46px;
    }
    .fullscreen-wrapper .field.password-field,
    .admin-page .form-container .checkbox-field,
    .fullscreen-wrapper .full .field,
    .admin-page .form-container .full .field,
    body .form-container div[data-class="wpcf7cf_group"] .field {
        max-width: none;
        width: 100%;
    }
    .fullscreen-wrapper .password-field-toggle {
        justify-content: space-between;
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .fullscreen-wrapper .password-field-toggle.manual {
        display: flex;
    }
    .fullscreen-wrapper .password-field-toggle > span {
        display: flex;
        width: calc(50% - 15px);
        max-width: 450px;
        flex-wrap: wrap;
    }
    .half-blocks.has-background,
    .half-blocks .wrap {
        display: flex;
    }
    .half-blocks .wrap {
        gap: 30px;
        max-width: 1120px;
    }
    .half-blocks.has-background > div,
    .half-blocks .wrap > div {
        width: 50%;
    }
}

@media all and (min-width: 768px) {
    .fullscreen-wrapper {
        margin: 100px auto;
    }
    .fullscreen-wrapper .content p {
        font-size: 20px;
    }
    .login-section h1,
    .admin-page h1 {
        font-size: 32px;
        margin-bottom: 30px;
    }
    .login-section .button {
        padding: 18px;
        font-size: 20px;
    }
    .admin-link {
        width: calc(50% - 13px);
    }
    .admin-page .content p {
        font-size: 26px;
    }
    .admin-page .content {
        margin-bottom: 90px;
    }
    .flexible-content {
        margin: 60px 0;
        font-size: 22px;
    }

    section {
        scroll-margin: 60px;
    }

    .flexible-content h1,
    .flexible-content h2 {
        font-size: 36px;
        margin-bottom: 30px;
    }

    .flexible-content .content p,
    .flexible-content .content ol,
    .flexible-content .content ul {
        margin-bottom: 30px;
    }
    .hero-section {
        min-height: 400px;
        height: calc(var(--app-height) - 75px);
    }

    .hero-section .button {
        font-size: 20px;
        height: 48px;
        padding: 0 22px;
        top: 30px;
        right: 30px;
    }
    hr {
        margin-bottom: 50px;
    }
    .link-block {
        width: calc(50% - 17px);
    }
    .half-blocks.has-background > div {
        padding: 50px 5% 80px;
    }
    .flexible-content .button {
        font-size: 20px;
        height: 48px;
    }
    .text-section .buttons {
        margin-top: 50px;
    }
    .main-navigation .menu {
        display: flex;
        flex-wrap: wrap;
        gap: 20px 30px;
    }
    .main-navigation a {
        font-size: 20px;
        line-height: 100%;
        transition: opacity 0.15s linear;
    }
    .main-navigation a:hover {
        opacity: 0.6;
    }
    .menu-icon {
        display: none;
    }
    .flexible-content p:has(iframe) {
        display: inline-block;
        margin-left: 15px;
        margin-right: 15px;
    }
    .flexible-content .align-left p:has(iframe) {
        margin-left: 0;
        margin-right: 30px;
    }
    .betrieb-listings {
        padding: 50px 0;
        font-size: 22px;
        text-align: left;
        column-count: 2;
        column-gap: 40px;
    }
    .betrieb-listings li {
        margin-bottom: 25px;
    }
    .betrieb-section .filter {
        margin: 50px 0;
    }
    .betrieb-section .filter .buttons {
        gap: 20px;
    }
    .site-footer {
        padding: 50px 0;
    }
    .logo-carousel figure {
        width: 280px;
    }
    .interview-section .interview-title {
        font-size: 32px;
        width: 75%;
        margin: 0 auto 20px;
    }
    .interview-section .interview {
        column-count: 2;
        column-gap: 30px;
    }
    .cta-section {
        padding: 60px 0;
    }
    .faq-section .question {
        font-size: 28px;
    }
    .faq-section .accordion .toggle {
        top: 10px;
    }
    .content ul li::before {
        top: 12px;
    }
    .half-blocks .content ul li::before {
        top: 18px;
    }
    .admin-return {
        margin-right: 50px;
        margin-left: auto;
        font-size: 20px;
        font-weight: 800;
        text-transform: uppercase;
        transition: opacity 0.15s linear;
    }
    .admin-return:hover {
        opacity: 0.5;
    }
    .admin-navigation .mobile {
        display: none;
    }
    .mandant-navigation {
        margin: 0 0 0 30px;
    }
    .main-navigation {
        margin-left: auto;
    }
    .wpcf7 form.sent .wpcf7-response-output {
        padding-left: 105px;
        background-size: 46px auto;
        background-position: left 40px top 34px;
    }
    .mandant-navigation ul {
        transform: translateX(-63%) translateY(13px);
    }

    .hero-title .text {
        font-size: 9.5vmin;
    }
}

@media all and (min-width: 768px) and (orientation: portrait) {
    .hero-slider .hero-content::after {
        transform: rotate(-3deg) translateX(-8vh) !important;
    }
}

@media all and (min-width: 1024px) {
    .login-section h1,
    .admin-page h1 {
        font-size: 38px;
    }
    .fullscreen-wrapper .content p {
        font-size: 22px;
    }
    .admin-page .content {
        margin-bottom: 100px;
    }
    .hero-slider .swiper-slide {
        display: flex;
        flex-direction: row-reverse;
    }
    .hero-image {
        width: 60%;
        height: 100%;
    }
    .hero-section .hero-logo {
        top: 45px;
        width: 220px;
        left: 5%;
    }
    .hero-slider .hero-content {
        width: 40%;
        height: 100%;
        display: flex;
        align-items: center;
        background: #c9dfa7;
        color: #35323d;
        padding: 0 5% 20px;
    }
    .hero-title {
        font-weight: 700;
        width: 130%;
        margin-right: -30%;
        position: relative;
        z-index: 2;
        margin-top: 30%;
    }
    .hero-title .text {
        font-size: 5vw;
        line-height: 100%;
    }
    .hero-slider .hero-content::after {
        content: " ";
        display: block;
        transform: rotate(-3deg) translateX(-10vh);
        position: absolute;
        bottom: -1%;
        left: 100%;
        height: 102vh;
        width: 31vh;
        background-size: auto 100%;
        background-image: url(inc/img/hero-shape.svg);
        background-size: 100% auto;
        background-repeat: no-repeat;
    }
    .swiper-pagination-clone {
        margin-top: 30px;
        display: block;
    }

    .hero-slider .swiper-pagination-bullet-active {
        background: #35323d;
    }
    .hero-slider .swiper-pagination-bullet {
        height: 10px;
        width: 10px;
        margin: 0 8px !important;
        border: 2px solid #35323d;
    }
    .hero-slider .swiper-wrapper + .swiper-pagination-bullets {
        bottom: 40px;
    }
    .hero-slider .swiper-pagination {
        text-align: left;
        margin-bottom: 0;
    }

    .flexible-content {
        margin: 70px 0;
        font-size: 24px;
    }

    section {
        scroll-margin: 70px;
    }

    .flexible-content h1,
    .flexible-content h2 {
        font-size: 38px;
    }
    .hero-section {
        min-height: 500px;
    }
    .hero-slider .hero-content::after {
        min-height: 510px;
        min-width: 155px;
    }
    .hero-section .button {
        font-size: 22px;
        height: 50px;
        padding: 0 24px;
        top: 40px;
        right: 40px;
    }
    hr {
        margin-bottom: 60px;
    }
    .link-block a {
        padding: 46px 60px 32px;
    }
    .link-block h4 {
        font-size: 32px;
    }
    .link-block p {
        font-size: 24px;
    }
    .half-blocks.has-background > div {
        padding: 60px 5% 90px;
    }
    .flexible-content.half-blocks h1,
    .flexible-content.half-blocks h2,
    .cta-section h1,
    .cta-section h2 {
        font-size: 36px;
    }
    .flexible-content .button {
        font-size: 22px;
        height: 50px;
    }
    .text-section .buttons {
        margin-top: 60px;
    }
    .main-navigation .menu {
        gap: 35px;
    }
    .main-navigation a {
        font-size: 22px;
    }
    .betrieb-listings {
        padding: 60px 0;
        font-size: 26px;
        column-gap: 60px;
    }
    .betrieb-listings li {
        margin-bottom: 30px;
    }
    .betrieb-section .filter {
        margin: 60px 0;
    }
    .betrieb-section .filter .buttons {
        gap: 25px;
    }
    .site-footer {
        padding: 60px 0;
    }
    .site-footer .column {
        width: calc(25% - 90px / 4);
    }
    .logo-carousel figure {
        width: 300px;
        padding: 36px 48px;
    }
    .half-blocks .wrap {
        gap: 40px;
    }
    .interview-section .interview-image {
        margin: 0 auto 40px;
    }
    .interview-section .interview-title {
        font-size: 36px;
        width: 60%;
    }
    .interview-section .interview {
        column-gap: 40px;
        margin-top: 50px;
    }
    .faq-section .question {
        font-size: 32px;
    }
    .faq-section .accordion .toggle {
        top: 12px;
    }
    .content ul li::before {
        top: 14px;
    }
    .half-blocks .content ul li::before {
        top: 20px;
    }
    .admin-return {
        font-size: 24px;
    }
    .admin-navigation a {
        font-size: 20px;
        padding: 15px 20px;
    }
    .data-list li {
        font-size: 18px;
    }

    .mandant-navigation a {
        font-size: 20px;
        padding: 15px 20px;
    }
    .mandant-dropdown {
        display: none;
    }
    .mandant-navigation {
        display: flex;
        align-items: center;
    }
    .mandant-navigation .current-mandant {
        display: block;
        font-size: 22px;
        font-weight: 700;
        text-transform: uppercase;
        margin-right: 15px;
        line-height: 100%;
    }
    .half-blocks.has-background .content p,
    .half-blocks.has-background ol,
    .half-blocks.has-background ul {
        line-height: 160%;
    }
}
@media all and (min-width: 1280px) {
    .login-section h1,
    .admin-page h1 {
        font-size: 46px;
        margin-bottom: 40px;
    }
    .fullscreen-wrapper .content p {
        font-size: 24px;
    }
    .login-section .button {
        padding: 20px;
        font-size: 24px;
        margin: 30px 0 60px;
    }
    .hero-section .hero-logo {
        width: 280px;
        top: 60px;
    }
    .hero-slider .swiper-pagination-bullet {
        height: 14px;
        width: 14px;
    }
    .flexible-content {
        margin: 80px 0;
    }

    section {
        scroll-margin: 80px;
    }

    .flexible-content h1,
    .flexible-content h2 {
        font-size: 46px;
        margin-bottom: 40px;
    }
    .hero-section {
        min-height: 600px;
    }
    .hero-slider .hero-content::after {
        min-height: 612px;
        min-width: 186px;
    }
    .hero-section .button {
        font-size: 24px;
        height: 52px;
        top: 60px;
        right: 60px;
    }
    hr {
        margin-bottom: 70px;
    }
    .flexible-content.half-blocks h1,
    .flexible-content.half-blocks h2,
    .cta-section h1,
    .cta-section h2 {
        font-size: 44px;
    }
    .flexible-content .button {
        font-size: 24px;
        height: 52px;
    }
    .text-section .buttons {
        margin-top: 70px;
    }
    .main-navigation .menu {
        gap: 40px;
    }
    .main-navigation a {
        font-size: 28px;
    }
    .betrieb-listings {
        padding: 75px 0;
        font-size: 30px;
        column-gap: 80px;
    }
    .betrieb-section .filter {
        margin: 75px 0;
    }
    .betrieb-section .filter .buttons {
        gap: 30px;
    }
    .site-footer {
        padding: 65px 0;
    }
    .site-footer .wrap {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }
    .site-footer .columns {
        font-size: 20px;
        gap: 40px;
    }
    .site-footer .title {
        font-size: 28px;
        margin-bottom: 20px;
    }
    .site-footer .column {
        width: calc(25% - 30px);
    }
    .logo-carousel {
        padding: 30px 0;
    }
    .logo-carousel figure {
        width: 320px;
        padding: 40px 52px;
    }
    .half-blocks .wrap {
        gap: 50px;
    }
    .interview-section .interview-title {
        font-size: 40px;
    }
    .interview-section .interview {
        column-gap: 50px;
    }
    .cta-section {
        padding: 75px 0;
    }
    .faq-section .question {
        font-size: 34px;
    }
    .faq-section .accordion .toggle {
        top: 14px;
    }
    .content ul li::before {
        top: 15px;
    }
    .half-blocks .content ul li::before {
        top: 21px;
    }
    .data-list li {
        font-size: 20px;
    }
    .mandant-navigation {
        margin: 0 0 0 40px;
    }
    .mandant-navigation .current-mandant {
        font-size: 28px;
        margin-right: 20px;
    }
    .half-blocks.has-background .content p,
    .half-blocks.has-background ol,
    .half-blocks.has-background ul {
        line-height: 180%;
    }
    .swiper-pagination-clone {
        margin-top: 40px;
    }
    /* .hero-image img {
        /* object-position: 0 10%;
    }*/
    .hero-image {
        width: 55%;
    }
    .hero-slider .hero-content {
        width: 45%;
    }
    .hero-slider .hero-content::after {
        transform: rotate(-3deg) translateX(-5vh);
    }
}
@media all and (min-width: 1440px) {
    .fullscreen-wrapper .content p {
        font-size: 26px;
    }
    .hero-section .hero-logo {
        width: 320px;
        top: 75px;
    }
    .hero-section {
        min-height: 700px;
    }
    .hero-slider .hero-content::after {
        min-height: 714px;
        min-width: 217px;
    }
    .hero-section .button {
        top: 80px;
        right: 80px;
    }
    .flexible-content h1,
    .flexible-content h2 {
        font-size: 56px;
    }
    .flexible-content {
        margin: 100px 0;
    }

    section {
        scroll-margin: 100px;
    }

    .flexible-content.half-blocks h1,
    .flexible-content.half-blocks h2,
    .cta-section h1,
    .cta-section h2 {
        font-size: 52px;
    }
    .main-navigation a {
        font-size: 32px;
    }
    .betrieb-listings {
        font-size: 34px;
        padding: 80px 0;
        column-gap: 100px;
    }
    .betrieb-section .filter {
        margin: 90px 0;
    }
    .site-footer .columns {
        font-size: 22px;
        gap: 60px;
    }
    .site-footer .title {
        font-size: 34px;
        margin-bottom: 24px;
    }
    .site-footer .column {
        width: calc(25% - 180px / 4);
    }
    .logo-carousel {
        padding: 40px 0;
    }
    .logo-carousel figure {
        width: 360px;
    }
    .interview-section .interview-title {
        font-size: 46px;
    }
    .interview-section .interview {
        column-gap: 50px;
    }
    .mandant-navigation .current-mandant {
        font-size: 32px;
        margin-right: 25px;
    }
    .half-blocks.has-background .content p,
    .half-blocks.has-background ol,
    .half-blocks.has-background ul {
        line-height: 200%;
    }
}
@media all and (min-width: 1720px) {
    .hero-section .hero-logo {
        width: 345px;
        top: 90px;
    }
    .hero-section {
        min-height: 900px;
    }
    .hero-slider .hero-content::after {
        min-height: 918px;
        min-width: 279px;
    }
    .hero-section .button {
        top: 100px;
        right: 100px;
    }
    .site-footer .columns {
        font-size: 24px;
    }
}

@media all and (max-width: 1023px), (orientation: portrait) {
    .hero-section::before {
        display: block;
        content: " ";
        width: 50vmin;
        height: 48vmin;
        min-width: 210px;
        min-height: 201px;
        background-image: url(inc/img/hero-mobile.svg);
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-position: left top;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
        max-width: 512px;
        max-height: 490px;
    }
    .hero-slider .swiper-slide {
        display: block;
    }
    .hero-slider .swiper-pagination-bullet {
        height: 16px;
        width: 16px;
    }
    .hero-image {
        width: 100%;
    }
    /*.hero-image img {
        object-position: 28% 0;
    }*/
    .hero-slider .hero-content {
        display: block;
        width: 100%;
        color: #ffffff;
        background: none;
        height: auto;
    }

    .hero-section .button {
        display: none;
    }
    .hero-slider .swiper-pagination-bullet {
        height: 1.5vw;
        width: 1.5vw;
        min-height: 8px;
        min-width: 8px;
        border: 2px solid #ffffff;
    }
    .hero-slider .swiper-pagination-bullet-active {
        background: #ffffff;
    }
    .hero-section .hero-content::before {
        display: block;
        content: " ";
        position: absolute;
        bottom: 0;
        right: 0;
        left: 0;
        height: 150%;
        background: linear-gradient(to top, #35323d, rgba(0, 0, 0, 0));
    }
    .hero-slider .hero-content::after {
        display: none;
    }

    .hero-title {
        width: 100%;
        margin-right: 0;
        margin-top: 0;
    }
    .hero-section .hero-logo {
        width: 27.66vmin;
        left: 5vmin;
        top: 5vmin;
        min-width: 116px;
    }
}

@media all and (min-width: 600px) and (max-width: 1023px), (min-width: 600px) and (orientation: portrait) {
    .hero-content .swiper-pagination {
        margin-top: 3vmin;
        margin-bottom: 3vmin;
        text-align: center;
    }
    .hero-slider .swiper-pagination-bullet {
        margin: 0 0.75vw !important;
    }
    .hero-title .text {
        font-size: 9.5vmin;
    }
    .hero-slider .hero-content {
        padding: 0 10% 20px;
    }
}

@media all and (min-width: 1024px) and (orientation: portrait) {
    .hero-title .text {
        font-size: 105px;
        line-height: 110%;
    }
    .swiper-pagination-clone {
        margin-top: 35px;
    }
    .hero-content .swiper-pagination {
        margin-top: 0;
        margin-bottom: 35px;
    }
    .hero-slider .swiper-pagination-bullet {
        margin: 0 8px !important;
        width: 15px;
        height: 15px;
    }
}