/* loader sur element */
.lb-preload {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

/* Modification des champs select */
.elementor-select-wrapper select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    position: relative;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="9" height="4.99" viewBox="0 0 9 4.99"><path d="M4.365 1.5l3.3 3.3a.621.621 0 0 0 .881 0 .629.629 0 0 0 0-.883L4.807.182a.622.622 0 0 0-.86-.018L.182 3.92a.624.624 0 0 0 .881.883Z" transform="rotate(180 4.364 2.495)" fill="%23707070"/></svg>');
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 9px;
    padding-right: 30px;
    outline: none;
}

.elementor-select-wrapper select::-ms-expand {
    display: none;
}

/**
 * Fond V2 .lb-bg-blue, .lb-bg-dark-blue, .lb-bg-bulle
 */
/** header blanc avec fond bleu ciel */
body.lb-bg-blue {
    background-color: #99C2FF;
    background-image: radial-gradient(
            circle at 2px 2px,
            rgba(229, 240, 255, 0.25) 0 2px,
            transparent 2px
    );
    background-size: 12px 12px;
    background-repeat: repeat;
}

.lb-bg-blue header {
    position: relative;
}

.lb-bg-blue header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: #FFFFFF;
    z-index: 2;
}

.lb-bg-blue header::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -130px;
    transform: translateX(-50%);

    width: 130%;
    height: 250px;

    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1200 200' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 170 C350 65 850 65 1200 170 L1200 0 L0 0 Z' fill='%23FFFFFF'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;

    filter: blur(22px);
    pointer-events: none;
    z-index: 1;
}

.lb-bg-blue main,
.lb-bg-blue div[data-elementor-type="archive"],
.lb-bg-blue div[data-elementor-type="single-post"] {
    position: relative;
}

.lb-bg-blue main::before,
.lb-bg-blue div[data-elementor-type="archive"]::before,
.lb-bg-blue div[data-elementor-type="single-post"]::before {
    content: '';
    position: absolute;

    top: -200px;
    bottom: -200px;

    width: 65%;
    left: 50%;
    transform: translateX(-50%);

    background: #fff;
    border-radius: 24px;

    box-shadow:
            0 0 50px 40px rgba(255,255,255,1),
            0 0 100px 90px rgba(255,255,255,0.9),
            0 0 150px 140px rgba(255,255,255,0.7),
            0 0 200px 190px rgba(255,255,255,0.4);
    pointer-events: none;

    z-index: 0;
}

@media (max-width: 767px) {
    .lb-bg-blue header::before {
        height: 40px;
    }

    .lb-bg-blue header::after {
        bottom: -135px;

        background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1200 140' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 100 C350 65 850 60 1200 100 L1200 0 L0 0 Z' fill='%23FFFFFF'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
    }

    .lb-bg-blue main::before,
    .lb-bg-blue div[data-elementor-type="archive"]::before,
    .lb-bg-blue div[data-elementor-type="single-post"]::before {
        box-shadow: 0 0 80px 80px #fff;
    }
}

/** header bleu foncé avec fond blanc */
body.lb-bg-dark-blue {
    background-color: #FFFFFF;
    background-image: radial-gradient(
            circle at 2px 2px,
            rgba(229, 240, 255, 1) 0 2px,
            transparent 2px
    );
    background-size: 12px 12px;
    background-repeat: repeat;
}

.lb-bg-dark-blue header {
    position: relative;
}

.lb-bg-dark-blue header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: #3385FF;
    z-index: 2;
}

.lb-bg-dark-blue header::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -130px;
    transform: translateX(-50%);

    width: 130%;
    height: 250px;

    background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1200 200' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 170 C350 65 850 65 1200 170 L1200 0 L0 0 Z' fill='%233385FF'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;

    filter: blur(22px);
    pointer-events: none;
    z-index: 1;
}

.lb-bg-dark-blue main,
.lb-bg-dark-blue div[data-elementor-type="archive"],
.lb-bg-dark-blue div[data-elementor-type="single-post"] {
    position: relative;
}

.lb-bg-dark-blue main::before,
.lb-bg-dark-blue div[data-elementor-type="archive"]::before,
.lb-bg-dark-blue div[data-elementor-type="single-post"]::before {
    content: '';
    position: absolute;

    top: -200px;
    bottom: -200px;

    width: 65%;
    left: 50%;
    transform: translateX(-50%);

    background: #fff;
    border-radius: 24px;

    box-shadow:
            0 0 50px 40px rgba(255,255,255,1),
            0 0 100px 90px rgba(255,255,255,0.9),
            0 0 150px 140px rgba(255,255,255,0.7),
            0 0 200px 190px rgba(255,255,255,0.4);
    pointer-events: none;

    z-index: 0;
}

@media (max-width: 767px) {
    .lb-bg-dark-blue header::before {
        height: 40px;
    }

    .lb-bg-dark-blue header::after {
        bottom: -135px;

        background: url("data:image/svg+xml,%3Csvg viewBox='0 0 1200 140' preserveAspectRatio='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 100 C350 65 850 60 1200 100 L1200 0 L0 0 Z' fill='%233385FF'/%3E%3C/svg%3E") center bottom / 100% 100% no-repeat;
    }

    .lb-bg-dark-blue main::before,
    .lb-bg-dark-blue div[data-elementor-type="archive"]::before,
    .lb-bg-dark-blue div[data-elementor-type="single-post"]::before {
        box-shadow: 0 0 80px 80px #fff;
    }
}

/**
 * Fond bulle
 */
.lb-bg-bulle header {
    position: relative;
}

.lb-bg-bulle header::before {
    content: "";
    position: absolute;
    top: -350px;
    left: -430px;

    width: 894px;
    height: 651px;
    opacity: 0.7;

    background: url('https://mabrik.immo/wp-content/uploads/2026/06/bulle-left.png') no-repeat center;
    background-size: contain;

    z-index: 0;
    pointer-events: none;

    animation: lbRotateLeft 10s ease-in-out infinite alternate;
    transform-origin: center center;
}

.lb-bg-bulle header::after {
    content: "";
    position: absolute;
    top: -480px;
    right: -400px;
    opacity: 0.5;

    width: 1085px;
    height: 1408px;

    background: url('https://mabrik.immo/wp-content/uploads/2026/06/bulle-right.png') no-repeat center;
    background-size: contain;

    z-index: 0;
    pointer-events: none;

    animation: lbRotateRight 10s ease-in-out infinite alternate;
    transform-origin: center center;
}

@keyframes lbRotateLeft {
    0% {
        transform: rotate(0deg) translate(0, 0);
    }
    35% {
        transform: rotate(29.15deg) translate(50px, 0);
    }
    75% {
        transform: rotate(58.56deg) translate(100px, -150px);
    }
    100% {
        transform: rotate(0deg) translateY(0);
    }
}

@keyframes lbRotateRight {
    0% {
        transform: rotate(0deg) translateY(0);
    }
    35% {
        transform: rotate(-9.09deg) translateY(0);
    }
    70% {
        transform: rotate(-72.45deg) translateY(12px);
    }
    0% {
        transform: rotate(0deg) translateY(0);
    }
}

@media (max-width: 1024px) {
    .lb-bg-bulle header::before {
        top: -150px;
        left: -230px;
        width: 494px;
        height: 351px;
    }

    .lb-bg-bulle header::after {
        top: -240px;
        right: -200px;
        width: 585px;
        height: 708px;
    }

    @keyframes lbRotateLeft {
        0% {
            transform: rotate(0deg) translate(0, 0);
        }
        35% {
            transform: rotate(29.15deg) translate(25px, 0);
        }
        75% {
            transform: rotate(58.56deg) translate(50px, -75px);
        }
        100% {
            transform: rotate(0deg) translateY(0);
        }
    }
}

@media (max-width: 767px) {
    .lb-bg-bulle header::before {
        top: -150px;
        left: -230px;
        width: 350px;
        height: 325px;
    }

    .lb-bg-bulle header::after {
        top: -240px;
        right: -200px;
        width: 380px;
        height: 650px;
    }

    @keyframes lbRotateLeft {
        0% {
            transform: rotate(0deg) translate(0, 0);
        }
        35% {
            transform: rotate(29.15deg) translate(20px, 0);
        }
        75% {
            transform: rotate(58.56deg) translate(40px, -50px);
        }
        100% {
            transform: rotate(0deg) translateY(0);
        }
    }
}

/**
 * Bloc bleu avec ellipse before/after
 */
.lb-bloc-ellipse {
    position:relative;
    z-index:1;
}

.lb-bloc-ellipse::before,
.lb-bloc-ellipse::after {
    content:'';
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    width:115%;
    height:444px;
    border-radius:50%;
    background:#fff;
    filter:blur(35px);
    pointer-events:none;
    z-index:1;
}

.lb-bloc-ellipse::before {
    top:-222px;

    background: linear-gradient(
            to bottom,
            #FFFFFF4D 0%,
            #FFFFFFB3 20%,
            #FFFFFF 35%
    );
}

.lb-bloc-ellipse::after {
    bottom:-252px;

    background: linear-gradient(
            to bottom,
            #FFFFFF 65%,
            #FFFFFF00 70%,
            #FFFFFF00 100%
    );
}

@media (max-width: 767px) {
    .lb-bloc-ellipse::before,
    .lb-bloc-ellipse::after{
        width:200%;
    }
}