:root {
  --color-principal: #3F3230;
  --color-secundario: #E25E3E;
  --color-claro: #F9F3EB ;
  --color-claro2: #FDFBF9;
  --fuente-texto: 'Inter', sans-serif;
  --fuente-alternativa: 'Raleway', sans-serif;

}

/* Clases extra */
.fondo-principal {
  background-color: var(--color-principal);
}

.fondo-claro {
  background-color: var(--color-claro);
}

.texto-principal {
  color: var(--color-principal);
}

.texto-secundario {
  color: var(--color-secundario);
}

.titulo-decorado span {
  padding-bottom: 15px;
  background: url(/assets/img/microsites/sociall_subrayado-simple.png) no-repeat bottom right;
}

/* Elementos */
.migas {
  background-color: var(--color-claro);
}

.btn {
  padding: 0.75rem 2.5rem !important;
  font-family: var(--fuente-alternativa);
  font-size: 1.125rem;
  font-weight: 600;
  border-color: var(--color-principal);
  border-width: 3px;
}

.btn:hover, 
.btn:focus {
  color: var(--color-claro) !important;
  background-color: var(--color-principal);
  border-color: var(--color-principal);
}

.btn--fondo {
  color: var(--color-principal) !important;
  background-color: var(--color-claro)  !important;
  border-color: var(--color-claro);
}

.btn--fondo:hover, 
.btn--fondo:focus {
  background-color: var(--color-secundario) !important;
  border-color: var(--color-secundario) !important;
}

/* Cabecera */
.header-microsite .nav-link {
  padding: 1rem;
  font-size: 1.25rem;
  color: var(--color-claro);
}

.header-microsite .nav-link:hover, 
.header-microsite .nav-link:focus, 
.header-microsite .nav-link:active {
  color: var(--color-secundario);
}

.header-microsite .navbar-toggler {
  background-color: var(--color-claro);
  border-radius: 10px;
  border-color: var(--color-claro);
}

.header-microsite .btn {
  border-color: var(--color-claro);
  border-width: 1px;
}

.header-microsite .btn:hover, 
.header-microsite  .btn:focus {
  color: var(--color-principal) !important;
  background-color: var(--color-claro);
  border-color: var(--color-claro);
}

/* Pie */
.footer-microsite {
  background-color: var(--color-principal);
}

.footer-microsite .nav-link {
  padding: 10px 0;
  font-size: 1rem;
  color: var(--color-claro);
}

.footer-microsite .nav-link:hover, 
.footer-microsite .nav-link:focus {
  color: var(--color-secundario);
  text-decoration: underline;
}


/* Bloques */
#hero {
  padding: 3rem 0;
}
@media (min-width: 1024px) {
  #hero {
    padding-top: 5rem;
  } 
}

.page-block h2 {
  color: var(--color-principal) !important;
}

.page-block p, 
.page-block li {
  font-family: var(--fuente-texto);
} 

.page-block__contenido ul li::marker {
  font-size: 2rem;
  color: var(--color-secundario);
}

#testimonios + section .btn {
  color: var(--color-claro);
  background-color: var(--color-principal);
}

#testimonios + section .btn:hover, 
#testimonios + section .btn:active {
  color: var(--color-principal) !important;
  background-color: var(--color-claro);
}

#como-funciona > .container {
  text-align: center;
}

#como-funciona .icono-texto, 
#tarjetas .icono-texto {
  height: 100%;
  padding: 3rem;
  background-color: var(--color-claro2);
  border-radius: 23px;
  box-shadow: -6px 9px 10.6px 0px rgba(0, 0, 0, 0.18);
}

#como-funciona .icono-texto__titulo,
#tarjetas .icono-texto__titulo {
  margin-bottom: 0;
}

#como-funciona .icono-texto__titulo *, 
#tarjetas .icono-texto__titulo *  {
  font-weight: 800;
}

#tarjetas .icono-texto__texto ul {
  text-align: left;
}

#impacto .icono-texto__texto .cifra {
  font-family: var(--fuente-alternativa);
  font-size: 3.5rem;
  line-height: 1;
  font-weight: 700;
}

@media (min-width: 992px) {
  #impacto {
    padding: 8rem 0 12rem;
  }

  #impacto > .container > .row {
    margin-top: 8rem;
  }

  #impacto:before {
    /*content: '';*/
    width: 100%;
    height: 100%;
    background: url(/assets/img/microsites/sociall_flechas.png) no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }

  #impacto .col:nth-child(1),
  #impacto .col:nth-child(2),
  #impacto .col:nth-child(3) {
    position: relative;
    overflow: visible;
  }

  #impacto .col:nth-child(1):before, 
  #impacto .col:nth-child(2):before,
  #impacto .col:nth-child(3):before {
    content: '';
    position: absolute;
    z-index: -1;
    background-size: contain;
  }

  #impacto .col:nth-child(1):before {
    width: 320px;
    height: 230px;
    background: url(/assets/img/microsites/sociall_flecha1.png) no-repeat;
    top: 30%;
    left: -30%;
   
  }

  #impacto .col:nth-child(2):before {
    width: 60px;
    height: 170px;
    background: url(/assets/img/microsites/sociall_flecha2.png) no-repeat;
    top: -90%;
    right: 20%;
  }

  #impacto .col:nth-child(3):before {
    width: 300px;
    height: 150px;
    background: url(/assets/img/microsites/sociall_flecha3.png) no-repeat;
    top: 90%;
    right: -40px;
  }
}


#planes + #planes {
  padding-top: 0;
}

#planes h2 {
  position: relative;
  overflow: visible;
  display: inline-block;
}

#planes h2:after {
  content: '';
  width: 90px;
  height: 30px;
  background: url(/assets/img/microsites/sociall_subrayado-curva.png) no-repeat;
  position: absolute;
  bottom: -20px;
  left: -20px;
  z-index: 1;
}

@media (min-width: 768px) {
  #planes .row-cols-md-2>* {
    width: 33.3333%;
  }

  #planes .col:nth-child(4) {
    margin-left: 16.66667%;
  }
}


#como-funciona-2 .botonera {
  position: relative;
  overflow: visible;
}

#como-funciona-2 .botonera:after {
  content: '';
  width: 100%;
  height: 100%;
  background: url(/assets/img/microsites/sociall_subrayado-rayado.png) no-repeat center;
  position: absolute;
  bottom: -50px;
  left: 0;
  z-index: 1;
}

#destacado {
/*background-color: var(-);*/
}

#destacado .block-cta--cortina:before {
  display: none;
}

/* Tarjetas */
.icono-texto--tarjeta {
  justify-items: center;
  background-color: var(--color-claro);
  border: none;
  border-radius: 23px;
  box-shadow: -6px 9px 10.6px 0px rgba(0, 0, 0, 0.18);
}

.icono-texto__texto {
  font-family: var(--fuente-texto);
}

.icono-texto__texto blockquote {
  margin-bottom: 3rem;
  font-family: var(--fuente-alternativa);
  font-weight: 600;
  font-size: 27px;
}

#planes .icono-texto--tarjeta, 
#planes-servicios .icono-texto--tarjeta {
  padding: 2rem 2rem 1rem;
  background-color: white;
}

#planes .icono-texto__texto, 
#planes-servicios .icono-texto__texto {
  text-align: center;
}

.icono-texto__imagen {
  background-color: transparent;
}

/* Logos */
.carousel-logos .slick-prev, 
.carousel-logos .slick-next {
  background-color: var(--color-principal);
}

.carousel-logos .slick-prev:hover:before, 
.carousel-logos .slick-prev:focus:before, 
.carousel-logos .slick-next:hover:before, 
.carousel-logos .slick-next:focus:before {
  color: var(--color-secundario);
}


/* Acordeones  */
.accordion-flush .accordion-item .accordion-button {
  font-size: 1.2rem;
  font-weight: 600;
}

.accordion-body {
  font-size: 1.1rem;
}