/**
 * @file home.css
 * @description Homepage-specific styles for Forefront Vision Consulting website.
 *              Contains styles for value proposition cards, news article cards,
 *              and hover/animation effects on the homepage.
 * @project Forefront Vision Consulting
 * @version 2.0
 */

/* ---- Value Proposition Cards ---- */

.link-text {
  transform: translateX(-18px);
}

.value-item .value-img::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(51, 51, 51, 0.5);
}

.value-item:hover .value-img img {
  transform: scale(1.1);
}

.value-item:hover .value-link {
  border: none;
}

.value-item:hover .value-link .icon {
  transform: translateX(10px);
}

/* ---- News Article Cards ---- */

.new-item {
  border: 2px solid #f3f3f3 !important;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.16);
}

.new-item .new-content {
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.new-item:hover a {
  transform: translateY(-10px);
}

.new-item:hover a img {
  transform: scale(1.1);
}

.new-item.active {
  animation: fadeInUp 1s ease forwards;
}