@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');


:root {
  --radio1: 10px;
  --radio2: 50px;
  --black: #0a0a0a;
  --red: #EA1E26;
  --white: #ffffff;
  --l-grey: #eeeeee;
  --d-grey: #666666;
	--m-grey: #999999;
  --mb: 14px;
	--ms:  20px;
}
/* a borrar 
* { outline: 2px dotted red }
* * { outline: 2px dotted green }
* * * { outline: 2px dotted orange }
* * * * { outline: 2px dotted blue }
* * * * * { outline: 1px solid red }
* * * * * * { outline: 1px solid green }
* * * * * * * { outline:txt 1px solid orange }
* * * * * * * * { outline: 1px solid blue }
* * * * * * * * * { outline: 1px solid blue }
* * * * * * * * * *{ outline: 1px solid blue }
* * * * * * * * * * { outline: 1px solid blue }
* * * * * * * * * * *{ outline: 1px solid blue }*/
/* fin a borrar */
* {
  margin: 0px;
  padding: 0px;
  /*cursor: none;*/
}
html, body {
  margin: 0px auto;
  width: 100%;
  /* max-width: 1300px; */
  /* box-sizing: revert-layer; */
}
body {
  /* background-color: #dddddd; */
  font-size: 18px;
  line-height: 22px;
  background-color: var(--black);
  overflow-x: hidden !important;
  font-family: "Noto Sans", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  height: auto;
  padding-top: 94px;
}
html {
  scroll-behavior: smooth;
}
h1{
	font-size: 62px;
	line-height: 62px;
	margin: 0 0 20px 0;
	font-weight: 300;
}
h2{
	margin-bottom: var(--mb);
	font-size: 32px;
	line-height: 32px;
	line-height: 16px;
	margin: 0 0 20px 0;
	font-weight: 600;
	}
h3{font-size: 26px;line-height: 26px;
	margin-bottom: var(--mb);
	margin: 0 0 20px 0;
	font-weight: 600;}
h4{font-size: 22px;
margin: 0 0 20px 0;}
h5{font-size: 18px;
margin: 0 0 20px 0;}
p{
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
	}
p strong{font-weight: 600;}
.wrapper-general{
    width: 100%;
    padding: 14px;
    box-sizing: border-box;
}

.content{
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}
a{
	color: var(--black);
}
a, a:hover {
  text-decoration: none;
  /*cursor: default;*/
}
a:hover {
 /* cursor: none !important;*/
}
ul{
	list-style: none;
}
img{
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
}
header{
    background-color: var(--white);
    border-radius: var(--radio1);
    /* height: 80px; */
    margin-bottom: var(--mb);
    z-index: 200;
    /* position: relative; */
    position: fixed;
    top: 14px;
    z-index: 99999;
    width: calc(100%-14px);
    box-sizing: inherit;
    width: calc(100% - 28px);
	  transition: box-shadow .3s ease;
	 transition: all 0.3s ease;
}
header.scrolled{
    box-shadow: 0 4px 20px rgba(0,0,0,0.6);
    top: 0;
    transition: all 0.3s ease;
    /* width: 100%; */
    /* left: 0; */
    /* border-radius: 0; */
}
.header{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* height: 80px; */
    z-index: 90;
    position: relative;
}
.logo{
    width: 180px;
}
.menu-toggle {
    display: none;

}
.nav-cont{
    display: flex;
    align-items: center;
}
nav {
  width: 100%;
  margin: 0 7px 0 0;
  }
nav ul{
    list-style: none;
    display: flex;
    /* align-items: center; */
    /* flex-direction: column; */
}
nav ul li{
    display: flex;
    align-items: center;
}
nav ul li .submenu{
	display: none;
	position: fixed;
	width: calc(100% - 68px);
	background-color: var(--white);
	left: 0px;
	top: 60px;
	z-index: 100;
	padding: 20px;
	border-radius: var(--radio1);
	margin: 14px;
	/* background-color: #eeeeee; */
	transition: all 0.6s ease;
	box-shadow: 0 6px 6px rgba(0, 0, 0, 0.1);
}

nav ul li:hover .submenu{
	display: block;
}
nav ul li a{
    font-size: 14px;
    color: var(--black);
    padding: 0 5px;
    transition: all 0.3s ease;
    font-weight: 600;
    height: 80px;
    display: flex;
    align-items: center;     /* centra vertical */
    justify-content: center; /* opcional: centra horizontal */
}
nav ul li a:hover{
	color: var(--red);
}
.submenu{}
.submenu-cont{
    display: flex;
    align-items: flex-start;
    justify-content: center;
    background-color: #eeeeee;
    border-radius: var(--radio1);
    padding: 20px 0;
}
.submenu-cont ul{
    display: flex;
    flex-direction: column;
    /* margin: 0 20px; */
    border-right: solid 1px #c7c7c7;
    padding: 0 40px;
    height: -webkit-fill-available;
}
.submenu-cont ul:last-child{
    border-right: none;
    
}
.submenu-cont ul li{}
.submenu-cont ul li a{
    height: auto;
    padding: 0px 20px 0 0;
    font-weight: 400;
}
.submenu-cont ul li a:hover{}
.submenu-tit{
	font-size: 14px;
	font-weight: 600;
}

.social{}
.social ul{
    display: flex;
    align-items: center;
}
.social ul li{}
.social ul li a{
    width: 26px;
    display: block;
    padding: 0 0 0 4px;
	
}
.social ul li a:hover img{
   filter: brightness(1);
	transition: all 0.3s ease;
}
.social ul li a img{
    filter: brightness(0);
}
section{
	
/* background-color: var(--white); */
	
/* min-height: 400px; */
	
border-radius: var(--radio1);
	
margin-bottom: var(--mb);
	
padding: 80px 0;
}

.slider {
    min-width: 100%;
    width: 100%;
    flex-shrink: 0;
    background-size: 100% auto;
    background-position: left top;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    margin-bottom: var(--mb);
    z-index: 50;
    /* background-color: red; */
    background-repeat: no-repeat;
}

.slider-left{
    background-position: right bottom;
}
.slider-left:before{
   /* content: ""; */
   position: absolute;
   inset: 0;
   /* background: linear-gradient(to left, rgba(48 4 4 /  0) 100%, rgba(0 0 0 / 100%) 60%); */
   z-index: 1;
   width: 50%;
   left: 0;
   /* background: red; */
   background: linear-gradient(90deg, #000000 35%, transparent 100%);
   /* box-sizing: border-box; */
   right: auto;
}
.slider-left .slider-info{
    z-index: 100;
    position: relative;
	 left: 0;
}
.slider-right{
	
}
.slider-right:before{
     /* content: ""; */
     position: absolute;
     inset: 0;
     /* background: linear-gradient(to left, rgba(48 4 4 /  0) 100%, rgba(0 0 0 / 100%) 60%); */
     z-index: 1;
     width: 50%;
     right: 0;
     /* background: red; */
     background: linear-gradient(90deg, transparent 0%, #000000 65%);
     /* box-sizing: border-box; */
     left: auto;
    }
.slider-right .slider-info{
   left: 50%;
}
 .slider-info{
	  z-index: 100;
	  position: relative;
	  background-color: rgba(0,0,0,0.5);
	  padding: 30px;
	  border-radius: var(--mb);
	  width: fit-content;
	  box-sizing: border-box;
}



.slider h1{
    color: var(--white);
}
.slider h1 span{font-weight: 600;}
.slider h3{
    color: var(--white);
}
.slider .botones{
    display: flex;
    margin: 40px 0 0;
}
/**** slider ******/
#slider-cont {
    position: relative;
    width: 100%;
    /* height: 60dvh; */  /* o 100vh */
    overflow: hidden;
}

.slider-track {
    display: flex;
    height: calc(40dvw - 40px);
    transition: transform 0.8s ease-in-out;
}


.slider.active {
    opacity: 1;
}
.button-cont{
    position: relative;
    width: 100%;
    /* height: 100px; */
    /* background-color: red; */
    display: flex;
    margin: 20px 0 0 0;
    z-index: 9998;
    align-items: center;
    justify-content: center;
}
.slider-prev,
.slider-next {
    /* position: absolute; */
    top: 50%;
    /* transform: translateY(-50%); */
    z-index: 10;
    cursor: pointer;
    border: none;
    background-color: transparent;
    color: #fff;
    width: 50px;
    height: 50px;
    font-size: 24px;
    margin: 0 0.3%;
    border-radius: 50px;
    border: solid 2px var(--red);
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-prev {
    left: 20px;
}

.slider-next {
    right: 20px;
}
/***** fin slider ******/

.boton{
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
    border-radius: var(--radio2);
    padding: 6px 24px 6px 51px;
    width: fit-content;
    transition: all 0.1s ease;
    margin: 0 20px 10px 0;
    overflow: hidden;
    /* height: 40px; */
    position: relative; /* ?? clave */
    height: 23px;
}
.boton img{
    height: 26px !important;
    width: auto !important;
    margin: 0 10px 0px -4px !important;
}
.boton p{
	font-size: 16px;
    font-weight: 700;
    
}
.icon-top {
  transform: translateY(0%);
}

.icon-bottom {
  transform: translateY(140%);
}
.icon {
  position: absolute;
  left: 11px;
  width: 100%;
  /* overflow: hidden; */
  /* margin: 0 0 40px 0 !important; */
  transition: transform 0.3s ease;
  margin-right: 10px!;
}
/* Hover */
.boton:hover .icon-top, .prod-indice-ind:hover .boton .icon-top {
  transform: translateY(-104%);
  /* background-color: red; */
}

.boton:hover .icon-bottom, .prod-indice-ind:hover .boton .icon-bottom {
  transform: translateY(0%);
  
}
.boton-white{
    background-color: var(--white);
    /* font-size: 18px; */
    border: solid 2px var(--red);
    color: var(--black);
}
.boton-white:hover{
    background-color: var(--red);
    border: solid 2px var(--red);
    color: var(--white);
}
.boton-white:hover img{
 	
}

.boton-red{
    background-color: var(--red);
    /* font-size: 18px; */
    border: solid 2px var(--red);
    color: var(--white);
}
.boton-red:hover{
    background-color: var(--white);
    border: solid 2px var(--red);
    color: var(--red);
}
.boton-red:hover img{
  
}
.boton-manual{
	
/* padding-top: 3px; */
}
.boton-manual img{
	/* background-color: var(--white); */
}
.boton-manual:hover {
    
    border: solid 2px var(--red) !important;
    
}
.boton-transp{
    background-color: transparent;
    /* font-size: 18px; */
    border: solid 2px var(--red);
    color: var(--white);
}
.boton-transp:hover{
    background-color: var(--white);
    border: solid 2px var(--white);
    color: var(--red);
}
.boton-txt-red{
	 color: var(--red);

}
.boton-minimal{
	  transition: all 0.3s ease;
	  display: flex;
	  align-items: center;
	  width: fit-content;
	  justify-content: space-between;
	  padding: 10px 0;
}
.boton-minimal:hover p{
    color: var(--red);
}
.boton-minimal p{
    color: var(--white);
    font-size: 16px;
    margin: 0 !important;
    font-weight: 500;
}
.acceso-ind:hover .boton-minimal p {
    color: var(--white) !important;
    
}
.boton-minimal img{
    height: 13px !important;
    margin: 0px 0 0 10px;
    position: relative;
    /* top: 8px; */
    margin-bottom: unset !important;
    transition: all 0.3s ease;
    width: auto;
}
.boton-minima:hoverl img{
    margin: 0 0 0 40px;
}
.hover-white:hover p{
	color: var(--white);
}
.copy{
    font-size: 22px;
    line-height: 30px;
}
.copy p{
    font-size: 20px;
}
.copy span{
	font-weight: 600;
}
.copy-left{}
.copy-right{}
.bk-white{
	background-color: var(--white);
}
.bk-l-grey{
	background-color: var(--l-grey);
}

#categorias{
	position: relative;
	background-color: var(--black);
}
#categorias-int, #producto, #mapa-comprar, #ayuda{
    padding: 40px 0 60px;
}
.categorias{}
.tit-cont{
    display: flex;
    align-items: center;
    flex-direction: column;
}
.tit-cont img{
    height: 26px;
    width: 26px;
    margin: 0 auto 10px;
    position: revert-rule;
}
.tit-cont h1{
    color: var(--white);
    font-weight: 100;
    text-align: center;
}
.tit-cont h2{
    color: var(--white);
    font-size: 24px;
    line-height: 28px;
    font-weight: 400;
    text-align: center;
    width: 70%;
}
.cards-cont{
    display: flex;
    align-items: center;
    padding: 80px 0;
    gap: 2%;
}
.categorias .card{
    height: 360px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 30px;
    /* border: solid 1px red; */
    border-radius: var(--mb);
    background-color: #aaa;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
    transition: all 0.3s ease;
    filter: saturate(0);
    background-size: 100% auto;
    width: 100%;
	background-repeat: no-repeat;
}
.categorias .card:hover{
	transform: scale(1.1);
	cursor: pointer;
	filter: saturate(1);
}
.categorias .card:before{
	content: "";
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.7);
	inset: 0;
	z-index: 0;
	top: 0;
	transition: all 0.3s ease;
}
.categorias .card:hover:before{
	top: 190px;
	cursor: pointer;
}
.categorias .card .dest{
    color: var(--white);
    font-size: 14px;
    border: solid 1px var(--white);
    border-radius: var(--radio2);
    padding: 4px 20px;

    z-index: 1;
    width: fit-content;
}
.categorias .card:hover .dest{
		background-color: rgba(0,0,0,0.7);
}
.categorias .card .card-info-cont{
    z-index: 2;
}
.categorias .card .card-info-cont img{
    height: 20px;
    width: auto;
    margin: 0 0 var(--mb) 0;
}
.categorias .card .card-info-cont h4{
    color: var(--white);
    font-size: 18px;
    margin: 0 0 var(--mb) 0;
}
.categorias .card .card-info-cont p{
    color: var(--white);
    font-size: 16px;
}
.categorias .card a{
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.card-baja{
	transform: translateY(80px);
}
.card-baja:hover{
	transform: translateY(100px) scale(1.1);
}
#comprar{
    position: relative;
    /* height: 200px; */
    background-image: url("../images/bk-comprar.png");
    background-size: auto 110%;
    background-position: right center;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    overflow: hidden;
}
#comprar:before{
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgb(235 40 36) 85%, rgb(235 40 36 / 0%) 100%);
	z-index: 1;
	width: 70%;
	z-index: 0;
}
.comprar{
    display: flex;
    align-content: center;
    flex-wrap: nowrap;
    z-index: 1;
    position: relative;
    width: 100%;
}
.ico-ubicacion{
    width: 110px;
    margin: 0 20px 0 0;
}
.info-comprar{
    display: flex;
    flex-direction: column;
    gap: 2%;

}
.info-comprar h1{
    color: var(--white);
}
.info-comprar h2{
    font-size: 24px;
    line-height: 28px;
    color: var(--white);
    font-weight: 500;
}
.info-comprar .boton-red{
    
border: solid 1px var(--white);
    
padding-top: 15px;
    
padding-bottom: 15px;
    
margin: 20px 0 0 0;
}
#comprar-head{}
.comprar-head{
	   z-index: 1;
	   position: relative;
}
.comprar-head h1{}
.comprar-copy h2{
    font-size: 24px;
    line-height: 28px;
 
}
.comprar-copy{
    margin: 0 0 60px 0;
}
.sin-distribuidores{
	display: flex;
	flex-direction: column;
	grid-row-gap: 16px;
	padding: 30px;
	/* background: red; */
	box-sizing: border-box;
}
.sin-distribuidores > img{
	width: 40px;
}

#soporte{
    position: relative;
    /* height: 200px; */
    background-image: url("../images/bk-ayuda-compresor.png");
    background-size: auto 100%;
    background-position: 0 0;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    overflow: hidden;
}

#soporte:before{
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to right, rgba(37 37 37 / 0%) 20%, rgb(37 37 37 / 100%) 37%);
	width: 100%;
	z-index: 0;
}
#soporte-head{
    position: relative;
    /* height: 200px; */
    background-image: url("../images/bk-soporte-head.png");
    background-size: 100% auto;
    background-position: left center;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    overflow: hidden;
}
#soporte-head:before{
	content: "";
	position: absolute;
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 0;
}
.soporte{
    display: flex;
    align-content: center;
    flex-wrap: nowrap;
    z-index: 1;
    position: relative;
    width: 70%;
    margin-left: 30%;
}
.ico-soporte{
    width: 90px;
    margin: 6px 20px 0 0;
}
.info-soporte{
    display: flex;
    flex-direction: column;
    gap: 2%;
}
.info-soporte h1{
    color: var(--white);
}
.info-soporte h2{
    font-size: 24px;
    line-height: 28px;
    color: var(--white);
    font-weight: 500;
}
.info-soporte .boton-transp{
border: solid 1px var(--white);
padding-top: 15px;
padding-bottom: 15px;
margin: 20px 0 0 0;
}
.soporte-quick h2{
	font-size: 32px;
	margin: 0 0 30px 0;
}

#accesos{
	 position: relative;
    /* height: 200px; */
    background-image: url("../images/bk-accesos.png");
    background-size: 100% auto;
    background-position:0 0;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    
}
.accesos{
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 2%;
    box-sizing: border-box;
}
.accesos-int{
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 2%;
    box-sizing: border-box;
    background-image: url("../images/bk-accesos.png");
    background-size: 100% auto;
    background-position: 0 -60px;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
}
.acceso-ind{
    transition: all 0.6s ease;
    border-radius: var(--radio1);
    padding: 30px 30px;
    box-sizing: border-box;
    width: 100%;
    cursor: pointer;
    border: solid 1px var(--white);
}
.acceso-ind:hover{
    background: var(--red);
    border-color: var(--red);
}
.acceso-ind:hover img{
  
filter: brightness(20);
}

.acceso-ind img{
    height: 20px;
    width: auto;
    margin-bottom: var(--mb);
}
.acceso-ind h3{
    color: var(--white);
    font-size: 24px;
    margin-bottom: 40px;
}
.acceso-ind:hover .boton-minimal img, .boton-minimal:hover img{
    margin: 0 0 0 40px;
}
.accesos-int .acceso-ind h3{
    color: var(--white);
    font-size: 30px;
    margin-bottom: 10px;
}
.accesos-int .acceso-ind h4{
    color: var(--white);
    font-size: 16px;
    margin-bottom: 20px;
}
.circle-categorias{
    background: rgba(145, 145, 145, 10.05);
    background: radial-gradient(circle, rgba(145, 145, 145, 65) 0%, rgba(145, 145, 145, 0) 100%);
    width: 100%;
    height: 50%;
    position: absolute;
    border-radius: 100%;
    filter: blur(131px);
    top: 35%;
}
.circle-atajos{
    background: rgba(145, 145, 145, 10.05);
    background: radial-gradient(circle, rgb(75 72 72) 0%, rgba(145, 145, 145, 0) 100%);
    width: 100%;
    height: 50%;
    position: absolute;
    border-radius: 100%;
    filter: blur(131px);
    top: 25%;
}
#atajos{
    position: relative;
    margin-top: 0;
    /* padding-top: 0; */
}
.atajos{
    display: flex;
    gap: 2%;
    z-index: 2;
    position: relative;
}
.atajos-soporte{
    display: grid;
    grid-template-columns: 1fr 1fr; 
      gap: 2%;
   z-index: 2;
    position: relative;
}
.atajos-tutoriales{
	flex-direction: column !important;
	row-gap: 40px;
}
.atajo-ind{
    padding: 40px;
    border: solid 1px var(--white);
    border-radius: var(--radio1);
    flex: 1;
}
.atajo-ind h1{color: var(--white);font-weight: 100;font-size: 50px;font-weight: 500;line-height: 50px;}
.atajo-ind p{color: var(--white);margin-bottom: var(--mb);}
.atajo-text-cont{
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 2%;
}
.atajo-text{
    padding: 20px 0;
}
.atajo-text h4{
    color: var(--red);
    font-size: 24px;
    margin-bottom: var(--mb);
    display: flex;
    align-items: center;
}
.atajo-text h4 img{
    width: 30px;
    height: auto;
    margin: 0 10px 0 0;
}
.atajo-text p{}
#elegir{
    padding-top: 0 !important;
}
.elegir{}
.elegir-cont{
    display: flex;
    gap: 2%;
    margin: 60px 0;
}
.elegir-card{
    border-radius: var(--mb);
    background-color: var(--red);
    cursor: pointer;
    transition: all 0.3s ease;
    overflow: hidden;
}
.elegir-card:hover{
	transform: translateY(-10px);
}
.elegir-card:hover .elegir-img{
	transform: scale(1.1);
}
.elegir-card .card-info-cont{
    padding: 20px 20px;
}
.elegir-img{
	transition: all 0.3s ease;
}
.elegir-card h4{font-weight: 300;font-size: 36px;line-height: 32px;color: var(--white);margin: 0 0 var(--mb) 0;}
.elegir-card p{
    color: var(--white);
    font-weight: 600;
}
footer{
    background-color: rgb(20 20 20);
    padding: 40px 0 20px;
    /* border-bottom: solid 1px #fff; */
}
.footer{
    border-bottom: solid 1px #fff;
    padding: 0 0 30px 0;
}
.logo-footer-cont{
    margin: 0 0 100px 0;
}
.logo-footer{}
.logo-footer img{
    width: 200px;
    margin: 0 auto 20px;
}
.logo-footer-cont h3{
    color: var(--white);
    font-weight: 100;
    font-size: 20px;
    text-align: center;
}
.footer-nav{
    display: grid;
    grid-template-columns: 40% 20% 20% 20%;
    /* margin: 40px 0; */
    gap: 2%;
}
.footer-nav .datos div{
    display: flex;
    flex-direction: row;
    margin: 0 0 20px 0;
    align-items: center;
}
.footer-nav .datos .direccion{
    width: 70%;
}

.footer-nav a, .footer-nav p{
	color: var(--white);
	font-size: 14px;
	line-height: 16px;
}

.footer-nav .datos img{
    width: 20px;
    height: auto;
    display: block;
    margin: 0 10px 0 0;
}
.footer-nav .datos .footer-social img{
    width: 30px;
    height: auto;
    display: block;
    margin: 0 10px 0 0;
}

.footer-productos a, .footer-soluciones a, .footer-masinfo a{font-weight: 200;margin: 10px 0 0 0;display: block;/* background: red; */width: fit-content;}
.footer-productos a:hover, .footer-soluciones a:hover, .footer-masinfo a:hover{
	color: var(--red);
}
.last-bar .content{
    /* background-color: #eee; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0 0 0;
}
.last-bar a, .last-bar p{
	font-size: 14px;
	color: #fff;
	font-weight: 300;
}





.categorias-int{}
.categorias-int .copy h2{
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
    MARGIN: 10px 0;
}
.categorias-principal{}

.categorias-principal a{
    color: var(--black);
    font-size: 14px;
}
.categorias-subcategoria{}
.categorias-subcategoria h1{
    font-size: 48px;
    font-weight: 500;
    margin: 0;
}
.categorias-subcategoria .copy{}
.categorias-subcategoria .copy h4{}
.catalogo-cont{
    display: grid;
    grid-template-columns: 30% 68%;
    margin: 40px 0;
    gap: 2%;
}
.menu{
    background-color: var(--l-grey);
    border-radius: var(--radio1);
    padding: 30px 30px;
    /* gap: 2%; */
    /* display: table-row-group; */
    height: fit-content;
}
.menu h2{
    font-size: 18px;
    margin: 0;
    font-weight: 600;
    text-transform: initial;
}
.menu ul{
    list-style: none;
    margin: 10px 0 0 0;
}
.menu ul li{
    /* padding: 0; */
}
.menu ul li a{
    color: var(--d-grey);
    font-size: 16px;
}
.menu ul li a:hover{
    color: var(--black);
    /* font-size: 16px; */
    font-weight: 600;
}
.menu ul li ul{
    /* background: red; */
    padding: 0 0 0 0;
    margin: 0;
}
.menu ul li ul li{
    display: flex;
    align-items: center;
    justify-content: left;
    padding: 0 0 3px 10px;
    align-items: baseline;
    /* margin: 0 0 3px 0; */
    /* height: inherit; */
}
.menu ul li ul li a{
    /* background: red; */
    width: 100%;
    display: inline-block;
    padding: 0 0 0 6px;
    box-sizing: border-box;
    font-size: 13px;
    line-height: 16px;
}
.prod-indice{
    /* display: grid; */
    /* grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); */
    /* gap: 2%; */
    /* row-gap: 4%; */
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 31%));
    gap: 2%;
    row-gap: 4%;
    justify-content: left; /* opcional */
    display: grid;
    grid-template-columns: repeat(3, 33%);
    gap: 16px;
}
.prod-indice-ind{
    /* width: 250px; */
    padding: 20px;
    border: solid 2px var(--l-grey);
    border-radius: var(--radio1);
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 390px;
}
.prod-indice-ind:hover{
	border: solid 2px var(--d-grey);
}
.prod-indice-ind .boton-transp:hover {
    
    border: solid 2px var(--red);
    
}
.prod-indice-ind .boton{
    margin: 0 auto;
}
.prod-imagen{
    /* border: solid 2px var(--l-grey); */
    /* border-radius: var(--radio1); */
    padding: 0;
    width: 100%;
    height: 240px;
    box-sizing: border-box;
    margin: 0 0 15px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.prod-imagen img{/* max-height: 100%; */width: 100%;height: 100%;/* max-width: inherit; *//* display: block; *//* inset: 0; *//* margin: 0 auto; *//* max-width: min-content; */object-fit: contain;max-height: 190px;}
.prod-indice-title{
    font-size: 15px;
    margin: 0 0 10px 0;
    text-align: center;
    /* display: none; */
}
/******** accordion *********/
.accordion, .js-accordion {
  font-size: 1rem;
  width: 100%;
  margin: 10px auto 70px;
  border-radius: 5px;
}
.accordion-header, .accordion-body {
  /* background: white; */
  padding: 0 0 0 10px;
}
.accordion-header {
  /* padding: 10px 10px; */
  /* background: #3F51B5; */
  color: white;
  cursor: pointer;
  font-size: .7em;
  letter-spacing: .1em;
  transition: all .3s;
  /* text-transform: uppercase; */
  position: relative;
  display: flex;
  justify-content: flex-start;
  width: 100%;
  align-items: center;
}
.accordion-header img {
  /* padding: 1.5em 1.5em; */

  /* background: #3F51B5; */
  color: white;
  cursor: pointer;
  /* font-size: .7em; */
  /* letter-spacing: .1em; */
  transition: all .3s;
  /* text-transform: uppercase; */
  height: 40px;
  width: auto;
  margin: 0 20px 0 0;
}
.accordion-header h4 {
  width: 100%;
  margin: 0;
  padding-bottom: 0;
  color: var(--black);
  font-size: 18px;
  letter-spacing: 0;
}
.accordion__item {
  /* border-bottom: 1px solid #3a4ba4; */
  /* background-color: rgb(31 36 99); */
  padding: 10px 0 10px;
  /* border-radius: var(--radio); */
  margin-bottom: 0;
  transition: all .3s;
  border-bottom: solid 1px var(--m-grey);
}
.accordion__item:hover {
  background-color: rgba(255, 255, 255, 0.1);
}
.accordion__item .accordion__item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.accordion-header:hover {
  /* background: #2D3D99; */
  position: relative;
  z-index: 5;
}
.accordion-body .img-general {
  /* width: 50%; */
}
.accordion-body__contents {
  padding: 10px 61px;
  font-size: .85em;
}
.accordion-body__contents h5 {
  margin: 0;
  text-align: left;
  font-size: 18px;
  line-height: 22px;
}
.accordion-body__contents .tags {
  margin: 30px 0 10px;
}
.accordion__item.active:last-child .accordion-header {
  border-radius: none;
}
.accordion:first-child > .accordion__item > .accordion-header {
  border-bottom: 1px solid transparent;
}
.accordion__item > .accordion-header:after {
  /* font-family: IonIcons; */
  /* font-size: 1.2em; */
  float: right;
  position: absolute;
  /* top: -2px; */
  transition: .3s all;
  transform: rotate(0deg);
  content: '';
  background-image: url("../images/ico-arrow-down.png");
  width: 22px;
  height: 22px;
  background-size: 100% auto;
  /* right: 0; */
  top: 11px;
  right: 10px;
  transform: rotate(-0deg) !important;
}
.accordion__item.active > .accordion-header:after {
  transform: rotate(-180deg) !important;
}
.accordion__item.active .accordion-header {
  /* background: #2D3D99; */
}
.accordion__item .accordion__item .accordion-header {
  background: #f1f1f1;
  color: #353535;
}
.accordion-body {
  display: none;
}
@media screen and (max-width: 1000px) {
  .accordion {
    width: 100%;
  }
}
/************ fin accordion **********/
.faq{
	margin: 120px 0;
	/* display: inline-block; */
}
.faq h3{
    font-size: 23px;
    line-height: 25px;
    margin: 0;
}
/********** producto ************/
#producto{}
#producto .tabs-container .tab-content p{
	margin-bottom: 14px;
}
.producto{
    margin: 0 0 80px 0;
}
.prod-info{
    margin: 20px 0;
    display: grid;
    grid-template-columns: 58% 40%;
    margin: 40px 0;
    gap: 2%;
    /* background: red; */
    /* box-sizing: revert; */
}
.prod-photos{}
.photo-princ{
    width:100%;
    height:360px;
    border-radius:20px;
    overflow:hidden;
    position:relative;
    background: #fff;
    display: flex;
    align-items: center;
}
.photo-princ img{
	  width: auto;
	  height: 100%;
	  /* object-fit: unset; */
	  position:absolute;
	  /* top:0; */
	  /* left:0; */
	  opacity:0;
	  transform:scale(1.05);
	  transition:
        opacity .45s ease,
        transform .45s ease;
	  /* margin: 0 auto; */
	  /* left: 50%; */
	  transform: translateX(-50%);
	  inset-inline: 0;
	  margin-inline: auto;
	  max-width: 100%;
	  max-height: fit-content;
}
.photo-princ img.active{
    opacity:1;
    transform:scale(1);
    z-index:2;
}
.photo-mini{
    margin: 20px 0 0 0;
}
.photo-mini ul{
    display: flex;
    /* flex-wrap: nowrap; */
}
.photo-mini ul li{
    height: 80px;
    margin: 0 10px 0 0;
}
.photo-mini ul li a{
    border: solid 1px var(--l-grey);
    border-radius: var(--radio1);
    display: block;
    width: 100%;
    height: 100%;
}
.photo-mini ul li a:hover{
        border: solid 1px var(--m-grey);
}

.photo-mini ul li a img{
    height: 100%;
    /* display: block; */
}
.prod-desc{
    /* background: red; */
    /* box-sizing: content-box; */
}
.prod-desc h1{
    font-size: 34px;
    font-weight: 700;
    margin: 0;
    line-height: 34px;
    margin: 0 0 10px 0;
}
.prod-desc h2{
       font-size: 18px;
    line-height: 16px;
    margin: 0 0 20px 0;
    font-weight: 600;
}
.prod-desc .copy {
    margin: 20px 0;
}

.prod-desc .copy p{
    font-size: 16px;
    font-weight: 400;
    line-height: 28px;
}
.prod-desc a{
	margin: 0 0 10px 0;
}
.prod-dif{}
.prod-dif ul{
    display: flex;
}
.prod-dif ul li{
    height: 80px;
    margin: 0 10px 0 0;
    width: 100%;
    /* border: solid 2px var(--d-med); */
    border-radius: var(--radio1);
    display: flex;
    flex-direction: column;
    align-content: center;
    flex-wrap: wrap;
    padding: 18px 10px 10px 10px;
    box-sizing: border-box;
    justify-content: space-around;
    background-color: var(--l-grey);
}
.prod-dif-tit{
    color: var(--red);
    text-align: center;
    font-size: 30px;
    font-weight: 800;
}
.prod-dif ul li p{
    color: var(--black);
    font-size: 12px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
}
/********* tabs *******/
  .tabs-container{
      /* max-width:1100px; */
      margin: 0 0 60px 0;
      /* background:#f2f2f2; */
    }

    /* NAV TABS */
    .tabs-nav{
      display:flex;
      gap:50px;
      border-bottom:1px solid #d9d9d9;
    }

    .tab-btn{
      position:relative;
      background:none;
      border:none;
      font-size:22px;
      font-weight:700;
      cursor:pointer;
      padding:0 0 18px;
      color:#111;
      transition:.3s;
    }

    .tab-btn::after{
      content:"";
      position:absolute;
      left:0;
      bottom:-1px;
      width:0;
      height:3px;
      background:#ff4b3e;
      transition:.3s ease;
    }

    .tab-btn.active::after{
      width:100%;
    }

    .tab-content{
      display:none;
      padding-top:30px;
      line-height:1.6;
      /* font-size:18px; */
      font-size: 16px;
      font-weight: 300;
      line-height: 24px;
    }

    .tab-content.active{
      display:block;
      animation:fade .35s ease;
    }

    @keyframes fade{
      from{
        opacity:0;
        transform:translateY(10px);
      }
      to{
        opacity:1;
        transform:translateY(0);
      }
    }

    .tab-content ul{
      margin-top:10px;
      padding-left:20px;
    }

    .tab-content li{
      margin-bottom:8px;
    }

    .tab-content strong{
      font-weight:700;
    }
.prod-rel{}
.prod-rel h3{
    font-size: 22px;
    margin: 0 0 30px 0;
}
.prod-rel ul{
    display: flex;
    width: 100%;
}
.prod-rel ul li{
    margin: 0 2% 0 0;
    width: 100%;
}
.prod-rel ul li a{}
.prod-rel ul li a .foto{
    height: 100px;
    margin: 0 0 6px 0;
    border: solid 1px var(--m-grey);
    border-radius: var(--radio1);
    width: auto;
    display: flex;
    /* width: 160px; */
    align-items: center;
}
.prod-rel ul li a:hover .foto{
	border: solid 1px var(--red);
}
.prod-rel ul li a:hover p{
	 color: var(--black);
}
.prod-rel ul li a .foto img{
    height: 92%;
    width: auto;
    margin: 0 auto;
    border-radius: 10px;
}
.prod-rel ul li a p{
    color: var(--d-grey);
    font-weight: 500;
    /* text-wrap: inherit; */
}
/******* donde comprar ********/
#comprar-head{
    position: relative;
    /* height: 200px; */
    background-image: url("../images/bk-comprar-int2.png");
    background-size: auto 100%;
    background-position: right center;
    background-repeat: no-repeat;
    border-radius: var(--radio1);
    overflow: hidden;
}
#comprar-head:before{
	content: "";
	position: absolute;
	background-color: rgba(0,0,0,0.7);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 0;
}
.mapa-comprar h1{
    font-size: 48px;
    font-weight: 500;
    margin: 0;
    color: var(--white);
}
.mapa-comprar .copy h2{
    font-size: 18px;
    font-weight: 400;
    color: var(--white);
}
.mapa-comprar .buscador, .tutoriales-indice .buscador{
    width: 100% !important;	
}
.mapa{
	margin: 40px 0;
}
.resultado{
    border-radius: var(--radio1);
    padding: 40px;
}
.buscador{
    display: flex;
    align-items: center;
}
.buscador form{
	width: 100%;
}
.buscador p{font-weight: 600;}
.buscador-input{}
.buscador-input input{
    border-radius: var(--radio1);
    border: solid 1px var(--m-grey);
    padding: 10px;
    margin: 0 0 0 20px;
}

.table-wrap{
    max-width:1200px;
    margin:auto;
    overflow-x:auto;
}

.service-table{
    width:100%;
    border-collapse:collapse;
    background:#fff;
}

.service-table thead th{
    text-align:left;
    font-size:14px;
    font-weight:700;
    color:#111;
    padding:18px 20px;
    border-bottom:1px solid #dcdcdc;
}

.service-table tbody td{
    padding: 6px 20px;
    vertical-align:top;
    font-size:14px;
    color:#222;
    line-height:1.6;

}

.service-table tbody tr{
    border-bottom:1px solid #efefef;
}

.service-table tbody tr:last-child{
    border-bottom:none;
}

.service-table strong{
    font-weight:700;
}

.map-col{
    width:90px;
    text-align:center;
}

.map-col a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition:.2s;
}
.map-col a img{
  width: 20px;
  height: auto;
}

.map-col a:hover{
    transform: scale(1.3);
}
/********** ayuda *********/
.ayuda h1{
    font-size: 48px;
    font-weight: 500;
    margin: 0 0 30px 0;
    color: var(--white);
    line-height: 48px;
}
.ayuda .copy h2{
    font-size: 18px;
    font-weight: 400;
    color: var(--white);
}
.ayuda .faq{
    margin: 60px 0;
    padding: 40px;
    border-radius: var(--radio1);
}
.ayuda .faq h3{}
.ayuda .faq h4{
    /* width: 100%; */
    margin: 10px 0;
    /* padding-bottom: 0; */
    /* color: var(--black); */
    font-size: 18px;
    letter-spacing: 0;
}
.alert{
    border: solid 1px var(--red);
    border-radius: var(--radio1);
    margin: 0px 0;
    display: inline-block;
    flex-direction: row;
    padding: 20px;
}
.alert img{
    width: 40px;
    height: 40px;
    /* display: list-item; */
    margin: 0 30px 160px 20px;
    float: left;
}
#soporte-head{}
.soporte-head{
    z-index: 1;
    position: relative;
}

.txt-white{
	color: var(--white);
	
}
.soporte-quick .faq{
	margin: 40px 0;
}
.reminder{
    display: flex;
    align-items: start;
    gap: 4%;
    background-color: var(--black);
    border-radius: var(--radio1);
    padding: 20px 20px;
}
.reminder img{
    width: 30px;
    height: auto;
}
.reminder p{
    padding: 7px 0 0 0;
    margin: 0;
    flex-direction: column;
    font-size: 14px;
    line-height: 16px;
}
.sidebar {
  width: 260px;
  border: 0.5px solid var(--color-border-tertiary);
  border-radius: var(--border-radius-lg);
  overflow: hidden;
  background: var(--color-background-primary);
}

.menu-item + .menu-item {
  border-top: 0.5px solid var(--color-border-tertiary);
}

.menu-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  /* background: transparent; */
  border: none;
  cursor: pointer;
  /* font-size: 14px; */
  /* font-weight: 500; */
  /* color: var(--color-text-primary); */
  text-align: left;
  transition: background 0.15s;
  text-transform: uppercase;
  height: 30px;
  /* background: red; */
}

.menu-trigger:hover {
  background: var(--color-background-secondary);
}

.menu-trigger.active {
  /* color: #8007C6; */
}

.menu-trigger .ti {
  font-size: 16px;
  color: var(--color-text-secondary);
  transition: transform 0.2s;
}

.menu-trigger.active .ti {
  /* transform: rotate(180deg); */
  /* color: #8007C6; */
}

.menu-content {
  display: none;
  background: var(--color-background-secondary);
  border-top: 0.5px solid var(--color-border-tertiary);
}

.menu-content.open {
  display: block;
}

.menu-content ul {
  list-style: none;
  margin: 0;
  /* padding: 6px 0; */
}

.menu-content ul li a {
  display: flex;
  align-items: center;
  /* padding: 8px 20px; */
  /* font-size: 13px; */
  color: var(--d-grey);
  text-decoration: none;
  transition: color 0.15s, background 0.15s;
  /* text-transform: lowercase; */
  /* text-transform: capitalize; */
  text-transform: initial;
}
.menu-content ul li a:first-letter {
    text-transform: uppercase;
}

.menu-content ul li a:hover {
  color: var(--color-text-primary);
  background: var(--color-background-primary);
}
.buscador input {
    width: 100%;
    padding: 18px 25px;
    border-radius: 40px;
    border: none;
    font-size: 18px;
    box-sizing: border-box;
    outline: none;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.tutoriales-indice {
    display: flex;
    flex-direction: column;
}
.resultado-list{
    padding: 40px 20px;
    display: grid;
    grid-template-columns: 47% 47%;
    column-gap: 6%;
    box-sizing: unset;
}
.resultado-list a p{
    color: var(--d-grey);
}
.resultado-list a img{
    /* transform: rotate(135deg); */
    height: 17px !important;
    /* display: none; */
}

.clear{
    height: 20px;
    background: red;
    clear: both;
	display: none;
}
.faq {
    display: block;
    width: 100%;
    position: relative;
    clear: both;
    margin: 60px 0;
    grid-column: 1 / -1; 
}
.categorias-int::after {
    content: "";
    display: table;
    clear: both;
}
.menu-blog{}
.menu-blog li a{
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: var(--mb) 0;
    /* padding: 0; */
}
.menu-blog li a img{
    width: 33%;
    margin: 0 14px 0 0;
    border-radius: var(--radio1);
}
.menu-blog li a p{
    font-size: 14px;
    font-weight: 600;
    text-align: left;
    line-height: 16px;
}
.menu-blog li:hover a p{}
.blog-contenido{
    display: block;
}
.blog-contenido .blog-texto ul{
	list-style: disc;
	padding: 10px 0 0 30px;
	font-size: 16px;
	margin: 0 0 20px 0;
	font-weight: 300;
	line-height: 24px;
}
.blog-contenido h2{
    line-height: 32px;
}
.blog-contenido .imagen{
    margin-bottom: 30px;
    width: 100%;
}
.blog-contenido .imagen img{
    border-radius: var(--radio1);
}
.blog-contenido .dato{
    margin-bottom: var(--mb);
    font-weight: 500;
}
.blog-texto p > br:first-child, .tabs-container p > br:first-child, .tabs-container .tab-content > br:first-child{
 /* display: none; */
}

/***** nosotros *****/
#nosotros-head{
	 background-image: url("../images/bk-nosotros-head.png");
	 background-size: 100% auto;
	 background-position: center bottom;
	 background-repeat: no-repeat;
	 /* border-radius: var(--radio1); */
	 height: 250px;
	 background-color: #9fc6da;
	 display: flex;
	 align-items: center;
}
.nosotros-head{}
.nosotros-head h1{
    text-align: center;
    font-weight: 500;
    font-style: italic;
    margin: 0;
    color: var(--white);
    background-color: rgba(0,0,0,0.6);
    padding: 30px;
    border-radius: var(--mb);
}
.nosotros-text-cont{
    margin: 0 0 80px 0;
    /* display: grid; */
    /* grid-template-columns: 50% 50%; */
}
.nosotros-text-cont2{
    margin: 0 0 80px 0;
    /* display: grid; */
    /* grid-template-columns: 100%; */
    background-color: var(--l-grey);
    padding: 40px;
    border-radius: var(--mb);
}
.jorge{
	display: grid;
	grid-template-columns: 40% 50%;
	gap: 30px;
	margin: 0;
	align-items: center;
}
.equipo{
	display: grid;
	grid-template-columns: 36% 60%;
	gap: 50px;
	margin: 0;
	align-items: center;
	width: 100%;
	/* position: relative; */
	/* inset: revert-rule; */
}
.equipo img{
	border-radius: var(--mb);
}
.nosotros-text-cont .copy img{
	border-radius: var(--mb);
}
.nosotros-copy{
    font-size: 16px !important;
}
.col-2-2{
    /* display: grid; */
    /* reading-flow: grid-rows; */
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2%;
}
.box-txt{
    padding: 30px;
    box-sizing: border-box;
    border-radius: var(--mb);
}
.box-txt h1, .valores h1{
    font-size: 48px;
}
.valores{
    margin: 80px 0;
}
.valores-col .content{
	display: grid;
	grid-template-columns:repeat(5,1fr);
	gap: 20px;
	margin: 40px auto 80px;
	width: 96%;
}
.valores-ind{
    background-color: var(--l-grey);
    padding: 30px;
    border-radius: var(--mb);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.valores-ind img{
    width: 30px;
    margin: 0 0 10px 0;
}
.valores-ind p{font-weight: 600;font-size: 22px;line-height: 24px;color: var(--black);}
.valores-ind p span{
    color: var(--red);
}
#cierre{
	 background-image: url("../images/bk-cierre.png");
	 background-size: 60%;
	 background-position: right center;
	 background-repeat: no-repeat;
	 background-color: #2e450a;
	 margin: 0 0 120px 0;
}
.cierre{
    width: 50%;
}
.cierre .copy{
	
color: var(--white);
	
font-size: 20px;
}
.videos{}
.videos-cont{
	
	margin: 40px 0;
	}
.videos-grid{
	display: grid;
	grid-template-columns: repeat(4,1fr);
	gap: 20px;
	align-items: center;
}
.videos-grid > :last-child {
    grid-column: span 2;
}
.video-ind{
	background-color: black;
}
.wsp {
    position: fixed;
    width: 70px;
    height: 70px;
    right: 40px;
    bottom: 20px;
    z-index: 9999;
}

.wsp a {
    display: block;
    width: 100%;
    height: 100%;
}

.wsp a img {
    display: block;
    width: 100%;
    height: 100%;
}

.wsp-tooltip {
    position: absolute;
    right: -27px; /* Lo ubica exactamente a la izquierda del botón de WhatsApp */
    bottom: 80px; /* Lo alinea verticalmente de forma centrada respecto al botón */
    background: #25D366;
    color: #fff;
    padding: 8px 14px;
    border-radius: 6px;
    font-size: 14px;
    font-family: Arial, sans-serif;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
}

/* Flecha apuntando hacia la derecha (hacia el botón de WhatsApp) */
.wsp-tooltip::after {
    content: "";
    position: absolute;
    top: 118%;
    left: 65%; /* Sale del borde derecho del tooltip */
    transform: translateY(-50%) rotate(90deg);
    border-width: 7px;
    border-style: solid;
    border-color: transparent transparent transparent #25D366;
}

/* Activación al hacer hover en el contenedor */
.wsp:hover .wsp-tooltip {
    opacity: 1;
    visibility: visible;
}
/******* formulario ********/

.contact-section{
    padding:70px 20px;
}

.contact-container{
    /* max-width:700px; */
    margin: 0 auto;
    /* background:#fff; */
    /* padding:40px; */
    /* border-radius:12px; */
    /* box-shadow:0 12px 30px rgba(0,0,0,.08); */
}

.contact-container h2{
    font-size:32px;
    margin-bottom: 40px;
    color:#222;
}

.contact-container p{
    color:#666;
    margin-bottom:30px;
}

.form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.form-group{
    margin-bottom:20px;
}

.form-group label{
    display:block;
    margin-bottom:8px;
    font-weight:600;
    color:#333;
}

.contact-form input,
.contact-form select,
.contact-form textarea{
    width:100%;
    padding:14px 16px;
    border:1px solid #d9d9d9;
    border-radius:8px;
    font-size:15px;
    transition:.3s;
    background:#fff;
    box-sizing: border-box;
}

.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus{
    outline:none;
    border-color:#0d6efd;
    box-shadow:0 0 0 4px rgba(13,110,253,.15);
}

.contact-form textarea{
    resize:vertical;
    min-height:160px;
}

.btn-enviar{
    display:inline-block;
    width:100%;
    border:none;
    background: #b51410;
    color:#fff;
    padding:16px;
    font-size:17px;
    font-weight:bold;
    border-radius:8px;
    cursor:pointer;
    transition:.3s;
}

.btn-enviar:hover{
    background: #eb2824;
}

.btn-enviar:active{
    transform:scale(.98);
}
#contacto-head{
	 background-image: url("../images/bk-contacto-head.jpg");
	 background-size: 100% auto;
	 background-position: center bottom;
	 background-repeat: no-repeat;
	 /* border-radius: var(--radio1); */
	 height: 250px;
	 background-color: #9fc6da;
	 display: flex;
	 align-items: center;
}

@media(max-width:768px){

    .contact-container{
        padding:30px;
    }

    .form-grid{
        grid-template-columns:1fr;
        gap:0;
    }

    .contact-container h2{
        font-size:28px;
    }

}
/****** buscador ******/
.buscador{
    width: 14%;
}
.buscador button{
    width: 100%;
    border: solid 1px var(--red);
    background-color: transparent;
    border-radius: 50px;
}
.buscador button span{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.buscador button span svg{
    width: 24px;
    height: 24px;
}
/******* resultados ********/
#searchOverlay{
	  position:fixed;
	  top:0;
	  left:0;
	  width: 100dvw;
	  background:#fff;
	  padding: 40px;
	  box-shadow:0 12px 40px rgba(0,0,0,.12);
	  opacity:0;
	  visibility:hidden;
	  /* transform:translateY(-15px); */
	  transition:
        opacity .25s,
        transform .25s,
        visibility .25s;
	  z-index:999;
	  box-sizing: border-box;
}
#searchOverlay.active{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.search-overlay{
    width:1300px;
    max-width: 100%;
    margin: 0;
    /* box-sizing: border-box; */
}

.search-top{
    display:flex;
    align-items:center;
    gap: 2%;
    box-sizing: content-box;
    width: 100%;
}

.search-box{
    flex:1;
    border: 1px solid var(--red);
    height:50px;
    display:flex;
    align-items:center;
    padding:0 15px;
    width: 86%;
	border-radius: 50px;
}

.search-box svg{
    margin-right:10px;
    flex-shrink:0;
}

.search-box input{
    width:100%;
    border:none;
    outline:none;
    font-size: 18px;
    font-weight:300;
}

.search-box input::placeholder{
    color:#444;
}

.close-search{
    color:#222;
    text-decoration:none;
    font-size:18px;
    width: 10%;
    /* background: red; */
    /* box-sizing: unset; */
    text-align: center;
    border: solid 1px var(--m-grey);
    height: 50px;
    display: grid;
    align-items: center;
	border-radius: 50px;
}

.search-overlay h3{
    margin: 20px 0;
    font-size:20px;
    font-weight:700;
}

.results{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap: 2%;
}

.results article h4{
    margin-bottom:12px;
}

.results a{
    color:#111;
    text-decoration:none;
    font-size: 16px;
    font-weight: 500;
    /* line-height:1.4; */
    margin: 0 0 14px 0;
}
.results a:hover{
    
    text-decoration: underline;
    
}

.results article p{
    color:#333;
    font-size:16px;
    line-height:1.6;
}

.btn-results{
    display:inline-block;
    margin-top:55px;
    padding:16px 30px;
    background:#1f1f1f;
    color:#fff;
    text-decoration:none;
    font-size:16px;
    transition:.25s;
}

.btn-results:hover{
    background:#000;
}

@media (max-width:900px){

    .results{
        grid-template-columns:1fr;
        gap:35px;
    }

    .search-top{
        flex-direction:column;
        align-items:stretch;
    }

    .close-search{
        align-self:flex-end;
    }

}
#locacion, .locacion{
    width:100%;
    height:350px;
    border-radius:12px;
    overflow:hidden;
}
.pagination{
	display: flex;
    gap: 10px;
    justify-content: center;
}
.pagination a{
	    font-size: 16px;
}
.pagination a.active{
	    color: var(--red);
}
.nota{
    background-color: #eeeeee;
    padding: 30px 30px;
    border-radius: var(--radio1);
    margin: 80px 0 0;
    display: flex;
    flex-direction: column;
}
.nota img{
    width: 40px;
    margin: 0 0 20px;
}
.nota p{
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
}
.txt-white{
	color: var(--white);
}
.soporte-atajos h2{
    font-size: 30px;
    line-height: 30px;
    font-weight: 500;
    color: var(--white);
}
.soporte-atajos .alert{
 
    padding: 20px;
    width: 100%;
    box-sizing: border-box;
    margin: 20px 0 0 0;
    color: var(--white);
}
.mt-small{
	margin: var(--mw) 0 0 0 ;
}
#soporte-redes{}
.soportes-redes{}
.soportes-redes .atajo-cont{
	  display: grid;
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     gap: 2%;
}
.reel-player-overlay-main-content:before{
	  content: "";
   position: absolute;
   inset: 0;
   /* background: linear-gradient(to left, rgba(48 4 4 /  0) 100%, rgba(0 0 0 / 100%) 60%); */
   z-index: 1;
   width: 100%;
   left: 0;
   background-color: rgba(0,0,0,0);/* box-sizing: border-box; */
   right: auto;
}
.reel-player-overlay-main-content {
    background-color: rgb(0 0 0 / 63%) !important;
}
/******* donde comprar ******/
.buscador{
	margin-bottom:20px;
}

.buscador input{
	width:100%;
	padding:18px 25px;
	border-radius:40px;
	border:none;
	font-size:18px;
	box-sizing:border-box;
	outline:none;
	box-shadow:0 0 10px rgba(0,0,0,0.1);
}

.box{
	display:flex;
	height:700px;
	background:#fff;
	border-radius:10px;
	overflow:hidden;
	box-shadow:0 0 10px rgba(0,0,0,0.15);
}

.lista{
	width:400px;
	overflow-y:auto;
	border-right:1px solid #ddd;
	background:#fff;
}

.item{
	padding:20px;
	border-bottom:1px solid #ddd;
	cursor:pointer;
	transition:all 0.2s;
}

.item:hover{
	background:#f7f7f7;
}

.item h3{
	margin:0 0 15px 0;
	font-size:22px;
	color:#222;
}

.item p{
	margin:7px 0;
	color:#555;
	line-height:1.4;
	font-size:15px;
}

#map{
	flex:1;
	height:500px;
}

.icono{
	color: var(--red);
	font-weight:bold;
	margin-right:6px;
}

@media(max-width:900px){

	.box{
		flex-direction:column;
		height:auto;
	}

	.lista{
		width:100%;
		height:300px;
	}

	#map{
		height:500px;
	}
}

/****** fin donde comprar ******/
.header .buscador{
	margin-bottom:0 !important;
}
.boton-link-yt{}
/******** tablas **********/
.blog-texto table {
    width: 100%;
    border-collapse: collapse;
    
    /* color: #111; */
}

.blog-texto table th, .blog-texto 
table td {
    border-bottom: 1px solid #000;
    padding: 9px 12px;
    text-align: left;
    font-size: 16px;
    font-weight: 300;
}
.blog-texto table td strong {
    
    font-weight: 600;
}

.blog-texto table th {
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.08em;
}

.blog-texto table tr:last-child td {
    /* border-bottom: 2px solid #000; */
}

.blog-texto table tr:hover td {
    background: #f5f5f5;
}