/* Generales */
* {
  box-sizing: border-box;
}
h3 {
  font-size: 1.2em;
}
h2, h4 {
  font-size: 2em;
}
p {
  font-size: 1em;
}
#pymes, #emprendedores, #empresas, #profesionales, #contacto {
  height: auto;
}
#pymes h2, .info-emprendedores h2, .info-emprendedores img, .info-empresas h2, .info-profesionales h2 {
  width: 100%;
  margin-bottom: 6vh;
}

/* HEADER */
header {
  padding: 0 6vw 0 2vw;
}
header img {
  width: 150px;
}
.nav-desktop {
  display: none;
}
.nav-desktop-mobile {
  display: flex;
  position: absolute;
  top: 0vh;
  left: 0;
  width: 100%;
  height: 70vh;
  padding-top: 15vh;
  background-color: var(--gris-claro);
  flex-direction: column;
  animation: mobileMenu .2s;
  z-index: 1;
}
.logo {
  z-index: 2;
}
@keyframes mobileMenu {
  from {
    height: 0;
  } to {
    height: 70vh;
  }
}
.nav-desktop-mobile ul {
  animation: opacity 1s;
  width: 100%;
  flex-direction: column;
  align-items: center;
}
@keyframes opacity {
  from {
    opacity: 0;
  } to {
    opacity: 1;
  }
}
.nav-desktop-mobile a {
  color: var(--oscuro);
}
.nav-desktop-mobile .contacto {
  animation: opacity 1s;
  color: var(--celeste);
}
.nav-mobile {
  display: block;
  width: 30px;
  align-self: center;
  position: relative;
  z-index: 2;
}
.nav-mobile span {
  display: block;
  width: 30px;
  height: 4px;
  margin: 5px auto;
  background-color: var(--celeste);
}
.primer-span {
  transform: rotate(45deg);
  transition: transform .5s ease-in;
  position: absolute;
  top: 0;
  left: 0;
}
.segundo-span {
  opacity: 0;
  transition: opacity .2s ease-in-out;
}
.tercer-span {
  transform: rotate(-45deg);
  transition: transform .5s ease-in;
  position: absolute;
  top: 0;
  left: 0;
}

/* INICIO */
#inicio {
  height: auto;
  background-image: url(../img/fondo-inicio-responsive.svg);
  background-size: cover;
}
.servicio-particular {
  width: 60%;
}
#presentacion {
  width: 95vw;
  height: 80vh;
  margin: 0 auto;
  padding-bottom: 30vh;
}
h1 {
  font-size: 2.5em;
}
#presentacion button {
    width: 12em;
    height: 4em;
    font-size: 1.2em;
}
#presentacion button:hover {
  border: none;
  background-color: none;
}
.servicios-titulo h5 {
  font-size: 1.5em;
  margin-bottom: 40px;
}
.servicios-titulo h6 {
  font-size: 1em;
}
.servicio-particular h3 {
  font-size: 1em;
  color: var(--blanco);
}
.servicio-particular p {
  color: var(--gris-claro);
  font-style: italic;
  font-size: 1em;
}
#servicios {
  flex-direction: column;
  padding-top: 90px;
  width: 95vw;
  height: auto;
  margin: 0 auto;
}
.servicios-titulo, .servicios-particulares {
  width: 100%;
}
.servicios-particulares {
  margin-bottom: 3vh;
}
.servicios-titulo h6, .servicios-titulo h5 {
  width: 90%;
}
.servicio-particular {
  width: 60%;
  margin: 15px auto;
}

/* PYMES */
#pymes {
  background-image: none;
}
.info-pymes, .seccion-pymes {
  width: 95vw;
}
.seccion-pymes div {
  width: 40vw;
  height: 48vw;
}

/* EMPRENDEDORES */
#emprendedores {
  flex-direction: column;
  width: 100vw;
  padding-bottom: 5vh;
}
.info-emprendedores, .seccion-emprendedores {
  width: 90%;
}
.seccion-emprendedores {
  height: 30vh;
}
.info-emprendedores img, .seccion-emprendedores img {
  width: 50px;
}
.seccion-emprendedores img {
  display: none;
}

/* EMPRESAS */
#empresas {
  background: none;
  width: 95vw;
  margin: 0 auto;
}
.info-empresas {
  width: 100%;
  margin: 0 auto;
}
.info-empresas h3, .info-empresas h2 {
  text-align: center;
}
.seccion-empresas {
  width: 100%;
  position: relative;
}
.factoring-empresas {
  height: 12vh;
}
.factoring-empresas p {
  padding-top: 2vh;
}
.sgr-empresas {
  flex-direction: column;
  justify-content: space-evenly;
  padding: 10% 0;
  height: 17vh;
}
.sgr-empresas p {
  width: 100%;
  padding-top: 0;
}
.sgr-empresas img {
  position: absolute;
  bottom: -20px;
  left: 46%;
  width: 40px;
}


/* PROFESIONALES */
#profesionales {
  justify-content: space-between;
}
.info-profesionales h2 {
  padding: 0 2%;
}
.seccion-profesionales {
  flex-direction: column;
  height: 65%;
}
.seccion-profesionales div {
  flex-direction: row;
  width: 80%;
  height: 10vh;
  margin: 2vh auto;
  position: relative;
  border-radius: 4px;
}
.seccion-profesionales p {
  font-size: 1em;
  padding: 21px 17% 0;
  line-height: 12v;
}
.seccion-profesionales img {
  width: 40px;
  position: absolute;
  bottom: 2vh;
  left: -5vw;
}
.seccion-profesionales-segunda img{
  left: inherit;
  right: -5vw;
  margin: 0;
}


/* CONTACTO */
#contacto {
  background-image: none;
  background-color: var(--blanco);
}
.contenedor-contacto {
  width: 95vw;
  margin-left: none;
}
.contenedor-contacto h4 {
  text-align: left;
  margin-bottom: 10vh;
}
.contacto-principal a, .contacto-principal p {
  font-size: 1.5em;
}
.contacto-principal .email::before {
  display: none;
}
.contacto-principal .email {
  padding-left: 0;
}
.contacto-principal p {
  margin-top: 6vh;
}

.locaciones address {
  width: 42%;
}
.locaciones a {
  font-size: 1.5em;
  margin-bottom: 3px;
}
.locaciones address p {
  font-size: 1.4em;
  color: var(--azul);
  margin: 0;
  margin-bottom: 5px;
}
.locaciones address p em {
  color: var(--celeste);
}
.locacion, .telefono {
  padding-left: 0;
}
.locacion::before, .telefono::before {
  display: none;
}
.whatsapp, .email {
  padding-left: 26px;
}
.locaciones address:last-child{
  display: flex;
  flex-direction: column;
}
@media (max-width: 320px) {
  #inicio {
    height: 220vh;
}
  .contacto-principal p {
    font-size: 1em;
}
}