/* css/pages/home.css */
.home-hero {
  background-image:
    linear-gradient(
      135deg,
      rgba(var(--accent-color-rgb), 0.1) 0%,
      rgba(var(--accent-color-rgb), 0.05) 100%);
  padding-bottom: 40px;
}
.home-card {
  border-left: 4px solid var(--accent-color);
}
.resource-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-bottom: 18px;
  border-radius: 13px;
  color: var(--accent-hover);
  background: rgba(var(--accent-color-rgb), 0.09);
}
@media (max-width: 576px) {
  .hero {
    min-height: calc(100vh - 60px);
    padding-top: 40px;
  }
  .profile {
    padding: 40px 20px;
  }
  .profile h1 {
    font-size: 2.5em;
  }
  .avatar {
    width: 120px;
    height: 120px;
  }
  .section-container {
    padding-top: 40px;
  }
  .section-title {
    margin-bottom: 30px;
  }
}