/* Careers Card */
.careers-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  gap: 0.75rem;
}

.career-card {
  display: flex;
  flex-direction: column;
  padding: 1.125rem;
  background-color: var(--white-clr);
  border: 1px solid #ddddeb;
  border-radius: 1.5rem;

  .btns {
    display: flex;
    gap: 0.5rem;
  }

  .career-card-icon,
  .career-card-love-btn {
    width: 2.625rem;
    height: 2.625rem;
    align-content: center;
    background-color: var(--white-clr);
    color: var(--secondary-clr-900);
    font-size: 1.75rem;
    border-radius: 50%;
    border: 1px solid #ddddeb;

    .iconify {
      margin-inline: auto;
    }
  }

  .career-card-love-btn {
    cursor: pointer;
    font-size: 1.5rem;
    color: var(--text-clr-700);
    transition: all 300ms ease;
    &:hover {
      color: var(--secondary-clr-900);
      background-color: hsl(from var(--secondary-clr-900) h s l / 0.1);
    }
  }

  header:first-of-type {
    padding-block: 1.5rem 0.75rem;
  }

  .key-values-list {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.125rem;

    border-top: 1px solid #e8e8f7;
  }

  .key-value {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;

    span:first-child {
      font-size: var(--fs-300);
      line-height: 97%;
      color: #9496b1;
    }

    span:last-child {
      line-height: 97%;
      color: var(--tertiary-clr-900);
    }
  }

  .cards-tag {
    display: block;
  }

  .btns {
    margin-top: 1.125rem;
    padding-top: 1.5rem;
    border-top: 1px solid #e8e8f7;
  }

  .btn-pill {
    --_btn-icon-size: 1.25rem;
    height: 2.875rem;
    flex: 1;
    gap: 0.625rem;

    .iconify {
      font-size: var(--_btn-icon-size);
    }
  }
}

.career-card-description {
  --_line-clamp: 3;
  line-height: 1.1;
  gap: 0.75rem;
  color: var(--secondary-clr-900);

  * {
    font-size: var(--fs-400);
  }
}

.career-card-pre-title {
  display: block;
  line-height: 1;
  color: var(--secondary-clr-900);
  border-radius: 100vw;
}

.career-card-title {
  display: block;
  margin-top: 0.75rem;
  font-weight: 700;
  font-size: var(--fs-450);
  line-height: 1;
}

.career-card-actions {
  order: -1;
  display: flex;
  justify-content: space-between;
}

/* End of Careers Card */
