
/* ===============
   CARD - FEATURED
   =============== */	

.card__featured {
	color: var(--color__white);
	display: block;
	background: var(--color__light-gray);
	border-radius: 20px;
   	width: 100%;
   	height: 100%;
   	transform: scale(1);
   	transition: all .4s;
   	position: relative;
   	background-size: cover;
	background-position: center;
	background-repeat: no-repeat; }
   			
.card__featured__content {
	display: flex;
	align-content: space-between;
	flex-wrap: wrap;
	box-sizing: border-box;
	padding: 3rem;
	position: relative;
	z-index: 9;
	height: 100%; }
	
.card__featured__header,
.card__featured__footer {
	width: 100%;
	position: relative;
	z-index: 9; }

.card__featured__footer {
	display: flex; }
	
.card__featured:hover {
	transform: scale(1.01); }


/* =============
   IMAGE PINNING
   ============= */

.card__featured.center__desktop { 					background-position: center; }
.card__featured.pin_top_center__desktop { 			background-position: top center; }
.card__featured.pin_top_right__desktop { 			background-position: top right; }
.card__featured.pin_top_left__desktop { 			background-position: top left; }
.card__featured.pin_bottom_center__desktop { 		background-position: bottom center; }
.card__featured.pin_bottom_right__desktop { 		background-position: bottom right; }
.card__featured.pin_bottom_left__desktop { 			background-position: bottom left; }

@media all and (max-width: 768px) {	
	.card__featured.center__mobile { 				background-position: center; }
	.card__featured.pin_top_center__mobile { 		background-position: top center; }
	.card__featured.pin_top_right__mobile { 		background-position: top right; }
	.card__featured.pin_top_left__mobile { 			background-position: top left; }
	.card__featured.pin_bottom_center__mobile { 	background-position: bottom center; }
	.card__featured.pin_bottom_right__mobile { 		background-position: bottom right; }
	.card__featured.pin_bottom_left__mobile { 		background-position: bottom left; }
}



/* ==========
   TYPOGRAPHY
   ========== */	

.card__featured h3 {
	margin-bottom: .15em;
	line-height: 1.2em;
	font-size: 3.2rem; }
	
.cf_large .card__featured p {
	font-size: 2.6rem; }

.cf_large .card__featured h3 {
	margin-top: -1.2rem;
	font-size: 7.2rem; }
		
.card__featured .a_btn {
	min-width: 12em;
	text-align: center; }
	
.card__featured:hover .a_btn {
	background: var(--color__lime); }
			
.cf_small .a_btn {
	min-width: 3em;
	width: 100%; }
	

/*.cf_medium p {
	max-width: 60%; }	*/
	
		
@media all and (max-width: 1100px) {	

	
	.a_btn {
		width: 100%; }	
		
	.cf_large .card__featured h3 {
		font-size: 5rem; }

}	
	
@media all and (max-width: 600px) {	

	
	.cf_large .card__featured h3 {
		margin-top: -.5rem; }

}		


/* ========
   TWO CTAS
   ========*/	
   
.card__featured__footer__two-ctas {
	display: flex;
	gap: 1.5rem; }   
	
 .card__featured__footer__two-ctas a {
 	flex: 1 1 auto;
 	text-align: center; }
 	
 .card__featured__footer__two-ctas a.btn__outline {
 	color: var(--color__white);  }


@media all and (max-width: 600px) {	

	 .card__featured__footer__two-ctas a {
	 	width: 100%; }
	 	
	.card__featured__footer__two-ctas {
		flex-wrap: wrap; }

}	



/* ====
   GRID
   ==== */	
   
.m__cards_featured { }	
		
.cf_grid__row {
	width: calc(100% + var(--spacing__x));
	display: flex; }
	
.cf_grid__row {
	margin-bottom: var(--spacing__x); }
	
.cf_grid .cf_grid__row:last-of-type {
	margin-bottom: 0; }
		
.cf_grid__col {
	flex: 1; }
	

.cf_grid__row .cf_grid__col {
	margin-right: var(--spacing__x); }



/* 
	cf_grid__row__style-A
	Single and Double. 50/50 columns
*/
.cf_grid__row__style-A .cf_grid__col__single .cf_grid__item  {
	height: 67rem; }

.cf_grid__row__style-A .cf_grid__col__double .cf_grid__item  {
	height: calc(33.5rem - 15px); }

.cf_grid__row__style-A .cf_grid__col__double .cf_grid__item:first-of-type {
	margin-bottom:  var(--spacing__x); }
	
/* 
	cf_grid__row__style-B
	Three Singles. 33/33/33 columns
*/	
.cf_grid__row__style-B .cf_grid__item  {
	height: 36rem; }
	
		
/* 
	cf_grid__row__style-C
	Two Singles. 66/33 columns
*/	
.cf_grid__row__style-C .cf_grid__item  {
	height: 57rem; }
	


/* Row A Reverse layout */
.cf_grid__row__style-A.reverse_layout__desktop {
	flex-direction: row-reverse; }



@media all and (max-width: 1100px) {	

	.cf_grid__row__style-A .cf_grid__col__single .cf_grid__item  {
		height: 60rem; }

	.cf_grid__row__style-A .cf_grid__col__double .cf_grid__item  {
		height: calc(30rem - 15px); }
}







/* ============
   GRID - COUNT
   ============ */	

/* 
	1
	If larger than x stick to 900px 
*/
@media all and (min-width: 900px) {	

	.cf_grid__row__1 .cf_grid__col {
		margin-left: auto;
		margin-right: auto;
		max-width: 900px; }
	
}

/* 4 */
.cf_grid__row__4 {
	flex-wrap: wrap; }
	
.cf_grid__row__4 .cf_grid__col {
	flex-basis: calc(50% - var(--spacing__x)); }
	
.cf_grid__row__4 .cf_grid__col {
	margin-bottom: var(--spacing__x); }
	
	
/* 5 */
.cf_grid__row__5 {
	flex-wrap: wrap; }

.cf_grid__row__5 .cf_grid__col:nth-of-type(1),
.cf_grid__row__5 .cf_grid__col:nth-of-type(2) {
	flex-basis: calc(50% - var(--spacing__x)); }
	
.cf_grid__row__5 .cf_grid__col {
	margin-bottom: var(--spacing__x); }
	
	
/* 6 */
.cf_grid__row__6 {
	flex-wrap: wrap; }

.cf_grid__row__6 .cf_grid__col {
	margin-bottom: var(--spacing__x); }
	
	
/* 7 */
.cf_grid__row__7 {
	flex-wrap: wrap; }
	
.cf_grid__row__7 .cf_grid__col:nth-of-type(1),
.cf_grid__row__7 .cf_grid__col:nth-of-type(2),
.cf_grid__row__7 .cf_grid__col:nth-of-type(3),
.cf_grid__row__7 .cf_grid__col:nth-of-type(4) {
	flex-basis: calc(50% - var(--spacing__x)); }

.cf_grid__row__7 .cf_grid__col {
	margin-bottom: var(--spacing__x); }


/* 8 */
.cf_grid__row__8 {
	flex-wrap: wrap; }
	
.cf_grid__row__8 .cf_grid__col:nth-of-type(4),
.cf_grid__row__8 .cf_grid__col:nth-of-type(5) {
	flex-basis: calc(50% - var(--spacing__x)); }

.cf_grid__row__8 .cf_grid__col {
	margin-bottom: var(--spacing__x); }





@media all and (max-width: 1100px) {	

	.cf_grid__row {
		flex-wrap: wrap; }
		
	.cf_grid__row__3 .cf_grid__col,
	.m__cards_featured_grid .cf_grid__row__style-B .cf_grid__col {
		margin-bottom: var(--spacing__x); }
	
	.cf_grid__row__8 .cf_grid__col,
	.m__cards_featured_grid .cf_grid__row__style-B .cf_grid__col {
		flex-basis: calc(50% - var(--spacing__x)); }

	.cf_grid__row__style-B {
		margin-bottom: 0; }
}	
	
	
	
@media all and (max-width: 800px) {	

	.cf_grid__row__style-A .cf_grid__col,
	.cf_grid__row__style-B .cf_grid__col,
	.cf_grid__row__style-C .cf_grid__col {
		flex-basis: 100% !important; }
		
	.cf_grid__row__style-A .cf_grid__col,
	.cf_grid__row__style-B .cf_grid__col,
	.cf_grid__row__style-A .cf_grid__col__double .cf_grid__item:first-of-type,
	.cf_grid__row__style-C .cf_grid__col {
		margin-bottom: var(--spacing__x); }
	
	.cf_grid__row__style-A .cf_grid__col:nth-of-type(2) {
		margin-bottom: 0; }
		
	.m__cards_featured_grid .cf_grid__item  {
		height: auto !important; }	
	
	.m__cards_featured_grid .cf_grid__item .card__featured__header {
		min-height: 20rem !important; }	
		
	.cf_medium p {
		max-width: 100%; }
		
}




@media all and (max-width: 600px) {	

	.cf_grid__row__2 .cf_grid__col,
	.cf_grid__row__3 .cf_grid__col,
	.cf_grid__row__4 .cf_grid__col,
	.cf_grid__row__5 .cf_grid__col,
	.cf_grid__row__6 .cf_grid__col,
	.cf_grid__row__7 .cf_grid__col,
	.cf_grid__row__8 .cf_grid__col  {
		flex-basis: 100% !important; }

	
	

}

/* Limit button width when 1/2 card */
.cf_grid__row__style-B.cf_grid__row__1 .card__featured__footer,
.cf_grid__row__style-B.cf_grid__row__2 .card__featured__footer {
	text-align: center; }

.cf_grid__row__style-B.cf_grid__row__1 .a_btn,
.cf_grid__row__style-B.cf_grid__row__2 .a_btn {
	width: auto;
	min-width: 22rem; }
	
	
/* Overlays and key color */

.card_featured__gradient {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 70%;
	z-index: 2; }

	
	
	
 