/* ========== ESCALADO UNIVERSAL ========== */


  /* Fix para Safari */
*{
    padding: 0;
    margin: 0;
}


body {
    margin: 0;
}



.main-wrapper{
    position: relative;
    overflow-x: hidden;
}

.navbar {
  position: fixed;
  width: 88.61em;
  height: 4.24em;
  top: 3.06em;
  left: 5.63em;
  display: flex;
  z-index: 100;
  transition:
    transform 0.5s cubic-bezier(0.77, 0, 0.175, 1),
    opacity 0.4s ease,
    top 0.3s ease,
    color 0.3s ease,
    text-shadow 0.3s ease;
  will-change: transform;
}

.navbar--glass {
  background: rgba(255, 255, 255, 0.12); /* más claro y neutro */
  backdrop-filter: blur(30px) saturate(160%);
  -webkit-backdrop-filter: blur(30px) saturate(160%);
  border: 1px solid rgba(255, 255, 255, 0.15); /* stroke sutil */
  box-shadow: inset 0 0 0.5em rgba(255, 255, 255, 0.1), 0 0.25em 1em rgba(0, 0, 0, 0.2); /* glow */
  border-radius: 0 0 1em 1em;

}


.navbar--hidden {
  transform: translateY(-200%);
  opacity: 0;
}

.navbar--show-fixed {
  top: 0 !important;
}

.navbar .logo {
  width: 6.6em;
  height: 4.24em;
  overflow: hidden;
  display: block;
}

.navbar .logo img {
  width: 100%;
  height: 100%;
}

.navbar .links-wrapper {
  width: 41.6em;
  height: 1.53em;
  margin-top: 1.81em;
  margin-left: 9.31em;
  display: flex;
  justify-content: space-between;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.navbar .links-wrapper a {
  font-family: 'Roboto', sans-serif;
  font-size: 1.25em;
  font-weight: 400;
  color: #365A5A;
  line-height: auto;
  letter-spacing: 1%;
  text-decoration: none;
  text-shadow: 0 0.05em 0.2em rgba(0, 0, 0, 0.4);
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.navbar .links-wrapper a:hover {
  color: #365A5A;
  text-decoration: underline;
}

.navbar .solo-link-wrapper {
  width: 6.39em;
  height: 2.92em;
  margin-top: 0.9em;
  margin-left: 24em;
  text-align: center;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.navbar .solo-link-wrapper a {
  font-family: 'Roboto', sans-serif;
  font-size: 1.25em;
  font-weight: 400;
  color: #365A5A;
  line-height: auto;
  letter-spacing: 1%;
  text-decoration: none;
  transition: color 0.3s ease, text-shadow 0.3s ease;
}

.navbar .solo-link-wrapper a:hover {
  color: #365A5A;
  text-decoration: underline;
}

/* === DARK MODE === */
.navbar--dark .links-wrapper a,
.navbar--dark .solo-link-wrapper a {
  color: #FCFEFB !important;
  text-shadow: 0 0.05em 0.2em rgba(0, 0, 0, 0.2);
}

.navbar-sensor {
  position: absolute;
  top: 0;
  width: 100%;
  height: 1px;
  pointer-events: none;
}




.hero{
    width: 100%;
    height: 67.01em;
    background-color: #EEFCEB;
    position: relative;
}

.hero .img-wrapper{
    position: absolute;
    z-index: 1;
    width: 85.76em;
    height: 59.79em;
    top: 3.96em;
    left: 8.33em;
}

.hero .img-wrapper img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.hero .text1{
    position: absolute;
    z-index: 10;
    width: 17.85em;
    height: 14.98em;
    top: 11.31em;
    left: 9.79em;
}

.hero .text1 p{
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 5.28em;
    font-weight: 600;
    color: #0E1717;
    text-align: right;
    line-height: 95%;
    letter-spacing: 1%;
}

.hero .text2{
    width: 19.17em;
    height: 7.07em;
    position: absolute;
    top: 26.99em;
    left: 8.68em;
    z-index: 2;
}

.hero .text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.94em;
    font-weight: 400;
    color: #936FE8;
    text-align: right;
    line-height: 120%;
    letter-spacing: 1%;
}

.valueProp{
    width: 100%;
    height: 76.25em;
    position: relative;
    top: -17.64em;
    z-index: 2;
    
}

.valueProp .triangle{
    width: 100%;
    height: 17.64em;
    background-color: #0E1717;
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.valueProp .content{
    width: 100%;
    height: 61.39em;
    background: linear-gradient(
    to bottom,
    #0E1717 0%,
    #132020 20%,
    #223838 60%,
    #365A5A 100%
    );
}

.valueProp .text1 {
    width: 45.56em;
    height: 7.78em;
    position: absolute;
    top: 12.01em;
    left: 40.97em;
    z-index: 3;
}

.valueProp .text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    text-align: right;
    line-height: 100%;
    letter-spacing: 1%;
}

.valueProp .text2 {
    width: 39.51em;
    height: 2.22em;
    position: absolute;
    top: 20.35em;
    left: 47.01em;
    z-index: 3;
}

.valueProp .text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #E4DBF9;
    text-align: right;
    line-height: 100%;
    letter-spacing: 1%;
}

.valueProp .text3 {
    width: 61.53em;
    height: 6.04em;
    position: absolute;
    top: 25.35em;
    left: 24.93em;
    z-index: 3;
}

.valueProp .text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    text-align: right;
    line-height: 120%;
    letter-spacing: 1%;
}

.valueProp .text3 p span{
    color: #1CDDA3;
}

.valueProp .imgcontainer{
    width: 69.43em;
    height: 49.38em;
    position: absolute;
    top: 32.43em;
    left: 17.01em;
    z-index: 3;
}

.valueProp .imgcontainer img{
    width: 100%;
    height: 100%;
}

.Section03{
    width: 100%;
    height: 132.43em;
    background-color: #EEFCEB;
    position: relative;
    top: -14.8em;
    z-index: 1;
}

.Section03 .imgcontainer1{
    width: 66.13em;
    height: 24.35em;
    position: absolute;
    top: 20.49em;
    left: 17.23em;
}

.Section03 .imgcontainer1 img{
    width: 100%;
    height: 100%;
}

.Section03 .text1{
    width: 70.28em;
    height: 19.44em;
    position: absolute;
    top: 40.35em;
    left: 50%;
    left: 14.86em;
}
.scroll-fade-sec03 {
  opacity: 0;
  transform: translateY(4em);
  transition: opacity 1s ease, transform 1s ease;
}

.scroll-fade-sec03.active {
  opacity: 1;
  transform: translateY(0);
}



.Section03 .text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #0E1717;
    text-align: center;
    line-height: 100%;
    letter-spacing: 1%;
}

.Section03 .text2{
    width: 54.93em;
    height: 3.89em;
    position: absolute;
    top: 71.88em;
    left: 22.57em;
    z-index: 3;
}

.Section03 .text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.88em;
    font-weight: 700;
    color: #0E1717;
    text-align: center;
    line-height: 100%;
    letter-spacing: 1%;
}

.Section03 .text3{
    width: 44.51em;
    height: 6.67em;
    position: absolute;
    top: 76.46em;
    left: 27.78em;
    z-index: 3;
}

.Section03 .text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #936FE8;
    text-align: center;
    line-height: 100%;
    letter-spacing: 1%;
}

.Section03 .imgcontainer2{
    width: 100em;
    height: 48.75em;
    position: absolute;
    top: 83.68em;
    z-index: 3;
    background-color: blue;
}

.Section03 .imgcontainer2 img{
    width: 100%;
    height: 100%;
}

.toolShowcase{
    width: 100%;
    height: 419.44em;
    background-color: #223838;
    position: relative;
    top: -14.8em;
    z-index: 2;
    overflow: hidden;
}

.toolShowcase .tool-scroller {
  width: 100%;
  height: 8.33em;
  background-color: #18020C;
  overflow: hidden;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.toolShowcase .tool-scroller::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(
    to right,
    rgba(24, 2, 12, 1) 0%,
    rgba(24, 2, 12, 0) 50%,
    rgba(24, 2, 12, 1) 100%
  );
}

.toolShowcase .tool-scroller-track {
  display: flex;
  flex-direction: row;
  gap: 5.35em;
  animation: scrollX 20s linear infinite;
  will-change: transform;
}

.toolShowcase .tool-scroller p {
  font-family: 'Roboto', sans-serif;
  font-size: 2.92em;
  font-weight: 400;
  color: #FCFEFB;
  line-height: 120%;
  letter-spacing: 1%;
  white-space: nowrap;
  margin: 0;
}

@keyframes scrollX {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.toolShowcase .fade1{
    width: 100%;
    height: 26.39em;
    background: linear-gradient(to bottom, rgba(24, 2, 12, 1) 0%, rgba(24, 2, 12, 0) 100%);
    position: absolute;
    z-index: 3;
    top: 8.33em;
}

.toolShowcase .fade2{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 10.83em;
    left: 44.44em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 100% 50%,
    rgba(24, 12, 2, 1) 0%,
    rgba(24, 12, 2, 0) 60%
    );
    clip-path: ellipse(100% 50% at 100% 50%);
    opacity: 0.7;
}

.toolShowcase .fade3{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 68.89em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 0% 50%,
    rgba(236, 243, 158, 1) 0%,
    rgba(236, 243, 158, 0) 60%
    );
    clip-path: ellipse(100% 50% at 0% 50%);
    opacity: 0.5;
}

.toolShowcase .fade4{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 107.5em;
    left: 44.44em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 100% 50%,
    rgba(24, 12, 2, 1) 0%,
    rgba(24, 12, 2, 0) 60%
    );
    clip-path: ellipse(100% 50% at 100% 50%);
    opacity: 0.7;
}

.toolShowcase .fade5{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 165.56em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 0% 50%,
    rgba(236, 243, 158, 1) 0%,
    rgba(236, 243, 158, 0) 60%
    );
    clip-path: ellipse(100% 50% at 0% 50%);
    opacity: 0.5;
}

.toolShowcase .fade6{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 244.58em;
    left: 44.44em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 100% 50%,
    rgba(24, 12, 2, 1) 0%,
    rgba(24, 12, 2, 0) 60%
    );
    clip-path: ellipse(100% 50% at 100% 50%);
    opacity: 0.7;
}

.toolShowcase .fade7{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 304.24em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 0% 50%,
    rgba(236, 243, 158, 1) 0%,
    rgba(236, 243, 158, 0) 60%
    );
    clip-path: ellipse(100% 50% at 0% 50%);
    opacity: 0.5;
}

.toolShowcase .fade8{
    width: 55.56em;
    height: 104.17em;
    position: absolute;
    top: 333.96em;
    left: 44.44em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 100% 50%,
    rgba(145, 108, 128, 1) 0%,
    rgba(145, 108, 128, 0) 60%
    );
    clip-path: ellipse(100% 50% at 100% 50%);
    opacity: 0.7;
}

.toolShowcase .fade9{
    width: 46.32em;
    height: 86.88em;
    position: absolute;
    top: 376.94em;
    z-index: 3;
    pointer-events: none;
    background: radial-gradient(
    circle at 50% 100%, 
  rgba(236, 243, 158, 1) 20%, 
  rgba(236, 243, 158, 0) 100%);
clip-path: ellipse(60% 100% at 50% 100%);
    opacity: 0.7;
    display: none;
}


.toolShowcase .hero-text1{
    width: 47.8em;
    height: 4.65em;
    position: absolute;
    z-index: 4;
    top: 12.5em;
    left: 26.18em;
}

.toolShowcase .hero-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .hero-text2{
    width: 35.63em;
    height: 4.44em;
    position: absolute;
    z-index: 4;
    top: 16.67em;
    left: 32.22em;
}

.toolShowcase .hero-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #E4DBF9;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .consultaPro-wrapper{
    width: 37.15em;
    height: 15.21em;
    position: absolute;
    z-index: 4;
    top: 35.95em;
    left: 6.46em;
}

.toolShowcase .consultaPro-wrapper .consulta-text1{
    width: 23.13em;
    height: 4.65em;
    position: absolute;
    z-index: 4;
    left: 14.03em;
}

.toolShowcase .consultaPro-wrapper .consulta-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}


.toolShowcase .consultaPro-wrapper .consulta-text2{
    width: 37.15em;
    height: 3.30em;
    position: absolute;
    z-index: 2;
    top: 3.8em;
}

.toolShowcase .consultaPro-wrapper .consulta-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    background: linear-gradient(to right, #FFFFFF 0%, #92C7B2 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .consultaPro-wrapper .consulta-text3{
    width: 25.55em;
    height: 4.03em;
    position: absolute;
    z-index: 4;
    top: 6.82em;
    left: 11.67em;
}

.toolShowcase .consultaPro-wrapper .consulta-text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .consultaPro-wrapper .consulta-text4{
    width: 35.80em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 13.19em;
    left: 1.39em;
}

.toolShowcase .consultaPro-wrapper .consulta-text4 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #ECF39E;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .consulta-imgWerapper{
    width: 45.76em;
    height: 36.53em;
    position: absolute;
    z-index: 4;
    top: 29.51em;
    left: 48.4em;
}

.toolShowcase .consulta-imgWerapper img{
    width: 100%;
    height: 100%;
}

.scroll-fade {
  opacity: 0;
  transform: translateY(4em);
  transition: opacity 1s ease, transform 1s ease;
}

.scroll-fade.active {
  opacity: 1;
  transform: translateY(0);
}



.toolShowcase .cartera-imgWerapper{
    width: 48.19em;
    height: 36.6em;
    position: absolute;
    z-index: 4;
    top: 77.36em;
    left: 3.54em;
}

.toolShowcase .cartera-imgWerapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .acertera-textWrapper{
    width: 36.88em;
    height: 15.21em;
    position: absolute;
    z-index: 4;
    top: 82.83em;
    left: 55.97em;
}

.toolShowcase .acertera-textWrapper .acertera-text1{
    width: 20.56em;
    height: 4.65em;
    position: absolute;
    z-index: 4;
}

.toolShowcase .acertera-textWrapper .acertera-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .acertera-textWrapper .acertera-text2{
    width: 36.85em;
    height: 2.22em;
    position: absolute;
    z-index: 4;
    top: 4.05em;
}

.toolShowcase .acertera-textWrapper .acertera-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    background: linear-gradient(to right, #FFFFFF 0%, #916C80 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 100%;
    letter-spacing: 1%;
}

.toolShowcase .acertera-textWrapper .acertera-text3{
    width: 28.9em;
    height: 4.03em;
    position: absolute;
    z-index: 4;
    top: 7.5em;
}

.toolShowcase .acertera-textWrapper .acertera-text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .acertera-textWrapper .acertera-text4{
    width: 35em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 13.19em;
}

.toolShowcase .acertera-textWrapper .acertera-text4 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #ECF39E;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .marca-textWrapper{
    width: 37.15em;
    height: 15.21em;
    position: absolute;
    z-index: 4;
    top: 131.16em;
    left: 7.01em;
}

.toolShowcase .marca-textWrapper .marca-text1{
    width: 18.96em;
    height: 4.65em;
    position: absolute;
    z-index: 4;
    left: 18.19em;
}

.toolShowcase .marca-textWrapper .marca-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .marca-textWrapper .marca-text2{
    width: 37.15em;
    height: 3.19em;
    position: absolute;
    z-index: 4;
    top: 3.77em;
}

.toolShowcase .marca-textWrapper .marca-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    background: linear-gradient(to right, #FFFFFF 0%, #92C7B2 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .marca-textWrapper .marca-text3{
    width: 35.69em;
    height: 4.03em;
    position: absolute;
    z-index: 4;
    top: 6.82em;
    left: 1.46em;
}

.toolShowcase .marca-textWrapper .marca-text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .marca-textWrapper .marca-text4{
    width: 25.5em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 13.19em;
    left: 11.7em;
}

.toolShowcase .marca-textWrapper .marca-text4 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #ECF39E;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
}

.toolShowcase .marca-imgWerapper{
    width: 45.76em;
    height: 36.53em;
    position: absolute;
    z-index: 4;
    top: 125.07em;
    left: 48.96em;
}

.toolShowcase .marca-imgWerapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .formacion-imgWerapper{
    width: 48.19em;
    height: 36.6em;
    position: absolute;
    z-index: 4;
    top: 172.71em;
    left: 3.26em;
}

.toolShowcase .formacion-imgWerapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .formacion-textWrapper{
    width: 39.38em;
    height: 15.21em;
    position: absolute;
    z-index: 4;
    top: 178.18em;
    left: 55.63em;
}

.toolShowcase .formacion-textWrapper .formacion-text1{
    width: 26.04em;
    height: 4.65em;
    position: absolute;
    z-index: 4;
}

.toolShowcase .formacion-textWrapper .formacion-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FFFFFF;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .formacion-textWrapper .formacion-text2{
    width: 39.31em;
    height: 2.22em;
    position: absolute;
    z-index: 4;
    top: 4.05em;
}

.toolShowcase .formacion-textWrapper .formacion-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    background: linear-gradient(to right, #FFFFFF 0%, #916C80 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 100%;
    letter-spacing: 1%;
}

.toolShowcase .formacion-textWrapper .formacion-text3{
    width: 33.6em;
    height: 4.03em;
    position: absolute;
    z-index: 4;
    top: 7.5em;
}

.toolShowcase .formacion-textWrapper .formacion-text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .formacion-textWrapper .formacion-text4{
    width: 25.95em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 13.19em;
}

.toolShowcase .formacion-textWrapper .formacion-text4 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #ECF39E;
    line-height: 120%;
    letter-spacing: 1%;
}

.toolShowcase .eco-text1{
    width: 80.97em;
    height: 9.31em;
    position: absolute;
    z-index: 4;
    top: 220.42em;
    left: 9.51em;
}

.toolShowcase .eco-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .eco-text2{
    width: 68.06em;
    height: 11.11em;
    position: absolute;
    z-index: 4;
    top: 230.21em;
    left: 15.97em;
}

.toolShowcase .eco-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.92em;
    font-weight: 400;
    color: #ECF39E;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .eco-text2 p span{
    color: #1CDEA4;
}

.toolShowcase .bullet1-icon{
    width: 3.47em;
    height: 3.47em;
    position: absolute;
    z-index: 4;
    top: 247.64em;
    left: 23.19em;
}

.toolShowcase .bullet1-icon img{
    width: 100%;
    height: 100%;
}

.toolShowcase .bullet1-text1{
    width: 20.14em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 252.99em;
    left: 15.49em;
}

.toolShowcase .bullet1-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .bullet1-text2{
    width: 20.14em;
    height: 6.04em;
    position: absolute;
    z-index: 4;
    top: 255.76em;
    left: 15.49em;
}

.toolShowcase .bullet1-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .bullet2-icon{
    width: 3.19em;
    height: 3.47em;
    position: absolute;
    z-index: 4;
    top: 247.64em;
    left: 48.82em;
}

.toolShowcase .bullet2-icon img{
    width: 100%;
    height: 100%;
}

.toolShowcase .bullet2-text1{
    width: 20.14em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 252.99em;
    left: 39.79em;
}

.toolShowcase .bullet2-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .bullet2-text2{
    width: 20.14em;
    height: 6.04em;
    position: absolute;
    z-index: 4;
    top: 255.76em;
    left: 39.93em;
}

.toolShowcase .bullet2-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .bullet3-icon{
    width: 3.06em;
    height: 3.47em;
    position: absolute;
    z-index: 4;
    top: 247.64em;
    left: 73.33em;
}

.toolShowcase .bullet3-icon img{
    width: 100%;
    height: 100%;
}

.toolShowcase .bullet3-text1{
    width: 20.14em;
    height: 2.01em;
    position: absolute;
    z-index: 4;
    top: 252.99em;
    left: 64.38em;
}

.toolShowcase .bullet3-text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.22em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 100%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .bullet3-text2{
    width: 20.14em;
    height: 6.04em;
    position: absolute;
    z-index: 4;
    top: 255.76em;
    left: 64.38em;
}

.toolShowcase .bullet3-text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: center;
}

.toolShowcase .group01-wrapper{
    width: 86.11em;
    height: 43.06em;
    position: absolute;
    z-index: 4;
    top: 272.22em;
    left: 7.57em;
}

.toolShowcase .group01-wrapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .group02-wrapper{
    width: 87.64em;
    height: 43.06em;
    position: absolute;
    z-index: 4;
    top: 320.14em;
    left: 6.81em;
}

.toolShowcase .group02-wrapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .quotes-wrapper{
    width: 10.66em;
    height: 8.43em;
    position: absolute;
    z-index: 4;
    top: 373.4em;
    left: 16.47em;
}

.toolShowcase .quotes-wrapper img{
    width: 100%;
    height: 100%;
}

.toolShowcase .testimonys-wrapper {
  width: 70.28em;
  height: 16.46em;
  position: absolute;
  top: 377.99em;
  left: 15.14em;
  z-index: 5;
}

.toolShowcase .testimony-1 {
  width: 70.28em;
  height: 12.29em;
  position: absolute;
  z-index: 5;
}

.toolShowcase .testimony-1 p {
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 2.92em;
  font-weight: 300;
  color: #1CDEA4;
  text-align: right;
  line-height: 1.4;
  letter-spacing: 1%;
  font-style: italic;
  opacity: 1;
  transition: opacity 0.5s ease;
}

.toolShowcase .testimony-1 p.fade-out {
  opacity: 0;
}

/* SUBRAYADO animado */
.toolShowcase .testimony-1 span {
  position: relative;
  display: inline;
  padding: 0 0.01em;
  z-index: 0;
}

.toolShowcase .testimony-1 span::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(14, 23, 23, 0.8);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.6s ease;
  z-index: -1;
}

.toolShowcase .testimony-1 p.animated span::before {
  transform: scaleX(1);
}

/* AUTOR */
.toolShowcase .testimony-2 {
  width: 70.28em;
  height: 2.99em;
  position: absolute;
  top: 13.47em;
  z-index: 5;
}

.toolShowcase .testimony-2 p {
  font-family: 'Roboto', sans-serif;
  font-size: 1.67em;
  font-weight: 400;
  color: #FCFEFB;
  line-height: 140%;
  letter-spacing: 1%;
  text-align: right;
  transition: opacity 0.5s ease;
}

.toolShowcase .testimony-2 p.fade-out {
  opacity: 0;
}


.toolShowcase .start-wrapper{
    width: 61.81em;
    height: 10em;
    position: absolute;
    z-index: 4;
    top: 408.26em;
    left: 29.79em;
}

.toolShowcase .start-wrapper p{
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 5.28em;
    font-weight: 600;
    color: #E3E3E3;
    text-align: right;
    line-height: 95%;
    letter-spacing: 1%;
    text-transform: uppercase;
}

.gaceta{
    width: 100%;
    height: 71.6em;
    position: relative;
    top: -33.47em;
    z-index: 5;
}

.gaceta .background{
    width: 100%;
    height: 53.13em;
    background-color: #E3E3E3;
    position: absolute;
    top: 18.68em; 
    z-index: 6;   
}

.gaceta .compu-imgwrapper{
    width: 70.42em;
    height: 71.81em;
    position: absolute;
    left: 8.06em;
    top: 0.1em;
    z-index: 7;   
}
.gaceta .compu-imgwrapper img{
    width: 100%;
    height: 100%;
}

.scroll-fade-gaceta {
  opacity: 0;
  transform: translateY(4em);
  transition: opacity 1s ease, transform 1s ease;
}

.scroll-fade-gaceta.active {
  opacity: 1;
  transform: translateY(0);
}


.gaceta .text1{
    width: 34.31em;
    height: 9.44em;
    position: absolute;
    top: 19.86em;
    left: 57.36em;
    z-index: 7;  
}

.gaceta .text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.94em;
    font-weight: 400;
    color: #365A5A;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
    text-transform: lowercase;
}

.gaceta .text2{
    width: 34.31em;
    height: 6.39em;
    position: absolute;
    top: 31.87em;
    left: 57.36em;
    z-index: 7;  
}

.gaceta .text2 a{
    text-decoration: none;
}

.gaceta .text2 a:hover{
    text-decoration: underline;
    color: #365A5A;
}

.gaceta .text2 a p{
    font-family: 'Roboto', sans-serif;
    font-size: 2.64em;
    font-weight: 400;
    color: #365A5A;
    line-height: 120%;
    letter-spacing: 1%;
    text-align: right;
    text-transform: uppercase;
}

.footer{
    width: 100%;
    height: 43.75em;
    background-color: #14040C;
    position: relative;
    top: -33.2em;
}

.footer .text1{
    width: 36.8em;
    height: 18.61em;
    position: absolute;
    top: 5.49em;
    left: 7.08em;
    z-index: 4;  
}

.footer .text1 p{
    font-family: 'Roboto', sans-serif;
    font-size: 3.89em;
    font-weight: 700;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
    text-transform: lowercase;
}

.footer .text2{
    width: 29.5em;
    height: 2.01em;
    position: absolute;
    top: 25em;
    left: 7.08em;
    z-index: 4;
}

.footer .text2 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #B594A2;
    line-height: 120%;
    letter-spacing: 1%;
}

.footer .compania-wrapper{
    width: 7.71em;
    height: 2.01em;
    position: absolute;
    top: 5.49em;
    left: 50em;
    z-index: 4;
}

.footer .compania-wrapper p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
}

.footer .compania-links-wrapper{
    width: 10.49em;
    height: 8.89em;
    position: absolute;
    top: 8.75em;
    left: 50em;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.footer .compania-links-wrapper a{
    font-family: 'Roboto', sans-serif;
    font-size: 1.11em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 200%;
    letter-spacing: 1%;
    text-decoration: none;
}

.footer .compania-links-wrapper a:hover{
    text-decoration: underline;
    color: #FCFEFB;
}

.footer .servicios-wrapper{
    width: 6.94em;
    height: 2.01em;
    position: absolute;
    top: 5.49em;
    left: 65.97em;
    z-index: 4;
}

.footer .servicios-wrapper p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
}

.footer .servicios-links-wrapper{
    width: 7.36em;
    height: 15.56em;
    position: absolute;
    top: 8.75em;
    left: 65.97em;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.footer .servicios-links-wrapper a{
    font-family: 'Roboto', sans-serif;
    font-size: 1.11em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 200%;
    letter-spacing: 1%;
    text-decoration: none;
}

.footer .servicios-links-wrapper a:hover{
    text-decoration: underline;
    color: #FCFEFB;
}

.footer .recursos-wrapper{
    width: 7.08em;
    height: 2.01em;
    position: absolute;
    top: 5.49em;
    left: 78.82em;
    z-index: 4;
}

.footer .recursos-wrapper p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.67em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 120%;
    letter-spacing: 1%;
}

.footer .recursos-links-wrapper{
    width: 10.76em;
    height: 8.89em;
    position: absolute;
    top: 8.75em;
    left: 78.82em;
    z-index: 4;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.footer .recursos-links-wrapper a{
    font-family: 'Roboto', sans-serif;
    font-size: 1.11em;
    font-weight: 400;
    color: #FCFEFB;
    line-height: 200%;
    letter-spacing: 1%;
    text-decoration: none;
}

.footer .recursos-links-wrapper a:hover{
    text-decoration: underline;
    color: #FCFEFB;
}

.footer .line{
    width: 85.42em;
    height: 0.07em;
    position: absolute;
    top: 29.86em;
    left: 7.22em;
    z-index: 4;
    background-color: #FCFEFB;
}

.footer .logo-wrapper{
    width: 10.42em;
    height: 5.04em;
    position: absolute;
    top: 32.5em;
    left: 7.08em;
    z-index: 4;
}

.footer .logo-wrapper img{
    width: 100%;
    height: 100%;
}

.footer .text3{
    width: 28.61em;
    height: 6.67em;
    position: absolute;
    top: 32.64em;
    left: 27.78em;
    z-index: 4;
}

.footer .text3 p{
    font-family: 'Roboto', sans-serif;
    font-size: 1.39em;
    font-weight: 400;
    color: #B594A2;
    line-height: 120%;
    letter-spacing: 1%;
}

.footer .in-wrapper{
    width: 2.5em;
    height: 2.5em;
    position: absolute;
    top: 31.94em;
    left: 85.56em;
    z-index: 4;
}

.footer .in-wrapper a{
    width: 100%;
    height: 100%;
}

.footer .in-wrapper a img{
    width: 100%;
    height: 100%;
}

.footer .ig-wrapper{
    width: 2.5em;
    height: 2.5em;
    position: absolute;
    top: 31.94em;
    left: 89.86em;
    z-index: 4;
}

.footer .ig-wrapper a{
    width: 100%;
    height: 100%;
}

.footer .ig-wrapper a img{
    width: 100%;
    height: 100%;
}