/* Three Column Infobox Block - uses help-block and card-help styles */

/* ### help block ### */
.help-block { margin-bottom: 58px; }
.help-block h2 { margin-bottom: 16px; font-size: var(--font-size-h3); }
.help-block-holder { padding-bottom: 59px; display: grid; gap: 20px; border-bottom: solid 1px var(--color-grey-100); }

/* ### card-help ### */
.card-help { position: relative; display: block; width: var(--width); min-height: 371px; border-radius: var(--border-radius); background-color: var(--color-medium-blue); overflow: hidden; }
.card-help-image { position: absolute; bottom: 0; left: 0; opacity: 0.15; }
.card-help-image img { width: var(--width); height: var(--height); object-fit: cover; }
.card-help-info { padding: 20px 20px 7px; position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-content: flex-end; width: var(--width); height: var(--height); color: var(--color-white); }
.card-help-info span { margin-bottom: 15px; display: block; font-size: var(--font-size-h5); font-weight: var(--font-weight-extra-bold); }
.card-help.dark-pink { background-color: var(--color-dakr-pink); }
.card-help.orange { background-color: var(--color-orange); }
.card-help:hover .button.white { color: var(--color-dark-blue); background-color: var(--color-white); }
.card-help.white { min-height: 307px; background-color: var(--color-white); }
.card-help.white .card-help-info { padding: 25px; color: var(--color-dark-blue); }
.card-help.white .card-help-info span { margin-bottom: 21px; line-height: normal; color: var(--color-dark-blue); }
.card-help.white:hover .button { color: var(--color-white); background-color: var(--color-dark-blue); }

@media only screen and (min-width: 768px) {
	.help-block-holder { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}
@media only screen and (min-width: 1025px) {
	.help-block-holder { padding-bottom: 81px; grid-template-columns: repeat(3, 1fr); }
	.help-block { margin-bottom: 65px; }
	.help-block h2 { margin-bottom: 23px; }
	.help-block-holder { padding-bottom: 81px; grid-template-columns: repeat(3, 1fr); }
}