/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (max-width: 1400px) {

  html{
    font-size: 8px;
  }

}

@media (min-width: 1600px) {

  html{
    font-size: 11px;
  }

}

@media (min-width: 1800px) {

  html{
    font-size: 12px;
  }

}

@media (min-width: 2200px) {

  html{
    font-size: 13px;
  }

}



/* =========================================================
TABLET
========================================================= */

@media (max-width:992px){

/*-----------------
GENERAL
------------------*/

.container{
    padding:0 3rem;
}

.header{
    padding:0 3rem;
}

/*-----------------
HEADER
------------------*/

.nav{
    display:none;
}

.menu-toggle,
.mobile-home{
    display:block;
}

.navbar-inner{
    justify-content:space-between;
}

/*-----------------
HERO
------------------*/

.hero-content{
    width:70%;
    padding:4rem;
}

.hero-content h1{
    font-size:4rem;
    line-height:4.4rem;
}

/*-----------------
HOME INTRO
------------------*/

.split-section{
    flex-direction:column;
    gap:4rem;
}

.right-box{
    margin-top:0;
}

/*-----------------
SERVICIOS
------------------*/

.servicios .wrap{
    grid-template-columns:repeat(3,1fr);
}

/*-----------------
STATEMENT
------------------*/

.statement{
    padding:8rem 0;
}

.statement__content{
    margin-bottom:6rem;
}

.statement h2{
    font-size:4rem;
}

.statement p{
    font-size:1.8rem;
}

.statement__process{
    grid-template-columns:repeat(3,1fr);
    row-gap:4rem;
}

.step{
    padding-right:0;
}

.step::after{
    display:none;
}

/*-----------------
NOTICIAS HOME
------------------*/

.news-slider__main{
    grid-template-columns:1fr;
}

.news-slider__tabs{
    grid-template-columns:repeat(2,1fr);
}

/*-----------------
ABOUT
------------------*/

.about{
    padding-top:14rem;
}

.about__intro{
    margin-bottom:6rem;
}

.about__text{
    column-count:1;
}

.about__highlight{
    grid-template-columns:1fr;
}

.about__statement{
    transform:none;
    margin-left:0;
    border-radius:0 0 4rem 4rem;
}

.about__valores{
    grid-template-columns:repeat(4,1fr);
}

/*-----------------
CERTIFICACION
------------------*/

.cert-content{
    grid-template-columns:1fr;
    gap:4rem;
}

.cert img{
    width:24rem;
}

/*-----------------
PROCESS
------------------*/

.process-card,
.process-card--reverse{
    grid-template-columns:1fr;
}

.process-card--reverse .process-card__content{
    order:2;
}

.process-card--reverse .process-card__image{
    order:1;
}

.process-grid{
    grid-template-columns:1fr;
}

/*-----------------
CATEGORIAS
------------------*/

.categorias{
    grid-template-columns:repeat(2,1fr);
}

/*-----------------
SECTORES
------------------*/

.industries-list{
    grid-template-columns:repeat(2,1fr);
}

/*-----------------
BLOG
------------------*/

.blog__grid{
    grid-template-columns:repeat(2,1fr);
}

/*-----------------
CONTACT
------------------*/

.contact{
    padding-top:14rem;
}

.contact-inner{
    grid-template-columns:1fr;
    gap:6rem;
}

.contact-phones{
    grid-template-columns:1fr;
}

.contact-image{
    text-align:center;
}

.contact-image img{
    width:45rem;
}

.contact::before{
    display:none;
}

/*-----------------
CTA
------------------*/

.cta-content{
    grid-template-columns:1fr;
}

.cta img{
    display:none;
}

/*-----------------
FOOTER
------------------*/

.footer-inner{
    flex-direction:column;
    align-items:center;
    text-align:center;
}

.footer-left{
    flex-direction:column;
}

.footer-right{
    align-items:center;
}

.footer-text{
    padding-left:0;
    padding-top:4rem;
    background-position:center top;
    text-align:center;
}

}


/* =========================================================
MOBILE
========================================================= */

@media (max-width:768px){

html{
    font-size:9px;
}

/*-----------------
GENERAL
------------------*/

.container{
    padding:0 2rem;
}

.header{
    padding:0 2rem;
}

/*-----------------
HEADER
------------------*/

.navbar{
    border-radius:0;
}

.navbar .navbar-inner .logo{
    width:16rem;
}

/*-----------------
HERO
------------------*/

.hero{
    min-height:90vh;
    padding-top:9rem;
    border-radius:0;
}

.hero-content{
    width:100%;
    padding:3rem 2rem;
}

.hero-content h1{
    font-size:3.2rem;
    line-height:1.15;
}

.hero-content p{
    font-size:1.5rem;
    line-height:2.2rem;
}

.arrow{
    width:5rem;
    height:5rem;
    right:2rem;
    bottom:2rem;
}

/*-----------------
BOTONES
------------------*/

.btn-primary{
    width:100%;
    justify-content:center;
}

.btn-seccion{
    margin-left:0;
}

/*-----------------
INTRO
------------------*/

.intro{
    padding:4rem 0;
}

.split-section{
    gap:3rem;
}

.right-box img{
    width:90%;
}

/*-----------------
SERVICIOS
------------------*/

.servicios{
    padding:4rem 0;
}

.servicios .head h2{
    font-size:3rem;
}

.servicios .wrap{
    grid-template-columns:1fr;
}

.benefit{
    aspect-ratio:auto;
    min-height:24rem;
}

/*-----------------
STATEMENT
------------------*/

.statement{
    padding:6rem 0;
}

.statement__content{
    margin-bottom:4rem;
}

.statement h2{
    font-size:3.2rem;
    line-height:1.2;
}

.statement p{
    font-size:1.6rem;
}

.statement__process{
    grid-template-columns:1fr;
    gap:3rem;
}

.step{
    font-size:1.8rem;
}

/*-----------------
NOTICIAS HOME
------------------*/

.noticias{
    padding:4rem 2rem;
}

.news-slider__content{
    padding:3rem;
}

.news-slider__content h2{
    font-size:2.6rem;
}

.news-slider__tabs{
    grid-template-columns:1fr;
}

/*-----------------
ABOUT
------------------*/

.about{
    padding-top:12rem;
}

.about__intro h2{
    font-size:3rem;
}

.about__highlight{
    gap:0;
}

.about__image{
    border-radius:4rem 0 0 0;
}

.about__statement{
    padding:4rem 3rem;
    border-radius:0 0 4rem 4rem;
}

.about__statement h3{
    font-size:2.6rem;
    line-height:1.3;
}

.about__caption{
    font-size:2rem;
    line-height:1.3;
}

.about__valores{
    grid-template-columns:repeat(2,1fr);
}

/*-----------------
CERTIFICADO
------------------*/

.cert{
    padding:3rem;
    border-radius:0 4rem;
}

.cert-content{
    gap:3rem;
}

.cert img{
    width:20rem;
    margin:auto;
}

/*-----------------
PROCESS
------------------*/

.process-card__content,
.process-item__content{
    padding:3rem;
}

.process-card__content h3,
.process-item h3{
    font-size:2.6rem;
    line-height:1.2;
}

/*-----------------
CATEGORIAS
------------------*/

.categorias{
    grid-template-columns:1fr;
    gap:2rem;
}

.product-card{
    min-height:32rem;
}

.product-card__icon{
    width:9rem;
}

.product-card__tag{
    font-size:1.6rem;
}

.product-card__title{
    font-size:2.4rem;
}

/*-----------------
SECTORES
------------------*/

.industries-list{
    grid-template-columns:1fr;
}

.industries-list li{
    font-size:1.8rem;
}

/*-----------------
BLOG
------------------*/

.blog{
    padding-top:12rem;
}

.blog h2{
    font-size:3rem;
}

.blog__grid{
    grid-template-columns:1fr;
    gap:2rem;
}

/*-----------------
CONTACTO
------------------*/

.contact{
    padding:12rem 0 6rem;
}

.contact-info .head h2{
    font-size:3rem;
}

.contact-phones{
    gap:2rem;
}

.wcall{
    gap:2rem;
}

.wcall img{
    width:5rem;
}

.wcall span{
    font-size:2.6rem;
}

.contact-image img{
    width:100%;
    max-width:36rem;
}

/*-----------------
CTA
------------------*/

.cta{
    min-height:auto;
    padding:5rem 0;
}

.cta h2{
    font-size:3rem;
    line-height:1.2;
}

/*-----------------
FOOTER
------------------*/

.footer-left{
    gap:2rem;
}

.footer-text{
    padding-left:0;
    padding-top:4rem;
    background-position:center top;
    text-align:center;
}

.footer-text.iso img{
    width:16rem;
}

/*-----------------
MODAL
------------------*/

.modal-panel{
    width:100%;
    min-width:100%;
}

.modal-content{
    padding:5rem 2rem;
}

}

/* =========================================================
SMALL MOBILE
========================================================= */

@media (max-width:480px){

html{
    font-size:8px;
}

/*-----------------
HEADER
------------------*/

.navbar .navbar-inner{
    padding:1.6rem 0;
}

.navbar .navbar-inner .logo{
    width:14rem;
}

/*-----------------
HERO
------------------*/

.hero-content{
    padding:2rem;
}

.hero-content h1{
    font-size:2.8rem;
    line-height:1.15;
}

.hero-content p{
    font-size:1.4rem;
}

/*-----------------
SERVICIOS
------------------*/

.benefit{
    min-height:20rem;
}

.benefit .icon{
    width:8rem;
}

.benefit .info .title{
    font-size:2rem;
}

/*-----------------
STATEMENT
------------------*/

.statement h2{
    font-size:2.8rem;
}

.statement p{
    font-size:1.5rem;
}

/*-----------------
ABOUT
------------------*/

.about__statement{
    padding:3rem 2.5rem;
}

.about__valores{
    grid-template-columns:1fr;
}

.valores{
    aspect-ratio:auto;
    min-height:12rem;
}

/*-----------------
PROCESS
------------------*/

.process-card__content,
.process-item__content{
    padding:2.5rem;
}

/*-----------------
PRODUCTOS
------------------*/

.product-card{
    min-height:28rem;
}

.product-card__title{
    font-size:2.2rem;
}

/*-----------------
CTA
------------------*/

.cta{
    padding:4rem 0;
}

.cta h2{
    font-size:2.8rem;
}

/*-----------------
CONTACTO
------------------*/

.wcall{
    flex-direction:column;
    align-items:flex-start;
    gap:1rem;
}

.wcall span{
    font-size:2.2rem;
}

/*-----------------
FOOTER
------------------*/

.footer-logo{
    width:8rem;
}

.footer-social{
    gap:2rem;
}

.footer-social .redes{
    width:3.8rem;
    height:3.8rem;
}

}