.elementor-4721 .elementor-element.elementor-element-d704cab{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:30px;--padding-left:30px;--padding-right:30px;}.elementor-4721 .elementor-element.elementor-element-d704cab.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-4721 .elementor-element.elementor-element-3c05532{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}.elementor-4721 .elementor-element.elementor-element-3c05532.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-4721 .elementor-element.elementor-element-8530055{text-align:center;}.elementor-4721 .elementor-element.elementor-element-8530055 .elementor-heading-title{color:var( --e-global-color-84c84aa );}.elementor-4721 .elementor-element.elementor-element-b2f5d03{padding:0px 0px 30px 0px;text-align:center;}.elementor-4721 .elementor-element.elementor-element-b2f5d03 .elementor-heading-title{color:var( --e-global-color-c03c2cd );}.elementor-4721 .elementor-element.elementor-element-ddf0f63{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -40px) 0px;padding:0px 0px 0px 0px;font-family:"Montserrat", Sans-serif;color:var( --e-global-color-dbcc5c9 );}.elementor-4721 .elementor-element.elementor-element-ddf0f63 p{margin-block-end:19px;}.elementor-4721 .elementor-element.elementor-element-ddf0f63 a:hover, .elementor-4721 .elementor-element.elementor-element-ddf0f63 a:focus{color:var( --e-global-color-c03c2cd );}.elementor-4721 .elementor-element.elementor-element-cbfd597{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:9px 0px 0px 0px;}.elementor-4721 .elementor-element.elementor-element-8caca14{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-4721 .elementor-element.elementor-element-7ca5ae2{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-432cca0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-570962f{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-570962f.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-4721 .elementor-element.elementor-element-4f91b6b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-f52f83e{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-a1c87d4{--display:flex;}.elementor-4721 .elementor-element.elementor-element-fab9b0a{--display:flex;}.elementor-4721 .elementor-element.elementor-element-2590292{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-3a14111{--display:flex;}.elementor-4721 .elementor-element.elementor-element-0bc1b27{--display:flex;}.elementor-4721 .elementor-element.elementor-element-e9f5630{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-33a7f1f{--display:flex;}.elementor-4721 .elementor-element.elementor-element-b66302f{--display:flex;}.elementor-4721 .elementor-element.elementor-element-2bb1498{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-2495d3b{--display:flex;}.elementor-4721 .elementor-element.elementor-element-3d96f61{--display:flex;}.elementor-4721 .elementor-element.elementor-element-43954be{--display:flex;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-4721 .elementor-element.elementor-element-d8a26d9{--display:flex;}.elementor-4721 .elementor-element.elementor-element-610cbab{--display:flex;}#elementor-popup-modal-4721{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-4721 .dialog-message{width:830px;height:792px;align-items:flex-start;}#elementor-popup-modal-4721 .dialog-close-button{display:flex;}#elementor-popup-modal-4721 .dialog-widget-content{border-radius:2px 2px 2px 2px;box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(min-width:768px){.elementor-4721 .elementor-element.elementor-element-d704cab{--width:90.472%;}.elementor-4721 .elementor-element.elementor-element-3c05532{--width:100%;}.elementor-4721 .elementor-element.elementor-element-7ca5ae2{--content-width:563px;}.elementor-4721 .elementor-element.elementor-element-432cca0{--width:74%;}.elementor-4721 .elementor-element.elementor-element-570962f{--width:52.216%;}.elementor-4721 .elementor-element.elementor-element-43954be{--width:100%;}}/* Start custom CSS for heading, class: .elementor-element-5cd514a *//* =========================================================
   TITRE RÉSULTAT / EXPÉRIENCE COMPLÈTE
   Classe widget titre :
   ATB-résultat
   ========================================================= */

.atb-portfolio-popup .ATB-résultat {
    position: relative;

    margin-top: 42px !important;
    margin-bottom: 30px !important;

    padding-top: 24px !important;
}


/* petit label au-dessus */

.atb-portfolio-popup .ATB-résultat::before {
    content: "FINAL EXPERIENCE";

    position: absolute;

    top: 0;
    left: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 9px;
    font-weight: 600;

    line-height: 1;

    letter-spacing: .24em;

    text-transform: uppercase;

    color: #9d83ad;
}


/* petit trait */

.atb-portfolio-popup .ATB-résultat::after {
    content: "";

    position: absolute;

    top: 5px;
    left: 155px;

    width: 85px;
    height: 1px;

    background: rgba(70, 19, 107, .24);
}


/* vrai titre */

.atb-portfolio-popup
.ATB-résultat
.elementor-heading-title {

    margin: 0 !important;

    font-family: "Fraunces", serif !important;

    font-size: 54px !important;
    font-weight: 400 !important;

    line-height: .94 !important;

    letter-spacing: -.05em !important;

    color: #46136b !important;
}


/* responsive */

@media (max-width: 860px) {

    .atb-portfolio-popup
    .ATB-résultat
    .elementor-heading-title {

        font-size: 50px !important;
    }

}


@media (max-width: 600px) {

    .atb-portfolio-popup
    .ATB-résultat
    .elementor-heading-title {

        font-size: 42px !important;
    }

    .atb-portfolio-popup
    .ATB-résultat::after {

        display: none;
    }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-d704cab *//* =========================================================
   OLLIVANDERS — PORTFOLIO POPUP / ELEMENTOR
   Direction : heritage luxury / magical archive
   Format cible : 830px x 783px
   ========================================================= */


/* =========================================================
   01 — PALETTE OLLIVANDERS
   ========================================================= */

:root {
    --olliv-purple: #2F1949;
    --olliv-burgundy: #521D2A;

    --olliv-gold: #B89357;
    --olliv-gold-soft: #C9AA72;

    --olliv-cream: #F8F4E9;
    --olliv-paper: #EEE9DF;

    --olliv-black: #191816;
    --olliv-ink: #2A2028;
    --olliv-text: #5B5258;

    --olliv-border: rgba(184, 147, 87, .24);
}


/* =========================================================
   02 — POPUP ELEMENTOR
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-widget-content {

    width: 830px !important;
    max-width: calc(100vw - 30px) !important;

    height: 783px !important;
    max-height: calc(100vh - 30px) !important;

    background: var(--olliv-cream) !important;

    border:
        1px solid rgba(47, 25, 73, .10) !important;

    border-radius: 4px !important;

    box-shadow:
        0 40px 110px rgba(25, 18, 22, .28),
        0 10px 32px rgba(82, 29, 42, .10) !important;

    overflow: hidden !important;
}


/* =========================================================
   03 — ZONE DE SCROLL
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message {

    width: 100% !important;

    height: 783px !important;
    max-height: calc(100vh - 30px) !important;

    padding: 0 !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    background:
        radial-gradient(
            circle at 88% 8%,
            rgba(184, 147, 87, .13),
            transparent 28%
        ),
        radial-gradient(
            circle at 5% 70%,
            rgba(47, 25, 73, .035),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #FBF8F0 0%,
            #F5F0E6 100%
        );
}


/* =========================================================
   04 — SCROLLBAR
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message::-webkit-scrollbar {
    width: 5px;
}

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message::-webkit-scrollbar-track {
    background: transparent;
}

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message::-webkit-scrollbar-thumb {

    background:
        linear-gradient(
            180deg,
            var(--olliv-gold),
            var(--olliv-burgundy)
        );

    border-radius: 999px;
}

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message {
    scrollbar-width: thin;
    scrollbar-color:
        var(--olliv-gold)
        transparent;
}


/* =========================================================
   05 — BOUTON FERMER
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-close-button {

    position: absolute !important;

    top: 18px !important;
    right: 18px !important;

    width: 38px !important;
    height: 38px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;

    background:
        rgba(248, 244, 233, .88) !important;

    border:
        1px solid rgba(184,147,87,.25);

    border-radius: 50%;

    color:
        var(--olliv-purple) !important;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    opacity: 1 !important;

    transition:
        background .25s ease,
        color .25s ease,
        transform .3s ease;

    z-index: 99999 !important;
}


.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-close-button:hover {

    background:
        var(--olliv-purple) !important;

    color:
        var(--olliv-gold-soft) !important;

    transform: rotate(90deg);
}


/* =========================================================
   06 — CONTENEUR PRINCIPAL
   ========================================================= */

.atb-portfolio-popup-Olliv {

    width: 100% !important;
    max-width: none !important;

    padding-left: 42px !important;
    padding-right: 42px !important;

    box-sizing: border-box;

    color: var(--olliv-ink);
}


.atb-portfolio-popup-Olliv.e-con,
.atb-portfolio-popup-Olliv > .e-con-inner {

    width: 100% !important;
    max-width: none !important;
}


/* =========================================================
   07 — RESET ELEMENTOR
   ========================================================= */

.atb-portfolio-popup-Olliv .e-con {
    min-height: 0;
}

.atb-portfolio-popup-Olliv
.elementor-widget-image {
    margin-bottom: 0;
}

.atb-portfolio-popup-Olliv img {
    max-width: 100%;
}


/* =========================================================
   08 — TYPOGRAPHIES
   ========================================================= */

.atb-portfolio-popup-Olliv h1,
.atb-portfolio-popup-Olliv h2,
.atb-portfolio-popup-Olliv h3,
.atb-portfolio-popup-Olliv h4,
.atb-portfolio-popup-Olliv h5,
.atb-portfolio-popup-Olliv h6,
.atb-portfolio-popup-Olliv
.elementor-heading-title {

    font-family:
        "Fraunces",
        serif !important;

    font-weight: 400;

    color:
        var(--olliv-purple);
}


.atb-portfolio-popup-Olliv p,
.atb-portfolio-popup-Olliv a,
.atb-portfolio-popup-Olliv li {

    font-family:
        "Montserrat",
        sans-serif;
}


/* =========================================================
   09 — TITRE PRINCIPAL
   ========================================================= */

.atb-portfolio-popup-Olliv h1 {

    margin: 0;

    font-size: 52px !important;

    font-weight: 400 !important;

    line-height: .94 !important;

    letter-spacing: -.045em !important;

    color:
        var(--olliv-purple) !important;

    text-wrap: balance;
}


/* =========================================================
   10 — SOUS-TITRE
   ========================================================= */

.atb-portfolio-popup-Olliv h2 {

    font-size: 33px;

    line-height: 1.05;

    letter-spacing: -.035em;

    color:
        var(--olliv-burgundy);
}


/* =========================================================
   11 — DESCRIPTION
   ========================================================= */

.atb-portfolio-popup-Olliv
.elementor-widget-text-editor {

    width: 100%;
    max-width: 100% !important;

    margin-bottom: 0 !important;
}


.atb-portfolio-popup-Olliv
.elementor-widget-text-editor p {

    margin-top: 0;
    margin-bottom: .65em;

    font-size: 14px !important;

    font-weight: 400;

    line-height: 1.72 !important;

    color:
        var(--olliv-text);
}


.atb-portfolio-popup-Olliv
.elementor-widget-text-editor
p:last-child {

    margin-bottom: 0 !important;
}


/* =========================================================
   12 — LIENS
   ========================================================= */

.atb-portfolio-popup-Olliv a {

    color:
        var(--olliv-burgundy);

    text-decoration: none;

    transition:
        color .25s ease;
}


.atb-portfolio-popup-Olliv a:hover {

    color:
        var(--olliv-gold);
}


/* =========================================================
   13 — TAGS
   Classe :
   atb-tags-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.atb-tags-olliv {

    width: 100%;

    margin-top: 14px !important;
    margin-bottom: 46px !important;

    padding-top: 13px !important;
    padding-bottom: 13px !important;

    border-top:
        1px solid var(--olliv-border);

    border-bottom:
        1px solid var(--olliv-border);
}


.atb-portfolio-popup-Olliv
.atb-tags-olliv::before {

    content: none !important;

    display: none !important;
}


.atb-portfolio-popup-Olliv
.atb-tags-olliv p {

    margin: 0 !important;
    padding: 0 !important;

    font-family:
        "Montserrat",
        sans-serif !important;

    font-size:
        9px !important;

    font-weight:
        600 !important;

    line-height:
        1.5 !important;

    letter-spacing:
        .17em !important;

    text-transform:
        uppercase;

    color:
        var(--olliv-burgundy) !important;
}


/* =========================================================
   14 — TITRE AVANT
   Classe :
   ATB-avant-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.ATB-avant-olliv {

    position: relative;

    margin-top: 30px !important;
    margin-bottom: 27px !important;

    padding-top: 24px !important;
}


/* petit label */

.atb-portfolio-popup-Olliv
.ATB-avant-olliv::before {

    content:
        "ARCHIVE — BEFORE";

    position: absolute;

    top: 0;
    left: 0;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 9px;

    font-weight: 600;

    line-height: 1;

    letter-spacing: .24em;

    text-transform: uppercase;

    color:
        var(--olliv-gold);
}


/* trait */

.atb-portfolio-popup-Olliv
.ATB-avant-olliv::after {

    content: "";

    position: absolute;

    top: 5px;
    left: 174px;

    width: 85px;
    height: 1px;

    background:
        rgba(184,147,87,.62);
}


/* TITRE EN BORDEAUX */

.atb-portfolio-popup-Olliv
.ATB-avant-olliv
.elementor-heading-title {

    margin: 0 !important;

    font-family:
        "Fraunces",
        serif !important;

    font-size: 54px !important;

    font-weight: 400 !important;

    line-height: .94 !important;

    letter-spacing: -.05em !important;

    color:
        var(--olliv-burgundy) !important;
}


/* =========================================================
   15 — PHOTOS AVANT
   Classe :
   ATB-photos-avant-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.ATB-photos-avant-olliv {

    width: 100% !important;
    max-width: none !important;

    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 68px !important;

    padding: 0 !important;
}


.atb-portfolio-popup-Olliv
.ATB-photos-avant-olliv .e-con {

    min-height: 0 !important;
}


.atb-portfolio-popup-Olliv
.ATB-photos-avant-olliv
.elementor-widget-image img {

    display: block;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 0 !important;

    object-fit: contain !important;

    border-radius: 2px;

    transition:
        transform .65s
        cubic-bezier(.2,.7,.2,1),
        filter .45s ease;
}


.atb-portfolio-popup-Olliv
.ATB-photos-avant-olliv
.elementor-widget-image:hover img {

    transform:
        scale(1.012);

    filter:
        contrast(1.015);
}


/* =========================================================
   16 — TITRE MOOD & BRAND BOARD
   Classe :
   ATB-Moodboard-titre-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.ATB-Moodboard-titre-olliv {

    position: relative;

    margin-top: 38px !important;
    margin-bottom: 27px !important;

    padding-top: 24px !important;
}


/* label */

.atb-portfolio-popup-Olliv
.ATB-Moodboard-titre-olliv::before {

    content:
        "VISUAL DIRECTION";

    position: absolute;

    top: 0;
    left: 0;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 9px;

    font-weight: 600;

    line-height: 1;

    letter-spacing: .24em;

    text-transform: uppercase;

    color:
        var(--olliv-gold);
}


/* trait */

.atb-portfolio-popup-Olliv
.ATB-Moodboard-titre-olliv::after {

    content: "";

    position: absolute;

    top: 5px;
    left: 153px;

    width: 85px;
    height: 1px;

    background:
        rgba(184,147,87,.62);
}


/* TITRE EN BORDEAUX */

.atb-portfolio-popup-Olliv
.ATB-Moodboard-titre-olliv
.elementor-heading-title {

    margin: 0 !important;

    font-family:
        "Fraunces",
        serif !important;

    font-size: 54px !important;

    font-weight: 400 !important;

    line-height: .94 !important;

    letter-spacing: -.05em !important;

    color:
        var(--olliv-burgundy) !important;
}


/* =========================================================
   17 — MOODBOARD
   Classe :
   ATB-moodboard-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv {

    position: relative;

    width: 100% !important;
    max-width: none !important;

    min-height: 0 !important;

    margin-top: 0 !important;
    margin-bottom: 68px !important;

    padding: 16px !important;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(184,147,87,.14),
            transparent 34%
        ),
        radial-gradient(
            circle at 85% 80%,
            rgba(47,25,73,.06),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #FBF8F0,
            #F2EBDF
        );

    border:
        1px solid var(--olliv-border);

    box-sizing: border-box;
}


/* reset */

.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv > * {

    grid-column: auto !important;
    grid-row: auto !important;

    min-height: 0 !important;
}


.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv .e-con {

    min-height: 0 !important;
}


/* images */

.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv
.elementor-widget-image img {

    display: block;

    width: 100% !important;
    max-width: 100% !important;

    height: auto !important;
    min-height: 0 !important;

    object-fit: contain !important;

    border-radius: 2px;

    transition:
        transform .7s
        cubic-bezier(.2,.7,.2,1);
}


.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv
.elementor-widget-image:hover img {

    transform:
        scale(1.012);
}


/* accent doré */

.atb-portfolio-popup-Olliv
.ATB-moodboard-olliv::before {

    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 58px;
    height: 2px;

    background:
        linear-gradient(
            90deg,
            var(--olliv-gold),
            var(--olliv-gold-soft)
        );

    z-index: 2;
}


/* =========================================================
   18 — TITRE RÉSULTAT
   Classe :
   ATB-résultat-titre-olliv
   ========================================================= */

.atb-portfolio-popup-Olliv
.ATB-résultat-titre-olliv {

    position: relative;

    margin-top: 40px !important;
    margin-bottom: 27px !important;

    padding-top: 24px !important;
}


/* label */

.atb-portfolio-popup-Olliv
.ATB-résultat-titre-olliv::before {

    content:
        "FINAL IDENTITY";

    position: absolute;

    top: 0;
    left: 0;

    font-family:
        "Montserrat",
        sans-serif;

    font-size: 9px;

    font-weight: 600;

    line-height: 1;

    letter-spacing: .24em;

    text-transform: uppercase;

    color:
        var(--olliv-gold);
}


/* trait */

.atb-portfolio-popup-Olliv
.ATB-résultat-titre-olliv::after {

    content: "";

    position: absolute;

    top: 5px;
    left: 137px;

    width: 85px;
    height: 1px;

    background:
        rgba(184,147,87,.62);
}


/* TITRE EN BORDEAUX */

.atb-portfolio-popup-Olliv
.ATB-résultat-titre-olliv
.elementor-heading-title {

    margin: 0 !important;

    font-family:
        "Fraunces",
        serif !important;

    font-size: 54px !important;

    font-weight: 400 !important;

    line-height: .94 !important;

    letter-spacing: -.05em !important;

    color:
        var(--olliv-burgundy) !important;
}


/* =========================================================
   19 — FINITIONS
   ========================================================= */

.atb-portfolio-popup-Olliv
.elementor-widget-heading {
    margin-bottom: 0;
}

.atb-portfolio-popup-Olliv
.elementor-widget-text-editor {
    margin-bottom: 0 !important;
}


/* =========================================================
   20 — TABLETTE
   ========================================================= */

@media (max-width: 860px) {

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-widget-content {

        width:
            calc(100vw - 24px) !important;

        height:
            calc(100vh - 24px) !important;

        max-height:
            calc(100vh - 24px) !important;
    }


    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-message {

        height:
            calc(100vh - 24px) !important;

        max-height:
            calc(100vh - 24px) !important;
    }


    .atb-portfolio-popup-Olliv {

        padding-left:
            30px !important;

        padding-right:
            30px !important;
    }


    .atb-portfolio-popup-Olliv h1 {

        font-size:
            48px !important;
    }


    .atb-portfolio-popup-Olliv
    .ATB-avant-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-Moodboard-titre-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-résultat-titre-olliv
    .elementor-heading-title {

        font-size:
            50px !important;
    }
}


/* =========================================================
   21 — MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-widget-content {

        width: 100vw !important;
        max-width: 100vw !important;

        height: 100dvh !important;
        max-height: 100dvh !important;

        border-radius: 0 !important;
    }


    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-message {

        height: 100dvh !important;
        max-height: 100dvh !important;
    }


    .atb-portfolio-popup-Olliv {

        padding-left:
            18px !important;

        padding-right:
            18px !important;
    }


    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-close-button {

        top: 14px !important;
        right: 14px !important;

        width: 38px !important;
        height: 38px !important;
    }


    .atb-portfolio-popup-Olliv h1 {

        font-size:
            39px !important;

        line-height:
            .96 !important;
    }


    .atb-portfolio-popup-Olliv h2 {

        font-size:
            28px;
    }


    .atb-portfolio-popup-Olliv
    .elementor-widget-text-editor p {

        font-size:
            13px !important;

        line-height:
            1.68 !important;
    }


    /* tags */

    .atb-portfolio-popup-Olliv
    .atb-tags-olliv {

        margin-top:
            12px !important;

        margin-bottom:
            40px !important;

        padding-top:
            11px !important;

        padding-bottom:
            11px !important;
    }


    .atb-portfolio-popup-Olliv
    .atb-tags-olliv p {

        font-size:
            8px !important;

        letter-spacing:
            .12em !important;
    }


    /* titres */

    .atb-portfolio-popup-Olliv
    .ATB-avant-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-Moodboard-titre-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-résultat-titre-olliv
    .elementor-heading-title {

        font-size:
            42px !important;
    }


    /* traits */

    .atb-portfolio-popup-Olliv
    .ATB-avant-olliv::after,

    .atb-portfolio-popup-Olliv
    .ATB-Moodboard-titre-olliv::after,

    .atb-portfolio-popup-Olliv
    .ATB-résultat-titre-olliv::after {

        display:
            none;
    }


    /* sections */

    .atb-portfolio-popup-Olliv
    .ATB-photos-avant-olliv,

    .atb-portfolio-popup-Olliv
    .ATB-moodboard-olliv {

        margin-bottom:
            52px !important;
    }


    .atb-portfolio-popup-Olliv
    .ATB-moodboard-olliv {

        padding:
            10px !important;
    }
}


/* =========================================================
   22 — PETITS MOBILES
   ========================================================= */

@media (max-width: 400px) {

    .atb-portfolio-popup-Olliv {

        padding-left:
            14px !important;

        padding-right:
            14px !important;
    }


    .atb-portfolio-popup-Olliv h1 {

        font-size:
            35px !important;
    }


    .atb-portfolio-popup-Olliv
    .ATB-avant-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-Moodboard-titre-olliv
    .elementor-heading-title,

    .atb-portfolio-popup-Olliv
    .ATB-résultat-titre-olliv
    .elementor-heading-title {

        font-size:
            38px !important;
    }
}


/* =========================================================
   23 — ACCESSIBILITÉ
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .atb-portfolio-popup-Olliv * {

        transition-duration:
            .01ms !important;
    }
}/* End custom CSS */
/* Start custom CSS *//* =========================================================
   OLLIVANDERS — ANIMATION POPUP
   Même principe que SCAVO / Clothes Over Bro's
   Adaptée à : atb-portfolio-popup-Olliv
   ========================================================= */


/* ---------------------------------------------------------
   ÉTAT INITIAL
   --------------------------------------------------------- */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-widget-content {

    transform-origin: 50% 100%;

    animation:
        olliv-folder-open
        0.82s
        cubic-bezier(.22,.78,.22,1)
        both;

    will-change:
        transform,
        opacity,
        clip-path;
}


/* ---------------------------------------------------------
   OUVERTURE
   Effet dossier / feuille qui se déplie
   --------------------------------------------------------- */

@keyframes olliv-folder-open {

    0% {
        opacity: 0;

        transform:
            perspective(1400px)
            translateY(22px)
            rotateX(-7deg)
            scale(.975);

        clip-path:
            inset(88% 2% 0 2% round 4px);
    }


    30% {
        opacity: 1;

        transform:
            perspective(1400px)
            translateY(10px)
            rotateX(-3deg)
            scale(.985);

        clip-path:
            inset(44% 1% 0 1% round 4px);
    }


    68% {
        transform:
            perspective(1400px)
            translateY(-2px)
            rotateX(.7deg)
            scale(1.002);

        clip-path:
            inset(0 0 0 0 round 4px);
    }


    100% {
        opacity: 1;

        transform:
            perspective(1400px)
            translateY(0)
            rotateX(0deg)
            scale(1);

        clip-path:
            inset(0 0 0 0 round 4px);
    }
}


/* =========================================================
   CONTENU
   Arrive légèrement après l'ouverture du "dossier"
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-message {

    animation:
        olliv-content-reveal
        .72s
        cubic-bezier(.22,.75,.25,1)
        .10s
        both;
}


@keyframes olliv-content-reveal {

    0% {
        opacity: 0;
        transform: translateY(12px);
    }


    45% {
        opacity: .45;
    }


    100% {
        opacity: 1;
        transform: translateY(0);
    }
}


/* =========================================================
   FOND / OVERLAY
   Apparition douce
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv) {

    animation:
        olliv-overlay-in
        .45s
        ease-out
        both;
}


@keyframes olliv-overlay-in {

    from {
        background-color:
            rgba(23, 15, 25, 0);
    }

    to {
        background-color:
            rgba(23, 15, 25, .76);
    }
}


/* =========================================================
   PETIT DÉTAIL OLLIVANDERS
   Reflet ivoire / or / bordeaux pendant l'ouverture
   ========================================================= */

.elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
.dialog-widget-content::before {

    content: "";

    position: absolute;

    inset: 0;

    pointer-events: none;

    z-index: 2;

    background:
        linear-gradient(
            115deg,

            transparent 15%,

            rgba(248, 244, 233, 0) 28%,

            rgba(248, 244, 233, .17) 40%,

            rgba(184, 147, 87, .10) 47%,

            rgba(82, 29, 42, .045) 54%,

            transparent 70%
        );

    transform:
        translateX(-115%);

    animation:
        olliv-light-pass
        1.05s
        cubic-bezier(.22,.75,.25,1)
        .12s
        both;
}


/* ---------------------------------------------------------
   Passage lumineux
   --------------------------------------------------------- */

@keyframes olliv-light-pass {

    0% {
        opacity: 0;

        transform:
            translateX(-115%);
    }


    25% {
        opacity: .65;
    }


    70% {
        opacity: .25;
    }


    100% {
        opacity: 0;

        transform:
            translateX(115%);
    }
}


/* =========================================================
   ACCESSIBILITÉ
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv),

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-widget-content,

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-message,

    .elementor-popup-modal:has(.atb-portfolio-popup-Olliv)
    .dialog-widget-content::before {

        animation: none !important;

        transform: none !important;

        clip-path: none !important;

        opacity: 1 !important;
    }
}/* End custom CSS */