.careers-hero-img {
  width: 100%;
  max-width: 500px;
}

/* Job Details Offcanvas Width */
#jobDetailsOffcanvas {
  width: 33.33vw !important;
  background-color: #ffffff !important;
  max-width: none !important;
}

/* Ensure text is visible in job description */
#jobDetailsOffcanvas .offcanvas-body,
#jobDetailsOffcanvas #jobDescriptionContent,
#jobDetailsOffcanvas #jobDescriptionContent p,
#jobDetailsOffcanvas #jobDescriptionContent h6,
#jobDetailsOffcanvas #jobDescriptionContent ul,
#jobDetailsOffcanvas #jobDescriptionContent li {
  color: #333333 !important;
}

/* Smaller font size for job description content */
#jobDetailsOffcanvas #jobDescriptionContent p {
  font-size: 0.9rem !important;
}

#jobDetailsOffcanvas #jobDescriptionContent h6 {
  font-size: 1rem !important;
}

/* Target the dynamically generated content with specific classes */
#jobDetailsOffcanvas .job-description-text {
  font-size: 0.8rem !important;
}

#jobDetailsOffcanvas .job-description-header {
  font-size: 0.8rem !important;
}

#jobDetailsOffcanvas .job-description-list {
  font-size: 0.8rem !important;
}

#jobDetailsOffcanvas .job-description-item {
  font-size: 0.8rem !important;
}

/* Smaller font size for responsibilities and qualifications lists */
#jobDetailsOffcanvas #jobDescriptionContent ul {
  font-size: 0.9rem;
}

#jobDetailsOffcanvas #jobDescriptionContent li {
  font-size: 0.9rem;
}

/* Smooth transitions for off-canvas content */
#jobDescriptionSection,
#applicationFormSection {
  transition: all 0.4s ease-in-out;
}

#jobDescriptionSection.slide-out {
  transform: translateX(-100%);
  opacity: 0;
}

#applicationFormSection.slide-in {
  transform: translateX(0);
  opacity: 1;
}

#applicationFormSection {
  transform: translateX(100%);
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: white;
  z-index: 10;
}

#jobDescriptionSection {
  position: relative;
  z-index: 5;
}

@media (max-width: 991px) {
  #jobDetailsOffcanvas {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}

@media (max-width: 576px) {
  #jobDetailsOffcanvas {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}

.icon-blue {
  color: #007bff !important;
}

@media (min-width: 992px) {
  .benefits-list {
    column-count: 2;
    column-gap: 1.5rem;
  }
}

/* Reduce padding on mobile */
@media (max-width: 767px) {
  .wrapper .row.px-10 {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}

/* Make careers hands stacked image smaller */
#jobDetailsOffcanvas .careers-hands-image,
.careers-hands-image {
  width: 80% !important;
  height: auto !important;
  max-width: 80% !important;
}