/**
* Theme Name: Enginir Child
* Description: This is a child theme of Enginir, generated by Merlin WP.
* Author: <a href="https://creativesplanet.com/">Creative's Planet</a>
* Template: enginir
* Version: 1.0
*/


/*GENERALES*/
	/*Subtitulos*/

.header-ttl .cspt-element-subtitle{
		padding: 0 10px !important;
}

.header-ttl .cspt-heading-subheading{
    margin-bottom: 0;
}

.header-ttl.blanco .cspt-subtitle-style1 .cspt-element-subtitle:after{
	color: #ffffff !important;
}

.header-ttl.blanco .cspt-subtitle-style1 .cspt-element-subtitle:before{
	color: #ffffff !important;
}

.header-ttl.blanco .cspt-title-style2 .cspt-element-title .cspt-square:after{
	    background-color: #ffffff !important;
}

/*MENÚ*/
div.cspt-sticky-header.cspt-header-sticky-yes{
	background-color: #ffffff !important;
}


/*SUBHEADER*/

ul.cspt-contact-info li{
	list-style: none;
}


/*===  INICIO ===*/

	/*Slider principal*/
div.btn-slider div a{
	font-size: 18px !important;
	font-weight: 600 !important;
}

	/*Marquesina*/
.custom-marquee-wrapper {
  overflow: hidden;
  width: 100%;
  /*padding: 10px 0;*/
  padding: 0;
  box-sizing: border-box;
  position: relative;
}

.custom-marquee-track {
  display: flex;
  width: max-content;
  animation: scroll-left 20s linear infinite; /* Cambia para ajustar velocidad */
}

.custom-marquee-content {
  display: flex;
  align-items: center;
  color: #162029;
  font-family: "Archivo", Sans-serif;
  font-weight: 600;
  font-size: 3.5rem;
  line-height: 1.2;
  white-space: nowrap;
  gap: 20px;
}

.custom-marquee-content span {
  display: inline-block;
}

/* Estilo base para el contenedor del asterisco */
.custom-marquee-content .dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 20px; /* Espacio entre el texto y el asterisco */
  width: 40px;    /* Ajusta según el tamaño que desees */
  height: 40px;
  position: relative;
  /* Animación de rotación: 4 segundos, lineal, infinita */
  animation: rotate-center 8s linear infinite; 
}

/* Crear el asterisco usando el pseudo-elemento ::before */
.custom-marquee-content .dot::before {
  content: '\2733'; /* Carácter Unicode de asterisco grueso o similar */
  font-size: 3.5rem; /* Tamaño del asterisco */
  color: #E53B1A;       /* Color del asterisco (ajústalo al de tu imagen) */
  line-height: 1;
}

/* Animación de rotación horaria */
@keyframes rotate-center {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Animación continua de derecha a izquierda */
@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-50%);
  }
}

@media (max-width: 768px) {
  .custom-marquee-content {
    font-size: 1.8rem;
  }
}



	/*Bordes animados sobresalientes*/

/* 1. Preparar el contenedor padre */
.caja-bordes-extendidos {
    position: relative;
    /* Importante: permite que las líneas sobresalgan del contenedor */
    overflow: visible !important; 
    padding: 40px; /* Dale espacio a tu texto interior */
}

/* 2. Estilo base de las líneas generadas */
.caja-bordes-extendidos .linea-borde {
    position: absolute;
    background-color: #162029; /* Color de tu borde */
    z-index: 0;
    /* Dura 1 segundo y empieza rápido, termina lento */
    transition: all 2s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 3. Posiciones iniciales (Invisibles: ancho o alto a 0) */
.caja-bordes-extendidos .linea-top {
    top: 0;
    left: -5%; /* Empieza antes del borde izquierdo */
    height: 1px; /* Grosor de la línea */
    width: 0;
}

.caja-bordes-extendidos .linea-bottom {
    bottom: 0;
    right: -5%; /* Empieza antes del borde derecho */
    height: 1px;
    width: 0;
}

.caja-bordes-extendidos .linea-left {
    left: 0;
    bottom: -8%;
    width: 1px;
    height: 0;
}

.caja-bordes-extendidos .linea-right {
    right: 0;
    top: -8%;
    width: 1px;
    height: 0;
}

/* 4. El estado final (Cuando el JS añade la clase 'animar') */
.caja-bordes-extendidos.animar .linea-top,
.caja-bordes-extendidos.animar .linea-bottom {
    width: 110%; /* Sobresale un 5% por cada lado */
}

.caja-bordes-extendidos.animar .linea-left,
.caja-bordes-extendidos.animar .linea-right {
    height: 115%;
}

	/*Bordes animados exactos*/

/* 1. Preparar el contenedor padre nuevo */
.caja-bordes-exactos {
    position: relative;
    padding: 40px;
}

/* Compartimos el estilo base de la línea con la clase anterior*/
.caja-bordes-exactos .linea-borde {
    position: absolute;
    background-color: #162029; 
    z-index: 0;
    transition: all 2s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* 3. Posiciones iniciales (Empiezan justo en la esquina: 0) */
.caja-bordes-exactos .linea-top {
    top: 0;
    left: 0; /* Exactamente en el vértice izquierdo */
    height: 1px;
    width: 0;
}

.caja-bordes-exactos .linea-bottom {
    bottom: 0;
    right: 0; /* Exactamente en el vértice derecho */
    height: 1px;
    width: 0;
}

.caja-bordes-exactos .linea-left {
    left: 0;
    bottom: 0; /* Exactamente en el vértice inferior */
    width: 1px;
    height: 0;
}

.caja-bordes-exactos .linea-right {
    right: 0;
    top: 0; /* Exactamente en el vértice superior */
    width: 1px;
    height: 0;
}

/* 4. Estado final (Llegan solo al 100%) */
.caja-bordes-exactos.animar .linea-top,
.caja-bordes-exactos.animar .linea-bottom {
    width: 100%;
}

.caja-bordes-exactos.animar .linea-left,
.caja-bordes-exactos.animar .linea-right {
    height: 100%;
}


	/*Cajas cifras*/
div.cifras div.cspt-heading-desc{
	font-size: 18px;
}


div.cifras div.cspt-contents-wraper div.cspt-fid-counter-wrapper h4, div.cifras div.cspt-contents-wraper div.cspt-heading-desc{
	color: #ffffff;
}

div.cifras div.cspt-contents-wraper{
	border-top: 4px solid #e53b1a;
}


/*=== BLOG ===*/

	/*Artículos*/
div.cspt-blog-btn a{
	padding: 5px;
	font-size: 16px;
	color: #162029;
	font-weight: 600;
}

div.cspt-blog-btn a:hover{
	background-color: #FCEBE8;
	color: #162029;
}

	/*Artículo individual*/
body.single-post h1.cspt-tbar-title{
	color: #162029; 
}

body.single-post .cspt-bg-color-light:not(.vc_column_container):before, body.archive.category .cspt-bg-color-light:not(.vc_column_container):before{
	background-color: #FCEBE8;
}

body.single-post h1.cspt-tbar-title, body.archive.category h1.cspt-tbar-title{
	margin-bottom: 3%;
}

body.single-post div.cspt-breadcrumb-inner a,  body.archive.category div.cspt-breadcrumb-inner a{
	text-decoration: underline;
}

span.cspt-author-name{
	display: none;
}

		/*Sidebar*/
	aside#secondary h2.widget-title:after{
		border-radius: 0;
	}

/*Post relacionados*/
div.cspt-post-related h3.cspt-post-title a{
	font-size: 0.8em;
	line-height: 1.4em;
	-webkit-line-clamp: 4;
    line-clamp: 4;
}


/*=== CONTACTO ===*/

/*CONTACTO*/

#responsive-form{
	max-width: 800px; /*-- cambiar esto para conseguir el ancho del formulario deseado --*/
	margin: 0 auto;
    width: 100%;
	padding: 2%;
	background-color: #FAFAFA;
}

div.form-row div.column-half{
	font-size: 20px;
	font-weight: 500;
}

div.form-row div.column-full{
	font-size: 20px;
	font-weight: 500;
}

div.column-full p, div.column-half p{
    margin-block: 0.5em !important;
}

input{
	width: 100%;
	background: none;
	/*font-size: 16px !important;*/
	color: #000000 !important;
}

textarea{
	background: none;
	/*font-size: 16px !important;*/
	color: #000000 !important;
}

select{
	border-color: #000000;
    border-radius: 5px;
    padding: 8px 16px;
	margin-bottom: 22px;
	color: #000000 !important;
}


div.form-row div{
	color: #162029;
}


div.column-half input[type=text], div.column-full input[type=text], div.column-full textarea, div.column-half input[type=email], div.column-half input[type=tel]{
	border: 0;
	border-bottom: 1px solid #000000 !important;
	border-radius: 0;
	outline: none !important;
}

input[type=checkbox]{
	padding: 8px !important;
}

div.form-row div span.rojo{
	color: #b20000;
	font-size: 16px;
}

.form-row{
	width: 100%;
}


.column-half{
	float: left;
	position: relative;
	padding: 0.65rem;
	width:100%;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
}


.column-full{
	padding: 0.65rem;
	float: left;
	position: relative;
	width:100%;
	-webkit-box-sizing: border-box;
    box-sizing: border-box;
}


.clearfix:after {
	content: "";
	display: table;
	clear: both;
}


div.column-full.aceptacion{
	margin-bottom: 3%;
}

div.btn-enviar{
	padding: 0.65rem;
}

div.btn-enviar p input{
	padding: 10px 0;
	color: #ffffff !important;
	font-size: 18px;
	font-weight: 800;
	border-radius: 8px;
}




/*Aceptación de términos*/

.aceptacion .wpcf7-list-item label {
    display: flex !important;
    flex-direction: row;
    align-items: center; /* Alinea verticalmente al centro */
    justify-content: flex-start; /* Alinea todo a la izquierda */
    width: auto !important;
}

.aceptacion input[type="checkbox"] {
    width: auto !important; /* Evita que ocupe el 100% */
    margin-right: 10px !important; /* Espacio entre la cajita y el texto */
    margin-bottom: 0 !important; /* Quita margenes inferiores que ponga el tema */
    margin-top: 0 !important;
    display: inline-block !important;
    height: auto !important;
}

.aceptacion .wpcf7-list-item-label {
    text-align: left;
    width: auto;
}

a.enlace-legal{
	color: #E53B1A; 
	font-size: 16px; 
}


a.enlace-legal:hover{
	color: #E53B1A;
	text-decoration: underline !important;
}



/*Mensaje error*/

span.wpcf7-not-valid-tip{
	font-size: 16px;
}

/*Formulario media query*/

@media only screen and (min-width: 48em) { 
	.column-half{
		width: 50%;
	}
}




/*=== FOOTER ===*/

/* Sobrescribimos el estilo interno en el blog y en entradas individuales */
.blog.cspt-advance-enginir-demo .site-footer .widget-title::after,
.cspt-advance-enginir-demo.single-post .site-footer .widget-title::after,
.site-footer .widget-title::after {
    content: "" !important;
    width: 50px !important;
    height: 2px !important;
    bottom: -10px !important;
    left: 0 !important;
    right: auto !important;       /* Esto anula el right: -10px del punto */
    border-radius: 0 !important;  /* Esto anula el círculo (50%) */
    position: absolute !important;
    display: block !important;
    z-index: 1 !important;
}

span.logo-footer{
	color: #ffffff;
	font-size: 20px;
}

aside#block-8{
	margin-top: 0;
}

ul.enlaces-contacto-footer li{
	line-height: 2;
	padding-bottom: 0 !important;
}

li.icono-footer a span svg{
	width: 16px;
	height: 16px;
	fill: #e53b1a;
}

.icono-footer-email{
	color: #e53b1a;
}

ul.enlaces-contacto-footer li a span.elementor-icon-list-text{
	color: #ffffff;
}

ul.enlaces-contacto-footer li a span.elementor-icon-list-text:hover{
	color: #E53B1A;
}

ul.enlaces-contacto-footer li a span.elementor-icon-list-icon{
    --icon-vertical-offset: 2px;	
}


/*=== RESPONSIVE HEADER & FOOTER ===*/

@media (min-width: 1200px) {
	
	/*Header*/
	
    div.cspt-header-height-wrapper div div.container{
        max-width: 90% !important;
    }
	
	div.cspt-sticky-header.cspt-header-sticky-yes div.container{
		 max-width: 90% !important;
	}
	
	div.cspt-pre-header-wrapper div.container{
		max-width: 90% !important;
	}
	
	/*Footer*/
	
	div.footer-wrap div.container{
		width: 90%;
	}
}

@media (width: 1280px) {
	
	div.cspt-sticky-header.cspt-header-sticky-yes.cspt-sticky-bg-color-white.cspt-sticky-header-mobile-yes.cspt-fixed-header ul.menu li a{
		font-size: 14px;
	}
	
	ul#cspt-top-menu li a{
		font-size: 14px;
	}
	
}


/*=== PORTÁTIL ===*/

@media (min-width: 1025px) and (max-width: 1280px) {
	/*Inicio*/
		/*Marquesina*/
	.custom-marquee-content {
		font-size: 3rem;
	}
	
	.custom-marquee-content .dot::before {
		font-size: 3rem;		
	}

}

/*@media (width: 1366px) {
	div.contenedor-botones{
		column-gap: 10%;
	}
}*/


	/*Mayoria de smartphone*/

@media (320px <= width < 480px) {
	
	/*Menú*/
	div.menu-indefunsa-menu-container.active{
		background-color: #162029;
	}
	
	/*Detalle punto cuadrado titulos*/
	span.cspt-square:after{
		width:  8px !important;
		height: 8px !important;
		top: -7px !important;
	}

}