*, 
*:before,
*:after {
  box-sizing: border-box;
}

:is(h1, h2, h3, h4, h5, h6, p, li) {
  margin-bottom: unset;
}

:root {
  --brandFont: "Jost", sans-serif;
  --primary1: #00538b;
  --primary2: #0074bf;
  --primary3: #00b388;
  --secondary1: #043465;
  --secondary2: #00c898;
  --secondary3: #951d54;
  --teal500: #008E6E;
  --bodyBg: white;


  --gray100: #f4f2ed;
  --gray200: #dbdad7;
  --gray300: #c2c3c1;
  --gray400: #a9abaa;
  --gray500: #909394;
  --gray600: #777c7e;
  --gray700: #5e6468;
  --gray800: #454d51;
  --gray900: #2c353b;

  --text: var(--gray900);
  --text-dark: black;
  --link: var(--primary2);

  --maxWidth: 1300px;

  --baseFontSize: 1rem;
  --baseFontWeight: 350;
  --baseLineHeight: 1.5;

  --h1Scale: calc(var(--baseFontSize) * 2.5);
  --h1Weight: 600;

  --h2Scale: calc(var(--baseFontSize) * 2);
  --h2Weight: 450;

  --bigShadow: drop-shadow(0 0.5em 2em rgba(0, 0, 0, 0.15));

  --shadow-4: -3px 5px 8px 0px rgba(0, 0, 0, 0.04), -5px 9px 18px 0px rgba(0, 0, 0, 0.10), -20px 27px 48px 0px rgba(0, 0, 0, 0.16);

  --colGap: 2rem;

  --borderColor: var(--gray900);

  --gapX: 1.5rem;
  --apsGridCols: 4;
  --maxWidth: 1280px;
  --outerGap: 2rem;
}

@media (width >= 1024px) {
  :root {
    --gapX: 2rem;
    --apsGridCols: 12;
  }
}

@media (width >= 1280px) {
  :root {
    --gapX: 2.5rem;
    --outerGap: 4rem;
  }
}

body {
  font-size: 1rem;
  color: var(--text);
}

p {
  color: var(--text);
}

a {
  color: var(--primary2);
}

a:hover {
  color: var(--primary1);
}


@media(width >= 900px) {
  :root {
    --colGap: 4rem;
  }

  .menu.vertical.medium-horizontal {
    display: flex;	
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (width < 1024px) {
  :root {
    --fs: 1rem;
    --fs-impact: calc(var(--fs) * 2.5);
    --fs-h1: calc(var(--fs) * 2);
    --fs-h2: calc(var(--fs) * 1.6818);
    --fs-h3: calc(var(--fs) * 1.4142);
    --fs-h4: calc(var(--fs) * 1.1892);
    --fs-h5: calc(var(--fs) * 1);
    --fs-h6: calc(var(--fs) * 1);
    --fs-small: calc(var(--fs) * 0.875); /* The scale dictates that this should be .8409, but we don't want it to dip below 14 */
  }
}

@media (width >= 1024px) {
  :root {
    --fs: 1.125rem;
    --fs-impact: calc(var(--fs) * 3);
    --fs-h1: calc(var(--fs) * 2.5);
    --fs-h2: calc(var(--fs) * 1.9882);
    --fs-h3: calc(var(--fs) * 1.5811);
    --fs-h4: calc(var(--fs) * 1.2574);
    --fs-h5: calc(var(--fs) * 1);
    --fs-h6: calc(var(--fs) * 1);
    --fs-small: 1rem;
  }
}

:root {
  --gray-100: #F2F2F2;
  --gray-900: #2c353b;
  --text: var(--gray-900);
  
  --ff-default: Jost;

  /*   --fs-small: calc(var(--fs) * 0.875); */
  --fs-overline: var(--fs);

  --fw-default: 350;
  --fw-title: 700;
  --fw-subheading: 600;
  --fw-bold: 600;
  --fw-h1: var(--fw-title);
  --fw-h2: var(--fw-subheading);
  --fw-h3: var(--fw-subheading);
  --fw-h4: var(--fw-subheading);
  --fw-h5: var(--fw-subheading);
  --fw-h6: var(--fw-subheading);
  --fw-overline: 350;
  --fw-link: 500;

  --lh-default: 1.6;
  --lh-heading: 1.1;
  --lh-small: 1.6;
  --lh-h1: var(--lh-heading);
  --lh-h2: var(--lh-heading);
  --lh-h3: var(--lh-heading);
  --lh-h4: var(--lh-heading);
  --lh-h5: var(--lh-heading);
  --lh-h6: var(--lh-heading);

  --ls-default: calc(2 * 0.01em); /*  2% */
  --ls-heading: calc(-2 * 0.01em); /* -2% */
  --ls-overline: calc(24 * 0.01em); /* 24% */
  --ls-small: calc(8 * 0.01em); /*  8% */
}

body {
  color: var(--text);
  font-family: var(--ff-default);
  font-weight: var(--fw-default);
  line-height: var(--lh-default);
  letter-spacing: var(--ls-default);
  text-rendering: optimizelegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: grayscale;
}

a {
  font-weight: var(--fw-link);
}

b,
strong {
  font-weight: var(--fw-bold);
}

i,
em,
cite {
  font-style: italic;
}

.wrap {
  max-width: 90vw;
  margin: 3rem auto;
  gap: 2rem;
}

.scale {
  border: 1px solid #ccc;
  padding: 2rem;
  margin-bottom: 2rem;
}

.elements {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto;
  gap: 3rem;
}

.elements > * {
  margin: 0;
  transition: 1s all ease-in-out;
}

.prose {
  max-width: 65ch;
  /* margin: auto; */
}

.prose * {
  transition: 1s all ease-in-out;
}

:is(h1, h2, h3, h4, h5, h6), 
:is(h1, h2, h3, h4, h5, h6):first-of-type {
  margin: 1.4em 0 0.5em 0;
  text-wrap: balance;
  text-edge: cap alphabetic;
  leading-trim: both;
  line-height: var(--lh-heading);
  letter-spacing: var(--ls-heading);
}

:is(h1, h2, h3, h4, h5, h6):first-child {
  /* margin-top: 0; */
}


p,
.main-body li {
  font-size: var(--fs);
  font-weight: var(--fw-default);
  margin: .5em 0;
}

/* :is(ol, ul) {
  margin-left: 2em;
} */

li::marker {
  color: var(--primary3);
}

:is(h1, .h1) {
  font-size: var(--fs-h1) !important;
  font-weight: var(--fw-h1) !important;
}

h2 ,
.h2{
  font-size: var(--fs-h2);
  font-weight: var(--fw-h2);
}

h3,
.h3 {
  font-size: var(--fs-h3);
  font-weight: var(--fw-h3);
}

h4,
.h4 {
  font-size: var(--fs-h4);
  font-weight: var(--fw-h4);
}

h5,
.h5 {
  font-size: var(--fs-h5);
  font-weight: var(--fw-h5);
}

h6,
.h6 {
  font-size: var(--fs-h6);
  font-weight: var(--fw-h6);
}

.impact-title {
  font-size: var(--fs-impact);
  font-weight: var(--fw-title);
}

.overline {
  font-size: var(--fs-overline);
  font-weight: var(--fw-overline);
  letter-spacing: var(--ls-overline);
  text-transform: uppercase;
}

.small {
  font-size: var(--fs-small);
  letter-spacing: var(--ls-small);
  line-height: var(--lh-small);
}



/* Buttons */
.button {
  font-size: 1.1rem;
  font-weight: var(--fw-bold);
  border-radius: 0 !important;
  margin: 0;
  padding: 1.4em 5.5em 1.4em 1.5em;
  background: var(--primary2) !important;
  position: relative;
  border: 0 !important;
  display: inline-flex;
  align-items: center;
}

.button:hover {
  background: var(--primary1) !important;
}

.button:hover:after {
  --arrowColor: var(--secondary1);
  background: var(--arrowColor) !important;
}

.button:focus {
  border-radius: 0;
  outline: 1px solid var(--primary2);
  outline-offset: 1px;
}

.button:after {
  --arrowColor: var(--primary1);
  background-color: var(--arrowColor);
  content: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.6993 6.3087L8.16549 1.77493L9.53698 0.403438L16.412 7.27849L9.69172 13.9988L8.32022 12.6273L12.6993 8.24829L0.41127 8.24829L0.41127 6.3087L12.6993 6.3087Z' fill='white'/%3E%3C/svg%3E%0A");
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
}

.button.expanded {
  width: auto;
  display: inline-block;
}

.button.alert {
  padding-right: 1.5em;
}

.button.secondary {
  --bg: white;
  background-color: var(--bg) !important;
  border: 0 !important;
  color: var(--gray900) !important;
  padding: .75rem 3.5rem .75rem 1rem !important;
}

.button.secondary::after {
  --arrowColor: var(--secondary2);
  content: url("data:image/svg+xml,%3Csvg width='17' height='14' viewBox='0 0 17 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.6993 6.3087L8.16549 1.77493L9.53698 0.403438L16.412 7.27849L9.69172 13.9988L8.32022 12.6273L12.6993 8.24829L0.41127 8.24829L0.41127 6.3087L12.6993 6.3087Z' fill='%232c353b'/%3E%3C/svg%3E%0A");
  color: var(--primary3);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
}

.button.secondary:hover {
  --bg: var(--gray100);
}

.button.secondary:hover::after {
  --arrowColor: var(--teal500);
}

.button.alert {
  background: red !important;
  color: white;
}

.button.alert::after {
  content: "";
  display: none;
}

.button:has(:not(i))::after {
  display: none;
  padding-right: 1.5rem;
}





/* Text button */
a.button--text,
a.button--text--invert { 
  display: block;
  font-weight: var(--fw-bold);
  /* display: inline-flex; */
  /* align-items: center; */
  gap: .5rem;
  transition: .2s all ease-in-out;
  text-decoration-line: underline;
  text-decoration-thickness: 3px;
  text-decoration-color: transparent;
  text-underline-offset: -.1em;
  padding: .25rem 0;
  vertical-align: middle;
  text-wrap: balance;
}

.button--text:hover {
  color: var(--primary2) !important;
  text-decoration-color: var(--primary2);
}

.button--text--invert:hover {
  color: white !important;
  text-decoration-color: var(--primary2);
  text-decoration-color: white;
}


:is(.button--text, .button--text--invert):hover {
  font-weight: var(--fw-bold);
  text-underline-offset: 2px;
  vertical-align: middle;
  
}

a.button--text {
  color: var(--text) !important;
}

a.button--text--invert {
  color: white;
}


:is(.button--text, .button--text--invert)::after {
  grid-column: 2;
  translate: 0 2px 0;
  transition: .2s all ease-in-out;
  vertical-align: middle;
  margin-left: .5em;
}

.button--text::after,
.button--text--invert:hover::after {
  content: url("data:image/svg+xml,%3Csvg width='21' height='17' viewBox='0 0 17 14' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.6993 6.3087L8.16549 1.77493L9.53698 0.403438L16.412 7.27849L9.69172 13.9988L8.32022 12.6273L12.6993 8.24829L0.41127 8.24829L0.41127 6.3087L12.6993 6.3087Z' fill='%2300b388'/%3E%3C/svg%3E%0A");
}

.button--text:hover::after {
  content: url("data:image/svg+xml,%3Csvg width='21' height='17' viewBox='0 0 17 14' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.6993 6.3087L8.16549 1.77493L9.53698 0.403438L16.412 7.27849L9.69172 13.9988L8.32022 12.6273L12.6993 8.24829L0.41127 8.24829L0.41127 6.3087L12.6993 6.3087Z' fill='%230074bf'/%3E%3C/svg%3E%0A");
}


a.button--text--invert::after {
  content: url("data:image/svg+xml,%3Csvg width='21' height='17' viewBox='0 0 17 14' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12.6993 6.3087L8.16549 1.77493L9.53698 0.403438L16.412 7.27849L9.69172 13.9988L8.32022 12.6273L12.6993 8.24829L0.41127 8.24829L0.41127 6.3087L12.6993 6.3087Z' fill='%23ffffff'/%3E%3C/svg%3E%0A");
}


a:is([href="#"], [href=""]):before {
  content: "No link!"
  color: red !important;
  outline: 2px solid red;
}

.top-bar {
  padding-left: 1rem;
  padding-right: 1rem;
}

.banner:empty {
  display: none !important;
  margin: 0;
}

.masthead .logo img {
  margin-left: 0;
}

.masthead .logo:nth-child(2) {
  display: none;
}

.masthead {
  position: relative;
  padding-bottom: 1rem;
}

:is(.public-nav, #public-nav) ul.menu li a {
  font-weight: 500 !important;	
  position: relative;
}

#public-nav ul.menu li.active :is(a:not(.button):hover, a:not(.button)) {
  background: var(--primary2) !important;
  color: white !important;
}

#public-nav ul.menu li.active:hover a:before {
  background: white !important;
}


#public-nav li:has(
  a:is(
    [href*="resources"], [href*="contact"]
  )
) {
  display: none;
}
  

:is( .public-nav, #public-nav) ul.menu li:hover a:before {
  content: "";
  height: 5px;
  position: absolute;
  top: -5px;
  left: 0;
  background: var(--primary3);
  width: 100%;
}


.banner:has(.slick-track:empty) {
  display: none !important;
}

.program-subnav {
  display: flex;
  list-style: none;
  padding: 0 0 .5rem 0;
  margin: 0;
  border-bottom: 1px solid var(--gray200);
}

/* [data-target-id="19"]:not(:only-child):has(.program-subnav) {
  display: none;
} */

.program-subnav a {
  padding-bottom: .5rem;
}


.program-subnav li {
  margin: 0;
  padding: .5em 1em;
}

.program-subnav li:not(:last-child) {
  border-right: 1px solid var(--gray200);
}

.program-current {
  color: var(--text);
  border-bottom: 3px solid var(--secondary2);
}

.program-current:hover {
  color: var(--text);
  text-decoration: none;
  cursor: pointer;
}

.title-bar {
  background-color: var(--primary1);
  display: flex;
  justify-content: flex-end;
}

.title-bar-title {
  display: none;
}


:is(a, button, .button, h1, h2, h3, h4, h5, h6, .menu, .menu li a, p, .button, .label) {
  font-family: var(--brandFont) !important;
}

:is(h1, h2, h3, h4, h5, h6) {
  line-height: 1.2;
}

:is(h1, h2, h3, h4, h5, h6, bold, strong) {
  color: var(--text) !important;
}

.home-intro,
.bodycopy {
  max-width: 95ch;
}



.bodycopy :is(ul, ol) {
  padding-left: 1em;
}

.bodycopy > h1 {
  margin-top: 1em;
}

.public-page .header-wrapper .header-wrapper  :is(h1):first-child {
  margin-top: 1em !important;
  font-size: var(--fs-impact);
}

/* Home hero */



.home-hero,
.feature {
  margin-bottom: 3rem;
  margin-top: 3rem;
  padding: var(--outerGap) 0;

  display: grid;
  gap: var(--colGap);
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  /* grid-template-columns: 1fr; */
}

.home-hero {
  align-items: stretch;
  border-top: 4px solid var(--borderColor);
  border-bottom: 1px solid var(--borderColor);
}

.home-hero h1 {
  margin-top: 0;
}

.feature {
  align-items: center;
  margin-top: 3rem;
}

.feature + .feature {
  margin-top: 6rem;
}

.home-hero > * {
  display: flex;
  flex-direction: column;
  justify-self: center;
  /* grid-row: 1 / -1; */
  align-self: center;
}

@media (width >= 800px) {
  .home-hero {
    /* grid-template-columns: 1fr 1fr; */
  }    
}


@media (width >= 604px) {
  .home-hero {
    padding: var(--outerGap);
  }    
}

@media (width >= 1024px) {
  .home-hero, {
    padding-inline: var(--outerGap);
  }    
}


.feature .image-block,
.home-hero img {
  box-shadow: var(--shadow-4);
  display: block;
  width: 100%:
}

.home-hero *:last-child {
  margin-bottom: 0;
}

iframe[src*="youtube"] {
  aspect-ratio: 16 / 9;
  display: block;
  width: 100%;
}

.post-content {
  border-top: 1px solid var(--primary3);
  border-bottom: 1px solid var(--primary3);
  margin: 2rem 0;
  padding: 2rem 0 1rem 0;
}

/* Feature */

/* .feature {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
  gap: var(--colGap);
  align-items: center;
} */

:is(.feature:nth-child(odd) ~ .feature:nth-child(even)) > *:first-child{
  order: 2;
}


.feature__content {
  margin-right: auto;
  max-width: 65ch;
}

/* Split */

.split {

  --splitCols: 1fr;
  --splitGap: 1.5rem;

  display: grid;
  grid-template-columns: var(--splitCols);
  column-gap: var(--splitGap);
  margin: 4rem auto;
}

@media (width >= 800px) {
  .split {
    --splitCols: 1fr 1px 1fr;
    --splitGap: 3rem;
  }

  .split > *:first-child {
    order: 1;
  }

  .split > *:last-child {
    order: 3;
  }

  .split:after  {
    content: "";
    background: var(--gray900);
    width: 1px;
    align-self: stretch;
    order: 2;
    
  }
}

/* More */

.more,
.announcements {
  margin-top: 6rem;
  padding-top: 3rem;
  position: relative;
}

/* Accordions and Documents/FAQ */

.accordion > li {
  margin: 0;
}

.accordion-item .category-heading {
  font-size: var(--fs-h4);
  font-weight: var(--fw-subheading);
}

.accordion-item :is(.accordion-title):hover {
  text-decoration: none;
}

.accordion-content {
  padding: 0;
}

.accordion-content .listing-entry {
  padding: 1rem;
}

.listing-entry {
  border-top-color: var(--gray300);
}

.listing-entry h3 {
  font-size: var(--fs);
  font-weight: var(--fw-subheading);
  margin: 0;
}

.listing-entry h3 a {
  text-decoration: underline;
  color: var(--primary2);
}

.listing-entry .body > *:first-child {
  margin-top: .5rem;
}

.listing-entry .body > *:last-child {
  margin-bottom: 0;
}

.callout.secondary {
  background: var(--gray100);
  border-left: 1px solid var(--secondary2);
}

.callout.secondary h3 {
  font-size: var(--fs-h4);
}

:root {

}

.sidenav {
  display: none;
}


.main-body {
  padding: var(--outerGap);
}

.main-body > .grid-container {
  padding: 0;
  width: 100%;
  margin: 0 auto;
  max-width: var(--maxWidth);
}

.grid-x {
  display: block;
}

.grid-margin-x {
  margin: 0;
}

.grid-x .cell {
  margin: 0;
  width: 100%;
}

.grid-padding-x > .cell {
  padding: 0;
}

.grid-container:not(.full) > .grid-padding-x {
  margin: 0;
}

#main-content > * {
  margin: 0;
}

.grid-margin-x > .small-12 {
  width: auto !important;
}

.aps-grid,
.announcements .grid-x {
  display: grid;
  grid-template-columns: repeat(var(--apsGridCols), 1fr);
  column-gap: var(--gapX);
}

.aps-grid > * {
  grid-column: 1 / -1;
}

@media (width >= 1024px) {
  .aps-grid .text-container {
    grid-column-end: 9;
  }
}



.text-container > *:first-child {
  margin-top: 0;
}

.text-container > *:last-child {
  margin-bottom: 0;
}


.announcements,
.announcements .grid-x {
  grid-column-gap: var(--colGap);
  grid-template-columns: repeat(var(--apsGridCols), 1fr);
}

.announcements .grid-x > * {
  grid-column: span 4;
}

.announcements h1 {
  font-size: var(--fs-h2);
  font-weight: var(--fw-subheading);
}

.announcements h2 {
  font-size: var(--fs-h3);
}

:is(.more, .announcements):before {
  border-top: 4px solid var(--gray900);
  height: 4px;
  width: 100%;
  max-width: 75ch;
  top: 0;
  left: 0;
  content: "";
  position: absolute;
}

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--gapX);
  margin-top: 3rem;
}

.cards > * {
  container: cards / inline-size;
}