.has-same-height .card {
  height: 320px;
  overflow: hidden;
}

.card-content h3 {
  text-align: center;
}

.table-profile td,
th {
  border: none !important;
}

.table-profile td:first-of-type {
  font-weight: bold;
}

.skills-content .media {
  margin: 0 !important;
  padding: 4px !important;
  border: 0 !important;
}

.skills-content .progress {
  height: 4px !important;
}

.custom-tags {
  text-align: center !important;
  display: block;
}

.portfolio-container .card {
  margin-bottom: 2em;
}

.section-heading {
  text-align: center;
  margin-top: 1em;
  margin-bottom: 6em;
}

.profile-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero {
  background-image: url('banner.jpg') !important;
  background-size: cover;
  background-position: center center;
}


.is-horizontal-center {
  justify-content: center;
}

#profilePic {
  width: 100%; /* Ensure it fills the container */
  height: auto; /* Maintain aspect ratio */
  object-fit: cover; /* Ensures the image doesn't distort */
  border-radius: 50%; /* Optional: Make it circular if desired */
}

.card-image .image {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.has-same-height .card {
 height: 100%; /* Ensure all cards take full column height */
 display: flex;
 flex-direction: column; /* Keep consistent alignment */
}

.card-content {
 flex: 1; /* Allow content to stretch while respecting the image */
}

.img {
  width: 6em;
  height: 6em;
  border-radius: 100%;
  border: 1px solid #fff;
  box-shadow: rgb(28 32 93 / 24%) 0px 2px 8px 0px;
}