.parallax--bg {
  background-image: url("../img/career//career-bg.webp");
  height: 540px;
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  background-position: center;
}

.parallax--bg:before {
  content: "";
  width: 0;
  height: 0;
  border-top: 30px solid transparent;
  border-bottom: 30px solid #fdfff8;
  border-right: 30px solid transparent;
  display: block;
  transform: scaleY(-1);
  position: absolute;
  left: 0;
  top: -1px;
}

.parallax--bg:after {
  content: "";
  width: 0;
  height: 0;
  border-top: 30px solid transparent;
  border-bottom: 30px solid #fdfff8;
  border-left: 30px solid transparent;
  display: block;
  transform: scaleY(-1);
  position: absolute;
  right: 0;
  top: -1px;
}

/* Why GH2 Vertical */
.why--gh2--vertical {
    display: flex;
    gap: 35px;
}

.why--gh2--vertical .left--why {
    width: 40%;
    padding: 50px;
    position: relative;
    background-image: url('../img/career/why-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.why--gh2--vertical .right--why {
    width: 60%;
    padding-right: 40px;
}
.why--gh2--vertical .left--why:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: var(--black);
    opacity: 0.4;
}

.why--gh2--vertical .left--why h2 {
    z-index: 1;
    position: relative;
}
.why--gh2--vertical .left--why h2, .why--gh2--vertical .left--why h2 span{
  color: var(--white);
}
.why--gh2--scrolling .why--vertical--item {
    background: #F0F0F0;
    padding: 30px;
}

.why--gh2--scrolling .why--vertical--item img {
    width: 60px;
    margin-bottom: 20px;
}

.why--gh2--scrolling .why--vertical--item h3 {
    color: var(--headingcolor);
    font-family: HaasGrotDispMedium;
}

.why--gh2--scrolling .why--vertical--item p {
    margin-bottom: 0;
    color: var(--black);
}

.why--gh2--scrolling {
    max-height: 630px;
    overflow: auto;
}
.why--gh2--scrolling::-webkit-scrollbar {
  width: 0px;
}

.why--gh2--scrolling .why--vertical--item:not(:last-child) {
    margin-bottom: 20px;
}
/* Why GH2 Vertical end */

/* Marquee text */
.marquee--text{
    overflow-x: hidden;
}
.marquee--yo {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.marquee--js-ticker {
  width: 100vw;
  height: 30vh;
  position: relative;
  margin-bottom: 0;
}

.marquee--js-ticker .marquee--wrapper {
  position: absolute;
  top: 50%;
  left: 0;
  white-space: nowrap;
  padding: 0;
  will-change: transform;
}

.marquee--js-ticker p {
  list-style: none;
  padding: 0;
  font-family: HaasGrotDispThin;
  line-height: 0;
  color: var(--primary);
  font-weight: 265;
  font-size: 130px;
  display: inline-block;
  margin-right: 30px;
}
/* Marquee text end */

/* Why GH2 */

.why--gh2 {
  background-image: url("../img/career/who-bg.png");
  background-repeat: no-repeat;
  background-size: 33%;
  background-color: #fdfff8;
  background-position: top left;
}

.why--gh2--items {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.why--gh2--items > .why--gh2--item {
  clip-path: polygon(
    10% 0%,
    90% 0%,
    100% 10%,
    100% 90%,
    90% 100%,
    10% 100%,
    0% 90%,
    0% 10%
  );
  background: #d9d9d9;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  transition: 0.3s;
}

.why--gh2--items > .why--gh2--item .inner--why {
  background: #fdfff8;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  clip-path: polygon(
    10% 0%,
    90% 0%,
    100% 10%,
    100% 90%,
    90% 100%,
    10% 100%,
    0% 90%,
    0% 10%
  );
  margin: 0 auto;
  margin-top: 1px;
  padding: 25px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  row-gap: 20px;
  transition: 0.3s;
}

.why--gh2--items > .why--gh2--item .inner--why > .why--img {
  height: 75%;
}

.why--gh2--items > .why--gh2--item .inner--why > .why--img > img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  object-position: bottom;
  transition: 0.3s;
}

.why--gh2--items > .why--gh2--item:hover .inner--why > .why--img > img {
  transform: rotate(360deg);
}

.why--gh2--items > .why--gh2--item:nth-child(odd):hover .inner--why {
  background-color: #fafcf3;
}

.why--gh2--items > .why--gh2--item:nth-child(even):hover .inner--why {
  background-color: #f5f8ff;
}

.why--gh2--items > .why--gh2--item .inner--why > h3 {
  color: var(--black);
  font-size: 18px;
  height: 25%;
}
/* Why GH2 End */

/* Current Openings */
.current--openings {
    position: relative;
}

.current--openings .bg--current--openings {
    position: absolute;
    top: 0;
    left: 0;
    height: 370px;
    width: 100%;
    overflow: hidden;
    background: url('../img/career/openigs-bg.jpg') no-repeat;
    background-size: cover;
    background-position: center;
}

.current--openings .bg--current--openings:before {
    content: '';
    width: 100%;
    height: 100%;
    background: var(--black);
    opacity: 0.6;
    position: absolute;
    left: 0;
    top: 0;
}
.jobs--openings--list {
    position: relative;
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding-right: 15px;
    padding-left: 15px;
}

.jobs--openings--list .job--open--item {
    filter: drop-shadow(0px 4px 2px rgba(0,0,0,0.1));
}

.jobs--openings--list .job--open--inner {
    background: #E2EEBA;
    clip-path: polygon(2% 0%, 98% 0%, 100% 10%, 100% 90%, 98% 100%, 2% 100%, 0% 90%, 0% 10%);
    padding: 40px;
}

.jobs--openings--list .job--open--item:not(:last-child) {
    margin-bottom: 20px;
}

.jobs--openings--list .job--open--inner .header--job {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 20px;
}

.jobs--openings--list .job--open--inner .header--job .job--heading {
    color: var(--black);
}

.jobs--openings--list .job--open--inner .header--job .job--heading h2 {
    text-transform: uppercase;
    font-size: 24px;
    font-family: HaasGrotDispMedium;
}

.jobs--openings--list .job--open--inner .header--job .job--heading .job--info {
    list-style: none;
    padding-left: 0;
    display: flex;
    margin-bottom: 0;
    gap: 10px;
    flex-wrap: wrap;
}

.jobs--openings--list .job--open--inner .header--job .job--heading .job--info li {
    font-size: 18px;
    display: flex;
    gap: 10px;
    align-items: center;
}

.jobs--openings--list .job--open--inner .header--job .job--heading .job--info li img {
    width: 24px;
}
/* Current Openings end */

/* Case Study */

.case--study--list {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
    max-width: 1245px;
    width: 100%;
    margin: 0 auto;
}

.case--study--list .case--study--item {
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    position: relative;
    padding: 20px;
    background: #ccc;
    padding-bottom: 55px;
}

.case--study--list .case--study--item:before {
    content: '';
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    position: absolute;
    left: 50%;
    top: 50%;
    background:#FAFFE9;
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    transform: translate(-50%, -50%);
}

.case--study--list .case--study--item .thum--case--study, .case--study--list .case--study--item .content--case--study {
    position: relative;
}

.case--study--list .case--study--item .thum--case--study {
    clip-path: polygon(8% 0, 92% 0, 100% 19%, 100% 100%, 0 100%, 0 19%);
    aspect-ratio: 1 / 0.6;
    overflow: hidden;
    margin-bottom: 20px;
}

.case--study--list .case--study--item .thum--case--study img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.case--study--list .case--study--item .content--case--study h3 {
    color: var(--black);
    font-size: 20px;
}

.case--study--list .case--study--item .content--case--study p, .case--study--list .case--study--item .content--case--study span {
    color: var(--black);
    font-family: EnergyLight;
}

.case--study--list .case--study--item .content--case--study p {
    margin-top: 10px;
       overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 3; /* number of lines to show */
           line-clamp: 3; 
   -webkit-box-orient: vertical;
}

.case--study--list .case--study--item .content--case--study a {
    color: var(--primary);
    font-family: 'HaasGrotDispMedium';
}
/* Case Study end */

/* Culture items */
.culture--items {
    max-width: 955px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    gap: 10px;
}

.culture--items .culture--item {
    width: 100%;
    padding: 20px;
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.culture--items .culture--item img {
    width: 60px;
    margin-bottom: 20px;
}

.culture--items .culture--item h3 {
    font-size: 24px;
    font-family: HaasGrotDispBold;
}

.culture--items .culture--items--col-1, .culture--items .culture--items--col-3 {
  max-width: 300px;
  width: 100%;
}

.culture--items .culture--items--col-2 {
    max-width: 335px;
    width: 100%;
}

.culture--items .culture--items--col-1 .culture--item:nth-child(1) {
    background: #EAEAEA;
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 100% 100%, 10% 100%, 0% 90%, 0% 10%);
    min-height: 245px;
}
.culture--items .culture--items--col-3 .culture--item:nth-child(1) {
    background: #EAEAEA;
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 100%, 0% 10%);
    min-height: 245px;
}

.culture--items .culture--items--col-1 .culture--item:nth-child(2) {
    background: #3E5BA6;
    clip-path: polygon(10% 0%, 100% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    min-height: 275px;
    color: var(--white);
}
.culture--items .culture--items--col-3 .culture--item:nth-child(2) {
    background: #3E5BA6;
    clip-path: polygon(0% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    min-height: 275px;
    color: var(--white);
}
.culture--items .culture--items--col-2 .culture--item:nth-child(1) {
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 100% 100%, 10% 100%, 0% 100%, 0% 10%);
    background: #E2EEBA;
    min-height: 280px;
}

.culture--items .culture--items--col-2 .culture--item:nth-child(2) {
    clip-path: polygon(0% 0%, 100% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    background: #EAEAEA;
    min-height: 270px;
}
.culture--items .culture--items--col-3, .culture--items .culture--items--col-1 {
    margin-top: 60px;
}
.culture--items .culture--items--col-3 .culture--item:nth-child(1) h3, .culture--items .culture--items--col-1 .culture--item:nth-child(1) h3, .culture--items .culture--items--col-2 .culture--item:nth-child(1) h3, .culture--items .culture--items--col-2 .culture--item:nth-child(2) h3 {
    color: var(--headingcolor);
}

.culture--items .culture--items--col-1 .culture--item:nth-child(2) img, .culture--items .culture--items--col-3 .culture--item:nth-child(2) img {
    filter: brightness(0) invert(1);
}
/* Culture items end */

/* Gallery Slide */
.our--culture{
	  overflow: hidden;
}

.gallery--item {
    background: #ddd;
    overflow: hidden;
    transition: 0.3s;
}
.gallery--item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: 0.3s;
}

.gallery--item:hover img{
	transform: scale(1.08);
}
/* Gallery Slide end */

/* Video slide */
.video--gallery--container {
    max-width: 90%;
    margin: 0 auto;
    width: 100%;
}

.video--gallary .video--boxes .video--item .video--thum {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.video--gallary .video--boxes .video--item {
		width: 400px;
    clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    position: relative;
    aspect-ratio: 1 / 1;
}

.video--gallary .video--boxes .video--item:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #000;
    opacity: 0.4;
}

.video--gallary .video--boxes .video--item .video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
}

.video--gallary .video--boxes .video--item .video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  backdrop-filter: blur(7.5px);
  display: block;
  width: 55px;
  height: 55px;
  background: rgb(255 255 255);
  border-radius: 50%;
  animation: pulse-border 1100ms ease-out infinite;
}

.video--gallary .video--boxes .video--item .video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 60px;
  height: 60px;
  background: rgb(255 255 255 / 12%);
  backdrop-filter: blur(7.5px);
  border-radius: 50%;
  transition: all 200ms;
}

.video--gallary .video--boxes .video--item .video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 19px solid #fff;
	border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  top: 10px;
  left: 5px;
}

.video--gallery--container .video--navigation .swiper-button-next, .video--gallery--container .video--navigation .swiper-button-prev {
    background: var(--primary);
    width: 77px;
    height: 77px;
    border-radius: 100px;
}

.video--gallery--container .video--navigation .swiper-button-next {
    right: -38.5px;
}

.video--gallery--container .video--navigation .swiper-button-prev {
    left: -38.5px;
}
.video--gallery--container .video--navigation .swiper-button-next:after, .video--gallery--container .video--navigation .swiper-button-prev:after {
    color: var(--white);
    font-size: 30px;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
/* Video slide end */


.partner--feature {
    background: #D8E6A9;
}

.partner--feature .container-fluid > .row {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
}

.partner--feature h2.heading--main {
    font-size: clamp(24px, 3vw, 48px);
    font-family: HaasGrotDispBold;
    color: var(--black);
}

.partner--feature p {
    color: var(--black);
}

@media(min-width:769px){
	
	.marquee-wrapper {
	    overflow: hidden;
	    width: 100%;
	    position: relative;
	}
	
	.marquee--gallary {
	    display: flex !important;
	    width: max-content;
	    gap: 10px;
	}
	
	.gallery--boxes {
	    width: 220vw !important;
	    min-width: 220vw;
	    flex-shrink: 0;
	    display: grid !important;
	    grid-template-columns: repeat(36, 1fr);
	    grid-template-rows: repeat(5, 86px);
	    gap: 10px;
	}
	
	.gallery--boxes .gallery--item:nth-child(1) {
	    grid-row: 1 / 6;
	    grid-column: 1 / 4;
	}
	
	.gallery--boxes .gallery--item:nth-child(2) {
	    grid-row: 1 / 3;
	    grid-column: 4 / 7;
	}
	
	.gallery--boxes .gallery--item:nth-child(3) {
	    grid-row: 3 / 6;
	    grid-column: 4 / 7;
	}
	
	.gallery--boxes .gallery--item:nth-child(4) {
	    grid-row: 1 / 6;
	    grid-column: 7 / 10;
	}
	
	.gallery--boxes .gallery--item:nth-child(5) {
	    grid-row: 1 / 4;
	    grid-column: 10 / 13;
	}
	
	.gallery--boxes .gallery--item:nth-child(6) {
	    grid-row: 4 / 6;
	    grid-column: 10 / 13;
	}
	
	.gallery--boxes .gallery--item:nth-child(7) {
	    grid-row: 1 / 6;
	    grid-column: 13 / 16;
	}
	
	.gallery--boxes .gallery--item:nth-child(8) {
	    grid-row: 1 / 3;
	    grid-column: 16 / 19;
	}
	
	.gallery--boxes .gallery--item:nth-child(9) {
	    grid-row: 3 / 6;
	    grid-column: 16 / 19;
	}
	
	.gallery--boxes .gallery--item:nth-child(10) {
	    grid-row: 1 / 6;
	    grid-column: 19 / 22;
	}
	
	.gallery--boxes .gallery--item:nth-child(11) {
	    grid-row: 1 / 4;
	    grid-column: 22 / 25;
	}
	
	.gallery--boxes .gallery--item:nth-child(12) {
	    grid-row: 4 / 6;
	    grid-column: 22 / 25;
	}
	
	.gallery--boxes .gallery--item:nth-child(13) {
	    grid-row: 1 / 6;
	    grid-column: 25 / 28;
	}
	
	.gallery--boxes .gallery--item:nth-child(14) {
	    grid-row: 1 / 3;
	    grid-column: 28 / 31;
	}
	
	.gallery--boxes .gallery--item:nth-child(15) {
	    grid-row: 3 / 6;
	    grid-column: 28 / 31;
	}
	
	.gallery--boxes .gallery--item:nth-child(16) {
	    grid-row: 1 / 6;
	    grid-column: 31 / 34;
	}
	
	.gallery--boxes .gallery--item:nth-child(17) {
	    grid-row: 1 / 4;
	    grid-column: 34 / 37;
	}
	
	.gallery--boxes .gallery--item:nth-child(18) {
	    grid-row: 4 / 6;
	    grid-column: 34 / 37;
	}
}

@media (max-width: 1280px) {
  .why--gh2--items > .why--gh2--item .inner--why {
    padding: 15px;
  }

  .why--gh2--items > .why--gh2--item .inner--why > .why--img {
    height: 75%;
  }

  .why--gh2--items > .why--gh2--item .inner--why > h3 {
    font-size: 15px;
  }
  .development--left--container, .development--right--container {
        height: 70vh;
    }
}

@media (max-width: 1024px) {
  .parallax--bg {
    height: 440px;
  }
  .marquee--js-ticker p {
      font-size: 100px;
  }

  .why--gh2--scrolling .why--vertical--item {
      padding: 20px;
  }

  .why--gh2--scrolling .why--vertical--item h3 {
      font-size: 24px;
  }

  .why--gh2--scrolling .why--vertical--item img {
      width: 50px;
  }

  .why--gh2--scrolling .why--vertical--item p {
      font-size: 15px;
  }

  .current--openings .bg--current--openings {
      height: 280px;
  }

}

@media (max-width: 991px) {
  
  .why--gh2--items {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }

  .why--gh2--items > .why--gh2--item {
    width: 100%;
    max-width: 235px;
  }
  .why--gh2--items > .why--gh2--item {
    max-width: calc(50% - 10px);
  }

  .why--gh2--items {
    gap: 10px;
  }

  .why--gh2--items > .why--gh2--item .inner--why > .why--img {
    height: 50%;
  }

  .why--gh2--items > .why--gh2--item .inner--why > .why--img > img {
    width: 40px;
    height: 40px;
  }

  .why--gh2--items > .why--gh2--item .inner--why > h3 {
    font-size: 12px;
  }

  .why--gh2--items > .why--gh2--item .inner--why {
    padding: 10px;
  }
  .gallery--boxes {
    width: 300vw;
    min-width: 300vw;
  }
}

@media (max-width: 768px) {
  .parallax--bg {
    height: 280px;
    background-attachment: scroll;
  }
  .marquee--js-ticker p {
      font-size: 50px;
  }
  .marquee--js-ticker {
      height: 13vh;
  }
  .case--study--list {
      grid-template-columns: repeat(1, 1fr);
  }
  .why--gh2--vertical {
        flex-direction: column;
        gap: 0px;
    }

    .why--gh2--vertical .left--why {
        width: 100%;
        padding: 50px 20px;
    }

    .why--gh2--vertical .right--why {
        padding-right: 15px;
        width: 100%;
        padding-left: 15px;
        margin-top: -20px;
        z-index: 1;
    }

    .why--gh2--scrolling {
        max-height: none;
    }

    .jobs--openings--list .job--open--inner {
        padding: 30px 20px;
        clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%);
    }

    .jobs--openings--list .job--open--inner .header--job {
        flex-direction: column;
        align-items: start;
        gap: 10px;
        margin-bottom: 10px;
    }

    .culture--items {
        flex-direction: column;
    }

    .culture--items .culture--items--col-3, .culture--items .culture--items--col-1, .culture--items .culture--items--col-2 {
        margin-top: 0px;
        max-width: 100%;
    }

    .culture--items .culture--item {
        max-width: 100%;
        clip-path: polygon(10% 0%, 90% 0%, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0% 90%, 0% 10%) !important;
    }

    .culture--items .culture--item h3 {
        font-size: 22px;
    }

    .jobs--openings--list .job--open--inner .header--job .job--heading h2 {
        font-size: 20px;
    }

    .jobs--openings--list .job--open--inner .header--job .job--heading .job--info li {
        font-size: 15px;
    }

    .jobs--openings--list .job--open--inner .content--job {
        font-size: 15px;
    }

    .why--gh2--scrolling .why--vertical--item h3 {
        font-size: 22px;
    }
    .marquee--gallary {
        overflow: hidden;
    }

    .gallery--item {
        width: 100%;
    }
    .our--culture {
        padding-right: 15px;
        padding-left: 15px;
    }
    .video--gallary .video--boxes .video--item{
      width:100%;
    }
    .video--gallery--container .video--navigation .swiper-button-next {
          right: -15px;
      }

      .video--gallery--container .video--navigation .swiper-button-prev {
          left: -15px;
      }

      .video--gallery--container .video--navigation .swiper-button-next, .video--gallery--container .video--navigation .swiper-button-prev {
          width: 50px;
          height: 50px;
      }

      .video--gallery--container .video--navigation .swiper-button-next:after, .video--gallery--container .video--navigation .swiper-button-prev:after {
          font-size: 22px;
      }
    
}