/* i am Eiva Marquee */

.eiva-marquee {
	--eiva-mq-bg: #0f4c47;
	--eiva-mq-text: #0f4c47;
	--eiva-mq-outline: #0f4c47;
	--eiva-mq-stroke: 2px;
	--eiva-mq-icon: #0f4c47;
	--eiva-mq-shadow: #061a18;
	--eiva-mq-speed: 28s;
	--eiva-mq-size: 72px;
	--eiva-mq-gap: 48px;
	--eiva-mq-height: 58px;
	--eiva-mq-skew: -4deg;
	--eiva-mq-pad: 16px;
	--eiva-mq-weight: 800;
	--eiva-mq-ls: -1px;
	--eiva-mq-icon-size: 14px;

	position: relative;
	width: 100%;
	padding-block: var(--eiva-mq-pad);
	overflow: hidden;
	isolation: isolate;
}

.eiva-marquee--bar {
	--eiva-mq-text: #ffffff;
	--eiva-mq-size: 15px;
	--eiva-mq-weight: 600;
	--eiva-mq-ls: 0.5px;
	--eiva-mq-gap: 36px;
}

/* ---------- Modo texto grande (sin fondo) ---------- */
.eiva-marquee--text .eiva-marquee__shadow {
	display: none;
}

.eiva-marquee--text .eiva-marquee__track-wrap {
	position: relative;
	z-index: 1;
	height: auto;
	min-height: 100px;
	background: transparent;
	color: var(--eiva-mq-text);
	overflow: hidden;
	display: flex;
	align-items: center;
}

.eiva-marquee--text .eiva-marquee__text {
	font-size: var(--eiva-mq-size);
	font-weight: var(--eiva-mq-weight);
	letter-spacing: var(--eiva-mq-ls);
	line-height: 1.2;
	white-space: nowrap;
	padding-block: 0.1em;
}

.eiva-marquee--text .eiva-marquee__text--fill {
	color: var(--eiva-mq-text);
	-webkit-text-stroke: 0;
	paint-order: normal;
}

.eiva-marquee--text .eiva-marquee__text--outline {
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-text-stroke-width: var(--eiva-mq-stroke);
	-webkit-text-stroke-color: var(--eiva-mq-outline);
}

/* ---------- Modo barra con fondo ---------- */
.eiva-marquee--bar .eiva-marquee__shadow {
	position: absolute;
	inset: calc(var(--eiva-mq-pad) + 6px) 2% calc(var(--eiva-mq-pad) - 4px) 2%;
	background: var(--eiva-mq-shadow);
	z-index: 0;
	pointer-events: none;
}

.eiva-marquee--bar.has-skew .eiva-marquee__shadow {
	transform: skewY(calc(var(--eiva-mq-skew) * -0.35)) skewX(calc(var(--eiva-mq-skew) * 0.5));
}

.eiva-marquee--bar:not(.has-shadow) .eiva-marquee__shadow {
	display: none;
}

.eiva-marquee--bar .eiva-marquee__track-wrap {
	position: relative;
	z-index: 1;
	height: var(--eiva-mq-height);
	background: var(--eiva-mq-bg);
	color: var(--eiva-mq-text);
	overflow: hidden;
	display: flex;
	align-items: center;
}

.eiva-marquee--bar.has-skew .eiva-marquee__track-wrap {
	transform: skewY(var(--eiva-mq-skew));
	clip-path: polygon(0 8%, 100% 0, 100% 92%, 0 100%);
}

.eiva-marquee--bar.has-skew .eiva-marquee__group {
	transform: skewY(calc(var(--eiva-mq-skew) * -1));
}

.eiva-marquee--bar .eiva-marquee__text {
	font-size: var(--eiva-mq-size);
	font-weight: var(--eiva-mq-weight);
	letter-spacing: var(--eiva-mq-ls);
	line-height: 1;
	color: var(--eiva-mq-text);
}

/* ---------- Compartido ---------- */
.eiva-marquee__track {
	display: flex;
	width: max-content;
	align-items: center;
	animation-name: eiva-marquee-left;
	animation-duration: var(--eiva-mq-speed);
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	will-change: transform;
}

.eiva-marquee[data-direction="right"] .eiva-marquee__track {
	animation-name: eiva-marquee-right;
}

.eiva-marquee[data-pause="1"]:hover .eiva-marquee__track {
	animation-play-state: paused;
}

.eiva-marquee__group {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	gap: var(--eiva-mq-gap);
	padding-inline-end: var(--eiva-mq-gap);
}

.eiva-marquee__item {
	display: inline-flex;
	align-items: center;
	gap: calc(var(--eiva-mq-gap) * 0.35);
	white-space: nowrap;
	flex-shrink: 0;
}

.eiva-marquee__text.is-upper {
	text-transform: uppercase;
}

.eiva-marquee__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--eiva-mq-icon);
	line-height: 0;
	flex-shrink: 0;
}

.eiva-marquee__icon svg {
	width: var(--eiva-mq-icon-size);
	height: var(--eiva-mq-icon-size);
	display: block;
}

.eiva-marquee__icon--dot {
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
}

.eiva-marquee__icon--custom {
	font-size: var(--eiva-mq-icon-size);
}

.eiva-marquee__icon--custom svg {
	width: var(--eiva-mq-icon-size);
	height: var(--eiva-mq-icon-size);
}

@keyframes eiva-marquee-left {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@keyframes eiva-marquee-right {
	from { transform: translateX(-50%); }
	to { transform: translateX(0); }
}

@media (max-width: 767px) {
	.eiva-marquee--text .eiva-marquee__text {
		font-size: clamp(28px, 10vw, var(--eiva-mq-size));
	}
}

@media (prefers-reduced-motion: reduce) {
	.eiva-marquee__track {
		animation: none;
	}
}