.success-stories-component{ padding: 0; margin-top: -40px; z-index: 20; position: relative; }

.success-stories-component .content{ position: relative; max-width: 100%; }

.success-stories-component .success-stories-carrousel{}
.success-stories-component .success-stories-carrousel .success-cases-list{ position: relative; overflow: hidden; border-radius: 40px; }
.success-stories-component .success-stories-carrousel .success-cases-list:before{ content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: var(--white); z-index: 1; border-radius: 41px; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper{ height: auto; color: var(--black); width: 100%; max-width: 100%; overflow: hidden; position: relative; z-index: 10; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content { display: flex; justify-content: space-between; flex-direction: row-reverse; align-items: center; max-width: 1160px; margin: 0 auto; padding: 100px 0 120px; position: relative; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .main-image{ width: 550px; min-width: 550px; height: 610px; overflow: hidden; border-radius: 20px; position: relative; z-index: 10; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .main-image img{ width: 100%; height: 100%; object-fit: cover; object-position: center center; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text{ width: 520px; min-width: 520px; position: relative; z-index: 1000; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .subtitle{ text-transform: uppercase; margin-bottom: 15px; font-size: 15px; font-weight: 500; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .title{ font-size: 36px; margin-bottom: 20px; font-weight: 600; letter-spacing: -1px; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .title span{ display: block; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .small-title{ font-weight: 500; margin-top: 20px; background: var(--black); color: var(--white); padding: 5px 13px; display: inline-block; border-radius: 30px; font-size: 15px; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .description{ line-height: 1.6; font-weight: 300; font-size: 16px; margin-bottom: 10px; }

.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .item-list{ list-style-type: disc; padding-left: 30px; margin-bottom: 30px; margin-top: 15px; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .item-list li{ color: var(--black); line-height: 1.4; font-weight: 400; font-size: 15px; margin-bottom: 10px; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .item-list li strong{ font-weight: bold; }

.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .pills{ display: flex; flex-wrap: wrap; margin: 30px 0; }
.success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .pills li{ background: var(--black); color: var(--white); border-radius: 40px; padding: 5px 12px; font-size: 14px; white-space: nowrap; margin: 0 10px 10px 0; font-weight: 400; }


/* Arrows */
.success-stories-component .carrousel-arrows{ display: flex; position: absolute; z-index: 10; left: 50%; margin-left: -580px; width: 1160px; bottom: 40px; }
.success-stories-component.white-carousel-arrows .carrousel-arrows .carrousel-arrow:before{ color: var(--white); }

    /* Avant */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.avant-case{ background: #2859F6; color: var(--white); }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.avant-case .case-content .bg-pattern{ width: 1200px; height: 780px; background: url("../../img/studios/data/avant-pattern.png"); background-size: 1200px 780px; position: absolute; bottom: -210px; left: -440px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.avant-case .case-content .bg-triangle{ width: 400px; height: 337px; background: url("../../img/cases/avant/bg-avant-right.svg"); background-size: 400px 337px; position: absolute; bottom: -20px; right: -180px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.avant-case .case-content .text .pills li{ background: var(--white); color: #2859F6; }

    /* OnePay */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.one-case{ background: var(--white); }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.one-case .case-content .text .pills li{ background: #6EC1FF; color: #1C1C1E; }

    /* Experian */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.experian-case{ background: var(--white); }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.experian-case .case-content .text .pills li{ background: #692777; }

    /* LandId */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.landid-case{ background: #f6f4f3 url("../../img/studios/sre/bg-landid.jpg"); background-size: cover; }

    /* Tpago */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.tpago-case{ background: #f1f6ff; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.tpago-case .case-content .text .pills li{ background: #203c89; }

    /* Liongard */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.liongard-case .case-content .text .pills li{ background: var(--black); color: #d6ab37 ; }
    
    /* Spruce */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.spruce-case .case-content .text .pills li{ background: #3A6155; color: var(--white); }
    
    /* Wellsite Navigator */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.wellsite-case .case-content .text .pills li{ background: #FEC257; color: var(--black); }

    /* Quantum */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.quantum-case .case-content .text .pills li{ background: var(--black); color: var(--white); }

    /* Exo */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.exo-case .case-content .text .pills li{ background: #1d1b1e; color: var(--white); }
    
    /* Harvard */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.harvard-case{ background: #F9FBFF; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.harvard-case .case-content .text .pills li{ background: #92272D; color: var(--white); }

    /* IncomeLab */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.incomelab-case{ background: var(--white) url("../../img/studios/sre/bg-income.png"); background-size: cover; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.incomelab-case .case-content .text .pills li{ background: #f69931; }
    
    /* UxWealth */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.uxwealth-case{ background: #f6f4f3 url("../../img/studios/sre/bg-landid.jpg"); background-size: cover; }

    /* Stride */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.stride-case .case-content .text .pills li{ background: #561DE2; }

    /* Tabula Rasa */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.tabula-rasa-case .case-content .text .pills li{ background: #79a24b; }

    /* Catapult */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.catapult-case .case-content .text .pills li{ background: #ddebf6; color: #24355c; }

    /* YouScience */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.youscience-case{ background: #e8f5f5; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.youscience-case .case-content .text .pills li{ background: #C15AB3; }

    /* Centr */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.centr-case{}
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.centr-case .case-content .text .pills li{ background: var(--black); }

    /* Digital Optometrics */
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.digital-optometrics-case{}
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper.digital-optometrics-case .case-content .text .pills li{ background: #245DA9; }


@media screen and (max-width: 1280px){

    .success-stories-component .content{ padding: 0; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content{ padding: 80px 20px 130px; height: 100%; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .main-image{ width: 40%; min-width: 40%; height: auto; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text{ width: 55%; min-width: 55%; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .subtitle{ font-size: 15px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .title{ font-size: 30px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .title span{ display: inline; } 
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .description{ font-size: 15px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .item-list li{ font-size: 15px; }

    .success-stories-component .carrousel-arrows{ left: 50%; width: 100%; bottom: 40px; padding: 0 20px; margin: 0 auto; max-width: 1160px; transform: translateX(-50%); }

}

@media screen and (max-width: 1024px){

    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content{ flex-direction: column; justify-content: flex-start; padding: 50px 20px 110px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .main-image{ width: 100%; min-width: 100%; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text{ width: 100%; min-width: 100%; margin-top: 30px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .subtitle{ font-size: 12px; margin-bottom: 15px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .title{ font-size: 26px; margin-bottom: 20px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .description{ font-size: 14px; margin-bottom: 20px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .item-list li{ font-size: 14px; }
    .success-stories-component .success-stories-carrousel .success-cases-list .case-content-wrapper .case-content .text .pills li{ padding: 4px 10px; font-size: 14px; }

}