/* --- Image Styles --- */

.hero-image {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 6px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

.article-image {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 4px;
  margin-top: 0.25rem;
}

@media (max-width: 768px) {
  .hero-image,
  .article-image {
    border-radius: 3px;
  }
  .hero-image {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
  }
}