/* ===================================================
   Compliance LATAM – Colaboradores Slider
   =================================================== */

.cl-colaboradores-slider-wrap {
	position: relative;
	width: 100%;
	max-width: 720px;
	margin: 0 auto;
}

/* ---------- Swiper container ---------- */

.cl-colaboradores-slider {
	width: 100%;
	overflow: hidden;
}

/* ---------- Card ---------- */

.cl-colaboradores-slider-wrap .cl-card {
	background-color: #d9d9d9;
	border-radius: 12px;
	overflow: hidden;
	padding: 14px 6% 24px; /* 6% sides so image and text stay aligned at any card width */
}

/* Image section */

.cl-colaboradores-slider-wrap .cl-card__image-wrap {
	position: relative;
	line-height: 0;
}

.cl-colaboradores-slider-wrap .cl-card__image-wrap img {
	width: 100%;
	height: 380px;
	object-fit: cover;
	object-position: top center;
	display: block;
	filter: grayscale(100%);
}

/* Text section */

.cl-colaboradores-slider-wrap .cl-card__content {
	padding-top: 18px; /* sides + bottom come from .cl-card */
}

.cl-card__label {
	display: block;
	color: #E02B1F;
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 6px;
}

.cl-card__name {
	font-size: 16px;
	font-weight: 700;
	color: #000;
	margin: 0 0 6px;
	line-height: 1.3;
}

.cl-card__position {
	font-size: 16px;
	color: #000;
	margin: 0 0 4px;
	line-height: 1.45;
}

.cl-card__firma {
	font-size: 16px;
	color: #000;
	margin: 0;
}

/* ---------- Navigation arrows ----------
   Overlaid on the image, vertically centered within it.
   Image is 380px tall so top: 190px = center.
   ---------------------------------------- */

.cl-colaboradores-slider .swiper-button-prev,
.cl-colaboradores-slider .swiper-button-next {
	top: 204px; /* 14px top padding + half of 380px image */
	transform: translateY(-50%);
	width: 36px;
	height: 36px;
	margin-top: 0;
	color: #fff;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
	background: none;
	transition: opacity 0.2s ease;
	opacity: 0.75;
}

.cl-colaboradores-slider .swiper-button-prev:hover,
.cl-colaboradores-slider .swiper-button-next:hover {
	opacity: 1;
}

.cl-colaboradores-slider .swiper-button-prev::after,
.cl-colaboradores-slider .swiper-button-next::after {
	font-size: 20px;
	font-weight: 700;
}

.cl-colaboradores-slider .swiper-button-prev {
	left: 6%;
}

.cl-colaboradores-slider .swiper-button-next {
	right: 6%;
}

/* ---------- Pagination dots ---------- */

.cl-colaboradores-slider .swiper-pagination {
	bottom: 12px; /* sits at bottom of image area */
	position: absolute;
}

.cl-colaboradores-slider .swiper-pagination-bullet {
	background: #fff;
	opacity: 0.6;
}

.cl-colaboradores-slider .swiper-pagination-bullet-active {
	background: #fff;
	opacity: 1;
}

/* ---------- Empty state ---------- */

.cl-slider-empty {
	color: #999;
	font-style: italic;
	text-align: center;
	padding: 24px 0;
}
