:root {
  /* Colores */
  --rojo-huella: #C41436;
  --rojo-huella-oscuro: #7A0C22;
  --gray: #797B80;
  --grayLight: #F6F6F7;
  --black: #000000;
  --white: #ffffff;
  --blackboard: #212121;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: "Space Grotesk", sans-serif;
  color: var(--ffffff);
}

*:before, :after{
  box-sizing: inherit;  
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--white);
  overflow-x: hidden;
  font-size: 16px;
}

a {
  text-decoration: none;
  color: var(--white);
  cursor: pointer;
}

a:focus,
a:active,
a:hover,
input[type="text"]:focus,
input[type="text"]:active,
input[type="date"]:focus,
input[type="date"]:active,
input[type="number"]:focus,
input[type="number"]:active,
input[type="submit"]:focus,
input[type="submit"]:active {
  text-decoration: none;
  outline: none;
}

li{
  /* list-style: none; */
  padding: 0;
  margin-bottom: 1.25em;
  font-size: 1.125em;
  line-height: 1.5em;
  list-style-image: url(./img/punto-lista.svg);
}

ul {
  margin-left: 1.25em;
  padding: 0;
}

.container {
  padding-left: 4.688em;
  padding-right: 4.688em;
}


/*-----------------------------------
1.1 Fuente
-----------------------------------*/
h1,h2,h3,h4,h5,h6{
  color: var(--black);
}

h1{
  font-size: 3.563em;
}

h3{
  font-size: 2.5em;
  color: var(--rojo-huella);
}

h4{
  font-size: 1.563em;
  color: var(--rojo-huella-oscuro);
  margin-bottom: 1.563em;
}

h5 {
  font-size: 1em;
  line-height: 1.313em;
  margin-top: 1.313em;
  margin-bottom: 0;
}

p{
  color: var(--black);
  font-size: 1.125em;
  line-height: 1.5em;
  margin: 0;
}

.color-fuente{
  color: var(--rojo-huella);
}

.fuente-bold{
  font-weight: bold;
}

::-webkit-scrollbar {
  width: 0.625em;
  opacity: 0;
}

::-webkit-scrollbar-thumb {
  background-color: var(--gray);
}

::-webkit-scrollbar-thumb:hover {
  background-color: var(--grayLight);
}
/*-----------------------------------
1.1 End Fuente
-----------------------------------*/

/*-----------------------------------
2 Grid
-----------------------------------*/
.col-2{
  display: flex;
}

/*-----------------------------------
2 END Grid
-----------------------------------*/

header{
  display: flex;
  justify-content: space-between;
  padding: 1.25em;
  background-color: var(--white);
  box-shadow: -1px 13px 9px -7px rgba(0,0,0,0.29);
  position: fixed;
  z-index: 3;
  width: 100%;
}

.cont-redes, .cont-logo{
  align-content: center;
}

.cont-secc1-intro, .cont-secc3-red, .cont-secc4-consultoria{
  position: relative;
  padding: 7.125em 0 3.125em 0;
  display: flex;
  justify-content: space-between;
}

.cont-secc1-intro{
  background-image: url(./img/fondo-formulario.jpg);
  background-repeat: no-repeat;
  background-size: 33em;
  background-position: right;
}

.cont-secc1-intro article{
  width: 50%;
}

.cont-secc1-text{
  margin-top: 1.125em;
  padding-right: 6.25em;

}

.cont-secc1-text p{
  font-size: 1.25em;
  font-weight: bold;
  margin-top: 1.25em;
  padding-right: 3.125em;
}

.img-fondo-form{
  position: absolute;
  top: 5em;
  right: 0;
  height: 100vh;
  z-index: -1;
}

/* formulario */
.cont-secc1-form{
  background-color: var(--blackboard);
  width: 33.75em;
  border-radius: 1.25em;
  margin-left: 2.25em;
  padding: 2.7em;
  margin-top: 1.875em;
}

.cont-secc1-form h2{
  color: var(--white);
  text-align: center;
  margin: 0 1.875em;
}

.cont-divisor-form{
  display: flex;
  align-items: center;
}

.cont-divisor-form{
  margin:1.25em 0;
}

.cont-divisor-form img{
  margin: 0 0.625em;
}

.divisor-form{
  background-color: var(--rojo-huella);
  width: 100%;
  height: 1px;
}

      .form-group {
        display: flex;
        align-items: center;
        margin-bottom: 0.938em;
      }
      .hsfc-Step__Content label {
        display: none!important;
      }
      .form-group input, .hsfc-Step__Content input {
        flex: 1!important;
        padding: 0.625em!important;
        border: none!important;
        border-bottom: 1px solid #ccc!important;
        background: none!important;
        color: var(--white)!important;
        border-radius: 0!important;
        font-family: "Space Grotesk", sans-serif!important;
        font-size: 14px!important;
      }
      .hsfc-Step__Content input:focus {
          box-shadow: none !important;
      }

      input::placeholder, .hsfc-Step__Content input::placeholder{
        color: var(--white)!important;
      }

      button, .hsfc-Button {
        width: 100%!important;
        padding: 0.75em!important;
        background-color: var(--rojo-huella)!important;
        color: white!important;
        font-size: 1em!important;
        border: none!important;
        border-radius: 1.25em!important;
        cursor: pointer!important;
        margin-top: 1.25em!important;
        font-family: "Space Grotesk", sans-serif!important;
      }
      button:hover, .hsfc-Button:hover {
        background-color: var(--rojo-huella-oscuro)!important;
      }
      


/* FIn formulario */


.cont-secc2-servicios{
  background-color: var(--grayLight);
  padding-top: 3.125em;
  padding-bottom: 3.125em;
  border-radius: 0 0 1.25em 1.25em;
}

.cont-secc2-servicios h2{
  text-align: center;
  font-size: 3.563em;
  margin-bottom: 1.125em;
}

.cont-secc2-servicios img{
  width: 31.25em;
  margin-right: 12.5em;
}

.img-academia-mobile{
  display: none;
}

.cont-secc2-servicios-text{
  align-content: center;
}

.cont-secc3-red{
  padding-top: 6.25em;
}

.img-red-mobile{
  display: none;
}

.img-red{
  width: 32.5em;
  margin-left: 12.5em;
}

.img-fondo-huella-1{
  position: absolute;
  top: 1.875em;
  right: 0;
  z-index: -1;
  width: 25em;
}

.cont-secc4-consultoria{
  margin-top: 2.188em;
  padding-top: 6.25em;
  padding-bottom: 7.5em;
  background-color: var(--grayLight);
  background-image: url(./img/fondo-huella-2.png);
  background-repeat: no-repeat;
  background-size: 25em;
  background-position: bottom left;
  border-radius: 1.25em 1.25em 0 0;
}

.img-consultoria{
  width: 31.25em;
  margin-right: 12.5em;
}

.img-consultoria-mobile{
  display: none;
}

.img-fondo-huella-2{
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  width: 25em;
}

.btn-oferta{
  position: absolute;
  bottom: 2.188em;
  margin: 0 37.5%;
  background-color: var(--rojo-huella);
  width: 25%;
  padding: 0.625em 0;
  text-align: center;
  border-radius: 1.25em;
  z-index: 2;
}

.btn-oferta:hover{
  background-color: var(--rojo-huella-oscuro);
}

.cont-secc5-iconos{
  background-image: url(./img/fondo-textura.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 1.25em;
  padding: 50px 0 50px 0;
}

.cont-secc5-iconos h2{
  color: var(--white);
  text-align: center;
  margin: 0 400px 30px 400px;
  font-size: 1.875em;
}

.cont-secc5-ico-text{
  width: 33%;
  padding: 0 1.875em;
  margin: 1.25em 0;
}

.divisor-iconos{
  margin: 1.25em 0;
  background-color: var(--rojo-huella);
  width: 2.688em;
  height: 3px;
}

.cont-secc5-iconos div p{
  color: var(--white);
}

.cont-secc6-frase h2{
  color: var(--rojo-huella);
  font-size: 1.875em;
  text-align: center;
  margin: 50px 0;
}

footer{
  background-color: var(--black);
  border-top: 2px var(--rojo-huella) solid;
  padding: 1.875em 0;
}

footer p{
  text-align: center;
  color: var(--white);
}

/*ajustes de estilos para formulario hb*/
.hsfc-Step__Content {
    padding: 0 !important;
}
[data-hsfc-id=Renderer] .hsfc-Row {
    display: flex!important;
    gap: 1px!important;
        margin-bottom: 0.938em!important;
}

.hsfc-TextField, .hsfc-PhoneField, .hsfc-EmailField, .hsfc-DropdownField {
    flex-grow: 1!important;
}
[data-hsfc-id=Renderer] .hsfc-NavigationRow {
  margin-top: 0!important;
}
[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__FlagAndCaret {
    background: transparent;
    color: #fff;
    border: none!important;
}

[data-hsfc-id=Renderer] .hsfc-PhoneInput__FlagAndCaret__Caret, [data-hsfc-id=Renderer] .hsfc-DropdownInput__Caret>span {
    border-top: 6px solid #fff!important;
}
[data-hsfc-id=Renderer] .hsfc-Step .hsfc-Step__Content>:last-child {
    justify-content: center!important;
    text-align: center!important;
}
[data-hsfc-id=Renderer] .hsfc-RichText{
  color: #fff!important;
}
[data-hsfc-id=Renderer] .hsfc-PhoneInput:not(.hsfc-PhoneInput--rtl) .hsfc-PhoneInput__FlagAndCaret {
    border-radius: 0 !important;
    border-bottom: 1px solid #ccc !important;
    margin-left: 4px !important;
}
.hsfc-DropdownOptions__Search .hsfc-TextInput {
    color: #000!important;
}
/**/

@media (max-width: 1199.98px){
  body{
    font-size: 14px;
  }
}

@media (max-width: 1024px) {
body{
  font-size: 14px;
}

h1 {
    font-size: 3em;
}

.img-fondo-form {
    height: 90vh;
}

.cont-secc1-form {
    margin-left: 0;
}

.cont-secc2-servicios h2 {
    font-size: 3em;
}

.cont-secc2-servicios img {
    margin-right: 2.5em;
}
.img-red {
    width: 29.5em;
    margin-left: 2.5em;
}
.img-consultoria {
    width: 28.25em;
    margin-right: 3.5em;
}

.cont-secc5-iconos h2 {
    margin: 0 100px 30px 100px;
}
}

@media (max-width: 991.98px) {
.container {
  padding-left: 2.688em;
  padding-right: 2.688em;
}

  h1{
    font-size: 2.563em;
  }

  .cont-secc1-form {
  width: 32.75em;
  margin-left: -1.75em;
  padding: 2.1em;
}

.cont-secc2-servicios h2 {
  font-size: 2.563em;
}

.cont-secc2-servicios img {
  width: 26.25em;
  margin-right: 3.5em;
}

.img-red {
  width: 26.5em;
  margin-left: 3.5em;
  margin-top: 3.125em;
}

.img-fondo-huella-1 {
  top: 4.875em;
}

.img-consultoria {
  width: 26.25em;
  margin-right: 4.5em;
}

.btn-oferta {
  margin: 0 33%;
  width: 33%;
}

.cont-secc5-iconos h2 {
  margin: 0 200px 30px 200px;
}

}

@media (max-width: 850px) {
body{
  font-size: 12px;
}

.container {
  padding-left: 1em;
  padding-right: 1em;
}

.cont-secc1-form {
    width: 31.75em;
    margin-left: -4.75em;
  }

.img-fondo-form {
  height: 80vh;
}

.cont-secc4-consultoria {
  background-size: 23em;
}

.cont-secc5-iconos h2 {
  margin: 0 150px 30px 150px;
  }
.cont-secc5-ico-text {
  padding: 0 0.875em;
}
}

@media (max-width: 767.98px) {
.cont-secc5-ico-text img{
  width: 32px;
}
}

@media (max-width: 575.98px) {
 body {
    font-size: 14px;
  }

.container {
    padding-left: 2em;
    padding-right: 2em;
  }

  .col-2 {
  flex-direction: column;
  align-items: center;
}

.cont-secc1-intro{
  background-image: url(./img/fondo-mobile.jpg);
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: contain;
}  

.cont-secc1-text {
  margin-top: 1.125em;
  padding-right: 0;
}

.cont-secc1-intro article {
  width: 100%;
}

.cont-secc1-text p {
  padding-right: 0;
}

.cont-secc1-form {
    width: 100%;
    margin-left: 0;
    margin-top: 4.063em;
    margin-bottom: 2em;
  }

.cont-secc1-form h2 {
  margin: 0px 0.875em;
}

 .img-fondo-form{
  display: none;
 } 

 .cont-secc2-servicios {
  padding-top: 0;
  padding-bottom: 1.125em;
}

 .cont-secc2-servicios h2 {
    padding-top: 1em;
  }

  .cont-secc2-servicios img {
    width: 80%;
    margin-right: 0;
  }

 .img-academia-mobile{
  display: flex;
  margin-bottom: 2.5em;
  justify-content: center;
}

 .img-academia-pc{
  display: none;
}

.cont-img-red-mobile{
  display: flex;
  justify-content: center;
  margin-bottom: 4em;
}

.img-red-mobile{
  display: flex;
  width: 80%;
}

.img-red {
 display: none;
}

.img-fondo-huella-1 {
  width: 50%;
  top: 12.875em;
}

.img-consultoria{
  display: none;
}

.cont-img-consultoria-mobile{
  display: flex;
  justify-content: center;
  margin-bottom: 4em;
}

.img-consultoria-mobile{
  display: flex;
  width: 80%;
}

.cont-secc4-consultoria {
  background-size: 45%;
  background-position: left;
}

.btn-oferta {
    margin: 0 5%;
    width: 90%;
  }

.cont-secc5-iconos h2 {
  margin: 0 10px 30px 10px;
  }

.cont-secc5-ico-text {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cont-secc5-ico-text p{
text-align: center;
}

.cont-secc6-frase h2 {
  margin: 30px 10px;
}

}
