/* ESTILOS GENERALES CSNET */

:root{
	--principal: #FF0000;
	--secundario: #ea4e4e;
	--negro: #131313;
}

@font-face {
	font-family: 'Open Sans';
	src: url('/fuentes/OpenSans/OpenSans-Light.ttf');
	font-style: normal;
	font-weight: 300;
}

@font-face {
	font-family: 'Open Sans';
	src: url('/fuentes/OpenSans/OpenSans-Regular.ttf');
	font-style: normal;
	font-weight: 400;
}

@font-face {
	font-family: 'Open Sans';
	src: url('/fuentes/OpenSans/OpenSans-SemiBold.ttf');
	font-style: normal;
	font-weight: 600;
}

@font-face {
	font-family: 'Open Sans';
	src: url('/fuentes/OpenSans/OpenSans-Bold.ttf');
	font-style: normal;
	font-weight: 700;
}


.fondo-principal{
	background-color: var(--principal);
}

.color-principal{
	color: var(--principal);
}

.boton-principal{
	color: white;
	background-color: var(--principal);
	border: 1px solid var(--principal);
	font-weight: 500;
	transition: all .2s;
}

.boton-principal:hover{
	color: white;
	opacity: .7;
	text-decoration: none;
	/* background-color: var(--secundario);
	border: 1px solid var(--secundario); */
}

.boton-outline-principal{
	color: var(--principal);
	border: 1px solid var(--principal);
}

.boton-outline-principal:hover{
	color: white;
	background-color: var(--principal);
}

.fw-semibold{
	font-weight: 600;
}

body{
	font-family:'Open Sans', sans-serif;
	background-color: white;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	font-size: 1rem;
}

main{
	flex-grow: 1;
}

.boton-clausula{
	width: fit-content;
	border: 1px solid rgb(190, 190, 190);
}

.boton-clausula:focus:not(:focus-visible), .boton-clausula:not(.collapsed){
    color: var(--negro);
    box-shadow: none;
    background-color: transparent;
	border: 1px solid rgb(190, 190, 190);
}

.boton-clausula:not(.collapsed)::after{
    background-image: url('/imagenes/iconos/chevron-down.svg'), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	
}

.card-noticia {
	text-decoration: none;
	color: var(--negro);
	transition: all .2s;
}

.card-noticia:hover {
	color: var(--negro);
	opacity: .7;
}

.noticia a{
	color: var(--principal);
	text-decoration: none;
	transition: all .2s;
}

.noticia a:hover{
	opacity: .7;
}

ul.pagination{
	justify-content: center;
	margin-bottom: 3em;

}

.pagination .page-item.active .page-link{
	background-color: var(--verde1);
	border-color: var(--verde1);
}

.pagination .page-link{
	color: var(--verde1);
}

.pagination .page-link:focus{
	box-shadow: none;
}

.pagination .page-item:first-child .page-link, .pagination .page-item:last-child .page-link{
	border-radius: 0;
}


.pie a:hover{
	color: var(--negro);
}

/* FIN DE ESTILOS GENERALES CSNET */

a{
	color: var(--negro);
	text-decoration: none;
	font-weight: 600;
}

a:hover{
	text-decoration: underline;
}

.pie{
	background-color: white;
}
.menu-principal{
	z-index: 100;
}
.menu-principal .nav-link{
	color: white;
	font-weight: 300;
	opacity: .7;
}
.menu-principal .nav-link:hover{
	text-decoration: none;
	opacity: 1;
}

.navbar-toggler:focus, .btn-close:focus{
	box-shadow: none;
}

.menu-principal .btn-close{
	background: none;
	width: 36px;
	height: 36px;
}
.menu-principal .btn-close svg{
	display: block;
}
.menu-principal .imagen-logo{
	width: 500px;
}

.portada-index .carousel-item{
	min-height: 100vh;
	background-attachment: fixed;
}

.portada-index .carousel-item.item-1{ background-image: url('/imagenes/paginas/index/Innova-teco-home1.jpg'); }
.portada-index .carousel-item.item-2{ background-image: url('/imagenes/paginas/index/Innova-teco-home2.jpg'); }
.portada-index .carousel-item.item-3{ background-image: url('/imagenes/paginas/index/Innova-teco-home3.jpg'); }
.portada-index .carousel-item.item-4{ background-image: url('/imagenes/paginas/index/Innova-teco-home4.jpg'); }

.cabecera-pagina{
	min-height: 40vh;
	background-image: url('/imagenes/assets/cabecera-paginas.jpg');
	background-size: cover;
	background-position: center center;
}

.titulo-pagina{
	border-bottom: 8px solid white;
}

.link-galeria{
	cursor: pointer;
}

img.tabla-oficina-tecnica{
	max-width: 800px;
}

/* TRATAMIENTOS HORNOS */
.ventajas-tratamientos li::marker{
	color: var(--secundario);
}

a.link-pdf:hover{
	text-decoration: none;
	color: var(--negro);
}
.card-tratamientos-hornos{
    transition: all .3s;
}

.card-tratamientos-hornos:hover{
    opacity: .6;
}

.cabecera-card{
    width: 100%;
    background-color: #d1d2d4;
    border-bottom: 5px solid var(--secundario);
    color: var(--secundario);
    padding: 1rem 2rem;
    text-align: start;
}

.codigo-seccion-1{
    padding: .5rem 1rem;
    border: 2px solid var(--secundario);
    white-space: nowrap;
}

.titulo-seccion-1{
    padding: .5rem 1rem;
    background-color: var(--secundario);
}

.caja-tratamientos-rodillos{
	border: 1px solid var(--secundario);
	color: var(--secundario);
	cursor: pointer;
	transition: opacity .2s;
}

.caja-tratamientos-rodillos:hover{
	color: var(--secundario);
	text-decoration: none;
	opacity: .6;
}

/* MATERIAS PRIMAS */

.img-square-wrapper {
    position: relative;
    width: 100%;
    padding-top: 100%; /* esto mantiene el cuadrado */
    overflow: hidden;
}

.img-square-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* recorta la imagen manteniendo proporción */
}


@media (max-width: 767.5px){
	.menu-principal .imagen-logo{
		width: 250px;
	}
	.container {
		padding-left: 14px;
		padding-right: 14px;
	}
}
@media (min-width: 1400px){
	.container {
		max-width: 1200px;
	}
}