/* Funlab Capability Row */

.fcr-row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 60px;
	width: 100%;
	box-sizing: border-box;
}

/* Imagen a la izquierda (orden natural) o a la derecha (se invierte con order) */
.fcr-image-col {
	order: 1;
}
.fcr-text-col {
	order: 2;
	flex: 1;
	min-width: 280px;
}

.fcr-row.fcr-image-right .fcr-image-col {
	order: 2;
}
.fcr-row.fcr-image-right .fcr-text-col {
	order: 1;
}

.fcr-image-col {
	position: relative;
	overflow: hidden;
	width: 48%;
	box-sizing: border-box;
}

.fcr-image {
	display: block;
	transition: transform 0.5s ease;
}

/* Con proporción fija: la imagen SIEMPRE llena el 100% del cuadro,
   recorta lo que sobre (object-fit: cover), nunca deja espacio vacío. */
.fcr-image-col.fcr-has-ratio .fcr-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* "Automática": el cuadro se ajusta al tamaño real de la imagen. */
.fcr-image-col.fcr-auto-ratio .fcr-image {
	position: relative;
	width: 100%;
	height: auto;
}

.fcr-image-col.fcr-hover-zoom:hover .fcr-image {
	transform: scale(1.05);
}

/* Barra de color junto al título / subtítulo */
.fcr-title-wrap,
.fcr-subtitle-wrap {
	display: flex;
	align-items: stretch;
	gap: 16px;
}

.fcr-title-wrap {
	margin-bottom: 24px;
}

.fcr-subtitle-wrap {
	margin-bottom: 30px;
	align-items: center;
}

.fcr-accent-bar {
	flex-shrink: 0;
	width: 4px;
	background: linear-gradient(180deg, #F4A261 0%, #2A9D8F 100%);
	border-radius: 2px;
}

.fcr-title {
	margin: 0;
	line-height: 1.05;
}

.fcr-title-bold {
	display: block;
	font-size: 56px;
	font-weight: 800;
	color: #FFFFFF;
}

.fcr-title-regular {
	display: block;
	font-size: 56px;
	font-weight: 300;
	color: #FFFFFF;
}

.fcr-subtitle {
	margin: 0;
	font-size: 20px;
	font-weight: 400;
	color: #FFFFFF;
}

.fcr-body {
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.65);
	max-width: 520px;
}

/* Animación de entrada al hacer scroll (clase agregada por JS) */
.fcr-animated {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.6s ease, transform 0.6s ease;
}

.fcr-animated.fcr-visible {
	opacity: 1;
	transform: translateY(0);
}

/* Dentro del editor de Elementor siempre se ve el contenido a full,
   la animación de entrada solo corre en el sitio publicado (front). */
.elementor-editor-active .fcr-animated {
	opacity: 1 !important;
	transform: none !important;
}

/* Responsive: imagen y texto apilados, imagen siempre primero */
@media (max-width: 767px) {
	.fcr-row,
	.fcr-row.fcr-image-right {
		flex-direction: column;
	}
	.fcr-image-col,
	.fcr-row.fcr-image-right .fcr-image-col {
		order: 1;
		width: 100% !important;
	}
	.fcr-text-col,
	.fcr-row.fcr-image-right .fcr-text-col {
		order: 2;
	}
	.fcr-title-bold,
	.fcr-title-regular {
		font-size: 36px;
	}
}