/**
 * Store IO Sistemas — cambios_landing.md
 * Header fijo/blanco (home + páginas internas) + hero slider (solo inicio)
 */

:root {
	--storeio-header-height: 160px;
}

/* ── Header fijo y transparente ── */
body.storeio-fixed-header .elementor-location-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	width: 100%;
	background: transparent !important;
	transition: background-color 0.35s ease, box-shadow 0.35s ease;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-4042e3c2,
body.storeio-fixed-header .elementor-location-header .elementor-element-4042e3c2 > .e-con-inner,
body.storeio-fixed-header .elementor-location-header .elementor-element-118b7c49,
body.storeio-fixed-header .elementor-location-header .elementor-element-554502a1 {
	background: transparent !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-118b7c49 {
	border-bottom-color: rgba(255, 255, 255, 0.18) !important;
}

body.storeio-fixed-header.storeio-header-scrolled .elementor-location-header {
	background: rgba(4, 12, 25, 0.92) !important;
	backdrop-filter: blur(10px);
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.18);
}

/* Menú principal en blanco sobre el hero */
body.storeio-fixed-header .elementor-location-header .elementor-nav-menu--main .elementor-item,
body.storeio-fixed-header .elementor-location-header .elementor-nav-menu--main .elementor-item:hover,
body.storeio-fixed-header .elementor-location-header .elementor-nav-menu--main .elementor-item:focus,
body.storeio-fixed-header .elementor-location-header .elementor-nav-menu--main .elementor-item.elementor-item-active,
body.storeio-fixed-header .elementor-element.elementor-element-2726b2c .elementor-nav-menu--main .elementor-item,
body.storeio-fixed-header .elementor-element.elementor-element-2726b2c .elementor-nav-menu--main .elementor-item:hover,
body.storeio-fixed-header .elementor-element.elementor-element-2726b2c .elementor-nav-menu--main .elementor-item:focus,
body.storeio-fixed-header .elementor-element.elementor-element-2726b2c .elementor-nav-menu--main .elementor-item.elementor-item-active {
	color: #ffffff !important;
	fill: #ffffff !important;
}

body.storeio-fixed-header .elementor-location-header .e--pointer-underline .elementor-item.elementor-item-active::after,
body.storeio-fixed-header .elementor-location-header .e--pointer-underline .elementor-item.highlighted::after,
body.storeio-fixed-header .elementor-location-header .e--pointer-underline .elementor-item:focus::after,
body.storeio-fixed-header .elementor-location-header .e--pointer-underline .elementor-item:hover::after {
	background-color: #ffffff !important;
}

/* Barra superior: iconos y textos en blanco */
body.storeio-fixed-header .elementor-location-header .elementor-element-39b67b48 .elementor-icon-list-icon i,
body.storeio-fixed-header .elementor-location-header .elementor-element-39b67b48 .elementor-icon-list-icon svg,
body.storeio-fixed-header .elementor-location-header .elementor-element-39b67b48 .elementor-icon-list-text,
body.storeio-fixed-header .elementor-location-header .elementor-element-7b694a6a .elementor-social-icon i,
body.storeio-fixed-header .elementor-location-header .elementor-element-7b694a6a .elementor-social-icon svg {
	color: #ffffff !important;
	fill: #ffffff !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-7b694a6a .elementor-social-icon {
	border-color: rgba(255, 255, 255, 0.35) !important;
	background-color: transparent !important;
}

/* Logo con fondo transparente (sin filtro que genera recuadro blanco) */
body.storeio-fixed-header .elementor-location-header .elementor-element-5c07f5f1,
body.storeio-fixed-header .elementor-location-header .elementor-element-5c07f5f1 .elementor-widget-container,
body.storeio-fixed-header .elementor-location-header .elementor-element-5c07f5f1 a {
	background: transparent !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-5c07f5f1 img {
	filter: drop-shadow(0 1px 6px rgba(255, 255, 255, 0.35));
	max-width: 75%;
	background: transparent !important;
}

/* Páginas internas: banner detrás del header sin tapar títulos */
body.storeio-fixed-header:not(.storeio-landing) main.site-main {
	padding-top: 0 !important;
	margin-top: 0 !important;
}

body.storeio-fixed-header:not(.storeio-landing) main.site-main > .elementor > .e-con.e-parent:first-child {
	padding-top: var(--storeio-header-height) !important;
	min-height: calc(45vh + var(--storeio-header-height)) !important;
	box-sizing: border-box;
}

/* Header: evitar solapamiento entre logo, menú y botón CTA */
body.storeio-fixed-header .elementor-location-header .elementor-element-554502a1 {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	gap: 12px;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-10d7f99f {
	display: flex !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-c3afc85 {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: 170px;
	z-index: 3;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-258380df {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	position: relative !important;
	z-index: 2;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-2726b2c .elementor-nav-menu--main.elementor-nav-menu__container {
	position: relative !important;
	width: 100% !important;
	max-width: 100% !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	transform: none !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-2726b2c .elementor-nav-menu {
	justify-content: center;
	flex-wrap: nowrap;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-2726b2c .elementor-nav-menu .elementor-item {
	white-space: nowrap;
	padding-inline: 10px !important;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-2fb7ace6 {
	flex: 0 0 auto !important;
	z-index: 3;
}

body.storeio-fixed-header .elementor-location-header .elementor-element-3e9b46c0 .elementor-button {
	white-space: nowrap;
}

@media (max-width: 1200px) {
	body.storeio-fixed-header .elementor-location-header .elementor-element-2726b2c .elementor-nav-menu .elementor-item {
		padding-inline: 8px !important;
		font-size: 0.9rem !important;
	}

	body.storeio-fixed-header .elementor-location-header .elementor-element-3e9b46c0 .elementor-button {
		font-size: 0.85rem !important;
		padding: 10px 14px !important;
	}

	body.storeio-fixed-header .elementor-location-header .elementor-element-c3afc85 {
		max-width: 140px;
	}
}

/* ── Hero: pantalla completa detrás del header fijo ── */
body.storeio-landing .elementor-44 .elementor-element.elementor-element-6ced0c7a {
	position: relative;
	min-height: 100vh !important;
	min-height: 100svh !important;
	margin-top: 0 !important;
	padding: 0 !important;
	overflow: hidden;
	background-image: none !important;
	isolation: isolate;
}

body.storeio-landing .elementor-44 .elementor-element.elementor-element-6ced0c7a::before,
body.storeio-landing .elementor-44 .elementor-element.elementor-element-6ced0c7a > .elementor-motion-effects-container {
	display: none !important;
}

body.storeio-landing .elementor-element.elementor-element-6313350,
body.storeio-landing .elementor-element.elementor-element-2264dd0e,
body.storeio-landing .elementor-element.elementor-element-67ad5351,
body.storeio-landing .elementor-element.elementor-element-50fddd0c,
body.storeio-landing .elementor-element.elementor-element-67b5bc16,
body.storeio-landing .elementor-element.elementor-element-41c6e7ef,
body.storeio-landing .elementor-element.elementor-element-542a217d {
	display: none !important;
}

/* ── Slider ── */
.storeio-hero-slider {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2;
}

.storeio-hero-slider__track {
	position: relative;
	width: 100%;
	height: 100%;
}

.storeio-hero-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.9s ease, visibility 0.9s ease;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.storeio-hero-slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 1;
}

.storeio-hero-slide__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		120deg,
		rgba(4, 12, 25, 0.72) 0%,
		rgba(4, 12, 25, 0.5) 55%,
		rgba(4, 12, 25, 0.62) 100%
	);
}

.storeio-hero-slide__content {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	max-width: 1340px;
	width: 90%;
	margin: 0 auto;
	min-height: 100vh;
	min-height: 100svh;
	padding: calc(var(--storeio-header-height) + 2.5rem) 0 6rem;
	box-sizing: border-box;
}

.storeio-hero-slide__title {
	margin: 0 0 1.25rem;
	color: #ffffff;
	font-family: "Lexend", Sans-serif;
	font-size: clamp(2.5rem, 6vw, 5.5rem);
	font-weight: 600;
	line-height: 0.95;
	letter-spacing: -0.04em;
	text-transform: capitalize;
	max-width: 14ch;
}

.storeio-hero-slide__description {
	margin: 0 0 2rem;
	color: rgba(255, 255, 255, 0.88);
	font-family: "Montserrat", Sans-serif;
	font-size: clamp(1rem, 2vw, 1.125rem);
	line-height: 1.6;
	max-width: 42rem;
}

.storeio-hero-slide__button.elementor-button {
	background-color: var(--storeio-brand, #0d9a9d) !important;
	border-color: var(--storeio-brand, #0d9a9d) !important;
	color: #ffffff !important;
	font-family: "Lexend", Sans-serif;
	font-weight: 600;
	border-radius: 50px;
	padding: 15px 40px;
	text-decoration: none;
	display: inline-block;
	transition: background-color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.storeio-hero-slide__button.elementor-button:hover,
.storeio-hero-slide__button.elementor-button:focus {
	background-color: transparent !important;
	border-color: #ffffff !important;
	color: #ffffff !important;
	transform: translateY(-1px);
}

.storeio-hero-slider__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 4;
	width: 48px;
	height: 48px;
	border: 1px solid rgba(255, 255, 255, 0.35);
	border-radius: 50%;
	background: rgba(4, 12, 25, 0.35);
	color: #ffffff;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background-color 0.25s ease, border-color 0.25s ease;
}

.storeio-hero-slider__arrow:hover,
.storeio-hero-slider__arrow:focus {
	background: rgba(13, 154, 157, 0.85);
	border-color: var(--storeio-brand, #0d9a9d);
	outline: none;
}

.storeio-hero-slider__arrow--prev {
	left: 1.25rem;
}

.storeio-hero-slider__arrow--next {
	right: 1.25rem;
}

.storeio-hero-slider__dots {
	position: absolute;
	left: 50%;
	bottom: 2rem;
	transform: translateX(-50%);
	z-index: 4;
	display: flex;
	gap: 0.65rem;
}

.storeio-hero-slider__dot {
	width: 10px;
	height: 10px;
	border: 0;
	border-radius: 50%;
	padding: 0;
	background: rgba(255, 255, 255, 0.4);
	cursor: pointer;
	transition: transform 0.25s ease, background-color 0.25s ease;
}

.storeio-hero-slider__dot.is-active {
	background: var(--storeio-brand, #0d9a9d);
	transform: scale(1.2);
}

.storeio-hero-slider.is-paused .storeio-hero-slider__dot.is-active {
	background: #ffffff;
}

@media (max-width: 767px) {
	.storeio-hero-slide__content {
		padding: calc(var(--storeio-header-height) + 1.5rem) 3rem 5.5rem;
		align-items: center;
		text-align: center;
	}

	.storeio-hero-slide__title {
		max-width: none;
		font-size: clamp(2.125rem, 5.1vw, 4.675rem);
	}

	.storeio-hero-slider__arrow {
		width: 40px;
		height: 40px;
		font-size: 1.25rem;
	}

	.storeio-hero-slider__arrow--prev {
		left: 0.5rem;
	}

	.storeio-hero-slider__arrow--next {
		right: 0.5rem;
	}
}