/* 
Theme Name: Luyando ópticos
Theme URI: https://bullhost.agency/
Description: Theme de Luyando basado en Hello Elementor
Author: Bullhost
Author URI: https://bullhost.agency/
Template: hello-elementor
Version: 1.0
Text Domain: adigrafik
*/

/* Clase para deshabilitar items del menú 
.no-clickable > a {
	pointer-events: none;
}
*/

:root {
	--fs-sm: clamp(0.8rem, 0.17vi + 0.76rem, 0.89rem);
	--fs-base: clamp(1rem, 0.34vi + 0.91rem, 1.19rem);
	--fs-md: clamp(1.25rem, 0.61vi + 1.1rem, 1.58rem);
	--fs-lg: clamp(1.56rem, 1vi + 1.31rem, 2.11rem);
	--fs-xl: clamp(1.95rem, 1.56vi + 1.56rem, 2.81rem);
	--fs-xxl: clamp(2.44rem, 2.38vi + 1.85rem, 3.75rem);
	--fs-xxxl: clamp(3.05rem, 3.54vi + 3.17rem, 7rem);
	--fs-4xl: clamp(3.05rem, 3.54vi + 2.17rem, 5rem);
}

@media screen and (min-width: 800px) {
	:root {
		--fs-4xl: clamp(3.05rem, 3.54vi + 4.17rem, 10rem);	
	}
}

body {
	font-family: 'Manrope', sans-serif;
	font-size: 1.15rem;
	margin-top: 100px;
}

body .elementor-nav-menu--main a {
	color: var(--e-global-color-text);
}


body .elementor-nav-menu--main a:hover, body .elementor-nav-menu--main a:active {
	color: var(--e-global-color-secondary);
}

body.elementor-kit-13 .elementor-button span {
	font-weight: 400;
}

h1, h2, h3 {
	font-family: 'Merchant Extra Light';
}

h1 { font-size: var(--fs-xxl); }
h2 { font-size: var(--fs-xl); }
h3 { 	font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }
h5 { font-size: var(--fs-base); }

ul {
	margin-bottom: 1rem;
}

.titulo-pagina h1 {
	/* font-size: var(--fs-xxxl); */
	font-size: var(--fs-4xl);
	text-transform: uppercase;
	font-family: 'Merchant Extra Light';
}

.home .titulo-pagina h1 {
	font-size: var(--fs-4xl);
	text-transform: uppercase;
}

.parrafo-destacado {
	font-size: var(--fs-md);
}

/* Clase para poner texto en dorado en mitad de textos */
.texto-dorado {
	color: var(--e-global-color-accent);
}

/* Color del icono de submenú */
.sub-arrow > svg {
	fill: var(--e-global-color-text);
}

/* Líneas verticales para el fondo*/
.line {
	position:absolute;
	top:0px;
	bottom:0px;
	width:1px;
	min-height:100svh;
	background:rgba(204, 159, 117, 0.05);
}

.line1 { left:3.854166667%; }
.line2 { left:21.875%; }
.line3 { left:40.625%; }
.line4 { left:59.375%; }
.line5 { left:78.125%; }
.line6 { left:96.09375%; }


/**************** PAGINA DE PRODUCTO *****************/

/* Tamaño icono de marca en página de producto */
.pwb-brand-shortcode img {
	max-width: 100px;
}

.pswp__ui .pswp__button--arrow--left, .pswp__ui .pswp__button--arrow--right {
    background: 0 0;
    top: 50%;
    margin-top: -50px;
    width: 70px;
    height: 70px;
    position: absolute;
}

.pswp__ui .pswp__button--arrow--left {
	left: 5%;
}

.pswp__ui .pswp__button--arrow--right {
	right: 5%;
}

.pswp__button--arrow--left:before, .pswp__button--arrow--right:before {
    content: '';
    top: 50%;
	left: 50%;
    background-color: rgba(0, 0, 0, .3);
    height: 30px;
    width: 32px;
    position: absolute;
    transform: translate(-50%, -50%);
}

/* Estilos del Swiper de las sedes */
.swiper {
	width: 600px;
	height: 400px;
}

.swiper .swiper-slide-inner img {
    display: block;
	height: 100%;
    object-fit: cover;
}

/* Estilos de las tarjetas de producto en el loop de los archivos de marca */
body .elementor-loop-container .e-con-boxed a {
	color: #2b2b2a;
}

body .elementor-loop-container .e-con-boxed a:hover {
	color: #76500B;
}

/* Pagina de archivo de marca */
@media screen and (min-width: 768px) {
	
#cabecera-marcas .banner-marca {
	position: relative;
	z-index: 5;
	bottom: -100px;
}

#cuerpo-archivo-marca {
	padding-top: 80px;
}
}
/* Tarjetas de marca en página de colecciones */
body .pwb-brands-cols-outer>div {
	flex-direction: column;
}

body .pwb-brands-col3>p, body .pwb-brands-col3>p a {
	color: var(--e-global-color-secondary);
	transition: all .4s;
}

body .pwb-brands-col3>p:hover, body .pwb-brands-col3>p:hover a {
	color: var(--e-global-color-text);
}

body .pwb-brands-col3>p {
    border: 2px solid var(--e-global-color-secondary);
    padding: 12px 24px;
    border-radius: 100px;
}

body .pwb-brands-col3>p:hover {
	background-color: var(--e-global-color-secondary);
    border: 2px solid var(--e-global-color-secondary);
    border-radius: 100px;
}

/* ESTILOS CF7 */
.wpcf7-form-control.wpcf7-acceptance .wpcf7-list-item {
	margin-left: 0;
}