.career-header {
  margin-top: 61px;
}

/* ================================
   Career Hero By Bhavya
================================ */

/* Background same as sales-banner */
.application-main-div {
    background: linear-gradient(0deg, #f3ebf600, #e2beed) !important;
}

/* Match row spacing & alignment */
.application-main-div .row {
  --bs-gutter-x: clamp(24px, 5vw, 72px);
  align-items: center;
}

/* Center image column */
.application-main-div .col-xl-6:last-child {
  display: flex;
  justify-content: center;
}

/* Image wrapper (same as sales-image) */
.application-main-div .sales-image {
  position: relative;
  max-width: 520px;
  width: 100%;
  overflow: visible;
}

/* Hero image styling */
.application-main-div .sales-image .img-hero {
  width: 100%;
  max-width: 480px;
  height: auto;
  display: block;
  margin: 0 auto;
  border-radius: 16px;
}

/* Curve icons */
.application-main-div .sales-image .curve-icon {
  position: absolute;
  pointer-events: none;
  animation: bounce 2s ease-in-out infinite;
}

/* Left curve */
.application-main-div .sales-image .curve-icon.left-curve {
  top: -24px;
  left: -24px;
  -webkit-animation: bounce 2s ease-in-out infinite;
  animation: bounce 2s ease-in-out infinite;
}

.application-main-div .sales-image .curve-icon.left-curve img {
  width: 64px;
}

/* Right curve */
.application-main-div .sales-image .curve-icon.right-curve {
  bottom: -85px;
  right: 120px;
  -webkit-animation: bounce 2s ease-in-out infinite;
  animation: bounce 2s ease-in-out infinite;
}

.application-main-div .sales-image .curve-icon.right-curve img {
  width: 132px;
}

/* End */

.row.two-col-gap-80 {
  --bs-gutter-x: 80px;
}

.img-hero-space img {
  max-height: 455px;
  margin-left: auto;
}

.hero-btn {
  margin-top: 40px;
  display: flex;
  width: 194px;
  height: 42px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
  border-radius: 60px;
  background-color: var(--color-primary);
}

.btn-img {
  height: 16px;
  width: 16px;
  object-fit: contain;
  margin-top: 6px;
}

.hero-btn:hover {
  background-color: var(--color-hover-bg);
  color: var(--color-hover-text);
}

@media (max-width: 1480px) {
  .career-header {
    margin-top: 76px;
  }
}

@media (max-width: 1025px) {
  .application-main-div .sales-image .img-hero {
    max-width: 320px;
  }
  .hero-heading {
    text-align: center;
  }

  .curve-icon {
    display: none;
  }

  .imgweb {
    display: none;
  }

  .hero-btn {
    margin-top: 32px;
  }

  .hero-btn-div {
    display: flex;
    justify-content: center;
  }

  .hero-img-div {
    padding-top: 60px;
    padding-bottom: 120px;
    display: flex;
    justify-content: center;
  }

  .img-hero-space {
    margin-top: 40px;
    display: flex;
    justify-content: center;
  }

  .img-hero {
    width: 320px;
    height: 302px;
    object-fit: contain;
  }

  .row.two-col-gap-80 {
    --bs-gutter-x: 0px;
  }
}

@media (max-width: 640px) {
  .hero-btn {
    margin-top: 32px;
    font-size: 18px;
    width: 194px;
    height: 44px;
  }

  .img-hero {
    width: 248px !important;
    height: 235px;
    object-fit: contain;
  }
}

.sales-image {
  position: relative;
}

.career-heading-txt-div {
  display: flex;
  flex-direction: column;
  gap: 16px 0;
}

.academy-heading {
  margin-bottom: 16px;
}

.current-openings h2 {
  margin: 24px 0 16px 0;
}

.job-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 200px;
    border-bottom: 0.5px solid #e5e5e5;
    border-top: 0.5px solid #f5f5f5;
}
.job-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 0px;
  padding: 24px 0;
  transition: all 0.3s ease;
}

.row.join-us-cards-gap {
  border-radius: 20px;
  background: linear-gradient(180deg, #fcf5ff 0%, #e2beed 100%);
}

.job-info h3 {
  margin: 0 0 12px;
}

.job-card:hover h3 {
  color: var(--color-primary);
}
.job-details {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  color: #000;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 140%; /* 28px */
}

.job-details span:not(:last-child)::after {
  content: '|';
  margin: 0 12px;
  color: rgba(134, 134, 134, 0.5);
}

.job-arrow {
  display: flex;
  width: 42px;
  height: 42px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 60px;
  border: 1px solid #663999;
  cursor: pointer;
}

.job-arrow img {
    width: 16px;
    height: 16px;
    filter: grayscale(1);
}

@media (max-width: 1025px) {
  .career-heading-txt-div {
    row-gap: 16px;
  }

  .job-grid {
    grid-template-columns: 1fr;
    gap: 0px;
    border: none;
  }
  .job-card {
    border-top: 0.5px solid #acb5fe;
  }
}

@media (max-width: 640px) {
  .career-inquiries-main {
    padding-block: 40px;
  }

  .current-openings h4 {
    margin: 16px 0;
    font-size: 28px;
  }
}

/* Open positions Sections */
.open-positions-main {
  background: var(--color-customer-story);
}

.open-position-head-txt-div {
  display: flex;
  flex-direction: column;
  row-gap: 28px;
}

.position-heading {
  text-align: center;
}

.position-txt {
  font-weight: 400;
  font-size: 24px;
  line-height: 140%;
  text-align: center;
  color: var(--color-text);
}

.positions-card-div {
  margin-top: 80px;
}

.position-card {
  border-radius: 16px;
  background: radial-gradient(
    174.15% 174.15% at 16.15% -54.62%,
    #ffffff 0%,
    #ffffff 100%
  );
}

.position-card-inside {
  padding: 28px 28px 48px;
}

.position-card-heading {
  font-weight: 600;
  font-size: 28px;
  line-height: 140%;
  color: var(--color-heading);
  padding-bottom: 20px;
  border-bottom: 1px solid transparent;
  border-image: linear-gradient(90deg, #94d5f7 0%, #acb5fe 100%) 1;
  border-image-slice: 1;
}

.openings-div {
  display: flex;
  align-items: end;
  justify-content: space-between;
}

.job-open-div {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.job-heading {
  font-weight: 600;
  font-size: 20px;
  line-height: 140%;
  color: var(--color-heading);
}

.job-txt {
  font-weight: 400;
  font-size: 20px;
  line-height: 140%;
  color: var(--color-text-2);
}

.job-open-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 4px;
  width: 184px;
  height: 56px;
  border-radius: 60px;
  background-color: var(--color-button);

  font-weight: 400;
  font-size: 22px;
  line-height: 140%;
  color: var(--color-button-text);
}

.job-btn-img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  margin-top: 6px;
}

.row.opening-job-gap {
  --bs-gutter-x: 48px;
  --bs-gutter-y: 48px;
}

.job-open-btn:hover {
  background-color: var(--color-hover-bg);
  color: var(--color-hover-text);
}

@media (max-width: 1025px) {
  .position-heading {
    font-size: 58px;
  }

  .positions-card-div {
    margin-top: 60px;
  }
}

@media (max-width: 640px) {
  .open-positions-main {
    padding-block: 80px;
  }

  .position-heading {
    font-size: 36px;
  }

  .open-position-head-txt-div {
    row-gap: 24px;
  }

  .position-txt {
    font-size: 20px;
  }

  .position-card-inside {
    padding: 24px;
  }

  .position-card-heading {
    font-size: 24px;
    padding-bottom: 16px;
  }

  .job-open-div {
    margin-top: 24px;
  }

  .openings-div {
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    row-gap: 40px;
  }

  .job-open-btn {
    width: 155px;
    height: 44px;
    font-size: 18px;
  }
}

/* Don't see your ideal role Section */
.ideal-role-main {
    background: linear-gradient(0deg, #f3ebf617, #e2beed) !important;
}

.ideal-txt-div {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  row-gap: 16px;
}

.ideal-txt {
  color: #000;
}

.ideal-email-div {
  font-weight: 400;
  font-size: 24px;
  line-height: 140%;
  color: #000;
}

.ideal-email-div p {
  color: #000;
}

.ideal-email-div u {
    cursor: pointer;
    color: #000;
    font-size: 16px;
}

.ideal-form-box {
  border-radius: 16px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(124, 124, 124, 0.08) 100%
  );
  box-shadow: 0px 0px 24px 0px #0b12201f;
  padding: 40px;
}

.ideal-form-div {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
  margin-bottom: 40px;
}

.ideal-form-div input {
    background: rgb(255 255 255 / 35%) !important;
    color: #000 !important;
    border-radius: 8px;
    padding: 10px 12px;
    font-weight: 400;
    font-size: 16px;
    line-height: 140%;
    width: 100%;
}
.ideal-form-div input::placeholder {
    color: #000 !important;
}

.drag-drop {
  border-radius: 8px;
  background: rgb(255 255 255 / 35%) !important;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  row-gap: 12px;
}

.upload-drag-img {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 60px;
  width: 60px;
  background: var(--color-form-upload-bg);
  border-radius: 100%;
  cursor: pointer;
}

.upload-ideal-form-img {
  height: 24px;
  width: 24px;
  filter: brightness(0.5);
}

.drag-drop-txt-div h6 {
  font-weight: 400;
  font-size: 18px;
  line-height: 140%;
  text-align: center;
  color: #000;
}

.drag-drop-txt-div p {
  font-weight: 400;
  font-size: 16px;
  line-height: 140%;
  color: #000;
  text-align: center;
}

.ideal-form button {
  width: 160px;
  height: 42px;
  background-color: var(--color-primary);
  border-radius: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 4px;
  font-weight: 400;
  font-size: 17px;
  line-height: 140%;
  color: var(--color-white);
}

.ideal-form button:hover {
  background-color: var(--color-hover-bg);
  color: var(--color-hover-text);
}

.ideal-form-btn {
  width: 16px;
  height: 16px;
  object-fit: contain;
  margin-top: 6px;
}

.row.ideal-role-gap {
  --bs-gutter-x: 40px;
}

.ideal-custom-input::placeholder {
  color: var(--color-button-text);
}

@media (max-width: 1025px) {
  .row.ideal-role-gap {
    --bs-gutter-x: 0px;
    --bs-gutter-y: 40px;
  }
}

@media (max-width: 640px) {
  .ideal-email-div {
    font-size: 20px;
    margin-bottom: 16px;
  }

  .row.ideal-role-gap {
    --bs-gutter-y: 16px;
  }



  .ideal-form-div input {
    padding: 11.5px 12px;
    font-size: 18px;
  }

  .upload-drag-img {
    height: 36px;
    width: 36px;
  }

.upload-ideal-form-img {
    height: 24px;
    width: 24px;
    filter: brightness(0.5) ;
}
  .drag-drop-txt-div h6 {
    font-size: 18px;
  }

  .drag-drop-txt-div p {
    font-size: 14px;
  }



}

/* Why Join de facto infotech Section */
.join-us-main {
  background-color: #f9f9f9;
}

.join-us-heading {
  text-align: center;
}

.join-us-cards-div {
  margin-top: 40px;
}

.join-us-card {
  border-radius: 16px;
  background: radial-gradient(
    174.15% 174.15% at 16.15% -54.62%,
    #ffffff 0%,
    #ffffff 100%
  );
  box-shadow: 0px 0px 24px 0px #0b12201f;
  height: 100%;
}

.join-us-card-inside {
  padding: 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 20px;
}

.join-us-img {
  width: 64px;
  height: 64px;
  object-fit: contain;
}

.join-us-card-txt-div {
  display: flex;
  flex-direction: column;
  row-gap: 12px;
}

.join-us-card-heading {
  text-align: center;
}

.join-us-card-para {
  font-size: 16px;
  text-align: center;
  color: var(--color-text-2);
}

.row.join-us-cards-gap {
  --bs-gutter-y: 24px;
  --bs-gutter-x: 24px;
}

/* .row.join-us-cards-gap {
  padding: 10px 24px 34px 24px;
} */

.row.join-us-cards-gap {
  padding: 0px 24px 27px 24px;
}

.job-info h3 {
    font-size: 20px;
}

@media (max-width: 1025px) {
  .join-us-cards-div {
    margin-top: 60px;
  }

  .row.join-us-cards-gap {
    --bs-gutter-x: 0px;
    --bs-gutter-y: 24px;
  }
}


/* Power Academy Section */
.power-academy-main {
  background: #fff;
}

.academy-img {
  border-radius: 24px;
  box-shadow: 0px 0px 24px 0px #0b12201f;
  object-fit: contain;
  width: 455px;
}

.academy-btn {
  margin-top: 40px;
  border-radius: 60px;
  width: 156px;
  height: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
  column-gap: 4px;
  background-color: var(--color-primary);
  font-weight: 400;
  font-size: 18px;
  line-height: 140%;
  color: var(--color-button-text);
}

.academy-btn:hover {
  background-color: var(--color-hover-bg);
  color: var(--color-hover-text);
}

.row.power-academy-gap {
  --bs-gutter-x: 40px;
}

@media (max-width: 1025px) {
  .row.power-academy-gap {
    --bs-gutter-x: 0px;
    --bs-gutter-y: 80px;
  }

  .academy-img {
    height: 355px;
    width: 100%;
  }
}

@media (max-width: 640px) {
  .academy-img {
    height: 325px;
  }

  .row.power-academy-gap {
    --bs-gutter-y: 40px;
  }

  .academy-btn {
    margin-top: 32px;
  }
}
.transform-home h1 {
  margin-bottom: 20px;
  width: 100%;
  max-width: 746px;
}

@media (max-width: 1080px) {
  .transform-home h1 {
    font-size: 58px;
    margin-bottom: 108px;
    width: 100%;
    max-width: 100%;
  }

  .transform-home img {
    width: 100%;
  }
}

@media (max-width: 700px) {
  .transform-home {
    margin-top: 0;
  }

  .transform-home h1 {
    font-size: 36px;
    margin-bottom: 48px;
  }
}

@media (min-width: 1280px) {
  .application-main-div {
    height: 700px;
  }
  .row.join-us-cards-gap {
    padding: 0px 13px 27px 13px;
  }

  .academy-para {
    font-size: 18px;
  }
}