#site-header {
  padding:0 1em;
}

.block-type--hero .hero-wrapper {
  position: relative;
  color: #000;
  background-color: #ffffff;
}
  .block-type--hero .hero-wrapper h1 {
    color: #258185;
  }
@media (min-width: 1024px) {
  .block-type--hero .hero-wrapper:after {
    content: "";
    position: absolute;
    background: initial;
    background-image: url(../images/divider.svg);
    background-size: 180px 400px;
    width: 180px;
    height: 400px;
    min-height:100%;
    top: 0;
    left: 50%;
    right: -180px;
    -webkit-mask: none;
    mask: none;
    z-index:0;
  }
}

  .featured-buttons {
    background-color: #258185;
    border-top: solid 5px #105C62;
  }

    .featured-buttons ul {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: 1fr;
      grid-gap: 2em;
    }

  @media (min-width: 1024px) {
    .featured-buttons ul {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr;
      grid-gap: 2em;
    }
  }

  .featured-buttons li {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
    background-color: #fff;
    border-radius: 32px;
    background-size: 64px;
    background-position: 1.7em 50%;
    background-repeat: no-repeat;
  }

    .featured-buttons li a {
      flex: 1;
      padding: 1.7em 1em 1.7em 6em;
      text-decoration: none;
      font-weight: 700;
      border-radius: 32px;
      border-bottom: solid 4px transparent;
    }
    .featured-buttons li a:hover {
      border-bottom: solid 4px var(--secondary);
    }
    .featured-buttons li a:focus {
     outline:solid 3px var(--gds-yellow);
     background-color:transparent;
     border-radius:30px;
    }

      .featured-buttons li a:after {
        display: none;
      }

.featured-buttons li:nth-child(odd) {
    background-image: url(../images/employer-icon.svg);
  }

.featured-buttons li:nth-child(even) {
      background-image: url(../images/client-icon.svg);
    }

:is(button,input[type="submit"],input[type="reset"],input[type="button"],.button):hover {
  background-color: var(--secondary);
}
:is(button,input[type="submit"],input[type="reset"],input[type="button"],.button):focus {
  outline: 3px solid var(--gds-yellow);
  outline-offset: -5px;
  background-color: var(--secondary);
  box-shadow: none;
}
  .menu-toggle {
    display: inline-flex;
    gap: 0.5rem;
    border: none;
    background: none;
    color: inherit;
    padding: 0.5rem;
    align-items: center;
    align-self: center;
    justify-self: end;
  }

    .menu-toggle:after {
      content: '☰';
      display: inline-block;
      aspect-ratio: 1 / 1;
      width: 1.8rem;
      font-size: 1.8rem;
      line-height: 1.8rem;
    }

    .menu-toggle[aria-expanded="true"]:after {
      content: '×';
      font-size: 2.65rem;
      line-height: 1.4rem;
    }

#main-menu {
  background: var(--primary);
  border-top: none;
  border-bottom: none;
  padding: 0 1rem 0.75rem;
  margin: 0 -1rem;
  grid-column: 1 / -1;
}

    #main-menu ul {
      display: flex;
      flex-direction: column;
      justify-content: start;
      height: 100%;
      gap: 0 1rem;
      margin-bottom:-0.7em;
    }

    #main-menu li,
    #main-menu a {
      display: flex;
      flex: 1;
    }

    #main-menu a {
      align-items: center;
      padding: 0.5rem 1rem;
      color: #fff;
    }

      #main-menu a:where(:hover, :focus) {
        background-color: var(--secondary);
      }
      #main-menu a:focus {
        outline: 3px solid var(--focus);
        outline-offset: 3px;
        box-shadow: none;
      }


  @media (min-width: 1024px) {
    #main-menu {
      grid-column: auto;
      margin: -0.5rem 0;
      background: none;
      border-top: none;
      border-bottom: none;
      padding: 0;
    }

      #main-menu > ul.menu {
        gap: 0;
      }

      #main-menu ul {
        flex-direction: row;
        gap: 0;
      }

      #main-menu li {
        position: relative;
        padding: 0;
      }

      #main-menu li,
      #main-menu a {
        flex: initial;
      }

      #main-menu a {
        background: linear-gradient(180deg, transparent 50%, #105C62 50%) no-repeat 0 0;
        background-size: 200% 200%;
        transition: background-position 0.3s ease;
        text-align: center;
        color: #fff;
      }

        #main-menu a:where(:hover, :focus) {
          background-color: transparent;
          background-position: 0 100%;
          border-bottom:none;
        }

        #main-menu a:where(:focus) {
          z-index: 10;
        }
    #site-header a:any-link:focus {
      outline: 3px solid var(--focus);
    }
  }

  .other-sections h2 {
    border-bottom: solid 2px #AB4487;
    padding-bottom: 0.5rem;
  }

#partnerships {
  background-color: #fff;
  border-top: solid 4px #AB4487;

}

.partnerships-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 1em;
  padding: 1.5rem 1rem;
}

  .partnerships-grid > img {
    max-height: 90px;
  }

  .partnerships-grid > a {
    display: block;
    height: 90px;
  }

    .partnerships-grid > a img {
      height: 100%
    }

@media (min-width: 600px) {

  .partnerships-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }
    .partnerships-grid > img:last-child:nth-child(3n - 2) {
      grid-column-end: 3;
    }
}


@media (min-width: 1024px) {

  .partnerships-grid {
    align-items: center;
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    padding: 1.5rem 0;
  }

}


  .service-grid .block {
    padding: 1rem;
    border: solid 1px #258185;
    border-radius: 10px;
  }

    .service-grid .block h2 {
      border-bottom: solid 2px #AB4487;
      padding-bottom: 0.5rem;
      padding-left: 48px;
      background-image: url(../images/service-icon.svg);
      background-repeat: no-repeat;
      background-size: 36px;
      min-height: 3rem;
    }

      .service-grid .block h2 a {
        text-decoration: none;
      }



  .block-type--pinned-action {
    padding: 1rem;
    border: solid 1px #258185;
    border-radius: 10px;
  }

    .block-type--pinned-action h2 {
      border-bottom: solid 2px #AB4487;
      padding-bottom: 0.5rem;
      padding-left: 48px;
      background-image: url(../images/service-icon.svg);
      background-repeat: no-repeat;
      background-size: 36px;
      min-height: 3rem;
    }

      .block-type--pinned-action h2 a {
        text-decoration: none;
      }

        .block-type--pinned-action h2 a:hover {
          text-decoration: underline;
        }







  @media (min-width: 320px) {
    #site-header > .inner {
      display: grid;
      grid-template-columns: auto auto;
    }

    #site-identity {
      grid-column: 1;
    }

    #logo {
      max-width: 150px;
      aspect-ratio: auto;
      object-fit: initial;
      padding: 0.5em 0;
    }
  }

  @media (min-width: 1024px) {
    #site-header > .inner {
      display: grid;
      grid-template-columns: 140px 1fr auto;
      align-items: center;
      gap: 0.5rem 1rem;
    }

    #site-identity {
      grid-column: auto;
    }
  }


  #site-footer {
    margin-top: 0rem;
    background-color: #333;
    border-top: 0;
    color: #fff;
    padding: 1rem;
  }

    #site-footer h2 {
      color: inherit;
      margin-bottom: 1rem;
      padding-bottom: 0.1rem;
      border-bottom: 1px solid var(--primary,currentColor);
    }

    #site-footer a:not(:is(:active,:focus)) {
      color: inherit;
    }

    #site-footer a:active, #site-footer a:focus {
      color: var(--gds-black);
    }

    #site-footer > .inner {
      display: grid;
      gap: 2rem;
      padding: 2rem 0;
    }

  @media (min-width: 1024px) {
    #site-footer > .inner {
      grid-template-columns: repeat(3,1fr);
    }
  }

  #social-media a {
    display: inline-block;
  }

    #social-media a:before {
      display: block;
    }

    #social-media a:where(:hover,:focus) {
      background: none;
      border: none;
      box-shadow: none;
    }

  #social-media ul.menu {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
  }

  #social-media a:before {
    font-size: 3em;
    border-radius: 0.2em;
  }

  #social-media a:focus {
    outline: 3px solid var(--focus);
    outline-offset: 3px;
  }

  #contact-us dl {
    grid-template-columns: auto 1fr;
    gap: 1rem 0.5rem;
    margin: 0;
  }

  #contact-us dt {
    font-size: 0;
  }

  #contact-us dl > :where(dt,dd) {
    border: none;
    padding: 0;
    margin: 0;
  }

  #contact-us dt:before {
    content: '';
    height: 1em;
    width: 1em;
    font-size: 1.2rem;
    display: inline-block;
    vertical-align: middle;
    flex: 0 0 auto;
    background-color: var(--primary,currentColor);
    -webkit-mask: var(--icon) no-repeat center center;
    mask: var(--icon) no-repeat center center;
    -webkit-mask-size: contain;
    mask-size: contain;
  }

  #contact-us dt.address:before {
    --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M215.7 499.2C267 435 384 279.4 384 192C384 86 298 0 192 0S0 86 0 192c0 87.4 117 243 168.3 307.2c12.3 15.3 35.1 15.3 47.4 0zM192 128a64 64 0 1 1 0 128 64 64 0 1 1 0-128z'/%3E%3C/svg%3E");
  }

  #contact-us dt.phone:before {
    --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M497.39 361.8l-112-48a24 24 0 0 0-28 6.9l-49.6 60.6A370.66 370.66 0 0 1 130.6 204.11l60.6-49.6a23.94 23.94 0 0 0 6.9-28l-48-112A24.16 24.16 0 0 0 122.6.61l-104 24A24 24 0 0 0 0 48c0 256.5 207.9 464 464 464a24 24 0 0 0 23.4-18.6l24-104a24.29 24.29 0 0 0-14.01-27.6z'%3E%3C/path%3E%3C/svg%3E");
  }

  #contact-us dt.email:before {
    --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z'%3E%3C/path%3E%3C/svg%3E");
  }

  #contact-us .email {
    overflow: auto;
  }

    #contact-us .email a {
      word-wrap: break-word;
    }

  #copyright {
    grid-column: 1 / -1;
  }

  @media (max-width: 480px) {
    body.about-us #content {
      --grid-metric: 4;
    }
  }

  @media (max-width: 1024px) {
    body.about-us #content {
      --grid-metric: 2;
    }
  }

