@import 'mixins/a11y';

.slat__link {
  display: flex;
  flex-direction: column;
  position: relative;
  text-decoration: none;
  @include focusOutlineAndResetHover;
  width: 100%;
  
  &:hover, &:active {
    text-decoration: none;
  }
    
  &:hover .slat__title, &:active .slat__title {
    text-decoration: underline;
  }
  
  
  .slat__body, .slat__title {
    color: $body-color;
    text-underline-offset: .15em;
  }
}