$font-size-subtitle: 14px;
$line-height-subtitle: 1.3;

// SERVICE CARDS -- components/TaoServiceCard.vue
.tao__service-card {
  text-decoration: none;
  transition: transform $transition-sm-medium $transition-easing-default;
  &::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    border-radius: $border-radius-normal;
    pointer-events: none;
    opacity: $opacity-none;
    box-shadow: $box-shadow-elevation-medium;
    transition: opacity $transition-sm-medium $transition-easing-default;
  }
  &:hover {
    transform: scale(1.05);
    &::after {
      opacity: $opacity-low-maximum;
    }
  }
  &:focus {
    transform: scale(1.05);
    &::after {
      opacity: $opacity-medium-maximum;
    }
  }
}
.service-card {
  &__title {
    font-size: font-size(1);
  }
  &__subtitle {
    font-size: $font-size-subtitle;
    line-height: $line-height-subtitle;
    height: $font-size-subtitle * 2 * $line-height-subtitle;
  }
}