
	  .card-list-section{
	    background: #f7f7f5;
	    padding-bottom: 30px;
		position: relative;
	  }
    .build-block-right span{
      color:white;

    }
    .list-card-item {
      background: #fff;
      border-radius: 10px;
      width: 100%;
	  margin-bottom: 2px;
      padding: 0.5rem 1.75rem;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 1.5rem;
	  cursor: pointer;
      align-items: center;
      position: relative;
	  z-index: 1;
      animation: fadeUp .55s cubic-bezier(.22,.68,0,1.2) both;
    }
	
	 .list-card-item:hover{
	    z-index: 20;
	 }
 
    /* Content side */
    .list-card-item-content { padding-left: 0; }
 
    .headline {
      font-size: 30px;
      font-weight: 700;
      color: #522b91;
      line-height: 1.1;
      margin-bottom: 10px;
      
    }
 
    .headline span {
      color: #32b563;
    }
 
    .list-card-text {
    font-size: 16px;
    color: #000;
    line-height: 1.3;
    max-width: 820px;
    font-weight: 500;
}
 
   
 
    /* Image side */
    .image-wrap {
      flex-shrink: 0;
      width: clamp(100px, 14vw, 150px);
      height: clamp(100px, 14vw, 150px);
      border-radius: 16px;
      overflow: hidden;
     
      position: relative;
      transition: transform 0.45s cubic-bezier(.22,.68,0,1.2), box-shadow 0.45s ease;
      z-index: 10;
    }
 
    .list-card-item:hover .image-wrap {
      transform: scale(1.6) translateX(-6px);
      
    }
 
    .image-wrap img,
    .image-wrap svg {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
 
    /* Fade-up animation */
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(28px); }
      to   { opacity: 1; transform: translateY(0); }
    }
 
    /* ── Responsive ── */
    @media (max-width: 767px) {
		.list-card-item {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
		padding: 1.25rem 0.5rem;
		gap: 1rem;
		width: 98%;
	}
	  
	  .headline {
       font-size: 20px;
	}
	
	.list-card-text {
    font-size: 15px;
	}
 
      .image-wrap {
        width: 90px;
        height: 90px;
        justify-self: end;
        grid-row: 1;
        grid-column: 1;
        position: absolute;
        top: 1.8rem;
        right: 1.5rem;
      }
 
      .list-card-item-content {
        padding-right: 110px;
      }
    }
	  
	  
	  
	  
	  
         :root {
         --voc-thumb-size:  42px;
         }
         .nav-menu a {
         color: #fff;
         }
         header.sticky .nav-menu a {
         color: #010000;
         }
         .main-navbar:hover  .nav-menu a {
         color: #010000;
         }
         .main-navbar:hover  .nav-menu a:hover {
         color: #7039c2;
         }
         .right-panel a {
         color: rgb(82, 43, 145) !important;
         }
         .right-panel a:hover {
         color: rgb(50, 181, 99) !important;
         }
         .popup-overlay {
         position: fixed;
         top: 0; left: 0;
         width: 100%; height: 100%;
         background: rgba(0,0,0,0.8);
         display: none;
         align-items: center;
         justify-content: center;
         z-index: 9999;
         }
         .popup-content {
         position: relative;
         width: 80%;
         max-width: 800px;
         aspect-ratio: 16 / 9;
         background: #000;
         }
         .popup-content iframe {
         width: 100%;
         height: 100%;
         border: none;
         }
         .popup-close {
         position: absolute;
         top: -16px;
         right: 0;
         color: #fff;
         font-size: 30px;
         cursor: pointer;
         }
         .body-grid {
         display: grid;
         grid-template-columns: 1fr 1fr;
         gap: 0 48px;
         padding: 30px 0px;
         }
         .col { display: flex; flex-direction: column; gap: 28px; }
         .career-talent-section {
         position: relative;
         background-color: #f7f7f5;
         }
         .byline {
            margin-top: 8px;
            padding-top: 16px;
            display: inline-block;
            position: relative;
            max-width: 600px;
            margin-left: auto;
        }
         .byline:before {
         content: "";
         width: 100%;
         height: 1px;
         background-color: #532e8a;
         position: absolute;
         bottom: -5px;
         }	
         .byline-name {
         font-size: 1.6rem;
         font-weight: 500;
         color: #532e8a;
         margin-bottom: 2px;
         }
         .safety-rule-banner {
         position: relative;
         background-color: #f7f7f5;
         padding-top: 16px;
         }
		 
		 .safety-rule-banner img{
		   width: 100%;
		 }
         .career-heading {
         font-size: 70px;
         color: #532e8a;
         line-height: 1.1;
         font-style: italic;
         font-weight: 600;
         }
         .career-heading span{
         color: #32b563;
         }
         .career-talent-text {
         position: relative;
         max-width: 800px;
         margin-top: 36px;
         margin-left: auto;
         }
         .career-images-section{
         background-color: #f7f7f5;
         position: relative;
         overflow: hidden;
         }
         .image-slider {
         overflow: hidden;
         padding: 60px 0;
         transform: skewX(-4deg);
         }
         .slider-track {
         display: flex;
         gap: 40px;
         scroll-behavior: auto; /* IMPORTANT */
         scrollbar-width: none;
         }
         .slider-track::-webkit-scrollbar {
         display: none;
         }
         .slide {
         flex: 0 0 386px;
         /*transform: skewX(-2deg);*/
         position: relative;
         }
         .slide:nth-child(odd) {
         top: 46px;
         }
         .slide img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         border-radius: 36px;
         }
         .career-video-section{
         background-color: #f7f7f5;
         }
         .voc-section{
         background-color: #f7f7f5;
         }
         .video-slider .video-slider-nav {
         text-align: center;
         }
         .video-slider {
         position: relative;
         padding: 70px 0;
         overflow: hidden;
         }
         .video-slider-track {
            display: flex;
            gap: 40px;
            overflow-x: auto;
            cursor: grab;
            user-select: none;
            scroll-behavior: auto;
            will-change: scroll-position;
            padding-top: 30px;
            padding-bottom: 50px;
            justify-content: flex-start;  /* ✅ center se flex-start karo */
            padding-left: 40px;           /* ✅ left padding add karo */
            padding-right: 40px;          /* ✅ right padding add karo */
        }
         .video-slider-track.dragging {
         cursor: grabbing;
         }
         .video-slider-track::-webkit-scrollbar {
         display: none;
         }
        .video-card {
            flex: 0 0 510px;
            height: 582px;
            border-radius: 30px;
            overflow: hidden;
            position: relative;
            transform: skewX(-2deg);
            transition: transform .4s ease;
        }
         .item-slider__video {
         max-height: 698px;
         object-fit: cover;
         width: 100%;
         border-radius: 30px;
         }
         .video-card:hover .video-text{
         filter: blur(10px);
         }
         .video-card:hover .video-play-btn-block{
         opacity: 1;
         }
         .video-item-content {
         position: relative;
         width: 92%;
         }
         .video-text {
         font-size: 22px;
         color: #fff;
         line-height: 1.4;
         font-weight: 500;
         transition: .25s ease-in;
         }
         .video-play-box{
         position: relative;
         }
         .video-play-btn-block {
         display: flex;
         cursor: pointer;
         justify-content: space-between;
         position: absolute;
         top: 0px;
         width: 96%;
         opacity: 0;
         transition: opacity .25s ease-in;
         }
         .video-item-content .see-full {
         font-size: 24px;
         color: #fff;
         font-weight: 600;
         }
         .video-item-content span img {
         width: 34px;
         height: 34px;
         }
         .video-card img {
         width: 100%;
         height: 100%;
         object-fit: cover;
         }
         /* Overlay */
         .card-overlay {
         position: absolute;
         bottom: 0;
         width: 100%;
         padding: 25px;
         -webkit-backdrop-filter: blur(17.5px);
         backdrop-filter: blur(17.5px);
         background: hsla(0, 0%, 100%, .05);
         }
         .card-overlay .video-name {
         margin: 12px 0 10px;
         color: #ffffff;
         font-size: 16px;
         font-weight: normal;
         }
         .nav {
         position: relative;
         width: 50px;
         height: 48px;
         border: none;
         background: #98cd6c;
         cursor: pointer;
         z-index: 10;
         padding-top: 2px;
         }
         .nav:hover{ 
         background-color: #32b563;
         }
         .nav.prev { 
         border-top-right-radius: 20px;
         border-top-left-radius: 10px;
         border-bottom-left-radius: 10px;
         border-bottom-right-radius: 10px;
         }
         .nav.next { 
         border-top-left-radius: 20px;
         border-top-right-radius: 8px;
         border-bottom-right-radius: 12px;
         border-bottom-left-radius: 9px;
         }
         .buid-tomarrow-section {
         position: relative;
         background-color: #f7f7f5;
         }
         .buid-tomarrow-block {
         height: 790px;
         background-size: cover;
         background-repeat: no-repeat;
         border-radius: 50px;
         transform: skewX(-2deg);
         position: relative;
         }
         .build-block-inner{
         padding: 18% 50px 0px;
         position: relative;
         }
         .build-block-title {
         color: #fff;
         font-size: 70px;
         font-style: italic;
         line-height: 1.2;
         font-weight: 600;
         }
         .build-block-buttns {
         display: flex;
         flex-wrap: wrap;
         align-items: center;
         padding-top: 18px;
         }
         .build-block-left{
         width: 60%;
         }
         .build-block-left .know-more-btn{
         margin-top: 34px;
         }
         .build-block-right {
         width: 40%;
         position: absolute;
         right: 5%;
         bottom: 10%;
         }
         .build-tomarrow-left-content{
         position: absolute;
         max-width: 950px;
         width: 100%;
         left: 5%;
         bottom: 11%;
         }
         .build-block-right p {
         color: #fff;
         font-size: 18px;
         max-width: 344px;
         margin-left: auto;
         }
         /* testimonial section css */
         /* Wrapper */
         .voc-section {
         position: relative;
         }
         .voc-container {
         width: 100%;
         margin-top: 20px;
         }
         /* ── Slider wrapper ── */
         .voc-slider {
         position: relative;
         overflow: hidden;
         }
         /* ── Each slide ── */
         .voc-slider {
         overflow: hidden;
         }
         .voc-track {
         display: flex;
         transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
         will-change: transform;
         }
         .voc-slide {
         min-width: 100%;
         display: grid;
         grid-template-columns: 480px 1fr;
         gap: 0 56px;
         align-items: center;
         min-height: 480px;
         position: relative;
         }
         .voc-slide {
         opacity: 0.5;
         transition: opacity 0.6s ease;
         }
         .voc-slide.voc-slide--active {
         opacity: 1;
         }
         @keyframes voc-slideFadeIn {
         from { opacity: 0; transform: translateX(20px); }
         to   { opacity: 1; transform: translateX(0); }
         }
         /* ── Photo ── */
         .voc-slide__photo {
         border-radius: 20px;
         overflow: hidden;
         width: 100%;
         }
         .voc-slide__photo img {
         width: 100%; height: 100%;
         object-fit: cover;
         object-position: top center;
         display: block;
         transition: transform 0.5s ease;
         }
         /* ── Decorative quote mark ── */
         .voc-slide__quotemark {
         position: absolute;
         top: 10px;
         right: 7%;
         line-height: 1;
         user-select: none;
         pointer-events: none;
         }
         .voc-slide__quotemark img {
         max-width: 84px;
         }
         /* ── Text content ── */
         .voc-slide__body {
         display: flex;
         flex-direction: column;
         gap: 8px;
         padding-right: 80px;
         }
         .voc-slide__name {
         font-style: italic;
         font-size: 40px;
         font-weight: 700;
         line-height: 1;
         color: #532e8a;
         }
         .voc-slide__role {
         font-size: 28px;
         font-weight: 500;
         color: #000;
         }
         /* ── Navigation bar ── */
         .voc-nav {
         display: flex;
         align-items: center;
         gap: 10px;
         margin-top: 5px;
         width: 68%;
         margin-left: auto;
         }
         .voc-nav__btn {
         width: 44px;
         height: 44px;
         background: #32b563;
         border: none;
         cursor: pointer;
         display: flex;
         border: 0px;
         align-items: center;
         justify-content: center;
         transition: background 0.2s, transform 0.15s;
         flex-shrink: 0;
         padding: 10px 16px;
         background-color: #98cd6c;
         border-top-left-radius: 20px;
         border-top-right-radius: 8px;
         border-bottom-right-radius: 12px;
         border-bottom-left-radius: 9px;
         }
         .voc-nav__btn span {
         position: relative;
         top: 2px;
         }
         .voc-nav__btn:hover { background: #48a83a;  }
         .voc-nav__btn svg {
         width: 18px; height: 18px;
         fill: none; stroke: #fff;
         stroke-width: 2.5;
         stroke-linecap: round;
         stroke-linejoin: round;
         }
         /* ── Thumbnail strip ── */
         /* Track clips to show exactly 3 thumbs; rest slide in/out */
         .voc-nav__thumbs-track {
         overflow: hidden;
         width: calc(var(--voc-thumb-size) * 3 + 40px * 2);
         flex-shrink: 0;
         }
         .voc-nav__thumbs {
         display: flex;
         align-items: center;
         gap: 8px;
         width: max-content;
         transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
         }
         .voc-nav__thumb {
         width: var(--voc-thumb-size);
         height: var(--voc-thumb-size);
         overflow: hidden;
         cursor: pointer;
         transition: border-color 0.2s, transform 0.2s;
         flex-shrink: 0;
         transform: skew(-4deg);
         border-radius: 14px;	 
         border: 2px solid transparent;	   
         }
         .voc-nav__thumb.voc-nav__thumb--active{
         border-color: #48a83a;
         }
         .voc-nav__thumb img {
         width: 100%; height: 100%;
         object-fit: cover;
         object-position: top center;
         display: block;
         border-radius: 10px;
         transform: skew(-4deg);
         }
         /* ── Responsive ── */
         @media (max-width: 820px) {
         .voc-slide--active {
         grid-template-columns: 1fr;
         gap: 28px 0;
         min-height: unset;
         }
         .voc-slide__photo  { max-width: 320px; margin: 0 auto;}
         .voc-slide__body   { padding-right: 0;  position: relative; }
          .voc-slide{
		       grid-template-columns: 1fr;
			   gap: 0 40px;
		  }
         }
         @media (max-width: 480px) {
         .voc-nav__thumb       { --voc-thumb-size: 42px; }
         }
         /* end testimonial section */
         @media (max-width: 767px) {
         .career-heading {
         font-size: 24px;
         }
         .banner-container img {
         width: 99%;
         margin: 0px auto;
         }
        .build-block-title {
			font-size: 24px;
			color: #532e8a;
			text-align: center;
		}
         .build-block-title span{
         color: #32b563;
         }
		 
		 .body-grid {
            grid-template-columns: 1fr;
			gap: 0 38px;
			padding: 10px 0px;
		}
		
		.col {
		     gap: 16px;
		}
		
		.byline-name {
			font-size: 1.2rem;
		}
		
		.byline {
        margin-top: 0px;
        margin-bottom: 20px;
        
        }
		
		.career-video-section{
		    padding-bottom: 30px;
		}
		
		.voc-container {
            margin-top: 0px;
        }
		 
         .video-popup__content video {
         width: 100%;
         height: 408px;
         }
		 
         .item-slider__video {
         max-height: 438px;
         }
         .slider-track{
         gap: 10px;
         }
         .slide {
         flex: 0 0 200px;
         }
         .video-slider-track{
         gap: 12px;
         }
         .video-text {
         font-size: 15px;
         }
         .video-card {
         flex: 0 0 300px;
         height: 440px;
         margin-left: 10px;
         }
         .card-overlay .video-name{
         font-size: 14px;
         }
         .video-item-content .see-full {
         font-size: 18px;
         }
         .video-item-content span {
         font-size: 16px;
         }
         .video-slider{
         padding: 16px 0;
         }
         .video-slider .nav {
         display: unset;
         transform: unset;
         }
         .video-slider-nav {
         display: flex;
         justify-content: center;
         gap: 10px;
         }
         .nav.next {
         right: 0px;
         }
         .nav.prev {
         left: 0px;
         }
        .buid-tomarrow-section {
            padding-top: 16px;
        }
         .image-slider {
         padding: 40px 0;
         }
         .video-slider-track{
         padding-bottom: 42px;
         }
         .build-block-inner {
         padding: 18% 16px 0px;
         }
         .build-block-left {
         width: 100%;
         }
         .build-block-right {
         width: 90%;
         padding-top: 18px;
         right: 0;
         bottom: 7%;
         left: 0;
         margin: 0px auto;
         }
		 
		 .voc-slide__photo img {
			width: 100%;
			height: auto;
			object-fit: unset;
			margin-bottom: 20px;
			}
		 
		 .voc-slide__body{
		       position: relative;
		 }
		 .voc-nav {
			width: 100%;
			margin-top: 22px;
			justify-content: center;
		}
		
		.voc-slide__quotemark {
			top: -12px;
			right: 3%;
		}
		
		.voc-slide__quotemark img {
			max-width: 32px;
		}
		
		.voc-slide{
		   grid-template-columns: 1fr;
           gap: 0 0px;
		   min-height: 510px;
		}
		
		.voc-slide__name{
		     font-size: 22px;
		}
		
		.voc-slide__role {
			font-size: 18px;
			line-height: normal;
		}
		
		.voc-nav__btn {
			width: 38px;
			height: 38px;
		}
		 
         .build-block-buttns {
         padding-top: 6px;
         }
         .build-block-left .know-more-btn {
			margin-top: 20px;
			text-align: center;
		}
         .build-block-left .know-more-btn a {
         line-height: normal;
         font-size: 14px;
         }
         .build-block-left .know-more-btn .btn-text {
         padding: 12px 18px;
         }
         .buid-tomarrow-block{
         height: 440px;
         background-image: url(assets/images/build-tomarrow-mobile-banner.jpg);
         border-radius: 24px;
         }
         .build-block-right p{
         font-size: 15px;
         }
         .build-tomarrow-left-content {
         padding-top: 52px;
         position: relative;
         left: 0;
         bottom: 0;
         padding-top: 30px;
         }
         }
         @media only screen and (min-width: 768px) and (max-width: 1199px)  {
         .career-heading {
         font-size: 32px;
         }
         .career-talent-text {
         max-width: 500px;
         }
         .slider-track{
         gap: 32px;
         }	
         .slide {
         flex: 0 0 316px;
         }
         .item-slider__video {
         max-height: 504px;
         }
         .video-text {
         font-size: 16px;
         }
         .video-slider{
         padding: 30px 0;
         }
         .video-slider-track{
         gap: 28px;
         }
         .video-slider-track{
         padding-top: 15px;
         padding-bottom: 76px;
         }
         .video-card {
         flex: 0 0 330px;
         height: 506px;
         }
         .video-item-content .see-full {
         font-size: 18px;
         }
         .card-overlay .video-name{
         font-size: 15px;
         }
         .video-item-content span {
         font-size: 17px;
         }
         .build-block-title{
         font-size: 32px;
         }
         .build-block-inner {
         padding: 28% 22px 0px;
         }
		 .voc-slide__quotemark img {
			max-width: 60px;
		}
		
		.voc-slide__name{
		 font-size: 28px;
		}
		
		.voc-slide__role {
         font-size: 22px;
	    }
		
		.voc-slide__body{
		  padding-right: 10px;
		}
		
		.voc-slide{
		     gap: 0 30px;
		}
		
		.voc-slide__quotemark{
		  top: 22px;
		}
		
		.col {
		      gap: 18px;
		}
		
		.voc-nav {
		  margin-top: 24px;
		  width: 74%;
		}
         .build-block-right p{
         font-size: 15px;
         }
         .build-block-buttns{
         padding-top: 8px;
         }
         .build-block-left .know-more-btn {
         margin-top: 26px;
         }
         .buid-tomarrow-block{
         height: 536px;
         }
         }
         @media only screen and (min-width: 1200px) and (max-width: 1366px)  {
         .career-heading {
         font-size: 50px;
         }
         .career-talent-text{
         max-width: 666px;
         }
         .slide {
         flex: 0 0 314px;
         }
         .slider-track{
         gap: 52px;
         }
         .video-slider-track {
         gap: 34px;
         padding-bottom: 80px;
         }
         .video-card {
            flex: 0 0 361px;
            height: 424px;
        }
         .video-text {
         font-size: 18px;
         }
         .video-item-content .see-full {
         font-size: 20px;
         }
		 
		 .video-slider-track{
		  padding-top: 10px;
		 }
		 
         .item-slider__video {
         max-height: 525px;
         }
		 .voc-slide{
		   grid-template-columns: 400px 1fr;
		 }
		 .voc-slide__name{
		   font-size: 34px;
		 }
		 
		 .voc-nav{
		      width: 58%;
		 }
		 
		 .voc-slide__quotemark img {
			max-width: 70px;
		}
		
		.voc-slide__role {
           font-size: 22px;
          }
		
		.image-slider{
		      padding: 40px 0;
		}
         .build-block-title {
         font-size: 50px;
         }
         .buid-tomarrow-block{
         height: 630px;
         }
         .build-block-right p{
         font-size: 14px;
         } 
         .build-block-left .know-more-btn {
         margin-top: 32px;
         }
         .build-tomarrow-left-content{
         max-width: 660px;
         }
         .build-block-right {
         right: 1%;
         }
         }
         @media only screen and (min-width: 1367px) and (max-width: 1440px)  {
         .career-heading {
         font-size: 54px;
         }
         .slider-track{
         gap: 46px;
         }
         .slide {
         flex: 0 0 350px;
         }
         .image-slider {
         padding: 60px 0;
         }
         .career-video-section.space-T-80{
         padding-top: 50px;
         }
         .video-slider{
         padding-top: 20px;
         }
         .item-slider__video {
         max-height: 525px;
         }
         .video-text {
         font-size: 18px;
         }
         .video-item-content .see-full {
         font-size: 20px;
         }
         .build-tomarrow-left-content {
         max-width: 750px;
         }
         .build-block-right {
         right: 3%;
         }
         .video-card {
            flex: 0 0 400px;
            height: 470px;
        }
		 .voc-nav{
		  width: 58%;
		 }
		 .voc-container{
		   margin-top: 0px;
		 }
		 
		 .voc-slide__role {
           font-size: 24px;
          }
		 
		 .voc-slide__name{
		      font-size: 36px;
		 }
		 
		 .voc-slide__quotemark img {
			max-width: 70px;
		}
         .build-block-title {
         font-size: 54px;
         }
         .buid-tomarrow-block{
         height: 660px;
         }
         .build-block-right p {
         font-size: 15px;
         }	
         }
         @media only screen and (min-width: 1441px) and (max-width: 1680px)  {
        .video-card {
            flex: 0 0 450px;
            height: 518px;
        }
         .build-block-right p {
         font-size: 15px;
         }
		 
		 .voc-nav{
		   width: 60%;
		 }
		 
		 .voc-container {
           margin-top: 4px;
         }
         }
		 
		  @media only screen and (min-width: 1681px) and (max-width: 1800px)  {
		  
		   .voc-nav{
		         width: 64%;
		   }
		  }