/* INNOS Equipo — carrusel del equipo.
   Mismo diseño que el bloque "Nuestro equipo" de la home (doc/equipo.png).
   Los !important neutralizan los estilos de listas y tipografía que Divi /
   WPBakery aplican al contenido de la página. */

.innos-eqc {
	--innos-eqc-dark: #063b34;
	--innos-eqc-green: #b7ef00;
	--innos-eqc-text: #454545;
	--innos-eqc-gap: clamp(18px, 2.4vw, 32px);
	--innos-eqc-w: calc((100% - 4 * var(--innos-eqc-gap)) / 5);

	padding: clamp(38px, 5vw, 64px) 20px;
	background: #fff;
	font-family: 'Lato', Helvetica, Arial, sans-serif;
}

.innos-eqc,
.innos-eqc * {
	box-sizing: border-box;
}

.innos-eqc__inner {
	width: min(1220px, 100%);
	margin-inline: auto;
}

/* --- Encabezado ------------------------------------------------------ */

.innos-eqc__header {
	max-width: 720px;
	margin: 0 auto 34px;
	text-align: center;
}

.innos-eqc .innos-eqc__titulo {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--innos-eqc-dark) !important;
	font-family: 'Lato', Helvetica, Arial, sans-serif !important;
	font-size: clamp(28px, 3.4vw, 40px) !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	text-align: center !important;
}

.innos-eqc .innos-eqc__intro {
	margin: 12px auto 0 !important;
	color: var(--innos-eqc-text) !important;
	font-size: 16px !important;
	line-height: 1.55 !important;
	text-align: center !important;
}

/* --- Carrusel -------------------------------------------------------- */

.innos-eqc__carrusel {
	display: flex;
	align-items: center;
	gap: 8px;
}

.innos-eqc__viewport {
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 6px 0 4px;
}

.innos-eqc__viewport::-webkit-scrollbar {
	display: none;
}

.innos-eqc__viewport:focus-visible {
	outline: 2px solid var(--innos-eqc-dark);
	outline-offset: 4px;
}

.innos-eqc .innos-eqc__track {
	display: flex;
	align-items: flex-start;
	gap: var(--innos-eqc-gap);
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

.innos-eqc .innos-eqc__slide {
	flex: 0 0 var(--innos-eqc-w);
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	scroll-snap-align: start;
}

.innos-eqc .innos-eqc__slide::before,
.innos-eqc .innos-eqc__slide::marker {
	content: none !important;
	display: none !important;
}

/* --- Tarjeta del integrante ------------------------------------------ */

.innos-eqc__member {
	text-align: center;
}

.innos-eqc .innos-eqc__link {
	display: block;
	color: inherit !important;
	text-decoration: none !important;
}

.innos-eqc__portrait {
	position: relative;
	width: 150px;
	height: 150px;
	margin: 0 auto 13px;
}

.innos-eqc__portrait::before {
	content: "";
	position: absolute;
	inset: 0;
	border: 2px solid var(--innos-eqc-dark);
	border-radius: 50%;
}

.innos-eqc__orbit {
	position: absolute;
	inset: 7px;
	border: 1px solid var(--innos-eqc-dark);
	border-radius: 50%;
	animation: innosEqcOrbit 8s linear infinite;
}

.innos-eqc__orbit::after {
	content: "";
	position: absolute;
	top: -4px;
	right: 11px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--innos-eqc-dark);
}

.innos-eqc__image-wrap {
	position: absolute;
	inset: 15px;
	display: block;
	overflow: hidden;
	border: 2px solid #dedede;
	border-radius: 50%;
	background: #f3f3f3;
}

.innos-eqc .innos-eqc__image {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	border-radius: 50%;
	object-fit: cover;
	object-position: center top;
	transition: transform .4s ease;
}

.innos-eqc__member:hover .innos-eqc__image {
	transform: scale(1.07);
}

.innos-eqc__placeholder {
	display: grid;
	width: 100%;
	height: 100%;
	place-items: center;
	background: #f4f4f4;
}

.innos-eqc__placeholder svg {
	width: 70%;
	fill: #bdbdbd;
}

.innos-eqc__namebar {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 4px;
	width: 100%;
	min-height: 25px;
	padding: 5px 10px 6px;
	border-radius: 999px;
	background: var(--innos-eqc-dark);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.1;
	box-shadow: 0 4px 10px rgba(6, 59, 52, .12);
}

.innos-eqc .innos-eqc__firstname {
	color: #fff !important;
}

.innos-eqc .innos-eqc__lastname {
	color: var(--innos-eqc-green) !important;
}

.innos-eqc .innos-eqc__role {
	margin: 8px auto 0 !important;
	padding: 0 !important;
	color: var(--innos-eqc-text) !important;
	font-size: 13px !important;
	font-weight: 400 !important;
	line-height: 1.35 !important;
	text-align: center !important;
}

/* --- Flechas --------------------------------------------------------- */

.innos-eqc .innos-eqc__flecha {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 2px solid var(--innos-eqc-dark);
	border-radius: 50%;
	background: #fff;
	color: var(--innos-eqc-dark);
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease, opacity .25s ease;
}

.innos-eqc .innos-eqc__flecha svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.innos-eqc .innos-eqc__flecha:hover:not(:disabled),
.innos-eqc .innos-eqc__flecha:focus-visible:not(:disabled) {
	background: var(--innos-eqc-dark);
	color: #fff;
}

.innos-eqc .innos-eqc__flecha:disabled {
	opacity: .3;
	cursor: default;
}

/* Sin JS o sin desbordamiento: el viewport sigue siendo desplazable. */
.innos-eqc:not(.is-ready) .innos-eqc__flecha {
	opacity: .3;
}

.innos-eqc.is-static .innos-eqc__flecha,
.innos-eqc.is-static .innos-eqc__dots {
	display: none;
}

.innos-eqc.is-static .innos-eqc__track {
	justify-content: center;
	flex-wrap: wrap;
}

/* --- Puntos ---------------------------------------------------------- */

.innos-eqc__dots {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 9px;
	margin-top: 26px;
}

.innos-eqc .innos-eqc__dot {
	width: 10px;
	height: 10px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #cfd8d5;
	cursor: pointer;
	transition: background-color .25s ease, transform .25s ease;
}

.innos-eqc .innos-eqc__dot[aria-selected="true"] {
	background: var(--innos-eqc-dark);
	transform: scale(1.35);
}

.innos-eqc .innos-eqc__dot:focus-visible {
	outline: 2px solid var(--innos-eqc-dark);
	outline-offset: 3px;
}

/* --- Botón opcional -------------------------------------------------- */

.innos-eqc__actions {
	display: flex;
	justify-content: center;
	margin-top: 30px;
}

.innos-eqc .innos-eqc__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 46px;
	padding: 11px 20px;
	border: 2px solid var(--innos-eqc-dark);
	border-radius: 999px;
	background: var(--innos-eqc-dark);
	color: #fff !important;
	font-size: 14px;
	font-weight: 800;
	line-height: 1;
	text-decoration: none !important;
	transition: transform .25s ease, background-color .25s ease, color .25s ease;
}

.innos-eqc .innos-eqc__button svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.innos-eqc .innos-eqc__button:hover,
.innos-eqc .innos-eqc__button:focus-visible {
	transform: translateY(-2px);
	background: var(--innos-eqc-green);
	color: var(--innos-eqc-dark) !important;
}

.innos-eqc__vacio {
	text-align: center;
	color: var(--innos-eqc-text);
}

/* --- Animación ------------------------------------------------------- */

@keyframes innosEqcOrbit {
	to { transform: rotate(360deg); }
}

/* --- Cuántos caben a la vez -------------------------------------------
   Ancho explícito por número de visibles: la división en calc() es siempre
   por un número literal, nunca por una var() o un min(). */

.innos-eqc--v1 { --innos-eqc-w: 100%; }
.innos-eqc--v2 { --innos-eqc-w: calc((100% - 1 * var(--innos-eqc-gap)) / 2); }
.innos-eqc--v3 { --innos-eqc-w: calc((100% - 2 * var(--innos-eqc-gap)) / 3); }
.innos-eqc--v4 { --innos-eqc-w: calc((100% - 3 * var(--innos-eqc-gap)) / 4); }
.innos-eqc--v5 { --innos-eqc-w: calc((100% - 4 * var(--innos-eqc-gap)) / 5); }
.innos-eqc--v6 { --innos-eqc-w: calc((100% - 5 * var(--innos-eqc-gap)) / 6); }

/* --- Responsive ------------------------------------------------------ */

@media (max-width: 1180px) {
	.innos-eqc--v5,
	.innos-eqc--v6 { --innos-eqc-w: calc((100% - 3 * var(--innos-eqc-gap)) / 4); }
}

@media (max-width: 980px) {
	.innos-eqc--v4,
	.innos-eqc--v5,
	.innos-eqc--v6 { --innos-eqc-w: calc((100% - 2 * var(--innos-eqc-gap)) / 3); }
}

@media (max-width: 760px) {
	.innos-eqc--v3,
	.innos-eqc--v4,
	.innos-eqc--v5,
	.innos-eqc--v6 { --innos-eqc-w: calc((100% - 1 * var(--innos-eqc-gap)) / 2); }

	.innos-eqc__portrait { width: 130px; height: 130px; }
}

@media (max-width: 480px) {
	.innos-eqc,
	.innos-eqc--v2,
	.innos-eqc--v3,
	.innos-eqc--v4,
	.innos-eqc--v5,
	.innos-eqc--v6 {
		--innos-eqc-w: 100%;
	}

	.innos-eqc { padding-inline: 15px; }
	.innos-eqc__portrait { width: 150px; height: 150px; }
	.innos-eqc .innos-eqc__flecha { width: 38px; height: 38px; }
}

@media (prefers-reduced-motion: reduce) {
	.innos-eqc__orbit { animation: none; }
	.innos-eqc__viewport { scroll-behavior: auto; }
	.innos-eqc .innos-eqc__image { transition: none; }
}
