/**
 * Theme Name:     EntreCuatroParedes
 * Author:         Kadence WP
 * Template:       kadence
 * Text Domain:	   entrecuatroparedes
 * Description:    Kadence Theme is a lightweight yet full featured WordPress theme for creating beautiful fast loading and accessible websites, easier than ever. It features an easy to use drag and drop header and footer builder to build any type of header in minutes. It features a full library of gorgeous starter templates that are easy to modify with our intelligent global font and color controls. With extensive integration with the most popular 3rd party plugins, you can quickly build impressive ecommerce websites, course websites, business websites, and more.
 */

/* 	
	--global-palette1: #e20613;
	--global-palette2: #cc0000;
	--global-palette3: #000000;
	--global-palette4: #3c3c3b;
	--global-palette9: #ffffff; 
*/

h1, h2, h3, h4, p, strong, div{
	font-family: 'Helvetica Neue', sans-serif !important;
}

.rojo{
	color: var(--global-palette1);
}

.hight-tide{
	font-family: 'High Tide', sans-serif !important;
}

/* MENU */

header{
	font-family: 'Helvetica Neue', sans-serif;
	font-size: 20px;
	font-weight: 200;
}

.header-button{
	font-size: 20px !important;
	padding: 0.3em 0.8em !important;
}

header img{
	padding-block: 1rem;
}

.header-hover:hover{
	color: var(--global-palette1) !important;
}

/* INICIO */

/* PORTADA INICIO */

.portada-inicio {
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    height: 100vh;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
}

.h1-inicio {
    font-family: 'Helvetica Neue', sans-serif;
	font-weight: 600;
	text-shadow: 0rem 0.7rem 0.7rem #0005;
}

.texto-portada-inicio{
	text-shadow: 0rem 0.8rem 0.8rem #0005;
	font-family: 'Helvetica Neue', sans-serif;
	font-weight: 200;
}

.btn-inicio{
	width: 12rem;
	background:none !important;
	border: 2px solid #fff !important;
	height:2.75rem;
	
}
.btn-inicio:last-of-type:hover{
	background-color:#fff !important;

	color:#000 !important;
}


.btn-inicio:first-of-type{
	color:#000 !important;
	background-color:#fff !important;
	
}

.btn-inicio:first-of-type:hover{

   box-shadow: 0 3px 17px #0008 !important; /* Resplandor blanco sutil */
}

/* MARCAS INICIO */

.titulo-marcas-inicio{
	font-family: 'High Tide', sans-serif !important;
	font-size: 70px;
	font-weight: 400;
}
.fuente-fresca{
	font-family: 'Fresca', sans-serif;
	font-size: 50px;
	font-weight: 400;
}
/* SERVICIOS INICIO */

.tarjetas-inicio{
/* 	background-image: url('/wp-content/uploads/2024/09/manchas-tarjeta-2-e1727361061359.png'); */
	background-size: cover;
	background-position: center;
	font-family: 'Helvetica Neue', sans-serif;
	font-weight: 400;
}

.fuenteDestacada{
	font-family: 'High Tide', sans-serif;
	font-size: 120px;
	font-weight: 400;
}



/* GALERIA INICIO */

.imagenes-galeria-inicio{
	transition: filter 0.3s ease;
}

.imagenes-galeria-inicio:hover{
	filter: brightness(0.5);
}

/* PROYECTOS DESTACADOS INICIO */

.proyectos-grid {
    height: 77vh;
    display: grid;
    padding-inline: 6%;
    grid-template-columns: repeat(4, 1fr); 
    grid-template-rows: repeat(3, 1fr); 
    gap: 10px; 
}

.proyecto-destacado {
    position: relative;
    background-size: cover;
    background-position: center;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: white;
}

.proyecto-destacado h3 {
    margin: 0;
    font-size: 1.5rem;
	color: white;
}

.proyecto-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7); 
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    text-align: center;
    padding: 20px;
}

.proyecto-overlay h3{
	font-size: 10px;
}

.proyecto-destacado:hover .proyecto-overlay {
    opacity: 1;
}

.proyecto-overlay h3 {
    margin: 0;
    font-size: 1.5rem;
    padding: 0 10px;
}

.proyecto-destacado a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1; 
    text-decoration: none;
}

/* Distribución de las áreas del grid */

.proyecto-destacado:first-child{
    grid-column: span 2;
    grid-row: span 2;
}

.proyecto-destacado:nth-child(4){
    grid-column: span 2;
}

.proyecto-destacado:nth-child(6){
    grid-column: span 2;
}

/* CONOCENOS */

/* PORTADA CONOCENOS */

.texto-largo-conocenos1{
	text-align: justify;
	margin-right: 2rem;
}

.texto-largo-conocenos2{
	text-align: justify;
}

.h1-peque-conocenos{
	font-size: 45px;
	font-weight: 200;
	font-style: normal;
}

.h1-vizcaya-conocenos{
	font-size: 90px;
}

.section-conocenos{
	position: relative;
}

.section-conocenos::before {
  	content: "";
  	position: absolute;
  	top: 0;
  	left: 0;
  	width: 100%;
  	height: 100%;
  	background-image: url('/wp-content/uploads/2024/09/manchaRoja1.png'); /* Añade la ruta de tu imagen */
  	background-size: 28%; /* Ajusta el tamaño del fondo */
  	background-repeat:no-repeat;
  	background-position: -15% 50%; /* Centra la imagen de fondo */
  	z-index: 1; /* Envía el fondo detrás del contenido */
  	opacity: 1; /* Ajusta la opacidad del fondo */
}

.section-conocenos::after {
  	content: ""; 
  	position: absolute;
  	top: 0;
  	left: 0;
  	width: 100%;
  	height: 100%;
  	background-image: url('/wp-content/uploads/2024/09/manchaRoja2.png'); /* Añade la ruta de tu imagen */
  	background-size: 28%; /* Ajusta el tamaño del fondo */
  	background-repeat:no-repeat;
  	background-position: 115% 135%; /* Centra la imagen de fondo */
  	z-index: 1; /* Envía el fondo detrás del contenido */
  	opacity: 1; /* Ajusta la opacidad del fondo */
}




.margin-conocenos{
	margin-right:0 !important;
}

/* SLIDER EQUIPO */

/* Estilo del contenedor entero (section) */
.swiper-container-conocenos{
	padding: 0rem 0rem 5rem;
}

/* Estilo general para las tarjetas */
.team-member-card {
    position: relative;
    width: 75%;
    height: 55vh;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
	margin: auto;
}

/* Imagen que ocupa toda la tarjeta */
.team-member-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

/* Estilo para el overlay */
.team-member-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    text-align: center;
	padding: 0;
}

/* Mostrar el overlay al hacer hover */
.team-member-card:hover .team-member-overlay {
    opacity: 1;
}

/* Efecto de zoom en la imagen al hacer hover */
.team-member-card:hover .team-member-image {
    transform: scale(1.1);
}

/* Título y posición dentro del overlay */
.team-member-overlay h3 {
	color: #fff;
    font-size: 1.5em;
    margin: 0 0 10px;
}

.team-member-overlay p {
    font-size: 1em;
    margin: 0;
}

/* Estilo de los bullets de paginación */
.swiper-pagination-conocenos {
    text-align: center;
    margin-bottom: 0px !important;
	margin: 0 5% !important;
}

.pagination-slider-conocenos{
	display: flex;
	display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding-block: 3rem;
}

/* Personalizar los bullets */
.swiper-pagination-bullets {
	position: initial !important;
	width: initial !important;
}

.swiper-pagination-bullet {
    width: 15px !important;
    height: 15px !important;
    background-color: #000 !important;
    margin: 0 10px !important;
	transition: opacity 0.3s ease !important;
}

/* Cambiar el color y opacidad al hover */
.swiper-pagination-bullet:hover {
    opacity: 1;
}

/* Estilo para el bullet activo */
.swiper-pagination-bullet-active {
    background-color: #ff0000;
    opacity: 1;
}

/* SERVICIOS /

/ PORTADA SERVICIOS */

.portada-servicios {
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.h1-servicios {
    font-family: 'Helvetica Neue', sans-serif;
    font-weight: 600;
    text-shadow: 0rem 0.7rem 0.7rem #0005;
}

.h1-peque-servicios{
	font-size: 43px;
	font-weight: 200;
	font-style: normal;
}

.texto-portada-servicios{
    text-shadow: 0rem 0.8rem 0.8rem #0005;
    font-family: 'Helvetica Neue', sans-serif;
}

.section-info-servicios img{
	height: 85vh;
}

.carrusel-servicios img:nth-child(2){
    margin: 0rem 10rem !important;
}

/* SLIDER SERVICIOS */

/* Contenedor general del slider */
.swiper-container-servicios {
    width: 100%;
    height: auto; /* Ajusta la altura según tus necesidades */
    margin: 0 auto; /* Centrar el slider */
	pointer-events: none !important;
}

/* Cada slide */
.swiper-slide-servicios {
	display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    height: auto;
}

/* Estilo para las imágenes */
.swiper-slide-servicios img {
    width: 100%;
    height: 600px;
    object-fit: cover;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}

.swiper-3d {
    perspective: 500px !important;
}

/*CONTACTO*/

.portada-contacto{
	height: 70vh;
	display: flex;
	align-items: center;
}

.portada-contacto > div:nth-child(2){
	height: 70vh;
	display: flex;
    justify-content: center;
    align-items: center;
}

.tarjetas-contacto > div:first-child{
	height: 100%;
}

.bloque-tarjetas-contacto > div:first-child{
	box-shadow:0rem 0rem 0.8rem #0005;
	padding:0rem;
	margin:0rem;
	border-radius:10px;
	width: 75%;
    max-width: none !important;
}

.h1-peque-contacto{
	font-size: 49px;
	font-weight: 200;
	font-style: normal;
}
.h1-secundario-contacto{
	font-size: 93px;
}

/* Formulario */

/* Contenedor del formulario */
.form-contacto {
	font-family: 'Helvetica Neue', sans-serif;
	background-color: var(--global-palette9);
    padding: 3rem 3rem 0.1rem 3rem;
    border-radius: 10px;
    box-shadow: 0rem 0rem 0.8rem #0005;
    max-width: 75%;
    margin: 0 auto;
	margin-block: 7rem;
}

/* Filas y columnas del formulario */
.form-row {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 2rem;
	width: 100%;
}

.form-row p{
	width: 100%;
}

.form-row label{
	display: block;
    margin-bottom: 5px;
	font-size: 20px;
	font-weight: 500;
}

.form-column {
    width: 48%;
    margin-right: 4%;
}

.form-column:last-child {
    margin-right: 0;
}

/* Campos de texto */
.form-contacto input[type="text"],
.form-contacto input[type="email"],
.form-contacto textarea {
    width: 100%;
    border: none;
    border-bottom: 2px solid #000;
    padding: 5px 0;
    font-size: 18px;
	font-weight: 200;
    background-color: transparent;
    outline: none;
    margin-top: 5px;
	font-family: 'Helvetica Neue', sans-serif;
}

/* Botón de envío */
.form-contacto input[type="submit"] {
    background-color: var(--global-palette1);
    color: white;
    padding: 10px 30px;
    font-size: 20px;
	font-weight: 200;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    display: block;
    margin: 30px auto 0;
    width: 150px;
    text-align: center;
}

.form-contacto input[type="submit"]:hover {
    background-color: #cc0000;
}

/* Placeholder y etiquetas */
.form-contacto::placeholder {
    color: #333;
    opacity: 1;
}

/* Mensajes de validación */
.wpcf7-not-valid-tip {
    color: red;
    font-size: 13px;
    margin-top: 5px;
    display: block;
}

.wpcf7-response-output{
	width: 75%;
	margin: 0 auto !important;
	margin-top: -8rem !important;
    margin-bottom: 10rem !important;
	border-radius: 10px;
}

/* Estilo general para el contenedor del checkbox */
.privacidad {
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
	font-size: 16px;
	font-weight: 500;
    margin-bottom: 10px; /* Espaciado inferior */
}

/* Estilo del checkbox */
.privacidad input[type="checkbox"] {
    appearance: none; /* Elimina el estilo predeterminado */
    width: 16px; /* Tamaño del checkbox */
    height: 16px; /* Tamaño del checkbox */
    border: 2px solid #000; /* Color del borde */
    border-radius: 4px; /* Bordes redondeados */
    cursor: pointer; /* Cambia el cursor al pasar por encima */
    position: relative; /* Para la pseudo-clase */
    outline: none; /* Elimina el contorno al seleccionar */
}

/* Estilo cuando el checkbox está seleccionado */
.privacidad input[type="checkbox"]:checked {
    background-color: #000; /* Color de fondo cuando está seleccionado */
    border: 2px solid #000; /* Color del borde cuando está seleccionado */
}

/* Crear una marca de verificación */
.privacidad input[type="checkbox"]:checked::after {
    content: "✔"; /* Marca de verificación */
    color: #fff; /* Color de la marca */
    position: absolute; /* Posiciona la marca en el centro */
    left: -1px; /* Ajusta según sea necesario */
    top: -7px; /* Ajusta según sea necesario */
    font-size: 18px; /* Tamaño de la marca */
	font-family: 'Helvetica Neue', sans-serif;
}

.wpcf7-list-item{
	margin: 0 0 0 0 !important;
}

.privacidad label{
	display: flex;
	align-items: center;
}

.privacidad input{
	margin-right: 10px;
}

/* PROYECTOS (archive-proyecto.php) */

/* Adaptación del CSS que ya tienes para la galería */
.h1-proyectos {
	position:absolute;
	z-index:10;
	color: var(--global-palette1);
	font-weight:400;
	filter: drop-shadow(0.2rem 0.2rem 0.2rem #0007);
	font-size: 9rem;
	margin-top:-7rem;
	margin-left:1rem;
	font-family: 'High Tide' !important;
}

.tarjetas-proyectos {
	margin-top: 10rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(26%, 2fr));
    grid-auto-rows: 300px;
    grid-gap: 10px;
	margin-inline: 10px;
	margin-bottom:20px;
}

.imagen-proyectos {
/* 	 */
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    position: relative;
}

.item-proyectos:hover .overlay {
    opacity: 1;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.4s;
}

.titulo-proyectos {
    font-size: 1.5rem;
    text-align: center;
    color: #fff;
}

/* PROYECTO (single-proyecto.php) */

/* Contenedor principal del proyecto */
.proyecto-contenedor {
    max-width: 100%;
}

/* Título del proyecto */
.proyecto-titulo {
	position: absolute;
    text-align: center;
    font-size: 2.5rem;
	color: #fff;
	top:35%;
	left:50%;
	transform: translate(-50%, -50%);
	
}

.proyecto-descripcion-larga{
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	gap:4rem;
}
.proyecto-descripcion-larga p{
	width:70%;
}
	
.proyecto-descripcion-larga img{
	width:35%;
	height: 35%;
}

/* Imagen del proyecto */
.proyecto-imagen {
    width: 100%;
    margin-bottom: 2rem;
	position: relative;
  	display: inline-block;
}

.proyecto-imagen::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}

.proyecto-imagen img {
    width: 100%;
    height: auto;
    max-height: 450px;
    object-fit: cover;
}

/* A PARTIR DE AQUI NO ES REAL, SON EJEMPLOS */

/* Contenido del proyecto */
.proyecto-contenido {
    display: flex;
    flex-direction: column;
	padding: 3rem 20rem;
}

/* Estilos de la descripción */
.proyecto-descripcion {
    font-size: 1.2rem;
    line-height: 1.6;
}

/* FOOTER */

footer .site-container{
    max-width: 98% !important;
    padding-block: 3rem !important;
	white-space: nowrap;
}

@media (max-width: 1500px) {

	.proyecto-contenido {
		padding: 3rem 10rem;
	}
}

@media (min-width: 768px) {
	
footer .site-middle-footer-inner-wrap{
	padding: 2% 8%;    
	border: 1px solid #fff;
}
}

footer p, footer a{
	color: var(--global-palette9) !important;
}

footer a:hover{

	text-shadow: 2px 2px 10px #000;
}

footer p, footer h2{
	font-family: 'Helvetica Neue', sans-serif !important;
	font-style: italic !important;
}

@media (max-width: 1024px) {


/* INICIO */
	
.fuenteDestacada{
	font-size: 100px;
}
	
/* MARCAS INICIO */

.titulo-marcas-inicio{
	font-size: 50px;
}
.fuente-fresca{
	font-size: 35px;
}
	
/* PROYECTOS DESTACADOS */
		
.proyectos-grid {
    height: 66vh;
    padding-inline: 4%;
}
	
.proyecto-overlay{
	padding: 5px;	
}
	
.proyecto-overlay h3{
	font-size: 15px;
	padding: 0;
}


/*CONOCENOS*/		
.h1-peque-conocenos{
    font-size: 28px;
}
.h1-peque-servicios{
    font-size: 27px;
}
.h1-peque-contacto{
    font-size:31px;
}

.h1-vizcaya-conocenos, .h1-secundario-contacto{
	font-size: 45px;
}

.section-conocenos::before {
  	background-size: 35%; /* Ajusta el tamaño del fondo */
  	background-position: -20% 90%; /* Centra la imagen de fondo */

}

.section-conocenos::after {
  	background-size: 25%; /* Ajusta el tamaño del fondo */
  	background-position: 110% 15%; /*Centra la imagen de fondo */
}
	
/* 	CONTACTO */
	
.bloque-tarjetas-contacto > div:first-child{
	width: 100%;
    max-width: none !important;
}
	
.form-contacto {
    max-width: 100%;
}
	
/*PROYECTOS*/
	
.h1-proyectos {

	font-size: 7rem;
	margin-top:-5.5rem;
	margin-left:1rem;

}
	
.tarjetas-proyectos {
	margin-top:5.5rem;
    grid-auto-rows: 200px;
}
	
/* 	SINGLE-PROYECTOS */
	
.proyecto-titulo {
    font-size: 2rem;
}
	
.proyecto-contenido {
	display: flex;
    flex-direction: column;
	padding: 1rem 48px;
}

}

@media (max-width: 768px) {
.proyecto-titulo {
	position:relative;
	color: #000;
}
	
.swiper-slide-servicios img {
    height: 300px;
}
	
/* INICIO */
	
.fuenteDestacada{
	font-size: 55px;
}
	
/* PORTADA INICIO */
	
.btn-inicio{
	width: 8rem;
	background:none !important;
	border: 2px solid #fff !important;
	height:2rem;
	font-size: 0.7rem !important;
}
	
/* MARCAS INICIO */

.titulo-marcas-inicio{
	font-size: 35px;
}
.fuente-fresca{
	font-size: 25px;
}
	
/* PROYECTOS DESTACADOS */
		
.proyectos-grid {
    height: 50vh;
    padding-inline: 0%;
}
	
.proyecto-overlay{
	padding: 5px;	
}
	
.proyecto-overlay h3{
	font-size: 10px;
	padding: 0;
}

/*CONOCENOS*/

.h1-peque-conocenos{
    font-size: 18.5px;
}
.h1-peque-servicios{
    font-size: 27px;
}
.h1-peque-contacto{
    font-size: 21px;
}

.h1-vizcaya-conocenos, .h1-secundario-contacto{
	font-size: 40px;
}

.section-conocenos::before {
  	background-size: 48%; /* Ajusta el tamaño del fondo */
  	background-position: -35% 100%; /* Centra la imagen de fondo */

}

.section-conocenos::after {
  	background-size: 38%; /* Ajusta el tamaño del fondo */
  	background-position: 120% 15%; /*Centra la imagen de fondo */
}
	
/* 	CONTACTO */
	
.form-contacto {
	padding: 4rem 2rem 1rem 2rem;
}
	
/*PROYECTOS*/
.proyecto-titulo {
	position:relative;
	color: #000;
	top: auto;
    left: auto;
    transform: none;
	margin-bottom:1.5rem;
}
	
.proyecto-descripcion-larga{
	display:block;
}
.proyecto-descripcion-larga p{
	width:100%;
}
	
.proyecto-descripcion-larga img{
	display: none;
}
	
.h1-proyectos {

	font-size: 5rem;
	margin-top:-4rem;
	margin-left:1rem;

}

.tarjetas-proyectos {
	margin-top:3.5rem;
    grid-auto-rows: 150px;
}
	
}

@media (max-width: 425px) {
	
/*CONOCENOS*/

.h1-peque-conocenos{
    font-size: 14px;
	line-height:0.2rem;
}
.h1-peque-servicios{
    font-size: 16px;
}
.h1-peque-contacto{
    font-size: 17px;
    line-height: 0.2rem;
}
.h1-vizcaya-conocenos, .h1-secundario-contacto{
	font-size: 30px;
}
	
	
/* PROYECTOS DESTACADOS */
		
.proyectos-grid {
	grid-template-columns: repeat(3, 1fr);
	 grid-template-rows: inherit; 
}
	
/* 	SINGLE-PROYECTOS */
	
.proyecto-titulo {
    font-size: 1.75rem;
}

.proyecto-contenido {
	display: flex;
    flex-direction: column;
	padding: 1rem 24px;
}

}