.hexes {
  .bg-image {
    background-image: linear-gradient(var(--overlay)), var(--background-image);
    background-size: cover;
    text-shadow: 0 0 .5rem var(--overlay);
    a {
      color: var(--white);
      &:hover {
        text-decoration-skip-ink: none;]
      }
    }
  }
  .none {
    visibility: hidden;
    @media (max-width: 720px){
      display: none;
    }
  }
  .blank {
    --overlay: rgb(0 0 0 / 0);
    @media (max-width: 720px){
      display: none;
    }
  }
  .stat{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    .icon {
      fill: currentColor;
      margin-bottom: 1rem;
      width: 4.5rem;
    }
    .number {
      font-family: var(--heading-font-family, sans-serif);
      font-style: var(--heading-font-style, normal);
      font-weight: var(--heading-font-weight, 700);
      line-height: var(--heading-line-height, 1.2);
      text-transform: uppercase;
      font-size: var(--font-size-2);
      margin: 0;
      text-box: cap alphabetic;
    }
  }
  .link{
    h3 {
      font-size:  var(--font-size-6);
    }
    a {
      color: var()=
  }
  .text{
    h3 {
      font-size: var(--font-size-6);
    }
  }
}