/* Page Components - Resource Cards with Intro */

.resource-cards__container { display: grid; grid-gap: 1.139rem; margin: 3rem 0 3.5rem 0; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column;}

/* This is so when you view the component in block view in admin it stays 3 across */
.acf-block-component .resource-cards__container { grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; grid-gap: 1.139rem; }

.resource-cards-with-intro__inner { border-radius: 1.667rem; overflow: hidden; padding: 4.611rem 5rem 5.5rem 5rem;}
.resource-cards__heading-container { display: grid; grid-template-columns: 2.1fr 1fr; grid-gap: 1.139rem; margin-top: 0rem; margin-bottom: 4rem; align-items: end; }
.resource-cards__heading-container .resource-cards__heading { color: var(--accent-quaternary); margin: 0; }

.content-block__content.resource-cards__intro { font-size: 1.0rem; line-height: 1.67; color: var(--darker-gray); padding-bottom: clamp(0.1rem, 0.2875rem + 0.4vw, 0.6875rem); }
.content-block__content.resource-cards__intro p:last-child { margin-bottom: 0; }
.resource-cards__container-card { display: flex; flex-direction: column; padding: 10px 10px 10px 10px; border-radius: 0.833rem; border: solid 1px #acc6d6; background-color: rgb(255 255 255 / 80%); }

.resource-card__image-container { margin-bottom: 1.5rem; position: relative; padding-bottom: 60%; }
.resource-card__image-container img { border-radius: 0.633rem; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; object-fit: cover; object-position: center center; }
.resource-card__date { display: inline-block; font-family: var(--text-family); font-size: 0.833rem; font-weight: normal; line-height: 1.07; letter-spacing: 0.47px; text-transform: uppercase; color: var(--darker-gray); margin-bottom: 1rem; }
.resource-card__text-container { padding-inline: 0.889rem; padding-bottom: 0.556rem; }
.resource-card__heading { font-family: var(--text-family); font-size: 1.0rem; font-weight: 500; line-height: 1.67; letter-spacing: normal; color: var(--accent-quaternary); margin-bottom: 1rem; }
.resource-card__button, .wp-admin .acf-block-component .resource-card__button {	margin-top: auto; margin-bottom: 0; padding-top: 10px; margin-inline: 0.889rem; border-top: solid 1px #acc6d6; }
.resource-card__button .button, .wp-admin .acf-block-component .resource-card__button .button[class*="button-style-2"] { background-color: transparent; margin-bottom: 0; letter-spacing: 0.7px; text-align: left; padding: 0.711rem 2.667rem 0.711rem 0rem; border-bottom: none; font-size: 0.944rem; backdrop-filter: unset; }
section.resource-cards-with-intro .button__container .button[class*="button-style-1"] { --background-color: var(--secondary); --hover-background-color: var(--primary); }

@media (max-width: 1300px) {
	.resource-cards-with-intro__inner { padding: 2.611rem 3rem 3.5rem 3rem; }
	.resource-cards__heading-container { margin-bottom: 2rem; }
	.resource-cards__container { margin: 2rem 0 3.0rem 0;}
}
@media (max-width: 1100px) {
	.resource-cards__heading-container { grid-template-columns: 1fr; grid-gap: 0; margin: 1rem 0 1.5rem 0; }
	.resource-cards__container { grid-auto-columns: 1fr; grid-auto-flow: row; margin: 1.5rem 0 3.0rem 0;}
	.resource-cards__heading-container .resource-cards__heading { margin-bottom: 1rem; }
	.acf-block-component .resource-cards__container { grid-auto-columns: 1fr; grid-auto-flow: row; }
	.resource-card__image-container { margin-bottom: 1rem; }

}
@media (min-width: 700px) and (max-width: 1100px) {
	.resource-card__image-container{ padding-bottom: 50%; }
}
@media (max-width: 639px) {
	.resource-cards-with-intro__inner { padding: 1.5rem 1.5rem 2rem 1.5rem; }
	.resource-cards__container { margin-bottom: 2rem; }
}
@media (max-width: 479px) {
	section.resource-cards-with-intro .button__container { justify-content: center; }
}