/*
Theme Name: Hello Elementor Child
Template: hello-elementor
Author: Quique
Description: Tema hijo de Hello Elementor
Version: 1.0
*/

/* Aquí van tus estilos personalizados */

/* INDEX 
    0. RESET 
    1. HEADER
    2. BANNER HOME
    3. RESPONSIVE BANNER HOME
    4. BLOG HOME
    5. FICHAS PRODUCTO 
*/

/* 0. RESET */
body{
    background-color: #fff!important;
}

.elementor-heading-title{
    line-height: 1.2!important;
}

.hfe-flyout-close{
    top: 24px;
    right: 24px;
}

/* 1. HEADER */
body.home #control-logo{
    opacity:0;
    pointer-events: none;
}
@media(max-width:1024px){
	body.home #control-logo{
		opacity:1;
		pointer-events: inherit;
	}
}

/* 2. BANNER HOME */

#flexer-hero-banner {
    border: 1px solid #ffffff80;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: calc(80vh - 112px);
}
#flexer-hero-banner .brand-controler-hero .elementor-widget-container{
	position:relative;
}
#flexer-hero-banner .brand-controler-hero a{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    font-size: 0;
    color: transparent;
    z-index: 98;
}
#flexer-hero-banner .brand-controler-hero a::after{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    content: "";
}

@media(min-width:991px){
    #flexer-hero-banner .brand-controler-hero{
        transition: 0.3s ease-in-out;
        background-color: #ffffff00;
        border: 1px solid #ffffff80;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        position:relative;
        padding: 32px;
    }
    #flexer-hero-banner .brand-controler-hero:hover{
        background-color: rgba(255,255,255,0.82);
        border: 1px solid #ffffff00;
    }
    #flexer-hero-banner .brand-controler-hero.reset:hover{
        background-color: transparent;
        border: 1px solid #ffffff80;
    
    }
    #flexer-hero-banner .brand-controler-hero:hover .flexer-hover{
        display: none;
    }
    #flexer-hero-banner .brand-controler-hero:hover .caption-controler{
        opacity: 1;
        top: 50%;  
    }
    
}

#flexer-hero-banner .brand-controler-hero > div{
    position: inherit;
    height: 100%;
}


#flexer-hero-banner .brand-controler-hero.reset > div{
    height: auto;
}
    

#flexer-hero-banner .brand-controler-hero .flexer-hover{
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 80%;
    transform: translate(-50%, -50%);
}

#flexer-hero-banner .brand-controler-hero .caption-controler{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    position: absolute;
    top: 70%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: 0.7s ease-in-out;
}
#flexer-hero-banner .brand-controler-hero .caption-controler img{
    max-width: 80%;
    margin: 0 auto;
}

#flexer-hero-banner .brand-controler-hero .caption-controler p{
    font-size: 18px;
    font-family: "DM Sans",sans-serif;
    color: #333333;
    margin: 20px auto 56px auto;
    width: 80%;
}

#flexer-hero-banner .brand-controler-hero .caption-controler span.fakelink{
    color: 16px;
    font-family: "DM Sans",sans-serif;
    color: black!important;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    gap: 24px;
    margin: 0 auto;

}
#flexer-hero-banner .brand-controler-hero .caption-controler a img{
    height: 21px;
    width: auto;
    margin: 0;
}


/* 3. RESPONSIVE BANNER HOME */

@media(max-width:991px){
    #flexer-hero-banner .brand-controler-hero .caption-controler{
        display: none;
    }
	#flexer-hero-banner{    
		height: 85vh!important;
		border:transparent;
		padding-top:120px;
		padding-bottom:20px;

	}
	#flexer-hero-banner .brand-controler-hero{
		height:14vh;
	}
	#flexer-hero-banner .brand-controler-hero img{
		height:100%
	}
	#custom-sina-blog .sina-bp .sina-read-more::after{
        height: 18px;
        width: 18px;
        top: 0;
    }
}

/* 4. BLOG HOME */


#custom-sina-blog .sina-bp .sina-read-more{
    width: 100%;
    text-align: left;
    position: relative;
}

#custom-sina-blog .sina-bp .sina-read-more::after{
    background-image: url(https://www.futureglass.es/wp-content/uploads/2025/05/arrow-icon-right.svg);
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 20px;
    content: "";
    position: absolute;
    right: 0;
    left:inherit;
    top: 20px;
    height: calc(100% - 20px);

}


/* 5. FICHAS PRODUCTO */

.parallax-bg {
    background-image: url('https://www.futureglass.es/wp-content/uploads/2025/07/4-2.jpeg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallax-bg-2 {
    background-image: url('https://www.futureglass.es/wp-content/uploads/2025/07/FOTO-FONDO-PRESENTACION-scaled-e1751446495307.webp');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.parallax-bg-3 {
    background-image: url('https://www.futureglass.es/wp-content/uploads/2025/07/paralax-glasslight-scaled.jpg');
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media(max-width:991px){
    .parallax-bg,.parallax-bg-2,.parallax-bg-3{
        background-size: cover;
        background-attachment: inherit;
    }
}

.custom-carrusel-gass .swiper .elementor-swiper-button{
    top: inherit;       
    bottom: -120px;
    width: fit-content;
}
@media(max-width:991px){
    .custom-carrusel-gass .swiper .elementor-swiper-button{
        bottom: -60px;
    }
}
.elementor-element .swiper .elementor-swiper-button svg{
    fill: hsla(0,0%,100%,0);
}

.custom-carrusel-gass  .swiper .elementor-swiper-button-next{
    left: 80px;
}
.custom-carrusel-gass  .swiper .elementor-swiper-button-prev{
 
    right: inherit;
    left: 0
}


/* 6. FORMULARIO */

.custom-form-control{
    font-family: "DM Sans",sans-serif;
    font-size: 300;
    color: #54595F;
}

.custom-form-control p{
    margin-bottom: 32px;
}
.custom-form-control p:last-of-type{
    margin: 0;
}
.custom-form-control input[type=email],
.custom-form-control input[type=tel],
.custom-form-control input[type=number],
.custom-form-control input[type=text],
.custom-form-control textarea{
    border: 0px transparent solid;
    border-bottom: 1px solid #BDB3AC;
    padding: 10px;
    border-radius: 0;
}
.custom-form-control label,
.custom-form-control span{
    width: 100%;
}
.custom-form-control textarea {
    height: 200px;
}
.custom-form-control .wpcf7-spinner,
.custom-form-control .wpcf7-list-item{
    margin: 0;
}

.custom-form-control input[type=submit]{
    padding: 12px 84px 12px 56px;
    border: 1px solid #BDB3AC;
    font-size: 20px;
    font-weight: 300;
    color: #000;
    border-radius: 0px;
    position: relative;

    background: url('https://www.futureglass.es/wp-content/uploads/2025/05/arrow-icon-right.svg') no-repeat right 56px center;
    background-size: 16px;
}

.custom-form-control a{
    color: #B6976A;
}


/* POSTS CONTROL CSS */

.control-posts-layout{
    padding: 180px 56px 40px 56px;
    display: flex;
    flex-direction: column;
}
.featured-hero {
  width: 100%;
  height: 50vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.control-main-content{
   padding: 32px 64px;
   max-width: 1200px;
   margin: 0 auto;
}
.control-main-content h1{
    font-size: 56px;
    font-weight: 200;
    margin-top: 0;
    margin-bottom: 20px;
}
.control-main-content h2{
    font-size: 32px;
    font-weight: 200;
    margin-top: 32px;
    margin-bottom: 8px;
}
.control-main-content h3{
    font-size: 28px;
    font-weight: 200;
    margin-top: 20px;
    margin-bottom: 8px;
}
.control-main-content  .back-link{
    color: #54595F;
    display: flex;
    flex-direction: row;
    gap: 12px;
    color: #54595F;

}

.control-main-content  .back-link img{
    transform: rotate(180deg);
}
.control-main-content p{
    font-size: 18px;
    font-weight: 300;
}
.control-main-content .post-date{
    font-size: 14px;
    color: #BDB3AC;
    margin: 20px 0 0 0;
}

.control-main-content *{
    font-family: "DM Sans",sans-serif;
}

@media(max-width:991px){
	.control-posts-layout{
		padding:0;
	}
	.control-main-content{
		padding:32px 20px;
	}
	.control-main-content h1{
    font-size: 28px;
    font-weight: 200;
    margin-top: 0;
    margin-bottom: 20px;
}
.control-main-content h2{
    font-size: 24px;
    font-weight: 200;
    margin-top: 32px;
    margin-bottom: 8px;
}
.control-main-content h3{
    font-size: 20px;
    font-weight: 200;
    margin-top: 20px;
    margin-bottom: 8px;
}
}
.sina-bg-thumb {
	min-height:300px;
	overflow:hidden;
	background-color:#ffffff;

}
.sina-bg-thumb img{
	max-width:none;
	width:auto;
	height:100%;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	
}
