@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100..900&display=swap');
body{
    background-color: #020202;
    --cp:#f8ce19;
    --cs:#e40313;
    --tw:#ffffff;
    --tb:#020202;
    color: var(--tw);
    font-family: "Roboto", sans-serif;
    margin: 0;
    padding: 0;
    font-size: 16px;
    position: relative;
    height: 95vh;
    /*background-image: url('images/bg-cover.png');background-size: cover;background-position: left top;background-repeat: no-repeat;*/
}
ul{padding: 0;}
ul:not(.browser-default)>li {list-style-type: none;}
.container{width: 90%;max-width: 90%;margin: 0 auto;}
.nav-wrapper{display: flex;justify-content: start;text-align: center;margin-top: 3rem;}
.nav-wrapper p{text-align: right;margin:0 ;font-size: .9rem;}
.nav-wrapper .logotipo{margin: 0 6rem 0 1rem;}
.nav-wrapper .logotipo img{width: 110%;}
div.social{text-align: left;}
div.social p{margin: 0 0 .5rem 0;text-align: left;}
ul.social-menu{display: flex;padding: 0;margin: 0;}
ul.social-menu li{margin: 0 .5rem;}
ul.social-menu li:first-of-type{margin-left: 0;}
ul.social-menu li i{font-size: 1.6rem;color: var(--tw);}
.call,#slide-out{display: none;}
#home-cover{ position: fixed;
  top: 0;
  left: 30%; /* inicia desde la mitad */
  width: 70vw; /* ocupa la mitad derecha */
  height: 100vh;
  background-image: url('images/bg-cover.webp'); /* reemplaza con tu ruta real */
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;}
#home-cover img{width: 100%;}
.tlight{font-weight: 300;}
.tw7{font-weight: 900;color: var(--tw);}
.tcp7{font-weight: 900;color: var(--cp);}
h1{font-size: 4rem;line-height: 3.6rem;margin-top: 8rem;}
h1 span{display: block;}
h1 .tlight{font-size: 3rem;}
.sedes{background-color: var(--tw);border-radius: 6px;width: 23%;color: var(--tb);padding-bottom: 2rem;}
.sedes-title{background-color: var(--cp);color: var(--tb);padding: 1rem;border-radius: 6px 6px 0 0;font-weight: 700;font-size: 1.8rem;}
ul.lista-map{margin-top: 2rem; padding-left: 1.5rem;}
ul.lista-map li{font-size: 1.6rem;margin: .5rem 0;}
ul.lista-map li:before{font-family: 'icomoon';margin-right: 1rem;vertical-align: middle;color: var(--cp);content: "\e908";font-size: 1.8rem;}
footer{position: absolute;bottom: 2rem;display: block;width: 100%;}
footer .container{display: flex;justify-content: start;align-items: center;}
footer .container p{margin: 0 1.5rem; }
footer .container .logotipo{margin: 0;}
.f-contacto li a{color: var(--tw);text-decoration: none;}
.f-contacto li i{color: var(--cp);margin-right: .5rem;}


@media screen and (max-width: 1440px){
.container{width: 95%;max-width: 95%;margin: 0 auto;}
.nav-wrapper p{font-size: .7rem;}
.nav-wrapper .logotipo img{width: 92%;}
ul.social-menu li i{font-size: 1.3rem;}
p{font-size: .9rem;}
#home-cover{width: 67%;left: 33%;}
h1{font-size: 2.8rem;line-height: 2.6rem;margin-top: 4rem;}
h1 .tlight{font-size: 2.2rem;}
.sedes{width: 23%;padding-bottom: 1rem;}
.sedes-title{font-size: 1.2rem;padding: .5rem 1rem;}
ul.lista-map{margin-top: 1.5rem; padding-left: 1rem;}
ul.lista-map li{font-size: 1rem;margin: .5rem 0;}
ul.lista-map li:before{font-size: 1.3rem;margin-right: .5rem;}
footer{bottom: 1rem;}
footer .container .logotipo img{width: 85%;}
footer .container p{font-size: .7rem; }
.f-contacto li{font-size: .7rem;}
}

@media screen and (min-width:320px) and (max-width:480px){
.nav-wrapper{margin-top: 1rem;}
.nav-wrapper p{font-size: .6rem;}
.nav-wrapper .logotipo { margin: 0 6rem 0 .5rem;}
.nav-wrapper .logotipo img{width: 150%;}
ul.social-menu li i{font-size: 1.2rem;}
.call,#slide-out{display: block;}
#home-cover{ position: fixed;top: 55%; height: 45vh; left: initial;  width: 100vw;  background-image: url('images/bg-cover-s.webp'); }
h1{text-align: center;}
.sedes{width: 70%;margin: 0 auto;}
footer{background-color: var(--tb);color: var(--tw);width: 95%;left: 2.5%;border-radius: 6px;}
footer .container .logotipo img{width: 100%;}
footer .container p{margin:0 1rem 0 1rem;}
}
/*******************************TABLET*******************************/
@media screen and (max-width: 768px) and (min-width: 480px){
.nav-wrapper{margin-top: 1rem;}
.nav-wrapper p{font-size: 1rem;}
.nav-wrapper .logotipo { margin: 0 16rem 0 1rem;}
.nav-wrapper .logotipo img{width: 120%;}
ul.social-menu li i{font-size: 1.2rem;}
.call,#slide-out{display: block;}
#home-cover{ position: fixed;top: 55%; height: 45vh; left: initial;  width: 100vw;  background-image: url('images/bg-cover-s.webp'); }
h1{text-align: center;}
.sedes{width: 70%;margin: 0 auto;}
ul.lista-map li{font-size: 1.4rem;}
footer{background-color: var(--tb);color: var(--tw);width: 95%;left: 2.5%;border-radius: 6px;}
.f-contacto li, footer .container p{font-size: 1.1rem;}
footer .container .logotipo img{width: 120%;}
footer .container p{margin:0 2rem;}
.f-contacto li i {font-size: 1.3rem;}
} 

/*************************************LAPTOP HD Y TV*************************************/
@media screen and (min-width: 1440px) and (max-width: 1920px){
.container{width: 95%;max-width: 95%;margin: 0 auto;}
.nav-wrapper p{font-size: .7rem;}
.nav-wrapper .logotipo img{width: 92%;}
ul.social-menu li i{font-size: 1.3rem;}
p{font-size: .9rem;}
#home-cover{width: 67%;left: 33%;}
h1{font-size: 2.8rem;line-height: 2.6rem;margin-top: 4rem;}
h1 .tlight{font-size: 2.2rem;}
.sedes{width: 23%;padding-bottom: 1rem;}
.sedes-title{font-size: 1.2rem;padding: .5rem 1rem;}
ul.lista-map{margin-top: 1.5rem; padding-left: 1rem;}
ul.lista-map li{font-size: 1rem;margin: .5rem 0;}
ul.lista-map li:before{font-size: 1.3rem;margin-right: .5rem;}
footer{bottom: 1rem;}
footer .container .logotipo img{width: 85%;}
footer .container p{font-size: .7rem; }
.f-contacto li{font-size: .7rem;}
}

@media screen and (min-width:1920px){
    .container{width: 90%;max-width: 90%;margin: 0 auto;}
.nav-wrapper p{font-size: .9rem;}
.nav-wrapper .logotipo img{width: 110%;}
ul.social-menu li i{font-size: 1.6rem;}
p{font-size: initial}
#home-cover{left: 30%;  width: 70vw; }
h1{font-size: 4rem;line-height: 3.6rem;margin-top: 8rem;}
h1 .tlight{font-size: 3rem;}
.sedes{width: 25%;padding-bottom: 2rem;}
.sedes-title{font-size: 1.8rem;padding: 1rem;}
ul.lista-map{margin-top: 2rem; padding-left: 1.5rem;}
ul.lista-map li{font-size: 1.6rem;margin: .5rem 0;}
ul.lista-map li:before{font-size: 1.8rem;margin-right: .1rem;}
footer{bottom: 2rem;}
footer .container .logotipo img{width: 100%;}
footer .container p{font-size: 1rem; }
.f-contacto li{font-size: 1rem;}

}
/*******************************ICONS*******************************/
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?md5fu1');
  src:  url('fonts/icomoon.eot?md5fu1#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?md5fu1') format('truetype'),
    url('fonts/icomoon.woff?md5fu1') format('woff'),
    url('fonts/icomoon.svg?md5fu1#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-book:before {
  content: "\e900";
}
.icon-checked:before {
  content: "\e901";
}
.icon-email:before {
  content: "\e902";
}
.icon-facebook:before {
  content: "\e903";
}
.icon-handshake:before {
  content: "\e904";
}
.icon-instagram:before {
  content: "\e905";
}
.icon-like:before {
  content: "\e906";
}
.icon-linkedin:before {
  content: "\e907";
}
.icon-maps:before {
  content: "\e908";
}
.icon-menu:before {
  content: "\e909";
}
.icon-quality:before {
  content: "\e90a";
}
.icon-smile:before {
  content: "\e90b";
}
.icon-telephone:before {
  content: "\e90c";
}
.icon-tiktok:before {
  content: "\e90d";
}
.icon-whatsapp:before {
  content: "\e90e";
}
.icon-web:before {
  content: "\e90f";
}
.icon-youtube:before {
  content: "\e910";
}
