@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');
:root{
  /*Fuente*/
  --font--fuente--principal:'Montserrat';
  
  /*weight*/
  --font--weight--bold:700;
  --font--weight--semibold:600;
  --font--weight--medium:500;
  --font--weight--regular:400;
  --font--weight--light:300;
  --font--weight--extralight:200;
  --font--weight--thin:100;

  /*tamaño desktop*/
  --font--size--h1:2.5em;
  --font--size--h2-especial:3.2em;
  --font--size--h2:2em;
  --font--size--h3:1.5em;
  --font--size--h4:1.4em;
  --font--size--h5:1.3em;
  --font--size--h6:1.25em;
  --font--size--eyebrown:1.125em;

  /*tamaño comun*/
  --font--size--p--XL:1.125em;
  --font--size--p--L:1em;
  --font--size--p--M:0.95em;
  --font--size--button:1em;
  --font--size--link:1em;
  --font--size--label:0.75em;
  
  /*tracking(letter.spacing) */
  --font-tracking-title:0.008em;
  --font-tracking-desktop-p:0.018em;
  --font-tracking-mobile-p:0.02em;
  --font-tracking-eyebrow:0.08em;
  --font-tracking-button:0.022em;
  --font-tracking-label:0.012em;
}

/* Cambio de tamaño en Tablet*/


 /*Estilo de titulos y font*/

.main{
  font-family: var(--font--fuente--principal),sans-serif;
  font-size: 16px;
}

.main h1{
  color: var( --color--neutral--80);
  font-size: var(--font--size--h1);/*tamaño*/
  font-weight: var(--font--weight--bold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

.main h2{
  color:var( --color--neutral--80);
  font-size: var(--font--size--h2);/*tamaño*/
  font-weight: var(--font--weight--bold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif; 
}

.main h3{
  color:var( --color--neutral--80);
  font-size: var(--font--size--h3);/*tamaño*/
  font-weight: var(--font--weight--bold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
  margin: initial;
}

.main h4{
  color:var( --color--neutral--80);
  font-size: var(--font--size--h4);/*tamaño*/
  font-weight: var(--font--weight--semibold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

.main h5{
  color:var( --color--neutral--80);
  font-size: var(--font--size--h5);/*tamaño*/
  font-weight: var(--font--weight--bold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

.main h6{
  color:var( --color--neutral--80);
  font-size: var(--font--size--h6);/*tamaño*/
  font-weight: var(--font--weight-ssemibold);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-title);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

.main .eyebrow {
  font-size: var(--font--size--eyebrown);/*tamaño*/
  font-weight: var(--font--weight--regular);/*weight*/
  line-height:120% !important; /*interlineado*/
  letter-spacing: var(--font-tracking-eyebrow);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

/*Comun*/

.main p{
  color: var( --color--neutral--80);
  font-weight: var(--font--weight--regular);/*weight*/
  font-family: var(--font--fuente--principal),sans-serif;
  font-size: var(--font--size--p--L);
  line-height: 1.5em;
  margin-bottom: 0 ;
}

.main ul li{
  color: var( --color--neutral--80);
  font-weight: var(--font--weight--regular);/*weight*/
  font-family: var(--font--fuente--principal),sans-serif;
  font-size: var(--font--size--p--L);
  line-height: 1.5em;
}

.main .p-xl{
  font-size:var(--font--size--p--XL);
  line-height: 200%;
  letter-spacing: var(--font-tracking-desktop-p);/*tracking*/
}

.main .p-l{
  font-size:var(--font--size--p--L);
  line-height: 170%;
  letter-spacing: var(--font-tracking-desktop-p);/*tracking*/
}

.main .p-m{
  font-size:var(--font--size--p--M);
  line-height: 120%;
  letter-spacing: var(--font-tracking-mobile-p);/*tracking*/
}

.main .p-s{
  font-size:var(--font--size--p--s);
  line-height: 125%;
  letter-spacing: var(--font-tracking-mobile-p);/*tracking*/
}

.button{
  color: var(--neutral-escala-grises-10, #F5F5F5);
  text-align: center;
  /* Comun/Boton */
  font-family: var(--font--fuente--principal),sans-serif;
  font-size: 1em;
  font-style: normal;
  font-weight: 700;
  line-height: 100%; /* 16px */
  letter-spacing: 0.352px;
}

.label{
  font-size: var(--font--size--label);/*tamaño*/
  font-weight: var(--font--weight--regular);/*weight*/
  line-height:120%; /*interlineado*/
  letter-spacing: var(--font-tracking-label);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

.link{
  font-size: var(--font--size--link);/*tamaño*/
  font-weight: var(--font--weight--semibold);/*weight*/
  line-height:100%; /*interlineado*/
  letter-spacing: var(--font-tracking-button);/*tracking*/
  font-family: var(--font--fuente--principal),sans-serif;
}

@media screen and (max-width: 1400px){
  .main {
    font-size: 14px;
  }
}

@media screen and (max-width: 1024px) {
 
}

/* Tablet */
@media screen and (max-width: 992px) {
}

/* Tablet */
@media screen and (max-width: 768px) { 
}

/* Mobile */
@media screen and (max-width: 576px) {
  .main {
    font-size: 13px;
  }
}