/* Career Section Container */
.career-section-container {
  padding-top: clamp(60px, 6vw, 100px); /* pt-[clamp(60px,6vw,100px)] */
  padding-bottom: clamp(200px, 10vw, 260px); /* pb-[clamp(200px,10vw,260px)] */
  background-color: var(--color-primaryGray25); /* bg-primaryGray-25 */
  border-radius: 25px; /* rounded-25 */
  display: flex;
  flex-direction: column;
  gap: 42px; /* space-y-[42px] */
}

@media (min-width: 768px) {
  /* tablet breakpoint (768px) */
  .career-section-container {
    gap: 62px; /* tablet:space-y-[62px] */
  }
}

/* Category Container */
.category-container {
  margin-left: clamp(12px, 4vw, 42px);
  margin-right: clamp(12px, 4vw, 42px);
  padding-bottom: 42px;
  border-bottom: 1px solid var(--color-primaryGray200); /* primaryGray-200 */
}

.category-container:last-child {
  padding-bottom: 0;
  border-bottom: none;
}

@media (min-width: 768px) {
  .category-container {
    padding-bottom: 62px;
  }
}

/* Category Wrapper */
.category-wrapper {
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 2vw, 42px);
}

@media (min-width: 1024px) {
  /* desktopMd breakpoint (1024px) */
  .category-wrapper {
    flex-direction: row;
  }
}

/* Heading Section */
.heading-section {
  width: 100%;
}

@media (min-width: 1024px) {
  /* desktopMd breakpoint (1024px) */
  .heading-section {
    width: 30%;
  }
}

/* Heading Text */
.heading-text {
  color: var(--color-black200); /* black-200 */
  width: 100%;
  letter-spacing: -1.2px; /* tracking-minus2 */
}

/* Heading Description */
.heading-description {
  margin-top: 18px;

  color: var(--color-black100); /* black-100 */
}

/* Job Cards Container */
.job-cards-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

@media (min-width: 1024px) {
  /* desktopMd breakpoint (1024px) */
  .job-cards-container {
    width: 70%;
  }
}

/* Job Card */
.job-card {
  padding: clamp(12px, 4vw, 24px);
  border-radius: 20px; /* rounded-20 */
  border: 1px solid var(--color-primaryGray200); /* primaryGray-200 */
  display: flex;
  flex-direction: column;
  gap: 42px;
}

/* For tablet and larger screens (tablet breakpoint) */
@media (min-width: 768px) {
  /* tablet breakpoint (768px) */
  .job-card {
    flex-direction: row;
    gap: clamp(16px, 4vw, 24px);
  }
}

/* Card Detail Container */
.card-detail-container {
  display: flex;
  flex-direction: column;
  flex-grow: 1; /* grow */
}

/* Card Detail Text */
.card-detail-text {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

/* Job Title */
.job-title {
  letter-spacing: -0.6px; /* tracking-[-0.6px] */
  color: var(--color-blackBrand); /* black-brand */
}

/* Job Category */
.job-category {
  display: flex;
  align-items: center;
  gap: 8px;

  color: var(--color-black100); /* black-100 */
  letter-spacing: -0.6px; /* tracking-[-0.6px] */
  padding: 4px 10px; /* px-[10px] py-[4px] */
  border-radius: 9999px; /* rounded-full */
  border: 1px solid var(--color-primaryGray200); /* border-primaryGray-200 */
}

/* Job Category Dot */
.job-category-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%; /* rounded-full */
  background-color: #f06cee; /* pink color */
}

/* Job Short Description */
.job-short-description {
  color: var(--color-black100); /* black-100 */
}

/* Job Specific Details Container */
.job-specific-details-container {
  margin-top: 32px; /* mt-[32px] */
  display: flex; /* flex */
  align-items: center; /* items-center */
  gap: 24px; /* gap-[24px] */
}

.job-timing {
  display: flex;
  align-items: center;
  gap: 8px;

  color: var(--color-black100);
}

.job-type {
  width: 20px;
  height: 20px;
}

.job-location {
  display: flex;
  align-items: center;
  gap: 8px;

  color: var(--color-black100);
}

.job-location-icon {
  width: 20px;
  height: 20px;
}

.apply-now-btn-container {
  min-width: 144.3px;
}

.apply-now-btn {
  height: fit-content;
  display: flex;
  align-items: center;
  gap: 12px;

  padding: 8px 18px; /* py-[8px] px-[18px] */
  width: 100%;
}

.angular-arrow-right-up-icon {
  width: 1.25rem;
  height: 1.25rem;
  filter: brightness(0) invert(1); /* brightness-0 invert */
}