/* Prevent horizontal scroll on all viewports */
html, body {
  overflow-x: hidden;
}

/* Fluid typography — scales smoothly between 320px and 1024px viewports */
.profile-name {
  font-size: clamp(1.5rem, 1rem + 2vw, 1.875rem);
  line-height: 1.2;
}

/* Fluid spacing for main content area */
main {
  padding-left: clamp(1rem, 0.5rem + 2vw, 1.5rem);
  padding-right: clamp(1rem, 0.5rem + 2vw, 1.5rem);
}

/* Project card — fluid padding and responsive layout */
.project-card {
  overflow-wrap: break-word;
  word-break: break-word;
  padding: clamp(0.75rem, 0.5rem + 1vw, 1.5rem);
}

/* Profile section — stack vertically on small screens */
@media (max-width: 479px) {
  .profile-section {
    flex-direction: column;
    align-items: flex-start;
  }

  .profile-section .profile-avatar {
    margin-right: 0;
    margin-bottom: 1rem;
  }
}

/* Bio text — fluid size */
.profile-bio {
  font-size: clamp(0.875rem, 0.8rem + 0.3vw, 1rem);
}