/*
Theme Name: Platform Mo
Author: eloq GmbH
Author URI: https://eloq.swiss/
Description: Die eloq GmbH macht nicht einfach Internetseiten. Wir bieten Ihnen durchdachte Konzepte, mischen Designkompetenz mit technischem Können und streben so nach der perfekten Internet-Präsenz unseres Kunden. Das vorliegende Theme wurde von uns mit Passion und Freude handgefertigt. Wir hoffen, Ihnen gefällt unsere Arbeit!
Version: 1.5.7
*/

/* Imports */

@import url("css/typo.css");
@import url("css/utilities.css");
@import url("css/header.css");
@import url("css/footer.css");
/*
COLOR DEFINITIONS - GOES BELOW:
*/

:root {
    --green-1: #E5EDE5;
    --green-2: #85A681;
    --green-3: #2E532D;
    --green-4: #135458;
    --red-1: #DF977F;
    --white-1: #fff;
    --white-2: #F5F1E7;
    --black: #000;
}

/* === Theme Specific === */

/* ----- GENERAL ----- */

body {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    min-height: 100vh;
    margin: 0;
}

body>main {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

section,
a {
    position: relative;
}

.white {
    background: var(--white-1);
}

.green {
    background: var(--green-1);
}

/* END GENERAL */

/* ----- WP ADMIN BAR ----- */

/*#wpadminbar {
    display: none;
  }*/

/* END WP ADMIN BAR */

/* ----- BUTTONS ----- */

/* Button classes:
        - btn_xyz_primary
        - btn_xyz_secondary 
*/

/* Button Reset */

button {
    border: none;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    background: transparent;
    /* inherit font & color from ancestor */
    color: inherit;
    font: inherit;
    /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
    line-height: normal;
    /* Corrects font smoothing for webkit */
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;
    /* Corrects inability to style clickable `input` types in iOS */
    -webkit-appearance: none;
}

.btn {
    padding: 8px 15px 7px 15px;
    border-radius: 30px;
    text-transform: uppercase;
    border: 1px solid transparent;
    font-family: 'LemonMilkMedium', sans-serif;
    font-weight: 500;
    letter-spacing: 1.14px;
    display: flex;
    flex-direction: row;
    gap: 30px;
    justify-content: center;
    align-items: center;
    position: relative;
    max-width: max-content;
}

.btn-primary {
    background: var(--green-4);
    color: var(--white-1);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:focus-visible,
.btn-primary:focus-within,
.btn-primary:not(.btn-check)+.btn:active {
    border-color: transparent !important;
    text-decoration: none !important;
    background: var(--green-4) !important;
    background-color: var(--green-4) !important;
    box-shadow: none !important;
}

.btn svg {
    transition: transform 150ms linear;
}

.btn:hover svg {
    transform: translateX(4px);
}

.btn-primary.red {
    background: var(--red-1);
}

.btn-primary.green {
    background: var(--green-2);
}

.btn-primary.green:hover,
.btn-primary.green:active,
.btn-primary.green:focus,
.btn-primary.green:focus-visible,
.btn-primary.green:focus-within {
    background: var(--green-2) !important;
}

.btn-primary.green:focus-visible {
    box-shadow: 0 0 0 0.25rem rgba(var(--green-2), .5);
    border-color: transparent;
    background: var(--green-2) !important;
}

.btn-primary.red:focus-visible {
    box-shadow: 0 0 0 0.25rem rgba(var(--red-1), .5);
    border-color: transparent;
    background: var(--red-1) !important;
}

.btn-primary.red:hover,
.btn-primary.red:active,
.btn-primary.red:focus,
.btn-primary.red:focus-visible,
.btn-primary.red:focus-within {
    background: var(--red-1) !important;
}

.btn-secondary {
    border-radius: 0;
    border-width: 5px;
    border-color: #ddd;
    min-width: 200px;
    background: transparent;
    text-transform: uppercase;
    color: #df1c1c;
}

/* END BUTTONS */

/* ----- LAZYLOAD EFFECT ----- */

img.bg_static_cover {
    -webkit-filter: blur(3px);
    filter: blur(3px);
    transition: filter 500ms, -webkit-filter 500ms;
}

img.bg_static_cover.lazyloaded {
    -webkit-filter: blur(0);
    filter: blur(0);
}

/* END LAZYLOAD EFFECT */
section.hero .hero_image {
    position: relative;
    max-height: 700px;
    overflow: hidden;
}

section.hero img.hero-img {
    width: 100%;
    max-height: 700px;
    object-fit: cover;
    object-position: center;
    display: block;
}

section.hero .hero_image .logo {
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 3;
    transform: translateX(-50%);
}

section.hero .container .logo {
    margin: 30px auto;
}

section.hero svg.decoration {
    position: absolute;
    bottom: -2px;
    left: 0;
    z-index: 2;
    width: 100%;
    height: auto;
}

section.hero h1 {
    color: var(--red-1);
}

section.hero h3 {
    color: var(--green-4);
}

section.hero p.lead {
    color: var(--green-3);
    word-break: auto-phrase;
}

section.akkordeon .accordion-button::after {
    display: none;
}

section.akkordeon h4 {
    color: var(--green-2);
}

section.akkordeon h4 button {
    padding: 0;
}

section.akkordeon h4 .accordion-button:not(.collapsed) {
    border: none !important;
    background-color: transparent !important;
    color: black;
}

section.akkordeon .accordion>* {
    background: transparent;
    background-color: transparent;
}

section.akkordeon .accordion .accordion-item {
    padding: 15px 0;
    border: none;
    border-top: 1px solid var(--green-4);
    border-radius: 0;

}

section.akkordeon .accordion .accordion-item:last-of-type {
    border-bottom: 1px solid var(--green-4);
}

section.akkordeon .accordion h3 button {
    color: var(--green-4);
    font-size: clamp(1.375rem, 1.3747rem + 0.1117vw, 1.4375rem);
    margin-bottom: 5px;
    background: transparent;
    background-color: transparent;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 0;
    box-shadow: none !important;
    gap: 15px
}

section.akkordeon .accordion h3 button:focus,
section.akkordeon .accordion h3 button:hover,
section.akkordeon .accordion h3 button:focus-within,
section.akkordeon .accordion h3 button:focus-visible {
    box-shadow: none !important;
}

section.akkordeon .accordion h3 button::after {
    display: none;
}


section.akkordeon .accordion .accordion-item button svg {
    transition: transform 300ms ease-in-out;
    border-radius: 100%;
    flex-shrink: 0;
    background: transparent;
}

section.akkordeon .accordion .accordion-item button:not(.collapsed) svg {
    transform: rotate(180deg);
}


section.akkordeon .accordion .accordion-item .accordion-body {
    padding-top: 30px;
    padding-left: 0;
    padding-right: 0;
}

section.akkordeon .accordion .accordion-item .accordion-body .btn.btn-primary {
    background: var(--green-4);
}

section.akkordeon .accordion .accordion-item .accordion-body .btn.btn-primary:focus-visible {
    box-shadow: none;
}

section.wave svg {
    z-index: 0;
    bottom: -2px;
    width: 100%;
    height: auto;
}

section.wave .circle {
    background: var(--red-1);
    display: flex;
    padding: 50px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    aspect-ratio: 1/1;
    border-radius: 100%;
    position: relative;
    z-index: 2;
    width: min(100%, 400px);
    transform: translateX(-30px);
}

section.wave .circle h2 {
    color: var(--white-1) !important;
    margin-bottom: 0;
    width: 90%;
}

.green-bar {
    background: var(--green-1);
    height: 2px;
    width: 100%;
    display: block;
    position: absolute;
}

section.announcement {
    background: var(--green-1);
}

section.announcement h2 {
    color: var(--red-1);
}

section.announcement p.lead {
    color: var(--green-3);
}

article.homepage section.hero svg.decoration {
    width: 100%;
    height: auto;
    position: relative;
    bottom: 0;
}




@media (max-width: 992px) {
    section.wave .circle {
        transform: translateX(0);
        margin: 0 auto;
    }

}