/* ==========================================================================

   Cards - Icon

   ========================================================================== */

.cards--icon .cards__items {
	display: grid;

	grid-template-columns: repeat(4, 1fr);

	gap: 2rem;
}

.cards--icon .cards__item {
	position: relative;

	height: 100%;

	padding: 2rem 1.5rem;

	border-radius: 30px;

	background-color: var(--color-secondary-light);
}

.cards--icon .cards__icon {
	position: relative;

	width: 60px;

	height: 60px;

	margin-bottom: 1rem;

	margin-left: auto;

	margin-right: auto;
}

.cards--icon .cards__icon-ico {
	display: block;

	width: 60px;

	height: 60px;

	object-fit: contain;
}

/* ==========================================================================

   Cards - Not Icon

   ========================================================================== */

.cards--icon .not-icons.cards__items {
	gap: 3rem;

	padding: 0 60px;
}

.cards--icon .not-icons.bg-primary-light .cards__item {
	background-color: var(--color-background-extralight);
}

.cards--icon .not-icons .cards__item {
	position: relative;

	height: 100%;

	padding: 2.5rem 1.5rem 2.5rem;

	background-color: var(--color-white);
}

.cards--icon .not-icons .cards__description {
	height: auto;
}

/* --------------------------------------------------------------------------

   Content

   -------------------------------------------------------------------------- */

.cards--icon .cards__title {
	display: flex;

	font-family: var(--font-primary);

	font-size: var(--font-size-lg);

	font-weight: var(--heading-weight-bold);

	color: var(--color-primary);

	height: 48px;

	overflow: hidden;

	margin: 0 0 0.75rem;
}

.cards--icon .cards__description {
	height: 90px;

	overflow: hidden;

	margin-bottom: 1.5rem;

	color: var(--color-secondary);
}

.cards--icon .cards__cta {
	margin-top: auto;
}

/***** CARD ICON SLICK *****/

.cards--icon .cards__items.slick-2 .slick-slide,
.cards--icon .cards__items.slick-3 .slick-slide,
.cards--icon .cards__items.slick-4 .slick-slide {
	margin-left: 15px !important;

	margin-right: 15px !important;
}

.cards--icon .cards__items.slick-2,
.cards--icon .cards__items.slick-3,
.cards--icon .cards__items.slick-4 {
	margin-left: -15px !important;

	margin-right: -15px !important;
}

.cards--icon .cards__items.slick-2 .slick-list,
.cards--icon .cards__items.slick-3 .slick-list,
.cards--icon .cards__items.slick-4 .slick-list {
	padding: 0px 0 10px !important;
}

.cards--icon .not-icons.cards__items.slick-2 .slick-list,
.cards--icon .not-icons.cards__items.slick-3 .slick-list,
.cards--icon .not-icons.cards__items.slick-4 .slick-list {
	padding: 0px 0 10px !important;
}

/***** RESPONSIVE *****/

@media (max-width: 767.98px) {
	.cards--icon .cards__items.slick-2 .slick-slide,
	.cards--icon .cards__items.slick-3 .slick-slide,
	.cards--icon .cards__items.slick-4 .slick-slide {
		margin: 0 20px !important;
	}

	.cards--icon .cards__items.slick-2,
	.cards--icon .cards__items.slick-3,
	.cards--icon .cards__items.slick-4 {
		margin: 0 0px !important;
	}

	.cards--icon .cards__items.slick-2 .slick-list,
	.cards--icon .cards__items.slick-3 .slick-list,
	.cards--icon .cards__items.slick-4 .slick-list {
		padding: 0px 0 10px !important;
	}

	.cards--icon .cards__items.slick-2,
	.cards--icon .cards__items.slick-3,
	.cards--icon .cards__items.slick-4 {
		margin: 0 0px !important;
	}

	.cards--icon .cards__title {
		justify-content: center;
	}

	.cards--icon .cards__icon {
		margin-top: 0rem;

		width: 40px;

		height: 40px;
	}

	.cards--icon .cards__icon-ico {
		width: 40px;

		height: 40px;
	}

	.cards--icon .not-icons.cards__items {
		padding: 0;

		gap: 1rem;
	}

	.cards--icon .not-icons .cards__item {
		padding: 2rem 1rem 2rem;

		text-align: center;
	}
}