.OurServices a, .OurServices a:hover, .OurServices a:visited{
    color: white !important;
    text-decoration: underline;
}
.OurServices .services_kicker{
    color: #FF3300 !Important;
}
.OurServices .services_graph{
    position: relative;
    z-index: 2;
    margin-bottom: 13dvh;
}
.OurServices .services_graph_item{
    position: absolute;
}

.OurServices .container{ z-index: 10; position: relative; }

.OurServices .pentagrama{
    background-color: #451B17;
    height: 700px;
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
}

.OurServices .pentagrama .circle{
    background: url(../../assets/images/line-our-services.svg) center no-repeat;
    max-width: 508px;
    height: 508px;
    margin: 0 auto;
    background-size: cover;
    width: 100%;
    position: relative;
}

.OurServices .pentagrama .bodyCircle{
    max-width: 482px;
    width: 100%;
    height: 482px;
    border: 2px solid white;
    border-radius: 50%;
    margin: 39px auto 0;
    z-index: 2;
}

.OurServices .pentagrama .dot{
    position: absolute;
}

.OurServices .circle .circlePart {
    width: 230px;
    transform: translate(7px, -3px);
}

/*General styles dots and icons*/
.OurServices .bodyDot.active .thisLine{ stroke: #F30; fill: #451B17; }
.OurServices .bodyDot.active circle{ fill: #F30; }
.OurServices .circle .bodyDot.active .contenedor{ opacity: 1; transition: all .3s linear;}
.OurServices .circle .bodyDot{
    width: 74px;
    height: 74px;
    position: absolute;
}

.OurServices .circle .bodyDot svg{
    cursor: pointer;
}

.OurServices .contenedor {
    position: absolute;
    transform: translate(-50%, -50%);
    min-height: unset;
    border-radius: 5px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 411px;
    opacity: 0;
    transition: all .3s linear;
}

.OurServices .title {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    color: #FFFFF9;
    leading-trim: both;
    text-edge: cap;
    font-family: 'Manrope';
    font-size: clamp(16px, 10vw, 24px);
    font-style: normal;
    font-weight: 500;
    line-height: 34px;
    margin-bottom: 10px;
    word-break: break-word;
    text-wrap: balance;
}

.OurServices .contents {
    position: absolute;
    width: 90%;
    color: #FFFFF9;
    leading-trim: both;
    text-edge: cap;
    font-family: 'Manrope';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    margin-top: 10px;
    word-break: break-word;
    text-wrap: wrap;
}

/*Dots and containers*/
.OurServices .circle .bodyDot.dot1{ left: 73px; top: 49px; }
.OurServices .circle .bodyDot.dot1 .contents{ top: 2px; left: 0; }
.OurServices .circle .bodyDot.dot1 .contenedor{ top: -20%; left: -261%; }
.OurServices .circle .bodyDot.dot1 .linea{
    width: 100%;
    background: url(../../assets/images/left-line-values.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}

.OurServices .circle .bodyDot.dot2{ right: 70px; top: 52px; }
.OurServices .circle .bodyDot.dot2 .contents{ top: 7px; left: 100px; }
.OurServices .circle .bodyDot.dot2 .title{ padding-left: 100px; bottom: 48px;}
.OurServices .circle .bodyDot.dot2 .contenedor{ top: -20%; left: 300%; }
.OurServices .circle .bodyDot.dot2 .linea{
    width: 80%;
    background: url(../../assets/images/right-line-values.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}

.OurServices .circle .bodyDot.dot3{ right: -10px; bottom: 115px; }
.OurServices .circle .bodyDot.dot3 .contents{ top: 10px; left: 0; }
.OurServices .circle .bodyDot.dot3 .title{ padding-left: 100px; bottom: 5%;}
.OurServices .circle .bodyDot.dot3 .contents{ padding-left: 100px; top: 100%; }
.OurServices .circle .bodyDot.dot3 .contenedor{ top: 103%; left: 360%; }
.OurServices .circle .bodyDot.dot3 .linea{
    width: 100%;
    background: url(../../assets/images/down-line-values.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}

.OurServices .circle .bodyDot.dot4{ left: 42%; bottom: -49px; }
.OurServices .circle .bodyDot.dot4 .contents{
    top: 100%;
    left: 97px;
    background-color: #451B17;
    width: clamp(400px, 40vw,600px);
}
.OurServices .circle .bodyDot.dot4 .title{ left: 74%; bottom: 5%; background-color: #451B17; }
.OurServices .circle .bodyDot.dot4 .contenedor{ top: 120%; left: 320%; }
.OurServices .circle .bodyDot.dot4 .linea{
    width: 100%;
    background: url(../../assets/images/down-line-values.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}

.OurServices .circle .bodyDot.dot5{ left: -9px; bottom: 115px; }
.OurServices .circle .bodyDot.dot5 .title{ padding-right: 100px; bottom: 5%; left: 52%;}
.OurServices .circle .bodyDot.dot5 .contents{ padding-right: 100px; top: 100%; left: 2%;}
.OurServices .circle .bodyDot.dot5 .contenedor{ top: 125%; right: -235%; }
.OurServices .circle .bodyDot.dot5 .linea{
    width: 100%;
    background: url(../../assets/images/down-left-line.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}

.OurServices .pentagonInferior{
    min-width: 100%;
}

/*.OurServices .pentagonInferior .line{
    background: url(../../assets/images/gradient-line.svg) no-repeat;
    width: 100%;
    height: 250px;
    position: relative;
    background-size: contain;
}*/

.OurServices .pentagonInferior .dot{
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative;
    margin: 0 auto;
    width: 100%;
}

.OurServices .pentagonInferior .dot .contentTexts{
    display: flex;
    flex-direction: row;
    justify-content: center;
    transform: translate(55px, -1px);
}

.OurServices .pentagonInferior .dot .contentTexts .itemTitle{
    color: #FFFFF9;
    leading-trim: both;
    text-edge: cap;
    font-family: 'Manrope';
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    line-height: 34px;
    width: 246px;
    height: 100px;
    background: url(../../assets/images/line-up-services.svg) no-repeat;
    background-size: 100%;
}

.OurServices .pentagonInferior .dot .contentTexts .itemTitle * { transform: translateY(180%);}
.OurServices .pentagonInferior .dot.active .contentTexts .itemText{ opacity: 1; transition: all .3s linear; }
.OurServices .pentagonInferior .dot .contentTexts .itemText span{
    position: absolute;
    top: 15px;
}
.OurServices .pentagonInferior .dot .contentTexts .itemText{
    color: #FFFFF9;
    leading-trim: both;
    text-edge: cap;
    font-family: 'Manrope';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    width: clamp(225px, 40vw,355px);
    padding-left: 20px;
    display: flex;
    align-items: flex-end;
    opacity: 0;
    transition: all .3s linear;
    margin-top: 20px;
}

.OurServices .pentagonInferior .dot .thisDot{
    display: flex;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background: url(../../assets/images/gradient-line.svg) no-repeat;
    background-position: center;
    background-size: 100%;
}

.OurServices .pentagonInferior .dot .thisDot svg .thisLine{ fill: #451B17; }
/*Pizza slice*/
.OurServices .pentagrama .sliceMobile { display: none;}
.OurServices .pentagrama .sliceDesktop {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0 auto;
    transform: rotate(72deg);
    transform-origin: center;
}

.OurServices .circle .slice.sliceDesktop .sliceContent {
    background: url(../../assets/images/part-degradated.svg);
    width: 50%;
    height: 50%;
    background-position: bottom right;
    background-size: 100%;
}

.OurServices .services_title {
    color: #FFFFF9;
    font-family: "PT Serif";
    font-size: clamp(20px, 4vw,24px) !important;
    font-style: normal;
    font-weight: 400;
    line-height: 125% !important;
    padding-top: 27px;
}

.OurServices .services .services_kicker{
    color: #F30;
    font-family: 'Manrope';
    font-size: clamp(24px, 4vw,28px);
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
}

@media screen and (max-width: 1200px){
    .OurServices .contenedor { width: 300px; }
    .OurServices .circle .bodyDot.dot1 .title{ bottom: 46px; }
    .OurServices .circle .bodyDot.dot1 .contents{ top: 9px; }
    .OurServices .circle .bodyDot.dot1 .contenedor{ top: -20%; left: -177%; }
    .OurServices .circle .bodyDot.dot2 .contenedor{ top: -10%; left: 240%; }
    .OurServices .circle .bodyDot.dot2 .title{ padding-left: 0; left: 77%; bottom: 43px; }
    .OurServices .circle .bodyDot.dot2 .contents{ left: 80px; }
    .OurServices .circle .bodyDot.dot3 .contenedor{ top: 110%; left: 225%; width: 250px;}
    .OurServices .circle .bodyDot.dot3 .title{ padding-left: 40px; bottom: 11px; }
    .OurServices .circle .bodyDot.dot3 .contents{ padding-left: 40px; top: 44px;}
    .OurServices .circle .bodyDot.dot4 .contenedor{ top: 110%; left: 215%; width: 250px;}
    .OurServices .circle .bodyDot.dot4 .title{ left: 72%; bottom: 12px;}
    .OurServices .circle .bodyDot.dot4 .contents{ top: 44px; left: 53px;}
    .OurServices .circle .bodyDot.dot5 .contenedor{ top: 112%; left: -115%; width: 250px;}
    .OurServices .circle .bodyDot.dot5 .title{ left: 41%; bottom: 11px;padding: 0; width: 194px;}
    .OurServices .circle .bodyDot.dot5 .contents{ padding-right: 40px; left: 2%; top:44px;}

    /*Titulo superior*/
    .OurServices .services_col *{ margin-bottom: 30px; }
}

@media screen and (max-width: 1000px) {
    /* Configuración de elementos de la pentagrama */
    .OurServices .pentagrama {
        padding: 50px 0;
        height: fit-content;
    }

    .OurServices .pentagrama .sliceMobile {
        display: block;
    }

    .OurServices .pentagrama .sliceDesktop {
        display: none;
    }

    .OurServices .pentagrama .bodyCircle {
        max-width: 320px;
        height: 320px;
        margin: 0 auto;
    }

    .OurServices .pentagrama .circle {
        max-width: 320px;
        width: 100%;
        height: 320px;
        margin: 0 auto;
        position: relative;
        top: 10px;
        background-size: cover;
        background-position-y: -17px;
    }

    .OurServices .pentagrama .bodyDot {
        z-index: 10;
    }

    .OurServices .pentagrama .contenedor {
        z-index: 2;
    }

    /* Estilos para slice y sliceContent */
    .OurServices .circle .slice.sliceMobile {
        width: 340px;
        height: 340px;
        position: absolute;
        transform: rotate(360deg);
        transform-origin: center;
        opacity: 0;
        top: -11px;
        left: -10px;
    }

    .OurServices .circle .slice.sliceMobile .sliceContent {
        background: url(../../assets/images/part-degradated.svg);
        width: 170px;
        height: 170px;
        background-position: bottom;
        background-size: 100%;
        transform: scale(1.03);
    }

    .OurServices .circle .slice.sliceMobile .circlePart {
        display: none;
    }

    /* Estilos generales para los bodyDot */
    .OurServices .circle .bodyDot {
        width: 45px;
        height: 45px;
    }

    .OurServices .circle .bodyDot svg {
        width: 100%;
        height: 100%;
    }

    .OurServices .circle .bodyDot .linea {
        display: none;
    }

    .OurServices .circle .bodyDot .contenedor {
        width: clamp(170px, 20vw, 300px);
        height: clamp(170px, 20vw, 300px);
    }

    .OurServices .circle .bodyDot .contents {
        font-size: 10px;
        font-style: normal;
        font-weight: 400;
        line-height: 140%;
    }

    /* Posicionamiento específico de bodyDot */
    .OurServices .circle .bodyDot.dot1 .title{
        bottom: 90%;
    }

    .OurServices .circle .bodyDot.dot1 {
        left: 45px;
        top: 6px;
    }

    .OurServices .circle .bodyDot.dot1 .contenedor {
        left: 20px;
        top: 100px;
        padding-left: 5px;
    }

    .OurServices .circle .bodyDot.dot2 .contents{
        left: 0;
    }

    .OurServices .circle .bodyDot.dot2 .title{
        bottom: 90%;
        left: 50%;
    }

    .OurServices .circle .bodyDot.dot2 {
        right: 46px;
        top: 5px;
    }

    .OurServices .circle .bodyDot.dot2 .contenedor {
        left: 30px;
        top: 100px;
    }

    .OurServices .circle .bodyDot.dot3 {
        right: -11px;
        bottom: 82px;
    }

    .OurServices .circle .bodyDot.dot3 .title {
        bottom: unset;
        top: 0;
    }

    .OurServices .circle .bodyDot.dot3 .contenedor {
        left: 0px;
        top: 45px;
        width: 180px !important;
    }

    .OurServices .circle .bodyDot.dot3 .contents {
        bottom: 150px;
        top: 30px;
    }

    .OurServices .circle .bodyDot.dot4 {
        left: 42%;
        bottom: -21px;
    }

    .OurServices .circle .bodyDot.dot4 .contents {
        top: -9px;
        left: 0;
        background-color: transparent;
        width: 150px;
    }

    .OurServices .circle .bodyDot.dot4 .contenedor {
        left: 20px;
        top: 10px;
        width: clamp(170px, 20vw, 300px);
    }

    .OurServices .circle .bodyDot.dot4 .title {
        bottom: 100%;
        top: unset;
        left: 50%;
        background-color: transparent;
    }

    .OurServices .circle .bodyDot.dot5 {
        left: -11px;
        bottom: 83px;
    }

    .OurServices .circle .bodyDot.dot5 .contenedor {
        left: 71px;
        top: 100%;
        width: clamp(150px, 20vw, 300px);
    }

    .OurServices .circle .bodyDot.dot5 .title {
        width: 150px;
        bottom: 80%;
    }

    .OurServices .circle .bodyDot.dot5 .contents {
        top: 15%;
        left: -15%;
    }

    /* Estilos generales de títulos y contenido */
    .OurServices .title {
        border-bottom: 2px solid #F30;
        margin-bottom: 5px;
        padding: 0 0 5px 0 !important;
        font-size: 16px;
        font-style: normal;
        font-weight: 500;
        line-height: 24px;
    }

    .OurServices .contents {
        padding: 0 !important;
    }

    /* Sección de pentagonInferior */
    .OurServices .pentagonInferior {
        min-width: unset;
        width: 100%;
    }

    .OurServices .pentagonInferior .dot .thisDot svg {
        width: 45px;
        height: 45px;
    }

    .OurServices .pentagonInferior .dot {
        transform: translate(0%, -21%);
        width: 100%;
    }

    .OurServices .pentagonInferior .dot svg *{ fill: #FFFFF9; stroke: #FFFFF9; }
    .OurServices .pentagonInferior .dot.active svg *{ fill: #F30; stroke: #F30; }
    .OurServices .pentagonInferior .dot.active .contentTexts {
        opacity: 1;
    }

    .OurServices .pentagonInferior .dot .contentTexts {
        flex-direction: column;
        transform: unset;
        width: 80%;
        opacity: 0;
        align-self:flex-start;
    }

    .OurServices .pentagonInferior .dot .contentTexts .itemTitle {
        background: unset !important;
        height: fit-content;
        line-height: 1;
        padding-bottom: 10px;
        font-size: clamp(16px, 3vw, 24px);
        border-bottom: 2px solid #F30;
    }

    .OurServices .pentagonInferior .line {
        height: fit-content;
    }

    .OurServices .pentagonInferior .dot .contentTexts .itemText {
        padding: 0;
        font-size: clamp(10px, 2vw, 16px);
        margin-top: 10px;
        line-height: 140%;
        width: fit-content;
    }

    .OurServices .pentagonInferior .dot .contentTexts .itemTitle * {
        transform: unset;
    }

    /* Ocultar SVG en elementos activos */
    .OurServices .circle .bodyDot.active svg {
        opacity: 0;
    }

    /*Titulos*/
    .OurServices .services_col {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }

    .OurServices .services_title {
        width: 60%;
        max-width: clamp(400px, 50vw, 705px);
        margin-right: 0;
        border-top: 1px solid #FFFFF9;
        padding-top: 40px;
        font-size: 48px;
        line-height: 1.05;
    }
}

@media screen and (max-width:767px){
    /*Titulos*/
    .OurServices .services_col{ margin-bottom: unset; }
    .OurServices .services_kicker{ width: 100%; margin-bottom:20px; }
    .OurServices .services_kicker *{margin-bottom: 0;}

    .OurServices .services_col {
        width: 100%;
        position: relative;
        z-index: 1;
        display: block;
    }

    .OurServices .services_title {
        width: 100%;
        max-width: unset;
        margin-right: unset;
        border-top: unset;
        padding-top: unset;
        line-height: 1.05;
    }
}

@media screen and (max-width:375px){
    .OurServices .circle .bodyDot .contents {
        top: 15%;
    }

    .OurServices .pentagrama{ transform: scale(0.9); }
}

.OurServices .dot:not(.active) .thisDot svg circle{
    fill: white;
}
.OurServices .dot:not(.active) .thisDot svg .thisLine{
    stroke: white;
}

.OurServices .pentagonInferior .dot:not(.active) .itemTitle{
    background: url(../../assets/images/line-up-services-white.svg) no-repeat;
}

/***** 4 SERVICES *****/
@media (max-width: 1200px){
    .OurServices.four .circle .bodyDot.dot4 .contenedor {
        bottom: -70% !important;
        left: -145% !important;
        top: unset;
        right: unset;
    }
}
@media (max-width: 992px){
    .OurServices.four .pentagrama .bodyCircle {
        margin: 0 auto 0 !important;
    }
    .OurServices.four .circle .slice .sliceContent {
        width: 49.5%;
        height: 46.5%;
        background-size: 111% !important;
    }
    .OurServices.four .pentagrama .circle {
        background: url(../../assets/images/bg_test.svg) 50.5% 49.5% !important;
    }

    .OurServices.four .circle .bodyDot.dot1 {
        left: 9%;
        top: 7% !important;
        right: unset; bottom: unset;
    }
    .OurServices.four .circle .bodyDot.dot2 {
        right: 9%;
        top: 7% !important;
        left: unset; bottom: unset;
    }
    .OurServices.four .circle .bodyDot.dot3 {
        right: 9%;
        bottom: 7% !important;
        left: unset; top: unset;
    }
    .OurServices.four .circle .bodyDot.dot4 {
        left: 9%;
        bottom: 7% !important;
        right: unset; top: unset;
    }
    .OurServices.four .circle .bodyDot.dot3 .contenedor {
        left: 35px;
        top: 30px;
        width: 180px !important;
    }
    .OurServices.four .circle .bodyDot.dot4 .title {
        left: 42% !important;
        bottom: 5% !important;
        width: 80%;
    }
    .OurServices.four .circle .bodyDot.dot4 .contenedor {
        bottom: -20% !important;
        left: 50% !important;
        top: unset;
        right: unset;
    }
    .OurServices.four .circle .bodyDot.dot4 .contents {
        width: 150px !important;
    }
}

.OurServices.four .pentagrama .circle {
    background: url(../../assets/images/bg_test.svg) 51% 46%;
}
.OurServices.four .circle .slice .sliceContent.four {
    display: block;
}
.OurServices.four .circle .slice .sliceContent:not(.four) {
    display: none;
}
.OurServices:not(.four) .circle .slice .sliceContent.four {
    display: none;
}
.OurServices:not(.four) .circle .slice .sliceContent{
    display: block;
}
.OurServices.four .circle .circlePart {
    width: 100%;
    transform: translate(-2px, -2px) scale(1.01);
}
.OurServices.four .circle .slice .sliceContent {
    background: url(../../assets/images/ellipse_quadrant.svg) bottom right no-repeat;
    width: 49.5%;
    height: 49.5%;
    background-size: 111% !important;
}
.OurServices.four .circle .bodyDot.dot1 {
    left: 9%;
    top: 10%;
    right: unset; bottom: unset;
}
.OurServices.four .circle .bodyDot.dot2 {
    right: 9%;
    top: 10%;
    left: unset; bottom: unset;
}
.OurServices.four .circle .bodyDot.dot3 {
    right: 9%;
    bottom: 10%;
    left: unset; top: unset;
}
.OurServices.four .circle .bodyDot.dot4 {
    left: 9%;
    bottom: 10%;
    right: unset; top: unset;
}
.OurServices.four .pentagrama .bodyCircle {
    margin: 14px auto 0;
}
.OurServices.four .circle .bodyDot.dot4 .contenedor {
    bottom: -80%;
    left: -253%;
    top: unset;
    right: unset;
}
.OurServices.four .circle .bodyDot.dot4 .title {
    left: 42%;
    bottom: 5%;
    text-align: left;
    width: 80%;
}
.OurServices.four .circle .bodyDot.dot4 .linea{
    width: 100%;
    background: url(../../assets/images/down-left-line.svg) center no-repeat;
    height: 54px;
    background-size: 100%;
}
.OurServices.four .circle .bodyDot.dot4 .contents {
    top: 100%;
    left: 10px;
    width: clamp(400px, 40vw, 425px);
}