/* ### HEADER ### */
header {
        position: fixed;
        top: 0;
        left: 0;
        display: flex;
        width: 100vw;
        margin: auto;
        padding: 16px 104px 16px 96px;
        justify-content: space-between;
        align-items: center;
        background: #fff;
        z-index: 10;
}

.admin-bar header{
        top : 32px;
}

.logos,
.logo{
        position: relative;
}

.burger-menu {
        display: none;
        align-items: center;
        column-gap: 12px;
        padding: 4px 8px;
        user-select: none;
        cursor: pointer;
}
.burger-menu-open {
        background: var(--dark-pink-color);
        color: #fff;
        font-weight: 500;
}
.burger-menu-open span{
        color: #fff;
}
.burger-menu-close {
        position: absolute;
        top: 28px;
        right: 48px;
        background: #fff;
        color: var(--dark-pink-color);
}
.burger-menu-close span{
        color: var(--dark-pink-color);
}

.nav {
        column-gap: 48px;
}
.nav > li:first-child::before,
.nav > li:first-child::after {
        display: none;
}
.nav > li{
        position: relative;
}
.nav > li::before {
        content: "";
        position: absolute;
        top: 5px;
        left: -28px;
        width: 2px;
        height: 12px;
        background-color: var(--green-blue-color);
}
.nav > li::after {
        content: "";
        position: absolute;
        top: 5px;
        left: -24px;
        width: 2px;
        height: 12px;
        background-color: var(--dark-pink-color);
}
.nav > li > a {
        position: relative;
        padding: 0;
        color: var(--dark-pink-color);
        font-family: scandia-web;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
}

.nav > li > a:focus,
.nav > li > a:hover{
        color: var(--dark-pink-color);
}


.nav > li > a::before{
        content: "";
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 0;
        height: 2px;
        background-color: var(--dark-pink-color);
        transition: width 0.3s;
}
.nav > li.current-menu-item > a::before,
.nav > li.current-menu-parent > a::before,
.nav > li > a:focus::before,
.nav > li > a:hover::before{
        width: 100%;
}

.nav > li a.dropdown-toggle:after {
        vertical-align: 3px;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 6px solid var(--dark-pink-color);
        border-radius: 2px;
}
.nav > li .dropdown-menu {
        top: 12px !important;
        left: -24px !important;
        padding: 12px 0;
        border: 0;
        background-color: var(--dark-pink-color);
        border-radius: 0;
}
.nav > li .dropdown-menu a {
        color: #fff;
        padding: 4px 24px;
}
.nav > li .dropdown-menu a.active,
.nav > li .dropdown-menu a:hover {
        color: var(--dark-pink-color);
        background: #fff;
}
.current-menu-item.current-menu-parent .dropdown-item.active {
        background: initial;
        color: #fff;
}
.current-menu-item.current-menu-parent .dropdown-item.active:hover {
        background: #fff;
        color: var(--dark-pink-color);
}

/* ### FOOTER ### */
footer#footer {
        position: relative;
        margin-top: 64px;
        background-color: var(--dark-pink-color);
}
.form-footer {
        position: absolute;
        bottom: calc(100% - 24px);
        right: 2%;
        z-index: -1;
}
#footer p {
        color: #fff;
        margin: 0;
}
.footer-inner {
        display: grid;
        grid-template-columns: 3fr 6fr 2fr;
        column-gap: 32px;
        padding: 64px var(--margin-section);
        margin: auto;
        max-width: var(--max-width-section);
}

.footer-inner .logos .logo-assemblee{
        display: none;
}

footer .contact {
        display: flex;
        flex-direction: column;
        row-gap: 16px;
}
footer .contact-inner {
        font-size: 14px;
        color: #fff;
}
footer .contact-inner a {
        display: block;
        color: #fff;
}
footer .infos {
        position: relative;
        display: flex;
        flex-direction: column;
        row-gap: 24px;
}
footer .infos::before{
        content: "";
        position: absolute;
        top: 0;
        left: -32px;
        width: 8px;
        height: 100%;
        background-color: var(--green-blue-color);
}
footer .sn {
        position: relative;
        display: flex;
        column-gap: 24px;
}
footer .sn-inner {
        display: flex;
        column-gap: 12px;
}
.button.newsletter {
        display: flex;
        align-items: center;
        column-gap: 8px;
        border: 0;
        background: var(--pink-color);
        padding: 4px 8px;
        font-size: 14px;
        color: var(--dark-color);
}
.button.newsletter span {
        display: flex;
        align-items: center;
}
footer .sn .logo-assemblee {
        position: absolute;
        left: 416px;
        bottom: 0;
}

.footer-nav {
        display: flex;
        flex-direction: column;
        row-gap: 32px;
        padding: 0;
        margin: 0;
        list-style: none;
}
.footer-nav li{
        position: relative;
}
.footer-nav li:last-child::before,
.footer-nav li:last-child::after {
        display: none;
}
.footer-nav li::before {
        content: "";
        position: absolute;
        bottom: -14px;
        left: 0;
        width: 12px;
        height: 2px;
        background-color: var(--green-blue-color);
}
.footer-nav li::after {
        content: "";
        position: absolute;
        bottom: -18px;
        left: 0;
        width: 12px;
        height: 2px;
        background-color: #fff;
}
.footer-nav li a {
        padding: 0;
        color: #fff;
}
#footer .footer-nav li.current-menu-item a {
        color: #fff;
}
.footer-nav li a:hover {
        color: #fff;
}

.footer-credits {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        color: #fff;
        font-size: 12px;
        background: var(--pink-color);
        padding: 4px 16px;
}
.footer-credits span{
        color: #fff;
}
.footer-credits a {
        color: #fff;
        padding-left: 6px;
}

@media (max-width: 1440px) {
        header{
                padding: 16px 72px 16px 64px;
        }
}

@media (max-width: 1332px) {
        .burger-menu {
                display: flex;
        }

        .nav-container {
                position: absolute;
                top: 0;
                right: 0;

                display: flex;
                justify-content: flex-start;
                align-items: center;

                width: 0;
                height: 100svh;

                padding: 0;
                background: var(--dark-pink-color);

                transition:  width .3s;

                z-index: 10;
                overflow: hidden;
        }
        .nav-container.open{
                width: 400px;
        }
        .nav {
                flex-direction: column;
                padding-left: 56px;
                row-gap: 56px;
        }
        .nav > li::before {
                top: -32px;
                left: 0;
                width: 12px;
                height: 2px;
        }
        .nav > li::after {
                top: -28px;
                left: 0;
                width: 12px;
                height: 2px;
                background-color: #fff;
        }

        .nav > li > a {
                font-size: 18px;
                transition: padding-left .3s;
        }
        .nav > li > a,
        .nav > li > a:hover,
        .nav > li > a:focus{
                color: #fff;
        }

        .nav > li > a::before{
                top: 4px;
                left: 0;
                height: 16px;
                width: 0;
                background: #fff;
        }
        .nav > li.current-menu-item > a::before,
        .nav > li.current-menu-parent > a::before,
        .nav > li > a:focus::before,
        .nav > li > a:hover::before{
                width: 4px;
        }

        .nav > li a.dropdown-toggle:after {
                border-top: 6px solid #fff;
        }

        .nav > li.current-menu-parent > a,
        .nav > li > a:focus,
        .nav > li > a:hover{
                padding-left: 12px;
        }

        .nav > li .dropdown-menu {
                position: relative !important;
                top: 0 !important;
                left: 0 !important;
                transform: translate(0, 0) !important;
                margin-top: 16px !important;
                padding: 0;
        }
        .nav > li .dropdown-menu a {
                padding: 4px 16px;
        }
}

@media (max-width: 1200px) {

}

@media (max-width: 992px) {
        header{
                padding: 16px 48px 16px 32px;
        }
        header .logo svg {
                width: 184px;
                height: 100%;
        }

        .form-footer{
                display: none;
        }
        .footer-inner {
                display: flex;
                flex-direction: column;
                row-gap: 40px;
                padding: 32px 24px;
        }
        .footer-inner .logos {
                display: flex;
                column-gap: 40px;
        }
        .footer-inner .logos .logo-assemblee{
                display: block;
        }
        footer .infos{
                row-gap: 40px;
        }
        .footer-nav {
                flex-direction: row;
                column-gap: 32px;
        }
        .footer-nav li::before {
                top: 6px;
                bottom: initial;
                left: initial;
                right: -14px;
                width: 2px;
                height: 12px;
        }
        .footer-nav li::after {
                top: 6px;
                bottom: initial;
                left: initial;
                right: -18px;
                width: 2px;
                height: 12px;
        }

        footer .infos {
                flex-direction: row;
                column-gap: 56px;
        }

        footer .sn {
                flex-direction: column;
                row-gap: 16px;
        }
        footer .sn .logo-assemblee {
                display: none;
        }
}

@media (max-width: 768px) {
        header {
                padding: 16px 40px 16px 24px;
        }
        .admin-bar header{
                top : 46px;
        }
        header .logo svg {
                width: 168px;
                height: 100%;
        }
        .burger-menu-close {
                top: 25px;
                right: 32px;
        }

        footer .infos {
                flex-direction: column;
        }
        footer .sn {
                flex-direction: row;
        }
}

@media (max-width: 576px) {
        header {
                padding: 16px 32px 16px 16px;
        }
        .nav-container.open{
                width: 100vw;
        }

        .footer-inner {
                padding: 32px 16px;
        }
        .footer-inner .logos {
                column-gap: 24px;
        }
        .footer-inner .logos > svg {
                width: 144px;
                height: 100%;
        }
        .footer-inner .logos .logo-assemblee svg {
                width: 48px;
                height: 100%;
        }
        .footer-nav{
                flex-wrap: wrap;
        }
        .footer-nav li a{
                font-size: 14px;
        }
        footer .sn {
                flex-direction: column;
                row-gap: 8px;
        }
        .button.newsletter {
                width: 213px;
        }
}