/* =========================================================
   Shared Components
========================================================= */


/* ---------------------------------------------------------
   Feature Cards
--------------------------------------------------------- */

.feature-card {
	background: #fff;
	border: 1px solid var(--global-palette7);
	border-radius: 14px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
	overflow: hidden;

	transition:
		box-shadow 0.2s ease,
		border-color 0.2s ease;
}

.feature-card:hover {
	border-color: var(--global-palette1);
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.08);
}


/* =========================================================
   Feature Card Content
========================================================= */

/* Card heading */
.feature-card h3 {
	position: relative;

	margin-top: -10px;
	margin-bottom: 10px;
	padding-bottom: 10px;

	color: var(--global-palette3) !important;
	font-family: var(--global-body-font-family);
	font-size: 1.8rem;
	line-height: 1.3;
}

/* Short green underline below heading */
.feature-card h3::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;

	width: 40px;
	height: 3px;

	background: var(--global-palette1);
	border-radius: 999px;

	transition: width 0.25s ease;
}

/* Extend heading underline on card hover */
.feature-card:hover h3::after {
	width: 70px;
}