/**
* Component: Cards
*
* Styles for the Cards component.
*
* @package Point_Hope
*/

.cards .heading-and-text {
	padding-bottom: 60px;
}
.cards .heading-and-text h2 {
	margin-bottom: 0;
}
.cards .heading-and-text .intro-text {
	padding-top: 8px;
}
.card-button {
	padding-bottom: 6px;
}
.card-content {
	padding: 24px 26px 12px 24px;
}
.card-content .card-text {
	margin-bottom:8px;
	text-wrap: pretty;
}
.card-image {
	line-height: 1;

	&:hover, &:focus-visible {
		+ .card-content {
			.card-button {
				.text-line-below-link {
					color: var(--color-slate);

					&:before {
						background-size: contain;
        				background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='205' height='6' viewBox='0 0 205 6' fill='none'%3E%3Cpath d='M0 1C11.3879 1 11.3879 5 22.7758 5C34.1637 5 34.1637 1 45.5425 1C56.9214 1 56.9304 5 68.3183 5C79.7062 5 79.7152 1 91.1031 1C102.491 1 102.491 5 113.879 5C125.267 5 125.267 1 136.655 1C148.043 1 148.043 5 159.43 5C170.818 5 170.818 1 182.215 1C193.612 1 193.603 5 205 5' stroke='%23005783' stroke-width='2' stroke-miterlimit='10'/%3E%3C/svg%3E");
					}
					&:after {
						transform: translateY(-50%) translateX(15px);
        				background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'><path d='M5.84338 16L5.41927 15.5359L10.1788 8.88666H0V7.10761H10.1788L5.41927 0.4641L5.84338 0L16 7.7923V8.2077L5.84338 16Z' fill='%23005783'/></svg>");
					}
				}
			}
		}
	}
	a {
		overflow: hidden;
		display: block;

		&:hover, &:focus-visible {
			img {
				transform: scale(1.1);
			}
		}
		img {
			display: block;
			transition: .5s ease;
		}
	}
}
.card-image img {
	max-width:100%;
	object-fit:cover;
}
@media (min-width: 993px) {
	.cards-wrapper {display: grid;grid-template-columns: repeat(2, 1fr);column-gap: 40px;row-gap: 50px;}
	.cards-wrapper .swiper-wrapper {display: contents;}
	.cards-wrapper .swiper-slide {width: auto !important;}
	.cards-slider-nav {display: none;}
	.card-content .card-text {max-width: 563px;}
}
@media (min-width: 1199px) {
	.cards-wrapper {row-gap: 72px;}
}
@media (max-width: 992px) {
	.cards-wrapper {position: relative;margin: 0 -14px;}
	.cards-wrapper .swiper-slide {height: auto;}
	.card {background: var(--color-white);box-shadow: 0 0 8px 0 rgba(77, 77, 83, 0.20);padding: 24px 24px 36px;margin: 24px 14px;}
	.card-image img {width:100%;object-fit:cover;max-height:500px;}
	.card-content {padding: 0;padding-top: 8px;}
	.cards .heading-and-text {padding:50px 14px 12px;}
	.cards-wrapper .swiper-slide {opacity: 0;transition: opacity 0.6s ease;}
	.cards-wrapper .swiper-slide-active {opacity: 1;}
	.cards-slider-nav {display: flex;align-items: center;justify-content: center;gap: 22px;}
	.cards-slider-nav .swiper-button-prev,
	.cards-slider-nav .swiper-button-next {position: relative;width: 40px;height: 40px;top: 0;margin: 0;left: 0;right: 0;}
	.cards-slider-nav .swiper-pagination {position: relative;width: auto;color: var(--color-hope);font-size: 16px;font-weight: 700;letter-spacing: 1.6px;display: flex;top: 0;}
	.cards-slider-nav .swiper-pagination-bullet {display: none;width: 100%;}
	.cards-slider-nav .swiper-pagination-bullet.swiper-pagination-bullet-active {display: flex;justify-content: center;align-items: center;background-color: transparent;}
}
@media (max-width: 575px) {
	.card-image img {width:100%;object-fit:cover;max-height:200px;}
}
