.icon svg {
  width: 60px;  /* ここで好きなサイズに調整 */
  height: auto;
}

/* マウスを乗せた時に色を変えるといった操作もCSSで可能です */
.icon svg:hover g {
  fill: #ff0000;
}

/* Pastel Color Enhancements */
:root {
  --color-primary-pastel: #a8d5ff;
  --color-secondary-pastel: #c4b5f9;
  --color-accent-pastel: #ffa8d5;
}

/* Profile Card Gradient Border */
.profile-border {
  background: linear-gradient(135deg, #60a5fa 0%, #a78bfa 100%);
  padding: 4px;
  border-radius: 50%;
}

/* Smooth transitions for interactive elements */
button, a {
  transition: all 0.3s ease;
}

/* Responsive breakpoints for hero section */
@media (max-width: 768px) {
  .hero-title {
    font-size: 2.5rem;
  }
  
  .profile-card {
    margin-top: 2rem;
  }
}