.max-width-100 { max-width: 100px !important; }
.max-width-200 { max-width: 200px !important; }
.max-width-300 { max-width: 300px !important; }
.max-width-400 { max-width: 400px !important; }
.max-width-500 { max-width: 500px !important; }
.max-width-600 { max-width: 600px !important; }
.max-width-700 { max-width: 700px !important; }
.max-width-800 { max-width: 800px !important; }
.max-width-850 { max-width: 850px !important; }
.max-width-900 { max-width: 900px !important; }
.max-width-950 { max-width: 950px !important; }
.max-width-1000 { max-width: 1000px !important; }
.max-width-1050 { max-width: 1050px !important; }
.max-width-1100 { max-width: 1100px !important; }
.max-width-1150 { max-width: 1150px !important; }
.max-width-1200 { max-width: 1200px !important; }
.max-width-1250 { max-width: 1250px !important; }
.max-width-1300 { max-width: 1300px !important; }
.max-width-1350 { max-width: 1350px !important; }
.max-width-1400 { max-width: 1400px !important; }
.max-width-1450 { max-width: 1450px !important; }
.max-width-1500 { max-width: 1500px !important; }
.max-width-1550 { max-width: 1550px !important; }
.max-width-1600 { max-width: 1600px !important; }
.max-width-1650 { max-width: 1650px !important; }
.max-width-1700 { max-width: 1700px !important; }
.max-width-1750 { max-width: 1750px !important; }
.max-width-1800 { max-width: 1800px !important; }
.max-width-1850 { max-width: 1850px !important; }
.max-width-1900 { max-width: 1900px !important; }
.max-width-1950 { max-width: 1950px !important; }
.max-width-2000 { max-width: 2000px !important; }
.max-width-2050 { max-width: 2050px !important; }
.max-width-2100 { max-width: 2100px !important; }
.max-width-2150 { max-width: 2150px !important; }
.max-width-2200 { max-width: 2200px !important; }

.fs-counter{
    font-size: 40px !important;
}

.counter-border{
    border: 1px solid #FF6600 !important;
    border-radius: 20px !important;
}

@media screen and (max-width:575px) {
    .counter-border{
        border:unset !important;
    }
}

.btnFindMore_carousel{
    position: absolute !important;

    left:7% !important;
    bottom: 8% !important;

    font-size: 1rem;   /* base size */
    padding: 0.5rem 1rem;

    background-color: #FF6600 !important;
    border-radius: 20px !important;
    border: unset;
    color: white !important;
}


.text-link:hover{
    text-decoration: underline !important;
}

@media (max-width: 576px) {
  .btnFindMore_carousel {
    font-size: 0.85rem;   /* smaller text */
    padding: 0.4rem 0.8rem;
  }
}

@media (min-width: 992px) {
  .btnFindMore_carousel {
    font-size: 1.2rem;   /* larger on desktop */
    padding: 0.75rem 1.5rem;
  }
}

.top-carousel-img{
    max-height: 900px !important;
}

.top-margin{
    /* height: 111.2px !important; */
    height: 71.2px !important;
    display: block;
}

body {
    padding: 0;
    margin: 0;
    /* font-family: 'Play', sans-serif; */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.section-partnering-border{
    
    border: 1px solid #EB5C0C !important;
    border-radius: 20px !important;
}

.partner-step-img-background{
    width: 50px !important;
    height: 50px !important;
    border-radius: 10px !important;
    background-color: #545454 !important;
}

.section-partnering-border img{
    width: 30px !important;
    height: auto !important;
}

.section-partner-step{
    width: 30px !important;
    height: 30px !important;
    background-color: black !important;
    color: white !important;

    border-radius: 50% !important;
    position: absolute !important;
    top: -15px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

}

.relative{
    position: relative !important;
}



.videoContainerSection{
    position: relative !important;
    
}

.videoContainerSection video{
    object-fit: cover !important;
    width: 100% !important;
    max-height: 900px !important;
 
}

.video-overlay-content{
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10 !important;
}

.title-font-size{
    font-size: 56px;
}

.text-title-color{
    font-weight: bold;
    background: linear-gradient(to bottom, #FFB17C, #ffffff); /* Gradient colors */
    -webkit-background-clip: text; /* Clip background to text */
    color: transparent; /* Make the text transparent so the gradient shows */
}

.special-text-title-color{
    font-weight: bold;
    background: linear-gradient(to bottom, #FFB17C 0%, #FFC49D 25%, rgb(245, 164, 111) 50%,#eb8d4f 75%,#eb7d34 100%); /* Gradient colors */
    -webkit-background-clip: text; /* Clip background to text */
    color: transparent; /* Make the text transparent so the gradient shows */
}

.orange-title-color{
    font-weight: bold;
    background: linear-gradient(to bottom, #FFA500 0%, #FF6600 54%,#9F4000 100%); /* Gradient colors */
    -webkit-background-clip: text; /* Clip background to text */
    color: transparent; /* Make the text transparent so the gradient shows */
}


.bg-content{
    /* background: linear-gradient(to right,
        #1B1B1B 0%,
        #1D1C1B 12%,
        #231F1C 22%,
        #25221D 35%,
        #27231D 46%,
        #29261F 50%,
        #25221E 56%,
        #27231D 66%,
        #231F1C 75%,
        #1D1C1B 88%,
        #1B1B1B 100%
    ) !important; */
    background-color: #1B1B1B !important;
}

.fs-18{
    font-size: 18px !important;
}

.img-ivanti-solutions{
    max-width: 500px !important;
    height: auto !important;
}

.form-control{
    border: 1px solid #ffffff !important;
    border-radius: 0px !important;
    background-color: transparent !important;
}

.btn-submit{
    /* background: linear-gradient(to bottom, #5C5956, #26221D) !important; */
    background-color: #EB5C0C !important;
    border-radius: 40px;
    color: white !important;
    /* color: #FFB17C !important; */
    max-width: 100px !important;
    border-color: unset !important;
    border-width: 0px !important;
}

.contact-us-container{
    border: 1px solid #5C5956;
    border-radius: 40px;
}


.progress-container {
    position: relative;
    width: 150px;
    height: 150px;
}

svg {
    transform: rotate(-90deg);
}

.progress-circle {
    fill: none;
    stroke: #FFB17C;
    stroke-width: 10;
    stroke-dasharray: 251.2;
    stroke-dashoffset: 251.2;
    transition: stroke-dashoffset 0.22s ease-in-out;
}

.progress-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 24px;
    font-weight: bold;
}

.border-card{
    background-color: rgba(255,255,255,0.15) !important;
    border-radius: 40px !important;
}

.technology-card{
    background-color: #38342B !important;
    border-radius: 40px !important;

}

.card-image{
    width: 100% !important;
    height: auto !important;
    object-fit: fill !important;
    min-width: 100% !important;
    
}

.custom-fs-5{
    font-size: 20px !important;
}

textarea::placeholder{
    color: white !important;
}


input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
}
  

.custom-fs-30{
    font-size: 30px;
}

.text-orange{
    color: #FF6600;
}

.fade-in{
    opacity: 0;
    transition:opacity 1s ease-in;
    will-change: opacity;
}

.fade-in.show{
    opacity: 1;
}

.next-icon{
    width: 20px !important;
    height: auto !important;
}

.big-next-icon{
    width: 25px !important;
    height: auto !important;
}


.relative{
    position:relative !important;
}

.ourConsultativeJourney-overlay{
    position: absolute !important;
    /* background-color: #1b1b1b !important;
    opacity: 1 !important; */
    background: rgba(27, 27, 27, 1);
    pointer-events: none; 
    transition: opacity 0.3s ease;
}

.btnContactUs_hover:hover{
    opacity: 0.9 !important;
}

.flip-card-front img{
    width: 80px !important;
    height:auto !important;
}

.flip-card-back img{
    width:25px !important;
    height:auto !important;
}

@media screen and (min-width:992px) {
    /* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  width: 100% !important;
  height: 160px !important;
  /* border: 1px solid #f1f1f1; */
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}
    /* Do an horizontal flip when you move the mouse over the flip box container */
    .flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
    }
}




/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

@media screen and (max-width:991px) {
    .flip-card-front, .flip-card-back {
        width: unset !important;
    }
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: unset !important;
  /* color: black; */
}

/* Style the back side */
.flip-card-back {
  background-color: unset !important;
  color: white;
  transform: rotateY(180deg);
}

.award-cert-container {
  max-width: 100% ;
  overflow: hidden;          /* hide overflow so it looks like a window */
  display: flex;
  gap: 1rem;                 /* keep some gap */
  position: relative;
}

.award-cert-container img{
    width: 180px  !important;
    height: auto !important;
    object-fit: scale-down !important;
}

.award-cert-track {
  display: flex;
  gap: 3rem;
  animation: scroll-left 20s linear infinite;
}

.award-cert-track img {
  flex-shrink: 0;            /* prevent shrinking */
  height: 60px;              /* adjust size */
}

@keyframes scroll-left {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%); /* move half of track width */
  }
}



@media screen and (max-width:991px) {
    /* set font size here */
    .title-font-size{
        font-size: 30px;
    }
    
    
}

@media screen and (max-width:767px) {
    .custom-fs-5{
        font-size: 18px !important;
    }

    .award-cert-container {
        max-width: 100% !important;
        overflow: hidden;          /* hide overflow so it looks like a window */
        display: flex;
        gap: 1rem;                 /* keep some gap */
        position: relative;
    }

    .award-cert-container img{
        width: 120px  !important;
        height: auto !important;
        object-fit: scale-down !important;
    }

    .award-cert-track {
        display: flex;
        gap: 1.5rem;
        animation: scroll-left 20s linear infinite;
    }
}

@media screen and (max-width:575px) {
    .section-partnering-border{
        max-width: 300px !important;
    }
}

@media screen and (max-width:480px) {
    /* set font size here */
    .title-font-size{
        font-size: 22px;
    }
    
    .custom-fs-5{
        font-size: 16px !important;
    }
    
}