.c-hero-branding {
  --box-space: var(--space-l) calc(var(--container-gutter) + ((var(--container-x-wide) - var(--container-wide)) / 2 )) ;
  --hero-background-color: var(--color-secondary);
  --hero-menu-color: var(--color-white);
  --flow-space: var(--space);
  background-color: #1365DF;
  background-color: var(--hero-background-color);
  color: white;

}

.theme-black {
  --hero-background-color: var(--color-mine-shaft);
  --hero-menu-color: var(--color-tertiary);
}

.theme-plum {
  --hero-background-color: var(--color-plum);
  --hero-menu-color: var(--color-white);
}

.c-hero-branding > .l-container {
  width: max(16rem, min(100vw, 95rem));
  width: var(--container-x-wide);
  max-width: 100vw;
  padding-left: clamp(1.25rem, 0.096rem + 5.769vw, 5rem);
  padding-left: var(--container-gutter);
  padding-right: clamp(1.25rem, 0.096rem + 5.769vw, 5rem);
  padding-right: var(--container-gutter);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25rem;
}

@media (min-width: 75em) {

.c-hero-branding > .l-container {
    padding-left: calc(max(16rem, min(100vw, 95rem)) + ((max(16rem, min(98vw, 85rem)) - max(16rem, min(98vw, 85rem))) / 2 ));
    padding-left: calc(var(--container-gutter) + ((var(--container-x-wide) - var(--container-wide)) / 2 ));
     --box-space: var(--space-xl) 0;
     gap: 1rem;
}
  }


.c-hero-branding--logo {
  width: 100%;
  padding-top: max(1rem, min(calc(1.40rem + 1.41vw), 1.5rem));
  padding-bottom: max(1rem, min(calc(1.40rem + 1.41vw), 1.5rem));
  padding-top: max(1rem, min(calc(1.40rem + 1.41vw), 1.5rem));
  padding-top: var(--space);
  padding-bottom: max(1rem, min(calc(1.40rem + 1.41vw), 1.5rem));
  padding-bottom: var(--space);
}


@media(min-width: 45em) {


.c-hero-branding--logo {
    width: 25%;
    align-items: center;
}
  }


@media (min-width: 75em) {


.c-hero-branding--logo {
    max-width: 30%;
}
  }

.c-hero-branding--text {
  padding: 0;
  padding-bottom: max(1rem, min(calc(1.40rem + 1.41vw), 1.5rem));
  padding-bottom: var(--space);
}

@media (min-width: 45em) {

.c-hero-branding--text {
    padding: max(2rem, min(calc(1.40rem + 1.41vw), 2.5rem));
    padding: var(--box-space);
    max-width: calc(75% - 0.25rem);
}
  }

@media (min-width: 75em) {

.c-hero-branding--text {
    max-width: calc(70% - 1rem);
}
  }

.c-hero-branding--text h2 {
 max-width: none;
}

.c-hero-branding--text h2.h1 a{
  color: white;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.c-subsite-menu {
  margin-top: 0.25rem;
  margin-top: var(--space-2xs);
}

.c-subsite-menu a {
  color: var(--hero-menu-color);
  font-weight: 700;
  font-weight: var(--font-bold);
  -webkit-text-decoration: none;
  text-decoration: none;
  font-size: max(0.88rem, min(calc(0.75rem + 0.33vw), 1.00rem));
  font-size: var(--type--1);
}

.c-subsite-menu a:hover {
  -webkit-text-decoration: underline;
  text-decoration: underline;
}

.c-subsite-menu li {
  display: inline-block;
  padding-right: 1rem;
  line-height: 0.8;
}

.c-subsite-menu li + li{
  padding-left: 1rem;
  border-left: 1px solid #ffaa00;
  border-left: 1px solid var(--color-tertiary);
}

.l-page-with-hero h1 {
  display: none;
}