/* 
* Estilos generales
* ------------------
*/
:root {
  /* Colores */
  --bg-primary-color: #fbf8ef;
  --white-color: #ffffff;
  --black-color: #000000;
  --grey-dark: #575756;
  --soft-grey: #98BCB6;
  --color-numbers: #906E74;
  --ligh: #D7BA62;
  /* Margin entre secciones */
  --margin__lg: 80px 0;
  --margin__md: 60px 0;
  --margin__xl: 120px 0;
  --p: 1rem;
  /* Fuentes */
  --primary-font: 'Montserrat-Regular', sans-serif;
  --primary-font-bold: 'Montserrat-Bold', sans-serif;
  --primary-font-medium: 'Montserrat-Medium', sans-serif;
  --primary-font-semibold: 'Montserrat-SemiBold', sans-serif;
  --primary-font-thin: 'Montserrat-Thin', sans-serif;
  --primary-font-light: 'Montserrat-LightItalic', sans-serif;
  --secondary-font: 'Roboto-Regular', sans-serif;
  --tercera-font: 'Helvetica', sans-serif;
  /* Font Sizes */
  --h1: 3.75rem; /* Titular de cabecera - 60px */
  --h2: 48px; /* Título primera sección - 48px */
  --h3: 2.5rem; /* Títulos - 40px */
  --h4: 2rem; /* Títulos - 40px */
  --p: 1rem; /* Párrafos - 16px */
  --font-xxl: 8.75rem; /* 70px */
  --font-lg: 24px; /* 24px */
  --font-md: 20px; /* 20px */
  --font-xs: 0.875rem; /* 14px */
  --font-xxs: 0.675rem;
}

.container .row{
  flex-wrap: nowrap;
}
p::selection,
h1::selection,
h2::selection,
h3::selection,
h4::selection,
h5::selection,
h6::selection,
span::selection,
li::selection,
strong::selection {
  background-color: var(--bg-primary-color);
}

.pad{
  padding: 120px 30px;
}


.grays{
  color: #575756;
}
.image img{
  width: 100%;
}

section,main{
  padding: 0px 30px;
}

a {
  color: inherit;
  text-decoration: none;
}

.subs{
  font-family: var(--primary-font);
  color: var(--color-numbers);
  text-transform: uppercase;
  padding-bottom: 10px;
  display: block;
  letter-spacing: 1.6px;
  font-size: 16px;
}
.sub2 {
  color: var(--ligh) !important;
}
.picture {
  position: relative;
  overflow: hidden;
}
.picture img {
  width: 100%;
}
.container {
  max-width: 1440px;
}
/* .container.container__lg {
  max-width: 1640px;
} */
.margin__xl {
  margin: var(--margin__xl);
}
.margin__lg {
  margin: var(--margin__lg);
}
.margin__md {
  margin: var(--margin__md);
}

.font-rgTl{
  font-size: 40px;
}
/* 
* Tamaños de fuentes
* -------------------
*/
h1 {
  font-family: var(--primary-font);
  font-size: var(--h1);
  color: var(--white-color);
}
h2 {
  color: var(--grey-dark);
  font-size: var(--h2);
  font-family: var(--primary-font);
  letter-spacing: 4.8px;
}
h3 {
  font-size: var(--h3);
  font-family: var(--primary-font);
  letter-spacing: 4px;
}
h4 {
  font-size: var(--h4);
  font-family: var(--primary-font);
  letter-spacing: 4px;
}
p {
  font-size: var(--p);
  font-family: var(--secondary-font);
  line-height: 28px; /* 175% */
  letter-spacing: 1.6px;
}
.font__xxl {
  font-size: var(--font-xxl);
}
.font__lg {
  color: var(--grey-dark);
  font-size: var(--font-lg);
  line-height: 36px; /* 150% */
  letter-spacing: 2.4px;
}
.font__md {
  font-size: var(--font-md);
  line-height: 32px; /* 160% */
  letter-spacing: 2px;
}

.font__xs {
  color: var(--grey-dark);
  font-family: var(--primary-font-bold);
  font-size: var(--font-xs);
  line-height: 24px; /* 171.429% */
  letter-spacing: 1.4px;
}
.font__xxs {
  font-family: var(--secondary-font);
  font-size: var(--font-xxs);
}

/* 
* Tipografías
* -------------------
*/
.primary__font {
  font-family: var(--primary-font);
}
.primary__font--bold {
  font-family: var(--primary-font-bold);
}
.primary__font--semibold {
  font-family: var(--primary-font-semibold);
}
.primary__font--medium {
  font-family: var(--primary-font-medium);
}
.primary__font--thin {
  font-family: var(--primary-font-thin);
}
.primary__font--light {
  font-family: var(--primary-font-light);
}
.secondary__font {
  font-family: var(--secondary-font);
}
.tercera__font {
  font-family: var(--tercera-font);
}
/* 
* Colores
* -------------------
*/
.white__color {
  color: var(--white-color);
}
.black__color {
  color: var(--black-color);
}
.bg__primary--color {
  background-color: var(--bg-primary-color);
}
.color__numbers {
  color: var(--color-numbers);
  letter-spacing: 1.6px;
}
.bg__secondary--color {
  background-color: var(--grey-dark);
}
.color__numbers2 {
  color: var(--soft-grey);
}

.title h1{
  font-family: var(--primary-font-bold);
  font-size: 66px;
}
/* 
* Tamaños Responsive
* -------------------
*/
@media only screen and (max-width:1400px) {
  .title h1 {
    font-size: 54px;
  }

.font__md{
  font-size: 18px;
}

}

@media only screen and (max-width:1200px) {
  .title h1 {
    font-size: 48px;
  }


    .font-rgTl{
      font-size: 35px;
    }
}
@media (width <= 1280px) {
  h2 {
    font-size: 1.6rem;
  }
  h3,
  h4 {
    font-size: 1.5rem;
  }
}
@media (width <= 992px) {

  .pad{
    padding: 30px 30px;
  }
  h1 {
    font-size: 3rem;
  }
h3,
h4 {
  font-size: 19px;
}
  .container .row{
    flex-wrap: wrap;
  }
  .container,.container.container__right{
    max-width: 860px !important;
  }

.font__xxl{
  font-size: 7rem;
}
  .margin__xl,
  .margin__lg {
    margin: 18px 0;
  }
  .font__xl {
    font-size: 2rem;
  }
  .font__lg {

    font-size: 19px;
  }
  .font__md {
    font-size: 16px;
    line-height: 28px;
  }
  .font__xs {
    font-size: 0.8rem;
  }
    .font__md{
      letter-spacing: 1px;
    }
}
@media (width <= 768px) {
  .image img{
    min-height: 300px;
    object-fit: cover;
  }
.container{
  max-width: 100% !important;
}
.font-rgTl{
  font-size: 30px;
  line-height: 35px;
}
  .container{
    padding: 0;
  }


    .font__lg{
      font-size: 16px;
    }

  p{
    line-height: 23px;
  }
section,
  main {
    padding: 0px 20px;
  }

  h3,
  .font__lg,
  h4 {
    font-size: 16px;
    line-height: 30px;
  }
  p {
    font-size: 1rem;
  }
  .font__xxl {
    font-size: 5rem;
  }
}
@media only screen and (max-width:480px) {
  .font__xs{
    line-height: 18px;
    font-size: 11px;
  }
  .font__md{
    line-height: 25px;
  }
    #banner .btnWhite a button{
      font-size: 13px;
    }
  h2{
    font-size: 1.3rem;
    letter-spacing: 3px;
  }
    .font__xxl{
      font-size: 3rem;
    }
  h3,
    .font__lg,
    h4{
      font-size: 14px;
      line-height: 25px;
      letter-spacing: 2px;
    }
    .icons h3{
      padding-bottom: 0 !important;
    }
        .font-rgTl {
          font-size: 20px;
        line-height: 28px;}
}