/* * {outline: 1px solid rgba(23,23,23,.1); } */




/* =========
   STRUCTURE
   ========= */
html {
	font-size: 10px;
	background: var(--color__white); }

#wrapper {
	min-height: 100vh;
	min-width: 320px;
	background: var(--color__white);
	position: relative; }
		



#wrapper,
header#header,
#container,
.m,
footer#footer {
	margin: 0 auto;
	width: 100%;
	display: block; }	
	

/* .m */	
.m {
	text-align: center;
	position: relative; }
			
/* .mc */
.mc {
	width: 100%;
	max-width: var(--layout__width);
	margin: 0 auto;
	padding: var(--spacing__xl) var(--spacing__sm);
	position: relative;
	z-index: 10; }

.mc__width__max .mc {
	max-width: 100%; }	

.mc__width__md .mc {
	max-width: var(--layout__width__md); }	
	
.mc__width__sm .mc {
	max-width: var(--layout__width__sm); }	
	
.mc__pad__0 .mc {
	padding: 0; }

.mc__pad__0-x .mc {
	padding-top: 0;
	padding-bottom: 0; }

.mc__pad__0-x-x-x .mc {
	padding-top: 0; }

.mc__pad__x-x-0-x .mc {
	padding-bottom: 0; }
		
.mc__pad__x-x-half-x .mc {
	padding-bottom: calc(var(--spacing__xl) / 2); }


@media (max-width: 500px) {
	.mc {
		padding-top: var(--spacing__lg);
	   	padding-bottom: var(--spacing__lg); }
	
}

/* Variations */
.m__slim .mc {
	padding-top:  var(--spacing__lg);
	padding-bottom: var(--spacing__lg); }

/* =======
   M THEME
   ======= */	
.m__theme__default {
	
}

.m__theme__navy {
	background: var(--color__navy__1);
	color: var(--color__white); }

.m__theme__gray {
	background: var(--color__gray__05); }

.m__theme__blue {
	background: var(--color__blue__tint); }
	
/* .m__theme__gray__dark {
	color: var(--color__white);
	background: var(--color__gray__dark); }

.m__theme__blue {
	color: var(--color__white);
	background: var(--color__blue); }


.box__theme__blue__tint {
	background: var(--color__blue__tint); }
 */

	
/* =========
   MC LAYOUT
   ========= */
/* .mc__eyebrow,
.mc__content,
.mc__content h2 {
	margin-bottom: var(--spacing__sm); } */
	
.mc__eyebrow + .mc__content,
.mc__module + .mc__footer,
.mc__eyebrow + .mc__module,
.mc__content + .mc__footer,
.mc__content .mc__content__image {
	margin-top: var(--spacing__sm); }

.mc__content {
	margin-left: auto;
	margin-right: auto;
	max-width: var(--layout__width__md); }

.mc__content h2 {
	text-wrap: balance; }
		
.mc__content .eyebrow {
	margin-bottom: var(--spacing__xs); }	

.mc__title {
	margin-bottom: var(--spacing__md); }	
	
.mc__eyebrow + .mc__module,
.mc__content + .mc__module {
	margin-top: var(--spacing__md); }


.js .mcc {
	opacity: 0;
	transform: translateY(20px);
	transition: transform .8s, opacity .6s; }

.mc__content__image svg {
	max-width: 100%;
	height: auto; }
		
/* Animated state */
.m.inview .mcc {
  opacity: 1;
  transform: translateY(0); }
	
/* Cascade delays by order of .mcc */
.m.inview .mcc:nth-of-type(1) { transition-delay: 0.2s; }
.m.inview .mcc:nth-of-type(2) { transition-delay: 0.4s; }
.m.inview .mcc:nth-of-type(3) { transition-delay: 0.6s; }
.m.inview .mcc:nth-of-type(4) { transition-delay: 0.8s; }
.m.inview .mcc:nth-of-type(5) { transition-delay: 1s; }


/* Animate articles */
.single-article .article__sidebar,
.single-article .article__header .block,
.single-article .article__section  {
	opacity: 0;
	transform: translateY(20px);
	transition: transform .8s, opacity .6s; }

.single-article .article__sidebar.inview,
.single-article .article__header.inview .block,
.single-article .article__section.inview  {
	opacity: 1;
	transform: translateY(0); }
	
	
/* =======
   COLUMNS
   ======= */
  
.columns {
	text-align: left;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--spacing__sm); }

.content__columns {
	grid-template-columns: 1fr 2fr; }

.js .content__columns .col {
	opacity: 0;
	transform: translateY(20px);
	transition: transform .8s, opacity .6s; }

.m.inview .content__columns .col {
	opacity: 1;
	transform: translateY(0); }
	  
.m.inview .content__columns .col:nth-of-type(1) { transition-delay: 0.2s; }
.m.inview .content__columns .col:nth-of-type(2) { transition-delay: 0.4s; }

.columns .col__image svg {
	height: auto;
	max-width: 100%; }

	
/* .columns .col {
	flex: 1 1 0; }	

.columns .col__image {
	display: flex;
	align-items: center; }
		 */
@media (max-width: 800px) {
 	
	.columns {
		grid-template-columns: 1fr; }

}
	

		
		
/* ===============
   SECTION SPACING
   =============== */	
	
.m__theme__default + .m__theme__default .mc {
	padding-top: 0; }