.pi_container {
  max-width: 1000px;
  margin: auto;
  padding: 20px;
}
.pi_profile {
  display: flex;
  align-items: flex-start;
  margin-bottom: 20px;
}
.pi_profile img {
  width: 269px; /* Set width to 269px */
  height: 336px; /* Set height to 369px */
  border-radius: 8px;
  margin-right: 20px; /* Space between image and text */
}
.pi_profile-info {
  flex-grow: 1;
}
h1 {
  margin: 0;
  font-size: 24px; /* Set name font size to 24px */
}
h2 {
  margin: 5px 0;
  font-size: 16px; /* Set job title font size to 16px */
  color: #555;
}
p {
  line-height: 1.6;
}

/* Styles for larger screens (desktops) */
@media (min-width: 1024px) {
  .pi_profile {
    margin-bottom: 40px;
  }
  h1 {
    font-size: 28px; /* Larger font size for name */
  }
  h2 {
    font-size: 18px; /* Larger font size for job title */
  }
}

/* Styles for tablets */
@media (max-width: 1023px) and (min-width: 600px) {
  .pi_profile {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .pi_profile img {
    margin-bottom: 15px; /* Space below image */
    margin-right: 0; /* Remove right margin */
  }
  h1 {
    font-size: 26px; /* Slightly larger font size for name */
  }
  h2 {
    font-size: 16px; /* Keep job title font size the same */
  }
}

/* Styles for mobile phones */
@media (max-width: 599px) {
  .pi_container {
    padding: 10px; /* Reduced padding on mobile */
  }
  .pi_profile {
    flex-direction: column; /* Stack on small screens */
    align-items: flex-start;
    text-align: left;
  }
  .pi_profile img {
    width: 100%; /* Full width for mobile */
    height: auto; /* Maintain aspect ratio */
    margin-bottom: 15px; /* Space below image */
  }
  h1 {
    font-size: 22px; /* Smaller font size for name */
  }
  h2 {
    font-size: 14px; /* Smaller font size for job title */
  }
}