/*
 * Shared Videos & Blogs Loop Item (Elementor template 1275).
 *
 * The visual contract comes from the live Videos & Blogs listing. Search,
 * loading and pagination remain owned by cie-blog-live-search.css.
 */
.blog_video_loop_grid .e-loop-item {
	border-radius: 20px;
	transition: box-shadow 180ms ease;
}

.blog_video_loop_grid .e-loop-item:hover {
	box-shadow: 0 8px 20px rgba(70, 89, 97, 0.12);
}

.blog_video_loop_grid .blog_video_loop_item {
	border-radius: 20px !important;
	overflow: hidden !important;
}

.blog_video_loop_grid .blog_video_loop_item::before {
	background: linear-gradient(
		180deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0) 40%,
		rgba(255, 255, 255, 0.55) 54%,
		rgba(255, 255, 255, 0.92) 64%,
		#fff 70%,
		#fff 100%
	) !important;
	content: "" !important;
	inset: 0 !important;
	opacity: 1 !important;
	position: absolute !important;
	transition: none !important;
	z-index: 1 !important;
}

.blog_video_loop_grid .blog_video_loop_item::after {
	background: #f5f5f5;
	content: "";
	inset: 0;
	opacity: 0;
	position: absolute;
	transition: opacity 180ms ease;
	z-index: 2;
}

.blog_video_loop_grid .blog_video_loop_item:is(:hover, :focus-within)::after {
	opacity: 1;
}

.blog_video_loop_grid .blog_video_loop_item > *:not(.cie-blog-card__link) {
	position: relative !important;
	z-index: 3 !important;
}

.blog_video_loop_grid .blog_video_loop_item .elementor-heading-title {
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	color: #292929 !important;
	display: -webkit-box;
	font-family: "Source Sans Pro", sans-serif !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 32px !important;
	overflow: hidden;
	text-shadow: none !important;
}

.blog_video_loop_grid .blog_video_loop_item:focus-within .video_blog_icons {
	display: none !important;
}

.blog_video_loop_grid .blog_video_loop_item:focus-within .blog_video_loop_txt {
	max-height: 350px !important;
	opacity: 1 !important;
	transform: translateY(0) !important;
}

.blog_video_loop_grid .e-loop-item:has(a:focus-visible) {
	box-shadow: 0 8px 20px rgba(70, 89, 97, 0.12);
	outline: 3px solid #a6ce39;
	outline-offset: 3px;
}

@media (max-width: 767px) {
	.blog_video_loop_grid .blog_video_loop_item::before {
		background: linear-gradient(
			180deg,
			rgba(255, 255, 255, 0) 0%,
			rgba(255, 255, 255, 0) 32%,
			rgba(255, 255, 255, 0.55) 46%,
			rgba(255, 255, 255, 0.94) 56%,
			#fff 62%,
			#fff 100%
		) !important;
		opacity: 1 !important;
	}

	.blog_video_loop_grid .blog_video_loop_item .elementor-heading-title {
		font-size: 20px !important;
		line-height: 28px !important;
	}

	.blog_video_loop_grid .blog_video_loop_item:is(:hover, :focus-within)::after {
		opacity: 1 !important;
	}

	.blog_video_loop_grid .blog_video_loop_item:hover .video_blog_icons {
		display: block !important;
	}

	.blog_video_loop_grid .blog_video_loop_item:focus-within .video_blog_icons {
		display: none !important;
	}

	.blog_video_loop_grid .blog_video_loop_item:is(:hover, :focus-within) .blog_video_loop_txt {
		max-height: 350px !important;
		opacity: 1 !important;
		transform: translateY(0) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.blog_video_loop_grid .e-loop-item,
	.blog_video_loop_grid .blog_video_loop_item::after,
	.blog_video_loop_grid .blog_video_loop_txt {
		transition: none !important;
	}
}