/*
Theme Name: asticotheme
Theme URI: None
Author: asticoweb.com
Author URI: https://asticoweb.com
Description: Simple wordpress theme made with ❤️ by asticoweb.com | All rights reserved ©
Tags: theme, madewithlove, asticonet, asticoweb, asticoweb.com, asticotheme, coding, spreadthelove, personal, personaluseonly
Version: 5.0
License: License asticoweb.com
License URI: https://asticoweb.com
Text Domain: asticotheme
*/

::selection {
    background: var(--jaune);
    color: var(--bleu2);
    text-shadow: none;
}

::-webkit-selection {
    background: var(--jaune);
    color: var(--bleu2);
    text-shadow: none;
}

::-moz-selection {
    background: var(--jaune);
    color: var(--bleu2);
    text-shadow: none;
}

*,
*:after,
*:before {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    outline: none !important;
    text-decoration: none;

}

section,
div,
header,
nav,
article,
section,
aside,
footer,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
ul,
li,
figure,
figcaption,
class,
img {

    margin: 0;
    padding: 0;
}


html,
body {

    width: 100%;
    padding: 0;
    margin: 0;
    font-family: '', sans-serif;
    position: relative;
    scroll-behavior: smooth;
    -webkit-tap-highlight-color: transparent;
}

body {

    overflow-x: hidden;
    overflow-y: overlay;
    background: white;
}

body:not(#tinymce) {

    opacity: 0;
    transition: opacity .5s;
}

main,
body>.elementor,
footer {

    transform: translateY(-100px);
    transition: transform .5s;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    border-left: solid 1px var(--blanc90);
}

::-webkit-scrollbar-thumb {
    background: var(--bleu2);
    border-left: solid 1px var(--blanc90);
}

::-webkit-scrollbar-button {
    display: none;
}

.page main>section>h1,
br.clear,
a.post-edit-link {

    display: none;
}

input::placeholder,
textarea::placeholder {

    opacity: 1 !important;
}

input {

    accent-color: var(--ciel);
}


:root {
    --bleu: #243566;
    --bleu2: #17223f;
    --ciel: #29abe2;
    --jaune: #ffdd33;
    --gris25: #3F3F3F;
    --gris50: #7F7F7F;
    --gris75: #BABABA;
    --blanc90: #E5E5E5;
    --blanc95: #F2F2F2;
}

/*------------------------------------*\
    DARK MODE
\*------------------------------------*/

input[type="search"] {

    background: white;
}

.balance {

    text-wrap: balance;
}

.title span {

    font-size: .5em;
    letter-spacing: 0.05em;
    color: var(--ciel);
}

#footer .contact ul:after,
#menu-home .menu>li>a:after,
.title-after:after {

    content: '';
    margin-top: 12.5px;
    margin-bottom: -12.5px;
    width: 100px;
    height: 26px;
    background-color: var(--jaune);
    display: inline-block;
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 26'%3E%3Cpath d='M33.04,21.1c5.07-2.37,19.5-10.52,21.91-14.89,1.2-2.18,2.79-.67,4.1-1.11,1.95-.65,3.87-1.89,6.21-3.01l.33,5.51,5.12-2c.4,3.76-2.21,4.45-4.02,6.83,9.09,3.28,10.31-8.59,13.53-11.08.49-.38,1.9.8,2.62.99.78.21,2.19-1.67,2.66-2.34l14.51,4.41c-5.89.12-11.51,1.07-16.4,4.42-2.76,4.5-6.9,6.72-11.65,8.54-5.86,2.25-11.42,4.75-17.46,6.47-14.77,4.22-30.01,2.27-42.88-5.96C6.61,14.68,2.11,11.17,0,5.32c7.53,7.79,12.49,14.45,24.08,16.74,2.91.58,6.24.31,8.96-.96Z'/%3E%3C/svg%3E");
}

#menu-home .menu>li>a:after,
#footer .contact ul:after {

    width: calc(100px / 2);
    height: calc(26px / 2);
    margin: 0;

}

.shadow {

    -webkit-box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5) !important;
    box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5) !important;
}

/*------------------------------------*\
    COOKIE
\*------------------------------------*/

.cky-btn-revisit-wrapper, [data-cky-tag="powered-by"] div, [data-cky-tag="detail-powered-by"], [data-cky-tag="optout-powered-by"], .cky-preference-header .cky-btn-close {

    display: none !important;
}

.cky-switch input[type="checkbox"] {

    padding: 0 !important;
    border-radius: 100vh !important;
}

.cky-audit-table, button.cky-show-desc-btn, .cky-btn-customize, .cky-btn-reject, .cky-btn-preferences, .cky-notice .cky-title, .cky-preference-header .cky-preference-title, .cky-accordion-header .cky-accordion-btn, .cky-consent-bar .cky-notice-des p, .cky-gpc-wrapper .cky-gpc-desc p, .cky-preference-body-wrapper .cky-preference-content-wrapper p, .cky-accordion-header-wrapper .cky-accordion-header-des p, .cky-cookie-des-table li div:last-child p {

    color: var(--e-global-color-text) !important;
}

.cky-modal button:not(.cky-prefrence-btn-wrapper button):hover {

    background-color: transparent !important;
    color: var(--e-global-color-text) !important;
}

.cky-btn-customize, .cky-btn-reject, .cky-btn-preferences {

    border: solid 2px var(--e-global-color-text) !important;
}

.cky-btn-accept,
.cky-switch input[type="checkbox"]:checked {

    background-color: var(--e-global-color-text) !important;
}

/*------------------------------------*\
    UNDERLINE
\*------------------------------------*/

.underline .elementor-button-text,
.elementor-widget-text-editor a,
#menu-home a,
#header ul li a,
#footer ul li a,
#footer ul li button {

    position: relative;
}

.elementor-widget-text-editor a {

    display: inline-block;
    line-height: 1 !important;
}

.underline .elementor-button-text:before,
.elementor-widget-text-editor a:before,
#menu-home a:before,
#header ul:not(.btn) li a:before,
#footer ul li a:before,
#footer ul li button:before {
    content: '';
    transform-origin: 100% 50%;
    transform: scale3d(0, 1, 1);
    transition: transform .5s;
    position: absolute;
    width: 100%;
    height: 2px;
    background: var(--ciel);
    top: 100%;
    left: 0;
    pointer-events: none;
}

.underline .elementor-button-text:before,
.elementor-widget-text-editor a:before,
#menu-home a:hover::before,
#header ul li a:hover::before,
#footer ul li a:hover::before,
#footer ul li button:hover::before {

    transform-origin: 0% 50% !important;
    transform: scale3d(1, 1, 1) !important;
}

.underline a:hover .elementor-button-text:before,
.elementor-widget-text-editor a:hover::before {

    transform-origin: 100% 50% !important;
    transform: scale3d(0, 1, 1) !important;
}

#footer .bottom button:before,
#footer .bottom a:before {

    top: 0;
}

.underline a {

    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
    color: var(--bleu) !important;
}

/*------------------------------------*\
    OVERLAY
\*------------------------------------*/

.overlay:not(:has(.elementor-background-video-container, .elementor-motion-effects-container))::before,
.overlay:not(:has(.elementor-background-video-container, .elementor-motion-effects-container))::after,
.overlay :is(.elementor-background-video-container, .elementor-motion-effects-container)::before,
.overlay :is(.elementor-background-video-container, .elementor-motion-effects-container)::after {

    content: '' !important;
    position: absolute;
    inset: 0;
    background: var(--bleu);
    pointer-events: none;
}

.overlay:before,
.overlay :is(.elementor-background-video-container, .elementor-motion-effects-container)::before {

    mix-blend-mode: color !important;
    z-index: 1;
}

.overlay:after,
.overlay :is(.elementor-background-video-container, .elementor-motion-effects-container)::after {

    opacity: .9;
    z-index: 2;
}

.overlay>* {

    z-index: 3;
}

/*------------------------------------*\
    SWIPER
\*------------------------------------*/

.custom-swiper .swiper {

    overflow: visible !important;
}

.custom-swiper .swiper-slide,
.custom-swiper .e-loop-item {

    -webkit-box-shadow: 0px 0px 12.5px 0px rgba(23, 34, 63, 0.333) !important;
    box-shadow: 0px 0px 12.5px 0px rgba(23, 34, 63, 0.333) !important;
    border: solid 1px var(--blanc90) !important;
    border-radius: 7.5px !important;
    background-color: white !important;
    overflow: hidden !important;
    transition: scale .3s, box-shadow .3s;
}

.custom-swiper .swiper-slide:hover,
.custom-swiper .e-loop-item:hover {

    -webkit-box-shadow: 0px 0px 18.75px 0px rgba(23, 34, 63, 0.5) !important;
    box-shadow: 0px 0px 18.75px 0px rgba(23, 34, 63, 0.5) !important;
    scale: 1.05 !important;
}

.custom-swiper .elementor-swiper-button {

    width: 58px !important;
    height: 58px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: 18px !important;
    color: var(--bleu) !important;
    background-color: var(--ciel) !important;
    transform: none !important;
    top: auto !important;
    bottom: calc(100% + 50px) !important;
    left: auto !important;
    border-radius: 7.5px !important;
    transition: background-color .3s !important;
}

.custom-swiper .elementor-swiper-button:hover {

    background-color: var(--jaune) !important;
}

.custom-swiper .elementor-swiper-button svg {

    fill: var(--bleu) !important;
}

.custom-swiper .swiper-button-disabled {

    opacity: 1 !important;
    background-color: var(--blanc90) !important;
    pointer-events: none;
}

.custom-swiper .swiper-button-disabled svg {

    fill: white !important;
}

.custom-swiper .swiper-button-lock {

    display: none !important;
}

/*------------------------------------*\
    EXIT
\*------------------------------------*/

#exit {

    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100lvh;
    background-color: rgba(23, 34, 63, .75);
    z-index: 999;
    display: none;
    cursor: pointer;
}

/*------------------------------------*\
    BURGER
\*------------------------------------*/

#menu {

    cursor: pointer;
    transition: background-color .3s;
    padding: 0;
    width: 58px;
    height: 58px;
    background-color: var(--ciel);
}

#menu,
#menu div {

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

#menu:hover {

    background-color: var(--jaune);
}

#menu div {

    width: 25px;
    position: relative;
}

#menu div span {

    width: 100%;
    height: 3px;
    background: var(--bleu);
    position: absolute;
    transition: margin .3s, transform .3s;
    transform-origin: center;
    border-radius: 100vh;
}

#menu div span.a {

    margin-bottom: calc(12.5px - 3px);
}

.active-first-span {

    transform: rotate(45deg) !important;
    margin: 0 !important;
}

#menu div span.b {

    margin-top: calc(12.5px - 3px);
}

.active-last-span {

    transform: rotate(-45deg) !important;
    margin: 0 !important;
}

/*------------------------------------*\
    HEADER
\*------------------------------------*/

#header {

    padding: 0 50px;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 9999;
}

#header:before {

    content: '';
    position: absolute;
    inset: 0;
    background-color: white;
    z-index: -1;
    translate: 0 calc(-100% - 1px);
    -webkit-box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    transition: translate .3s;
}

#header.active-header:before {

    translate: 0;
}

#header .wrapper {
    max-width: 1680px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: padding .3s;
}

#header a#logo {

    -webkit-box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    transition: margin .3s;
}

.active-header a#logo {

    margin-bottom: -25px;
}

#header a#logo img {

    height: 158px;
    width: auto;
    transition: height .3s;
}

.active-header a#logo img {

    height: 125px !important;
}

#header .container,
#header .container ul.btn {

    display: flex;
    align-items: center;
}

#header .container ul.btn {

    gap: 12.5px;
    margin-left: 37.5px;
    padding-left: 37.5px;
    border-left: solid 1px var(--gris75);
}

#header .container ul.btn li:first-child a {

    display: flex;
    flex-direction: column;
    text-align: right;
    line-height: 1.5em;
}

#header .container ul.btn li:last-child {

    display: none;
}

#header .container ul.btn li:not(:first-child) a {

    width: 58px;
    height: 58px;
    border-radius: 7.5px;
    background-color: var(--jaune);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background-color .3s;
}

#header .container ul.btn li:not(:first-child) a:hover {

    background-color: var(--ciel);
}

#header .container ul.btn li a svg {

    fill: none;
    stroke: var(--bleu);
    stroke-linejoin: round;
    stroke-width: 10px;
    max-width: 30px;
    height: 30px;
}

#header ul {

    list-style: none;
}

#header ul#menu-menu,
#header #nav {

    display: flex;
    gap: 37.5px;
}

#header a {

    color: white;
    display: inline-flex;
}

#nav #menu-menu>li.menu-item-has-children>a:after {

    content: '';
    width: 12.5px;
    height: 12.5px;
    display: inline-block;
    margin-left: 6.25px;
    mask-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 116 66"><path d="M58,66c-2.05,0-4.09-.78-5.66-2.34L2.34,13.66C-.78,10.53-.78,5.47,2.34,2.34,5.47-.78,10.53-.78,13.66,2.34l44.34,44.34L102.34,2.34c3.12-3.12,8.19-3.12,11.31,0,3.12,3.12,3.12,8.19,0,11.31l-50,50c-1.56,1.56-3.61,2.34-5.66,2.34Z"/></svg>');
    mask-position: center bottom;
    mask-repeat: no-repeat;
    background: var(--ciel);
}

#header .container ul.btn li:first-child span,
#header ul li a {

    transition: color .3s;
}

#header ul#menu-menu li a {

    line-height: 58px;
    display: inline-flex;
    align-items: baseline;
}

.active-header ul li a span,
.active-header ul li a {

    color: var(--bleu) !important;
}

#header .container ul.btn li:first-child a span:first-of-type {

    color: var(--ciel) !important;
}

#nav #menu-menu>li.menu-item-has-children {

    position: relative;
}

#header #nav .sub-menu {

    position: absolute;
    background-color: white;
    top: 100%;
    left: 50%;
    translate: -50%;
    padding: 37.5px;
    padding-top: 25px;
    border-radius: 15px;
    -webkit-box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
    border-bottom: solid 7.5px var(--jaune);
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    width: max-content;
    transition: opacity .3s, padding .3s;
}

#nav #menu-menu>li.menu-item-has-children:hover>.sub-menu {

    pointer-events: all;
    opacity: 1;
    padding: 37.5px;
}

#header #nav .sub-menu li {

    list-style: square inside;
    color: var(--ciel);
}

#header #nav .sub-menu li::marker {

    margin-right: 0;
    padding-right: 0;
}

#header #nav .sub-menu a {

    color: var(--bleu);
    line-height: 1.75em;
}

/*------------------------------------*\
    FOOTER
\*------------------------------------*/

#footer {

    background-color: var(--bleu);
}

#footer .wrapper {

    max-width: 1680px;
    width: 100%;
    margin: 0 auto;
    display: flex;
}

#footer p,
#footer li,
#footer a,
#footer span,
#footer button {

    color: white;
    transition: color .3s;
}

#footer a:hover {

    color: var(--jaune);
}


#footer .wrapper {

    justify-content: space-between;
}

#footer .bottom .wrapper {

    align-items: center;
}

#footer .container:not(.bottom) {

    padding: 100px;
}

#footer .column {

    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 50px;
}

#footer p {

    width: 350px;
    font-size: 14px;
    line-height: 1.75em;
    color: var(--blanc90);
}

#footer a#devis {

    background-color: var(--ciel);
    color: var(--bleu);
    border-radius: 7.5px;
    padding: 15px 25px;
    transition: background-color .3s;
}

#footer a#devis:hover {

    background-color: var(--jaune);
}

#footer .contact ul li:first-child a,
#footer .menu>li>a {

    color: var(--ciel);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

#footer .contact ul li:first-child a span {

    color: var(--ciel);
    text-transform: none;
    letter-spacing: 0;
}

#footer .menu>li:not(:last-child) {

    margin-bottom: 50px;
}

#footer #facebook svg {

    height: 25px;
    width: 25px;
    fill: var(--jaune);
    transition: fill .3s;
}

#footer a#facebook:hover svg {

    fill: white;
}

#footer a#facebook {

    display: flex;
    gap: 6.25px;
    align-items: center;
    line-height: 1;
}

#footer li {

    list-style: none;
}

#footer .logo img {

    height: auto;
    width: 125px;
}

#footer .bottom {

    background-color: var(--bleu2);
    align-items: center;
    padding: 0 12.5px;
}

#footer .bottom a,
#footer .bottom button {

    color: var(--gris75);
    line-height: 50px;
    font-size: 14px;
    display: inline-flex;
    transition: color .3s;
    padding: 0;
    border-radius: 0;
    background: transparent !important;
    cursor: pointer;
}

#footer .bottom a:hover,
#footer .bottom button:hover {

    color: var(--ciel);
}

#footer .bottom ul {

    display: flex;
    flex-wrap: wrap;
    gap: 0 25px;
}


/*------------------------------------------------------------------------*\
    RESPONSIVE
\*------------------------------------------------------------------------*/

@media only screen and (max-width:1024px) {

    .img {

        aspect-ratio: 4/3;
    }

    .custom-swiper .elementor-swiper-button {

        display: none !important;
    }


    #header .container ul.btn li:last-child {

        display: inherit;
    }

    #header .container ul.btn {

        margin-left: 0;
        padding-left: 0;
        border: none;
    }

    #header #nav {

        position: absolute;
        left: 0;
        top: 100%;
        height: calc(100dvh - 100px);
        background: white;
        padding: 50px;
        justify-content: space-between;
        transform: translateX(-100%);
        transition: transform .75s cubic-bezier(.85, 0, .075, 1), -webkit-transform .75s cubic-bezier(.85, 0, .075, 1);
        gap: 50px;
        overflow-y: auto;
        z-index: -2;
    }

    #header #nav::-webkit-scrollbar {
        width: 0;
    }

    .active-nav {

        transform: translateX(0) !important;
    }

    #header ul#menu-menu {

        flex-direction: column;
        gap: 25px;
    }

    #header ul#menu-menu li a {

        line-height: 1;
    }

    #header #nav .sub-menu,
    #nav #menu-menu>li.menu-item-has-children:hover>.sub-menu {

        position: static;
        translate: none;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-bottom: none;
        pointer-events: all;
        opacity: 1;
        padding: 0;
    }

    #header ul#menu-menu>li>a {

        font-size: var(--e-global-typography-secondary-font-size);
        color: var(--bleu);
        width: 100%;
        justify-content: space-between;
    }

    /*------------------------------------*\
    FOOTER
\*------------------------------------*/

    #footer .wrapper {

        flex-direction: column;
        gap: 50px;
    }

    #footer .container:not(.bottom) {

        padding: 100px 50px;
    }

    #footer .bottom {

        padding: 25px;
    }

    #footer .bottom .wrapper {

        gap: 12.5px;
        align-items: flex-start;
    }

    #footer .bottom a,
    #footer .bottom button {

        line-height: normal;
    }
}

@media only screen and (max-width:650px) {

    .custom-swiper .swiper {

        padding-right: 37.5px;
    }

    #header {

        padding: 0 25px;
    }

    #header a#logo img {

        height: 125px;
    }

    #header .container ul.btn li:first-child {

        position: fixed;
        left: 0;
        bottom: 0;
        background: var(--bleu);
        padding: 25px;
        width: 100%;
        -webkit-box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
        box-shadow: 0px 0px 20px 0px rgba(23, 34, 63, 0.5);
        transition: translate .3s;
        z-index: -3;
    }

    .active-tel {

        translate: 0 100%;
    }

    #header .container ul.btn li:first-child a {

        flex-direction: row;
        justify-content: space-between;
    }

    #header ul.btn li:first-child span,
    .active-header ul.btn li:first-child span {

        color: white !important;
    }

    /*------------------------------------*\
    FOOTER
\*------------------------------------*/

    #footer .wrapper,
    #footer .column {

        gap: 25px;
    }

    #footer .menu>li:not(:last-child) {

        margin-bottom: 25px;
    }

    #footer .container:not(.bottom) {

        padding: 50px 25px;
    }

    #footer p {

        width: 100%;
    }

    #footer .bottom a,
    #footer .bottom button {

        font-size: 12px;
    }
}