/** ---- INIT / LAYOUT ---- **/

.Elixir-SIAA {
    position: relative;
    --COLOR-WHITE: #FFFFFF;
    --COLOR-GOLD: #A08B37;
    --COLOR-BLACK: #000000;
    --TITLE-COLOR: var(--COLOR-GOLD);
    --TEXT-COLOR: var(--COLOR-BLACK);
    --ALIGN: center;
    --VIEWPORT-HEIGHT: 100svh;    
    --SISLEY-HEADER: 156px;
    --UNIT: calc(100vw / 375);
    --STICKY-HEIGHT: 153px;
    --STRATE_3_STICKY: 80vh;
    --STRATE_3_DELTA: 0px
}
.Elixir-SIAA * { box-sizing: border-box; }
.Elixir-SIAA section { position: relative; height: var(--VIEWPORT-HEIGHT); width: 100%; overflow: hidden;
    display: flex; justify-content: center; align-items: center; }
.Elixir-SIAA__block { display: flex; flex-direction: column; align-items: center; gap: calc(var(--UNIT) * 8) }
.Elixir-SIAA__block[data-theme="dark"] { --TITLE-COLOR: var(--COLOR-WHITE); --TEXT-COLOR: var(--COLOR-WHITE) }
.Elixir-SIAA__block[data-theme="columns"] { align-items: flex-start; --TITLE-COLOR: var(--COLOR-WHITE);
    --TEXT-COLOR: var(--COLOR-WHITE); --ALIGN: left }
.Elixir-SIAA__block[data-theme="gray"] { --TITLE-COLOR: var(--COLOR-BLACK); --TEXT-COLOR: var(--COLOR-BLACK) }

@media (max-width: 761px) {
    .is--desktop { display: none!important }
}
@media (min-width: 762px) {
    .Elixir-SIAA { 
        --UNIT: calc(100vw / 1920); 
        --STICKY-HEIGHT: 97px;
        --STRATE_3_STICKY: 120vh;
    }
    .Elixir-SIAA__block { gap: calc(var(--UNIT) * 20) }
    .is--mobile { display: none!important }
    .Elixir-SIAA section { height: calc(var(--VIEWPORT-HEIGHT) - var(--STICKY-HEIGHT)) }
}
@media (min-width: 1024px) {
    .Elixir-SIAA { --SISLEY-HEADER: 184px }
}
@media (min-width: 1280px) {
    .Elixir-SIAA { --SISLEY-HEADER: 174px }
}

    /** ---- PACKSHOT ---- **/

.Elixir-SIAA__packshot { position: relative; display: block; width: calc(var(--UNIT) * 55); z-index: 2; }
.Elixir-SIAA__packshot > img { display: block; width: 100%; height: auto; }

@media (min-width: 762px) {
    .Elixir-SIAA__packshot { width: calc(var(--UNIT) * 114) }
}

    /** ---- TEXTES ---- **/

.Elixir-SIAA__title { font-family: 'Montserrat'; font-weight: 500; font-size: calc(var(--UNIT) * 25);
    line-height: calc(35 / 25); letter-spacing: 0.2em; text-align: var(--ALIGN);
    text-transform: uppercase; color: var(--TITLE-COLOR);
    margin: 0; max-width: calc(var(--UNIT) * 325); }
.Elixir-SIAA__tag { font-family: 'Roboto'; font-weight: 500; font-size: calc(var(--UNIT) * 12);
    line-height: calc(26 / 12); letter-spacing: calc(var(--UNIT) * 4); text-align: var(--ALIGN);
    text-transform: uppercase; color: var(--TITLE-COLOR); margin: 0 0 calc(var(--UNIT) * 2); }
.Elixir-SIAA__text { font-family: 'Roboto'; font-weight: 300; font-size: calc(var(--UNIT) * 14);
    line-height: calc(24 / 12); letter-spacing: 0; text-align: var(--ALIGN);
    color: var(--TEXT-COLOR); margin: 0; max-width: calc(var(--UNIT) * 325) }
.Elixir-SIAA__cta { font-family: 'Roboto'; font-weight: 300; font-size: var(--UNIT) * 14; 
    line-height: calc(20 / 14); letter-spacing: 0; height: 54px; min-width: 190px;
    padding: 0 27px; border: 0px solid;  border-radius: 27px;    
    background-color: #877046; color: #fff;
    display: flex; justify-content: center; align-items: center;
    outline: 0; cursor: pointer; text-decoration: none !important;
}
.Elixir-SIAA__cta:hover { color: #fff }
.Elixir-SIAA__scrolldown { font-family: 'Roboto'; font-weight: 500; font-size: calc(var(--UNIT) * 14);
    line-height: calc(20 / 14); margin: 0;
    display: flex; align-items: center; gap: calc(var(--UNIT) * 8) }
.Elixir-SIAA__text-button { font-family: 'Roboto'; font-weight: 500; font-size: calc(var(--UNIT) * 23);
    line-height: calc(30 / 23); letter-spacing: 0; margin-bottom: calc(var(--UNIT) * 20);
    display: flex; justify-content: flex-start; align-items: center;
    padding: 0; border: 0px solid; outline: 0; cursor: pointer; }
.Elixir-SIAA__text-button::after { font-family: 'Roboto'; font-weight: 200; font-size: calc(var(--UNIT) * 30);
    line-height: calc(20 / 16); width: calc(var(--UNIT) * 20); height: calc(var(--UNIT) * 20);
    overflow: hidden; white-space: nowrap; margin-left: calc(var(--UNIT) * 14);    
    display: flex; justify-content: center; align-items: center;
    transition: transform ease-in-out 0.25s; }
.Elixir-SIAA__text-button[data-action="collapse"]::after { content: "-"; font-size: calc(var(--UNIT) * 60) }
.Elixir-SIAA__text-button[data-action="expand"]::after { content: "+" }
.Elixir-SIAA__text-button + .Elixir-SIAA__block { margin-top: calc(var(--UNIT) * -8) }

@media(min-width:762px) {
    .Elixir-SIAA__title { font-size: calc(var(--UNIT) * 42); line-height: calc(56 / 42);
        max-width: calc(var(--UNIT) * 700) }
    .Elixir-SIAA__tag { font-weight: 300; font-size: calc(var(--UNIT) * 18); line-height: calc(30 / 18);
        letter-spacing: calc(var(--UNIT) * 7.8); margin-bottom: calc(var(--UNIT) * 7) }
    .Elixir-SIAA__text { font-size: calc(var(--UNIT) * 18); line-height: calc(33 / 18);
        max-width: calc(var(--UNIT) * 580) }
    .Elixir-SIAA__cta { line-height: calc(26 / 14) }
    .Elixir-SIAA__scrolldown { gap: calc(var(--UNIT) * 4) }
    .Elixir-SIAA__scrolldown svg { height: calc(var(--UNIT) * 20) }
    .Elixir-SIAA__text-button { font-size: calc(var(--UNIT) * 16); line-height: calc(20 / 16);
        margin-bottom: 0; text-transform: uppercase;
        position: absolute; bottom: 36px; left: 34px }
    .Elixir-SIAA__text-button::after { width: calc(var(--UNIT) * 26); height: calc(var(--UNIT) * 30);
        margin-left: 5px  }
    .Elixir-SIAA__text-button + .Elixir-SIAA__block { margin-top: 0 }
}

/** ----- LINKS ---- **/

.Elixir-SIAA__link { font-family: 'Roboto'; font-weight: 300; font-size: calc(var(--UNIT) * 12);
    line-height: calc(24 / 12); width: 100%; display: inline-block; color: #000;
    border: 1px solid #877046; border-radius: calc(var(--UNIT) * 4);
    margin-top: calc(var(--UNIT) * 4); 
    padding: calc(var(--UNIT) * 2) calc(var(--UNIT) * 28) calc(var(--UNIT) * 11) calc(var(--UNIT) * 12);
    text-decoration: none !important; position: relative }
.Elixir-SIAA__link::after { content: ' '; position: absolute; top: 0; height: 100%; right: 0; width: 25px;
    background: transparent url("data:image/svg+xml;utf8,<svg width='11' height='19' viewBox='0 0 11 19' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M1.25 0.958496L9.75 9.4585L1.25 17.9585' stroke='%23877046' stroke-width='0.75'/></svg>") no-repeat center }
.Elixir-SIAA__link > span { font-family: 'Roboto'; font-weight: 400; font-size: calc(var(--UNIT) * 10);
    line-height: calc(16 / 10); letter-spacing: .2em;
    text-transform: uppercase; color: #877046; display: inline-block; width: 100%; 
    position: relative; top: calc(var(--UNIT) * 4) }

.Elixir-SIAA__link2 { font-family: 'Roboto'; font-size: calc(var(--UNIT) * 11.33);
    line-height: calc(13.33 / 9.33); color: #000; position: relative; 
    padding-bottom: calc(var(--UNIT) * 2); padding-right: calc(var(--UNIT) * 14);
}
.Elixir-SIAA__link2:after { content: ' '; position: absolute; top: 0; height: 100%; right: 0; width: calc(var(--UNIT) * 25);
    background: transparent url("data:image/svg+xml;utf8,<svg width='8' height='12' viewBox='0 0 8 12' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M1.10011 0.765267C1.29319 0.544041 1.62859 0.521624 1.84925 0.715196L7.11182 5.33176C7.56587 5.73007 7.56587 6.43692 7.11182 6.83524L1.84925 11.4518C1.62859 11.6454 1.29319 11.623 1.10011 11.4017C0.907036 11.1805 0.929396 10.8442 1.15006 10.6507L5.92786 6.45937C6.15488 6.26021 6.15488 5.90678 5.92786 5.70763L1.15006 1.51633C0.929396 1.32275 0.907036 0.986493 1.10011 0.765267Z' fill='black'/></svg>") no-repeat right center }

@media (min-width: 762px) { 
    .Elixir-SIAA__link { font-size: calc(var(--UNIT) * 16); max-width: 62%; 
        margin-left: auto; margin-right: auto; margin-top: 45px;
        padding: 5px 20px 10px 14px; border: 2px solid #877046 }
    .Elixir-SIAA__link > span { font-size: calc(var(--UNIT) * 13.5); top: 1px }

    .Elixir-SIAA__link2 { font-size: calc(var(--UNIT) * 14); line-height: calc(20 / 14);}
}

/** ---- STICKY ---- **/

#STICKY { position: fixed; bottom: 0; height: auto; left: 0; width: 100%;
    overflow: hidden; display: flex; justify-content: space-between; flex-wrap: wrap;
    padding: 21px 25px 21px; transform: translateY(100%); z-index: 10;
    background-color: #F6F6F6; transition: transform .5s ease-in-out }
#STICKY_name { font-family: 'Playfair Display'; font-weight: 400; font-size: calc(var(--UNIT) * 18); 
    line-height: calc(30 / 18); width: calc(100% - 80px); margin-bottom: calc(var(--UNIT) * 12) }
#STICKY_price { font-family: 'Roboto'; font-weight: 500; font-size: calc(var(--UNIT) * 14); 
    line-height: calc(26 / 14) }
#STICKY .Elixir-SIAA__cta-container { width: 100%; margin: 0 }
#STICKY .Elixir-SIAA__cta { width: 100%; height: 48px }

.Elixir-SIAA[data-cart="visible"] #STICKY { transform: none }

@media (min-width: 762px) {
    #STICKY { height: var(--STICKY-HEIGHT); padding: 10px 40px 0 }
    #STICKY_name { font-size: calc(var(--UNIT) * 18); line-height: calc(30 / 18); 
        width: auto; margin-right: auto; margin-bottom: 0 }
    #STICKY_price { font-size: calc(var(--UNIT) * 14); line-height: calc(26 / 14);
        margin-right: 16px }
    #STICKY .Elixir-SIAA__cta-container { width: auto; margin: 0 }
    #STICKY .Elixir-SIAA__cta { font-size: calc(var(--UNIT) * 14); padding: calc(var(--UNIT) * 6.5) calc(var(--UNIT) * 40);
    height: calc(var(--UNIT) * 48); width: auto; min-width: 0; background: #877046 }
}

.Elixir-SIAA .sticky__marker { position: absolute; top: 0; bottom: 0; left: 0; width: 1px;
    /*width: 10px; background-color: red;*/  }
@media (max-width: 761px) {
    #STRATES_B > .sticky__marker { top: var(--STICKY-HEIGHT); bottom: calc(200vh - var(--SISLEY-HEADER)) }
    #STRATES_C > .sticky__marker { display: none }
    #STRATE_5 .sticky__marker { top: var(--STICKY-HEIGHT); bottom: 0 }
    #STRATE_6 .sticky__marker { top: 0; bottom: calc(200vh - var(--STICKY-HEIGHT)) }
    #STRATE_7 .sticky__marker { top: var(--STICKY-HEIGHT); bottom: 0 }
    #STRATE_8 .sticky__marker { top: 0; bottom: calc(100vh - var(--STICKY-HEIGHT)) }
}
@media (min-width: 762px) {
    #STRATES_B > .sticky__marker { top: calc(200vh + (var(--STRATE_3_STICKY) / 3)); /* relation avec score__marker position */ bottom: 200vh } 
    #STRATES_C > .sticky__marker { display: none }
    #STRATE_5 .sticky__marker { top: var(--STICKY-HEIGHT); }
    #STRATE_8 .sticky__marker { bottom: calc(100vh - var(--STICKY-HEIGHT)) }
}

/** ---- STRATES ---- **/

#STRATES_A { margin-top: calc(var(--SISLEY-HEADER) * -1) }
#STRATES_B { position: relative }
#STRATES_C { position: relative }
.score__marker { position: absolute; bottom: 0; left: 1px; width: 1px; 
    top: calc(100vh + (var(--STRATE_3_STICKY) / 2)); /* au milieu de STRATE_3 */
    /*left: 10px; width: 10px; background-color: green;*/ }
@media (min-width: 762px) {
    #STRATES_A { position: relative; z-index: 2; }
    #STRATES_B { z-index: 1; margin-top: calc(-1 * var(--VIEWPORT-HEIGHT)) }
    .score__marker { top: calc(200vh + (var(--STRATE_3_STICKY) / 3)); /* au milieu de STRATE_3 */ }
}

/** ---- STRATE 1 ---- **/

#STRATE_1 { flex-direction: column; justify-content: flex-start;
    padding-top: calc(var(--SISLEY-HEADER) + 5vw) }
#STRATE_1_CONTENT { margin-top: calc(var(--UNIT) * 8); flex: 1 }
#STRATE_1_VIDEO { position: absolute; top: -17vw; height: 108.5vw; left: 0; width: 100vw }
#STRATE_1_FOOTER { height: 65px; display: flex; }       

@media (max-width: 761px) {
    #STRATE_1 { height: calc(100 * var(--1svh) + 3px); margin-bottom: 5px }
}
@media (min-width: 762px) {
    #STRATE_1 { --FOOTER-HEIGHT: 60px; height: var(--VIEWPORT-HEIGHT);
        position: sticky; top: 0; flex-direction: row; padding: 0 0 var(--FOOTER-HEIGHT) }
    #STRATE_1 .Elixir-SIAA__packshot { position: absolute; top: 50%; height: auto;
        left: 50%; transform: translate(-50%, -35%); z-index: 2 }
    #STRATE_1_CONTENT { height: 100%; width: 50%;  flex: auto;
        padding: var(--SISLEY-HEADER) 0 0; margin: 0 } 
    #STRATE_1_CONTENT > .Elixir-SIAA__block { height: 100%; justify-content: center;
        padding-bottom: 16.5% }
    #STRATE_1_FOOTER { position: absolute; bottom: 0; height: var(--FOOTER-HEIGHT); left: 0; width: 100%;
        display: flex; justify-content: center; align-items: center; background-color: #fff; z-index: 2; }
    #STRATE_1_VIDEO { position: relative; top: 0; height: 100%; width: 50% }
    #STRATE_1_VIDEO_container { height: 100%; width: 100% }
}

/** ---- STRATE 2 ---- **/

#STRATE_2 { height: var(--VIEWPORT-HEIGHT) }
#STRATE_2_BG { width: 100%; height: var(--VIEWPORT-HEIGHT); position: relative;
    display: block; z-index: 1; object-fit: cover; }
#STRATE_2_BG > img { width: 100%; object-fit: cover; height: 100%; }
#STRATE_2_TITLE { display: flex; justify-content: center; align-items: center;
    position: absolute; top: 0; height: var(--VIEWPORT-HEIGHT); left: 0; width: 100%;
    z-index: 2; font-size: calc(var(--UNIT) * 48); line-height: calc(68 / 48);
    transition: opacity 1s ease-in-out }
#STRATE_2_TITLE.is--hidden { opacity: 0; }
#STRATE_2 .Elixir-SIAA__title { font-size: calc(var(--UNIT) * 28); line-height: calc(42 / 28); }

@media (min-width: 762px) { 
    #STRATE_2 { margin-top: 50vh } /* durée d'affichage STRATE_1 sticky */
    #STRATE_2 .Elixir-SIAA__title { font-size: calc(var(--UNIT) * 48); line-height: calc(66 / 48);
        max-width: calc(var(--UNIT) * 900) }
}

/** ---- STRATE 3 ---- **/

@keyframes score {
    100% { stroke-dashoffset: 0; }
}

#STRATE_3 { position: sticky; top: 0; flex-direction: column; height: auto; justify-content: flex-start;
    /*min-height: var(--VIEWPORT-HEIGHT);*/ padding-bottom: 100vh /* taille de STRATE_4 */;
    /*min-height: calc(var(--VIEWPORT-HEIGHT) - var(--STICKY-HEIGHT));*/ box-sizing: content-box }
#STRATE_3 .Elixir-SIAA__packshot { display: block; width: calc(var(--UNIT) * 48);
    position: relative; z-index: 2; }
#STRATE_3 .Elixir-SIAA__packshot > img { display: block; width: 100%; height: auto; }
#STRATE_3_CONTENT { /*flex: 1;*/ width: 100%; position: relative; /*padding-bottom: var(--STICKY-HEIGHT)*/ }
/*#STRATE_3_TEXT { padding-bottom: var(--STICKY-HEIGHT) }*/
#STRATE_3_SCORE { opacity: 0; position: absolute; top: 0; 
    left: 0; width: 100%; transform: translateY(20px); 
    padding: 0 12px; display: flex; flex-wrap: wrap; align-content: flex-start }

#STRATE_3_CONTENT[data-visible="score"] #STRATE_3_TEXT { opacity: 0 }
#STRATE_3_CONTENT[data-visible="score"] #STRATE_3_SCORE { opacity: 1; transform: none }
#STRATE_3_TEXT, #STRATE_3_SCORE { transition: all .5s ease-in-out }

.Elixir-SIAA__score-box { width: 50%; text-align: center; position: relative; margin-bottom: 20px; }
.Elixir-SIAA__score { width: 86px; display: flex; height: 86px; color: #A08B37;
    border: 1px solid rgba(160, 139, 55, 0.4); border-width: calc(var(--UNIT) * 2);
    margin: 0 auto; justify-content: center; align-items: center;
    border-radius: 50%; font-family: 'Montserrat'; font-weight: 600; padding: 7px 0 0 7px;
    position: relative }
.Elixir-SIAA__score-border { width: 86px; height: 86px; position: absolute; top: 0;
    left: 50%; transform: translateX(-50%); overflow: inherit !important }
.Elixir-SIAA__score-border circle { fill: none; stroke: #A08B37;
    stroke-width: calc(var(--UNIT) * 2); stroke-dasharray: 360; stroke-dashoffset: 360;
    transform: rotate(-90deg); transform-origin: center }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+1) .Elixir-SIAA__score-border circle {
    animation: score 2s linear forwards; }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+2) .Elixir-SIAA__score-border circle {
    animation: score 2s linear forwards 200ms }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+3) .Elixir-SIAA__score-border circle {
    animation: score 2s linear forwards 400ms }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n) .Elixir-SIAA__score-border circle {
    animation: score 2s linear forwards 600ms }
.Elixir-SIAA__score--description { font-family: 'Roboto'; font-weight: 300 }
.Elixir-SIAA__score--description > strong { font-weight: 500 }
.Elixir-SIAA__score--description sup { font-size: 70% }
.Elixir-SIAA__score-box { opacity: 0; transition: opacity .6s ease-in-out }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box { opacity: 1 }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+1) { transition-delay: 0 }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+2) { transition-delay: 200ms }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n+3) { transition-delay: 400ms }
.STRATE_3_SCORE--visible .Elixir-SIAA__score-box:nth-of-type(4n) { transition-delay: 600ms }

#STRATE_3_PACKSHOT { padding: /*48px 0 24px;*/ 24px 0 12px; }
.Elixir-SIAA__score--description { font-size: calc(var(--UNIT) * 12.7);
    line-height: calc(21.16 / 12.7); margin: .8em 0 0 }

#STRATE_3_CONTENT { margin-bottom: calc(var(--STRATE_3_DELTA) * -1) }

@media (max-width: 761px) {
    #STRATE_3_TEXT br { display: none }
    #STRATE_3 .Elixir-SIAA__block h2,
    #STRATE_3 .Elixir-SIAA__block p:first-of-type { margin-bottom: calc(var(--UNIT) * 5) }
    .Elixir-SIAA__score { font-size: calc(var(--UNIT) * 17.65); line-height: calc(21.16 / 17.65);
        letter-spacing: .2em; border-width: calc(var(--UNIT) * 1); }
    .Elixir-SIAA__score-box { margin: 0 0 19px }
    
}

@media (min-width: 762px) {
    #STRATE_3_PACKSHOT { padding: 48px 0 }
    #STRATE_3 .Elixir-SIAA__packshot { width: calc(var(--UNIT) * 114) }
    #STRATE_3 .Elixir-SIAA__title,
    #STRATE_3 .Elixir-SIAA__text { max-width: calc(var(--UNIT) * 800) }
    #STRATE_3 .Elixir-SIAA__block p:first-of-type { margin-bottom: -1.2em }
    #STRATE_3_SCORE { padding: 0 calc(var(--UNIT) * 366) }
    .Elixir-SIAA__score-box { width: 25%; margin-bottom: 0 }
    .Elixir-SIAA__score-border { width: calc(var(--UNIT) * 175);
        height: calc(var(--UNIT) * 175) }
    .Elixir-SIAA__score-border circle { stroke-width: calc(var(--UNIT) * 2) }
    .Elixir-SIAA__score { width: calc(var(--UNIT) * 175); height: calc(var(--UNIT) * 175);
        font-size: calc(var(--UNIT) * 36); letter-spacing: .2em;
        font-size: calc(var(--UNIT) * 36); margin-bottom: calc(var(--UNIT) * 29) }
    .Elixir-SIAA__score--description { font-size: calc(var(--UNIT) * 18); line-height: calc(30/18); margin: 0 }
    #STRATE_3_CONTENT { margin-bottom: 0 }
}

/** ---- STRATE 4 ---- 

#STRATE_4 { flex-direction: column; margin-top: 150vh }
#STRATE_4 .Elixir-SIAA__pano { height: calc(100% / 3); width: 100%;
    transition: height ease-in-out 1s; cursor: pointer;
    overflow: hidden; position: relative }
#STRATE_4 .Elixir-SIAA__pano:last-child { width: 100%; height: auto; flex: 1 }
#STRATE_4 img { width: 100%; height: 100%; max-width: unset; object-fit: cover;
    transition: transform ease-in-out 1s }
#STRATE_4 #STRATE_4_BG_1 img { object-position: top }
#STRATE_4 #STRATE_4_BG_2 img { object-position: bottom }
#STRATE_4 #STRATE_4_BG_3 img { object-position: bottom }
#STRATE_4 .Elixir-SIAA__pano[data-state="collapse"] { width: 100%; height: 13%; }
#STRATE_4 .Elixir-SIAA__pano[data-state="expand"] { width: 100%; height: 74%; }
#STRATE_4_BG_3 { left: auto; transform: scale(1.8); right: 0 }

.infos { position: absolute; left: 0; width: 100vw; bottom: 0; height: 100%;   
    display: flex; flex-direction: column; justify-content: flex-end;
    padding: 29px 20px 11px; z-index: 2;
    background: linear-gradient(25deg, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0) 600px) }
.infos p { overflow: hidden; opacity: 1;
    transition: opacity ease-in-out 0.5s, max-height ease-in-out 0.5s }
*[data-state="start"] .infos p { max-height: 0px !important; opacity: 0; }
*[data-state="collapse"] .infos p { max-height: 0px !important; opacity: 0 }
.infos button { color: #fff; background-color: transparent; border: 0 }

@media (min-width: 762px) {
    #STRATE_4 { flex-direction: row; margin-top: 150vh }
    #STRATE_4 .Elixir-SIAA__pano { width: calc(100% / 3); height: 100%; 
        transition: width ease-in-out 1s }
    #STRATE_4 .Elixir-SIAA__pano:last-child { width: auto }
    #STRATE_4 #STRATE_4_BG_2 img { object-position: right }
    #STRATE_4 #STRATE_4_BG_3 img { object-position: left }
    #STRATE_4 .Elixir-SIAA__pano[data-state="collapse"] { width: 25% }
    #STRATE_4 .Elixir-SIAA__pano[data-state="expand"] { width: 50% }
    .Elixir-SIAA__text-button.is--desktop { transition: opacity ease-in-out 250ms }
    .Elixir-SIAA__pano[data-state="collapse"] .Elixir-SIAA__text-button.is--desktop[data-action="collapse"],
    .Elixir-SIAA__pano[data-state="start"] .Elixir-SIAA__text-button.is--desktop[data-action="collapse"],
    .Elixir-SIAA__pano[data-state="expand"] .Elixir-SIAA__text-button.is--desktop[data-action="expand"] {
        opacity: 0; visibility: hidden }
    #STRATE_4 .Elixir-SIAA__title { font-weight: 400; font-size: calc(var(--UNIT) * 29);
        line-height: calc(57 / 33); color: #fff; }
    #STRATE_4 .Elixir-SIAA__pano:after { position: absolute; top: 0; height: 100%;
        left: 0; width: 100%; content: ' '; background: rgba(0, 0, 0, 0.4);
        transition: opacity ease-in-out 1s; opacity: 0 }
    #STRATE_4 .Elixir-SIAA__pano[data-state="collapse"]:after { opacity: 1 }

    .infos { width: 50vw; padding: 157px 44px 63px; align-items: flex-start }
} */


/********************************************/
#STRATE_4 { margin-top: var(--STRATE_3_STICKY) }

#STRATE_4 .Elixir-SIAA__pano {
    width: 33.333333%;
    height: 100%;
    overflow: hidden;
    position: relative;
    transition: width ease-in-out 1s;
    cursor: pointer
}

#STRATE_4 .Elixir-SIAA__pano:last-child {
    width: auto;
    flex: 1;
}

#STRATE_4 img {
    /*width: auto;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: unset;*/
    width: 100%;
    height: 100%;
    max-width: unset;
    object-fit: cover;
}
#STRATE_4 #STRATE_4_BG_2 img {
    object-position: right;
}
#STRATE_4 #STRATE_4_BG_3 img {
    object-position: left
}

#STRATE_4 .Elixir-SIAA__pano[data-state="collapse"] {
    width: 25%;
}

#STRATE_4 .Elixir-SIAA__pano[data-state="expand"] {
    width: 50%;
}

#STRATE_4_BG_3 {
    left: auto;
    transform: scale(1.8);
    right: 0
}
#STRATE_4 .Elixir-SIAA__pano:after {
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    width: 100%;
    content: ' ';
    background: rgba(0, 0, 0, 0.5);
    transition: opacity ease-in-out 1s;
    opacity: 0
}
#STRATE_4 .Elixir-SIAA__pano[data-state="collapse"]:after {
    opacity: 1
}

@media(max-width:761px) {
    #STRATE_4 {
        flex-direction: column;
        height: calc(100 * var(--1svh));
        margin-bottom: 5px;
        /*margin-top: calc(100vh - var(--STICKY-HEIGHT)) */    
    }

    #STRATE_4 .Elixir-SIAA__pano {
        height: 33.333333%;
        width: 100%;
        transition: height ease-in-out 1s;
    }

    #STRATE_4 .Elixir-SIAA__pano:last-child {
        width: 100%;
        height: auto;
    }

    #STRATE_4 img {
        /*width: 100%;
        height: auto;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%) scale(1.8);*/
        transition: transform ease-in-out 1s;
        /*object-fit: cover;*/
    }
    #STRATE_4 #STRATE_4_BG_1 img {
        object-position: top
    }
    #STRATE_4 #STRATE_4_BG_2 img {
        object-position: bottom
    }
    #STRATE_4 #STRATE_4_BG_3 img {
        object-position: bottom
    }

    /*#STRATE_4 #STRATE_4_BG_1 img {
        transform: translate(1%, -21%) scale(1.02)
    }
    #STRATE_4 .Elixir-SIAA__pano[data-state="expand"] #STRATE_4_BG_1 img {
        transform: translate(1%, -49%) scale(1.02)
    }
    #STRATE_4 #STRATE_4_BG_2 img {
        transform: translate(0, -78%)
    }
    #STRATE_4 .Elixir-SIAA__pano[data-state="expand"] #STRATE_4_BG_2 img {
        transform: translate(0, -50%)
    }    
    #STRATE_4 #STRATE_4_BG_3 img {
        transform: translate(0, -33%)
    }
    #STRATE_4 .Elixir-SIAA__pano[data-state="expand"] #STRATE_4_BG_3 img {
        transform: translate(0%, -50%)
    }*/

    #STRATE_4 .Elixir-SIAA__pano[data-state="collapse"] {
        width: 100%;
        height: 13%;
    }

    #STRATE_4 .Elixir-SIAA__pano[data-state="expand"] {
        width: 100%;
        height: 74%;
    }

    #STRATE_4_BG_3 {
        left: auto;
        transform: scale(1.8);
        right: 0
    }
}
@media (min-width: 762px) {
    #STRATE_4 { margin-top: 150vh }
    .Elixir-SIAA #STRATE_4 { height: calc(var(--VIEWPORT-HEIGHT)) }
    .Elixir-SIAA__text-button.is--desktop { transition: opacity ease-in-out 250ms }
    .Elixir-SIAA__pano[data-state="collapse"] .Elixir-SIAA__text-button.is--desktop[data-action="collapse"],
    .Elixir-SIAA__pano[data-state="start"] .Elixir-SIAA__text-button.is--desktop[data-action="collapse"],
    .Elixir-SIAA__pano[data-state="expand"] .Elixir-SIAA__text-button.is--desktop[data-action="expand"] {
        opacity: 0; visibility: hidden }
    #STRATE_4 .Elixir-SIAA__title { font-weight: 400; font-size: calc(var(--UNIT) * 29);
        line-height: calc(57 / 33); color: #fff; }
}

/********************************************/


.infos {
    width: 50vw;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 63px 32px;
    padding-top: 157px;
    z-index: 2;
    background: linear-gradient(25deg, rgba(0, 0, 0, 0) 0px, rgba(0, 0, 0, 0) 600px);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.infos p {
    transition: opacity ease-in-out 0.5s, max-height ease-in-out 0.5s;
    overflow: hidden;
    opacity: 1;
}

*[data-state="start"] .infos p {
    max-height: 0px !important;
    opacity: 0;
}

*[data-state="collapse"] .infos p {
    max-height: 0px !important;
    opacity: 0;
}

/**[data-state="expand"] .infos {
    background: linear-gradient(25deg, rgba(0, 0, 0, 0.8) 0px, rgba(0, 0, 0, 0) 600px);
}*/

.infos button {
    color: #fff;
    background-color: transparent;
    border: 0px;
}

@media(max-width:761px) {

    .infos { width: 100vw; height: auto; position: absolute; bottom: 0;
        left: 0; padding: 11px 20px 11px }
    .Elixir-SIAA__pano[data-state="expand"] .infos { background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .9) 100%) }

}

@media (min-width: 762px) {
    .infos { align-items: flex-start; height: auto; padding-top: 10px; }
    .Elixir-SIAA__pano[data-state="expand"] .infos { background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .9) 100%) }
}


/********************************************/

#STRATE_5 > div:not(.sticky__marker) {
    flex-basis: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
}

#STRATE_5_BG {
    width: 100%;
    height: auto;
    object-fit: cover;
}

#STRATE_5_PACKSHOT {
    position: relative;
    z-index: 2;
}

@media(max-width:761px) {
    #STRATE_5 {
        display: flex;
        flex-direction: column-reverse;
        height: auto;
    }

    #STRATE_5 .Elixir-SIAA__packshot {
        width: calc(var(--UNIT) * 56);
        margin: 24px 0
    }

    #STRATE_5 .Elixir-SIAA__block h2,
    #STRATE_5 .Elixir-SIAA__block p:first-of-type {
        margin-bottom: calc(var(--UNIT) * 5);
    }

    #STRATE_5_BLOCK {
        padding-top: 57px;
        padding-bottom: 87px;
    }

    #STRATE_5 .Elixir-SIAA__block {
        padding: 0 25px
    }
}

@media (min-width: 762px) {
    #STRATE_5_BG {
        transform: translate(9%, 8%) scale(1.18)
    }

    #STRATE_5 .Elixir-SIAA__title {
        margin-bottom: 8px;
    }

    #STRATE_5 .Elixir-SIAA__title+.Elixir-SIAA__text {
        margin-bottom: 10px;
    }
}

/********************************************/
#STRATE_6 > div:not(.sticky__marker) {
    flex-basis: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
}

#STRATE_6_BG {
    width: 100%;
    height: auto;
    object-fit: cover;
}

#STRATE_6 .Elixir-SIAA__packshot {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#STRATE_6 .Elixir-SIAA__packshot>img {
    display: block;
    width: 100%;
    height: auto;
}

#STRATE_6_MODALS {
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    width: 100%
}

.dp-modal__opener {
    display: flex;
    align-items: center;
    flex-direction: column;
    position: absolute;
}

.dp-modal__opener[data-modal="1"] {
    top: 16.5%;
    left: 15%;
}

.dp-modal__opener--icon {
    width: calc(var(--UNIT) * 48);
    height: calc(var(--UNIT) * 48);
}

.dp-modal__opener--txt {
    font-family: 'Roboto';
    font-weight: 500;
    font-size: calc(var(--UNIT) * 14);
    color: #fff;
    margin: calc(var(--UNIT) * 8) 0 0;
}

@media(max-width:761px) {
    #STRATE_6 {
        display: flex;
        flex-direction: column-reverse;
        height: auto;
    }

    #STRATE_6 .Elixir-SIAA__packshot {
        width: calc(var(--UNIT) * 73);
    }

    #STRATE_6 .Elixir-SIAA__block h2 {
        margin-bottom: calc(var(--UNIT) * 13);
    }

    #STRATE_6 .Elixir-SIAA__block p:first-of-type {
        margin-bottom: calc(var(--UNIT) * 5);
    }

    #STRATE_6_BLOCK {
        padding-top: 83px;
        padding-bottom: 87px;
    }

    #STRATE_6 .Elixir-SIAA__block {
        padding: 0 25px
    }

    #STRATE_6 .Elixir-SIAA__link {
        margin-top: 14px;
    }
}

@media (min-width: 762px) {
    #STRATE_6 {
        flex-direction: row-reverse
    }

    /*#STRATE_6_BG {
        transform: translate(9%, 8%) scale(1.18)
    }*/
    #STRATE_6 .Elixir-SIAA__title {
        margin-bottom: 8px;
    }

    #STRATE_6 .Elixir-SIAA__title+.Elixir-SIAA__text {
        margin-bottom: 10px;
    }

    #STRATE_6 .Elixir-SIAA__title,
    #STRATE_6 .Elixir-SIAA__text {
        max-width: calc(var(--UNIT) * 623)
    }
}

/********************************************/

#STRATE_7 > div:not(.sticky__marker) {
    flex-basis: 50%;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    overflow: hidden;
}

#STRATE_7_BG {
    width: 100%;
    height: auto;
    object-fit: cover;
}

@media(max-width:761px) {
    #STRATE_7 {
        display: flex;
        flex-direction: column-reverse;
        height: auto;
    }

    #STRATE_7 .Elixir-SIAA__block h2,
    #STRATE_7 .Elixir-SIAA__block p:first-of-type {
        margin-bottom: calc(var(--UNIT) * 25);
    }

    #STRATE_7 > div:first-child {
        padding: 0 25px;
        width: 100%
    }

    #STRATE_7_BLOCK {
        padding-top: 84px;
        padding-bottom: 35px;
    }

    #STRATE_7 .Elixir-SIAA__block {
        padding: 0 25px
    }
}

@media (min-width: 762px) {
    #STRATE_7 .Elixir-SIAA__block {
        padding-top: 16px;
    }

    #STRATE_7 .Elixir-SIAA__title {
        margin-bottom: 8px;
    }

    #STRATE_7 .Elixir-SIAA__title+.Elixir-SIAA__text {
        margin-bottom: 2px;
    }
}

/** ---- STRATE 8 ---- **/

#STRATE_8 { padding: 30px 25px 0; align-items: flex-start }
#STRATE_8_VIDEO { width: 100%; height: auto; display: block; object-fit: cover }

@media (max-width: 761px) {
    #STRATE_8 { height: auto }
}

@media (min-width: 762px) {
    #STRATE_8 { padding: 140px 0 0 }
    #STRATE_8_VIDEO { width: 68%; margin: 0 auto; transition: transform 1s ease-in-out }
    .in--viewport #STRATE_8_VIDEO { transform: scale(1.1) }
}

/********************************************/
#STRATE_9 {
    flex-direction: column;
    padding: 84px 0 108px;
    height: auto;
    justify-content: flex-start;
}

@media(max-width:761px) {
    #STRATE_9 img {
        width: 87%;
    }

    #STRATE_9 .Elixir-SIAA__cta {
        margin-top: calc(var(--UNIT) * 5);
        padding: 0 calc(var(--UNIT) * 38);
        height: calc(var(--UNIT) * 48);
        margin-bottom: calc(var(--UNIT) * 15);
    }
}

@media (min-width: 762px) {
    #STRATE_9 {
        padding: 95px 0 92px;
    }

    #STRATE_9_TITLE {
        width: 100%;
    }

    #STRATE_9 .Elixir-SIAA__title {
        max-width: 55%
    }

    #STRATE_9 .Elixir-SIAA__text {
        max-width: 43%
    }

    #STRATE_9 .Elixir-SIAA__cta {
        margin-top: calc(var(--UNIT) * 12);
        padding: 0 calc(var(--UNIT) * 52);
        font-size: calc(var(--UNIT) * 19);
        min-width: 0;
        height: calc(var(--UNIT) * 63);
        margin-bottom: calc(var(--UNIT) * -38);
        border-radius: calc(var(--UNIT) * 36);
    }

    #STRATE_9 img {
        width: 40%;
    }
}

/********************************************/
#STRATE_10 {
    flex-direction: column;
    background-color: #F6F6F6;
    justify-content: flex-start;
    padding: 69px 50px;
    height: auto;
}

#STRATE_10 .Elixir-SIAA__title {
    max-width: none;
    margin-bottom: 22px
}

@media(max-width:761px) {
    #STRATE_10 {
        padding: 45px 24px 45px 19px;
    }

    #STRATE_10 .Elixir-SIAA__title {
        margin-bottom: 17px;
        padding-left: 5px
    }
}

@media (min-width: 762px) {
    #STRATE_10 .Elixir-SIAA__block {
        max-width: 70%;
    }
}

/***********faq**********/
.dp-faq {
    margin: 0 auto;
    font-family: 'Roboto';
    width: 100%;
}

.dp-faq__item {
    display: block;
    border-bottom: 1px solid #EDEDED;
}

.dp-faq__question {
    margin: 0;
    font-size: calc(var(--UNIT) * 26);
    line-height: calc(82 / 26);
    font-weight: 400;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    padding: 20px 40px 4px 0;
    position: relative;
    box-sizing: border-box;
    cursor: pointer;
    outline: 0;
}

.dp-faq__question[aria-expanded="true"] {
    border-bottom: 1px solid transparent;
}

.dp-faq__question::after {
    content: "+";
    font-weight: 100;
    font-size: 34px;
    width: 34px;
    height: 34px;
    display: flex;
    position: absolute;
    right: -7px;
    top: calc(50% + 10px);
    transform: translateY(-50%);
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 3px;
}

.dp-faq__question[aria-expanded="true"]::after {
    content: "-";
    transform: translateY(-50%) scaleX(2);
}

.dp-faq__question:focus-visible::after {
    box-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 3px #fff;
}

.dp-faq__answer {
    padding: 0 4px 0;
    margin-bottom: 21px;
    font-size: calc(var(--UNIT) * 14);
    line-height: calc(20 / 14);
    display: block;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    box-sizing: border-box;
    text-align: left;
    overflow: hidden;
    transition: max-height ease-in-out 0.5s;
    font-weight: 300;
}

.dp-faq__answer[aria-hidden="true"] {
    visibility: hidden;
}

.dp-faq__answer p {
    margin: 0
}

@media (max-width: 761px) {
    .dp-faq__item {
        margin-bottom: 0;
    }

    .dp-faq__question {
        font-size: calc(var(--UNIT) * 18);
        line-height: calc(32 / 18);
        padding: 33px 33px 7px 9px
    }

    .dp-faq__answer {
        font-size: calc(var(--UNIT) * 14);
        line-height: calc(20 / 14);
        padding: 0 6px 15px;
        margin-bottom: 0
    }

    .dp-faq__answer p {
        margin: 20px 0;
    }
}

/****************** modal ***************/

#STRATE_6_MODALS_OVERLAY {
    background: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    width: 100%;
    z-index: 4;
    opacity: 0;
    transition: opacity .5s ease-in-out;
    visibility: hidden;
}

#STRATE_6_MODALS[data-modal-open] #STRATE_6_MODALS_OVERLAY {
    opacity: 1;
    visibility: visible
}

.dp-modal {
    opacity: 0;
    transition: opacity .5s ease-in-out;
    z-index: 5;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    visibility: hidden;
    width: 87%;
    background: #fff;
}

#STRATE_6_MODALS[data-modal-open] .dp-modal {
    opacity: 1;
    transition: opacity 1s ease-in-out;
    visibility: visible
}

.dp-modal-elt .dp-modal__content {
    display: none
}

.dp-modal__content p {
    margin: 1em 0
}

.dp-modal__wrapper {
    /*padding: 32px 31px 6px 24px*/
    padding: 25px 25px 6px 18px
}

.dp-modal__header {
    display: flex;
    justify-content: space-between;
    padding: 0;
    align-items: center
}

.dp-modal__title {
    display: block;
    font-family: 'Roboto';
    font-weight: 500;
    font-size: calc(var(--UNIT) * 14);
    line-height: calc(30 / 18);
}

.dp-modal__content {
    font-family: 'Roboto';
    font-weight: 300;
    font-size: calc(var(--UNIT) * 14);
    line-height: calc(30 / 18)
}

.dp-modal__close {
    border: 0;
    background: transparent;
    padding: 0;
}

.dp-modal__opener,
.dp-modal__close {
    cursor: pointer
}

.dp-modal-elt {
    position: absolute;
    z-index: 3
}

.dp-modal-elt[data-modal="1"] {
    top: 16.5%;
    left: 5%
}

.dp-modal-elt[data-modal="2"] {
    top: 12.5%;
    left: 63%
}

.dp-modal-elt[data-modal="3"] {
    top: 53%;
    left: 8%;
}

.dp-modal-elt[data-modal="4"] {
    top: 52%;
    left: 69%
}

.dp-modal-elt[data-modal="5"] {
    top: 78%;
    left: 37%
}

.dp-modal__opener--txt {
    white-space: nowrap;
}

@media (min-width: 762px) {
    .dp-modal {
        width: 40%
    }

    .dp-modal-elt[data-modal="1"] {
        top: 37.5%;
        left: 25%;
    }

    .dp-modal-elt[data-modal="2"] {
        top: 23.5%;
        left: 58.5%;
    }

    .dp-modal-elt[data-modal="3"] {
        top: 48.5%;
        left: 64%;
    }

    .dp-modal-elt[data-modal="4"] {
        top: 74.5%;
        left: 27%;
    }

    .dp-modal-elt[data-modal="5"] {
        top: 72%;
        left: 65%;
    }

    .dp-modal__opener--txt {
        font-size: calc(var(--UNIT) * 15);
        margin: calc(var(--UNIT) * 18) 0 0;
    }

    #STRATE_6 .Elixir-SIAA__packshot {
        transform: translate(-48%, -50%);
        width: 14%;
    }
}

/** ---- Animations ---- **/

@media (min-width: 762px) {
    [data-anim] {
        transition: opacity 1s ease-in-out, transform 1s ease-in-out
    }

    [data-anim].is--hidden {
        opacity: 0;
        transform: translateY(20px)
    }
}

/****** Mentions ********/
.Elixir-SIAA__mentions_wrapper.is--mobile {
    padding: 56px 20px 44px;
    text-align: center;
}

.Elixir-SIAA__mentions {
    font-family: 'Roboto';
    font-weight: 300;
    font-size: calc(var(--UNIT) * 12);
    line-height: calc(24/12);
    margin: 0 0 1em;
}

.Elixir-SIAA__mentions_wrapper.is--desktop {
    display: none
}

@media (min-width: 762px) {
    .Elixir-SIAA__mentions_wrapper.is--mobile {
        display: none
    }

    .Elixir-SIAA__mentions_wrapper.is--desktop {
        display: block;
        padding: calc(var(--UNIT) * 100) 0 calc(var(--UNIT) * 28);
        text-align: center;
    }
}

/** ---- Popin --- **/

.sp-core-modal-dialog { box-shadow: 0 .3125rem .4375rem 0 hsla(0,0%,75%,.5);
    background: #f5f5f5; border-radius: .3125rem; }
.sp-core-modal-dialog .sp-core-modal--notification .sp-core-modal-close {
    cursor: pointer; position: absolute; right: 1.5rem; top: 0; z-index: 2 }
.sp-core-modal-dialog .sp-popin-icon { position: absolute; top: -1.25rem;
    width: 2.5rem; height: 2.5rem; background: #5d8c82; z-index: 1;
    border-radius: 50%; display: flex; justify-content: center;
    align-items: center; }
.sp-core-modal-dialog .sp-icon--icon-check { fill: #fff; }
.sp-core-modal-dialog .sp-core-modal-content { width: 350px; }
.sp-core-modal-dialog .sp-popin-wrapper { display: flex; gap: .75rem; }
.sp-core-modal-dialog .sp-popin-infos-title { font-family: 'RobotoLight' }
.sp-core-modal-dialog .sp-price-xl { font-family: 'Roboto Bold', arial, sans-serif;
    font-size: .75rem }

/** ---- STRATE 8 - Version APAC ---- **/

#STRATE_8 { padding: 25px 25px 75px; margin-bottom: 40px; }
#STRATE_8_SLICK { width: 100% }
.slick-arrow { position: absolute; bottom: 0 }
.strate_8__slide { position: relative;}
.strate_8__media { position: relative; width: 100%; height: 0; 
    padding-bottom: calc(1024 / 768 * 100%); }
.strate_8__img { position: absolute; width: 100% }
.strate_8__content { position: absolute; bottom: 0;
    font-family: 'Roboto'; font-weight: 400; text-align: center;
    color: #fff; padding: 0 16px 14px; width: 100%; }
.strate_8__step {  font-size: calc(var(--UNIT) * 14); line-height: calc(20 / 14);
    letter-spacing: 1%; text-transform: uppercase; border: 2px solid #fff;
    display: inline-block; padding: 8px 25px; border-radius: 25px;
    margin-bottom: 26px; }
.strate_8__description { font-size: calc(var(--UNIT) * 12);
    line-height: calc(22 / 12) }

#STRATE_8 .slick-dots { position: absolute; bottom: -66px; left: 50%;
    transform: translateX(-50%); display: inline-flex; gap: 24px; }
#STRATE_8 .slick-dots li { display: inline-flex; height: 20px; font-size: 0; }
#STRATE_8 .slick-dots button { border: 2px solid #877046 !important;
  width: 12px; border-radius: 50%; height: 12px; }
#STRATE_8 .slick-active button { background: #877046; font-size: 0!important;
margin: 0 }

#STRATE_8 .slick-arrow { bottom: -74px; border: none; background-color: #877046;
  left: 50%;  width: 48px; height: 48px; }
#STRATE_8 .slick-disabled { visibility: visible }
#STRATE_8 .slick-next-custom { transform: translateX(69px); }
#STRATE_8 .slick-prev-custom { transform: translateX(-119px); }
#STRATE_8 .slick-next-custom:after {
    background: transparent url("data:image/svg+xml;utf8,<svg width='14' height='22' viewBox='0 0 14 22' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M1.04788 0.692251C1.34387 0.350601 1.86375 0.311035 2.20908 0.603878L13.1069 9.84558C13.8195 10.4499 13.8195 11.5493 13.1069 12.1536L2.20908 21.3953C1.86375 21.6882 1.34387 21.6486 1.04788 21.307C0.751891 20.9653 0.791882 20.451 1.1372 20.1581L11.2565 11.5766C11.6128 11.2745 11.6128 10.7248 11.2565 10.4226L1.1372 1.8411C0.791882 1.54826 0.751891 1.0339 1.04788 0.692251Z' fill='white'/></svg>") no-repeat center;
    height: 21px; width: 13.5px; position: absolute; top: 13px; left: 18px; }
#STRATE_8 .slick-prev-custom:after {
    background: transparent url("data:image/svg+xml;utf8,<svg width='14' height='22' viewBox='0 0 14 22' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M12.9521 21.3077C12.6561 21.6494 12.1362 21.689 11.7909 21.3961L0.893081 12.1544C0.18045 11.5501 0.18045 10.4507 0.893082 9.84636L11.7909 0.604664C12.1362 0.31182 12.6561 0.351385 12.9521 0.693036C13.2481 1.03469 13.2081 1.54904 12.8628 1.84189L2.74347 10.4234C2.38716 10.7255 2.38716 11.2752 2.74347 11.5774L12.8628 20.1589C13.2081 20.4517 13.2481 20.9661 12.9521 21.3077Z' fill='white'/></svg>") no-repeat center;
    height: 21px; width: 13.5px; position: absolute; top: 13px; left: 18px; }

@media (orientation: landscape) {
    #STRATE_8 { padding: 100px calc(var(--UNIT) * 227) 30px; margin-bottom: 3px;
        height: auto }
    .strate_8__media { padding-bottom: calc(823 / 1464 * 100%); }
    .strate_8__content { padding-bottom: 30px }
    .strate_8__step {  font-size: calc(var(--UNIT) * 12); line-height: calc(20 / 12);
        margin-bottom: 9px; padding: 6px 19px; }
    .strate_8__description { font-size: calc(var(--UNIT) * 18);
        line-height: calc(30 / 18) }

    .strate_8_prev_custom { top: 45%; left: calc(var(--UNIT) * 135); }
    .strate_8_next_custom { top: 45%; left: auto; right: calc(var(--UNIT) * 135); }
    #STRATE_8 .slick-dots { bottom: -30px; gap: 17px }
    #STRATE_8 .slick-dots li { height: calc(var(--UNIT) * 24) }
    #STRATE_8 .slick-dots button { width: calc(var(--UNIT) * 24); height: calc(var(--UNIT) * 24); }
    #STRATE_8 .slick-arrow { bottom: auto; top: 45% }
    #STRATE_8 .slick-prev-custom { left: 0; transform: translateX(-50%); z-index: 2; }
    #STRATE_8 .slick-next-custom { right: 0; transform: translateX(50%); left: auto; }
}