.main-text h2{
    font-size: 60px;
    font-weight: 600;
    text-align: center;
    margin: 65px 0 30px 0;
}

.main-text span{
    color: #915FFE;
}

.main-text p{
    text-align: center;
    margin: 0;
    margin: 0 240px;
}

.home-banner{
    display: block;
    width: 100%;
    height: auto;
    margin-top: -75px;
}

.logo-patners{
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    place-items: center;
}

.logo-patners img{
    height: auto;
    display: block;
}

.reliable-people{
    background: url(../images/home/simple-back.webp) no-repeat center;
    background-size: cover;
    padding: 50px 0 60px 0;
    height: auto;
    margin: 50px 0;
}


.circle-sketch-simple{
    position: relative;
    padding: 0.3em 0.4em;
}

.circle-sketch-simple:before{
  content:"";
  left: -0em;
  top: 0.5em;
  border-width:3px;
  border-style:solid;
  border-color:#fff;
  position:absolute;
  border-right-color:transparent;
  width:100%;
  height:1em;
  transform:rotate(2deg);
  opacity:0.7;
  border-radius:50%;
  padding:0.1em 0.25em;
}
.circle-sketch-simple:after{
  content:"";
  left: -0em;
  top: 0.6em;
  padding:0.1em 0.25em;
  border-width:3px;
  border-style:solid;
  border-color:#fff;
  border-left-color:transparent;
  border-top-color:transparent;
  position:absolute;
  width:100%;
  height:1em;
  transform:rotate(-1deg);
  opacity:0.7;
  border-radius:50%;
}

.reliable-people ul{
    margin: 20px 0;
    padding: 0 30px;
}

.reliable-people ul li{
    font-size: 16px;
    color: #fff;
    line-height: 35px;
    font-weight: 400;
}

.reliable-people ul li::marker{
    color: #fff !important;
}

.reliable-cont{
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    left: 100px;
    width: 552px;
    line-height: 45px;
    position: relative;
}

.reliable-cont p{
    margin: 10px 0;
}

.reliable-cont .color-btn{
    justify-content: left;
}

.reliable-cont .color-btn p{
    padding: 5px 28px;
}

.what-makes p{
    font-size: 36px;
    font-weight: 600;
}

.what-makes-section{
    display: flex;
    justify-content: center;
    align-items: center;
}

.what-makes-section img {
  transition: transform 0.4s ease;
}

.what-makes-section:hover img:nth-child(1) {
  transform: rotate(5deg); /* keep straight */
}

.what-makes-section:hover img:nth-child(2) {
  transform: rotate(-5deg);
}

.what-makes-section:hover img:nth-child(3) {
  transform: rotate(5deg);
}

.track-record{
    background-color: #48485C;
    padding: 36px 0;
    margin: 50px 0;
}

.track-record p{
    color: #fff;
    font-size: 36px;
    text-align: center;
    margin: 0;
    font-weight: 600;
}

.track-recored-grid{
    grid-template-columns: repeat(4, 1fr);
    place-items: center;
    padding: 50px 0 30px 0;
}

.track-recored-grid .col{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.track-recored-grid .col p{
    font-size: 18px !important;
    padding: 0 20px;
    padding-top: 20px;
    font-weight: 400;
}

.Specialists-grid{
    grid-template-columns: repeat(2, 1fr);
    margin: 50px 0;
}

.Specialists-grid img{
    display: block;
    width: 100%;
    height: auto;
}

.Specialists-grid p{
    font-size: 36px;
    margin: 0;
    line-height: 45px;
    text-align: left;
}

.Specialists-grid .color-btn{
    justify-content: left;
}

.Specialists-grid .color-btn p{
    font-size: 16px !important;
    padding: 5px 28px;
}

.how-it-works{
    background-color: #915FFE;
    margin: 50px 0 0 0;
    padding: 40px 0;
}

.how-it-works p{
    color: #fff;
    font-size: 36px;
    margin: 0;
    font-weight: 600;
}

.how-it-works .d-grid{
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.how-it-works .d-grid .col{
    background: #B28FFE;
    margin-top: 36px;
    border-radius: 12px;
}

.how-it-works .d-grid .col img{
    width: 100%;
    height: auto;
    display: block;
}

.visionary-startups{
    background: url(../images/home/visionary.webp) no-repeat center;
    background-size: cover;
    padding: 20px 0 40px 0;
    height: auto;
}

.visionary-cont{
    color: #fff;
    left: 100px;
    width: 600px;
    line-height: 45px;
    position: relative;
}

.visionary-cont ul{
    display: flex;
    justify-content: left;
    align-items: center;
    gap: 26px;
    margin: 0;
    padding: 0 20px;
    line-height: 28px;
}

.visionary-cont ul li::marker{
    color: #fff !important;
}

.visionary-cont h3{
    font-size: 36px;
    font-weight: 400;
    margin: 20px 0;
}

.visionary-cont h4{
    margin: 0;
}

.visionary-cont p{
    line-height: 24px;
}

.trusted-by-teams{
    margin: 50px 0;
}

.dependable-engineers{
    background: #915FFE;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin: 50px 0;
    place-items: center;
}

.dependable-cont{
    color: #fff;
    left: 40px;
    width: 600px;
    line-height: 45px;
    position: relative;
}

.dependable-cont p{
    margin: 12px 0;
}

.dependable-cont h3 {
    font-size: 36px;
    font-weight: 400;
    margin: 20px 0;
}

.dependable-cont .color-btn{
    display: flex;
    justify-content: left;
    align-items: center;
    margin: 0 !important;
}

.dependable-cont .color-btn p{
    background: #fff;
    color: #915FFE;
    padding: 5px 28px;
    border-radius: 12px;
}

.dependable-engineers img{
    display: block;
    width: 100%;
    height: auto;
}

.decision-making{
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    margin: 20px 0;
}

.decision-making .col h3{
    color: #915FFE;
    margin: 0;
    font-size: 18px;
}

.decision-making .col p{
    margin: 8px 0;
    font-size: 16px;
    line-height: 20px;
    height: 90px;
}

#file-Intelligence {
  width: 90%;   /* your custom width */
  height: 8px;   /* thickness */
  appearance: none;
}

/* For Chrome, Edge, Safari */
#file-Intelligence::-webkit-progress-bar {
  background-color: #F2ECFF;       /* background color */
  border-radius: 6px;
}

#file-Intelligence::-webkit-progress-value {
  background-color: #915FFE;    /* progress color */
  border-radius: 6px;
}

/* For Firefox */
#file-Intelligence::-moz-progress-bar {
  background-color: #915FFE;
}

.trusted-img{
    text-align: center;
}

.trusted-img img{
    border-radius: 12px;
}

.trusted-item{
    background-color: #F1F2F3;
    padding: 80px 30px 20px 30px;
    border-radius: 12px;
    margin-top: -85px;
    height: 580px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.trusted-item p{
    margin: 0;
    font-size: 16px;
}

.trusted-item svg{
    text-align: left !important;
}

.trusted-flex{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.trusted-flex p{
    font-weight: 600;
    font-size: 18px;
}

#splide-trusted .splide__pagination{
    bottom: -1.5em;
}

#splide-trusted .splide__pagination .splide__pagination__page.is-active{
    background: #915FFE;
}

#splide-trusted .splide__slide.is-active{
    transform: scale(1);
}

#splide-logo img {
  display: block;
  margin: 0 auto;
}

#splide-logo .splide__pagination{
    bottom: -1.5em;
}

#splide-logo .splide__pagination .splide__pagination__page.is-active{
    background: #915FFE;
}

#splide-logo .splide__slide.is-active{
    transform: scale(1);
}

@media(max-width:1950px){
    .reliable-cont{
        left: 152px;
    }
}

@media(max-width:1500px){
    .reliable-cont{
        left: 130px;
    }
}


@media(max-width:1199px){
    .main-text h2{
        font-size: 32px;
        margin: 30px 0;
    }

    .what-makes-section img{
        height: 400px;
    }
}

@media(max-width:991px){
    .decision-making .col h3{
        line-height: 20px;
        height: 45px;
    }

    .decision-making .col p{
        height: 130px;
    }

    .book-appoint{
        background: #915FFE;
    }

    .book-appoint a{
        color: #fff;
    }
}

@media (max-width:768px){
    .main-text p{
        margin: 0;
    }

    #splide-logo img{
        width: 150px;
        height: 65px;
    }

    .logo-patners .drdo{
        width: 90px !important;
    }

    .logo-patners{
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .home-banner{
        margin-top: 0;
    }

    .color-btn p{
        padding: 10px 28px;
        margin: 8px 0;
    }

    .main-text h2{
        margin: 20px 0;
    }

    .reliable-cont{
        left: 20px;
        width: 345px;
        font-size: 24px;
        line-height: 30px;
    }

    .reliable-people{
        padding: 15px 0 15px 0;
    }

    .reliable-people ul li{
        line-height: 26px;
    }

    .reliable-people ul{
        margin: 10px 0;
    }

    .what-makes p{
        font-size: 24px;
        margin: 20px 0;
    }

    .what-makes-section img{
        height: 190px;
    }

    .track-recored-grid{
        grid-template-columns: repeat(2, 1fr);
        padding: 30px 0 30px 0;
        gap: 20px;
    }

    .track-record p{
        font-size: 24px;
    }

    .Specialists-grid p{
        font-size: 24px;
        line-height: 28px;
    }

    .decision-making {
        display: flex;
        overflow-x: auto;
        gap: 20px;
        scroll-snap-type: x mandatory;
        padding-bottom: 10px;
    }

    .decision-making .col {
        min-width: 180px; /* each card width */
        scroll-snap-align: start;
    }

    /* Hide scrollbar (optional) */
    .decision-making::-webkit-scrollbar {
        display: none;
    }

    .Specialists-grid{
        grid-template-columns: repeat(1, 1fr);
    }

    .how-it-works .d-grid{
        grid-template-columns: repeat(1, 1fr);
        gap: 0px;
    }

    .visionary-startups{
        padding: 20px 0 20px 0;
    }

    .visionary-cont{
        left: 20px;
        width: 345px;
    }

    .visionary-cont h3{
        font-size: 24px;
    }

       .visionary-startups {
    background-position-x: 56%; /* adjust left-right */
  }

  .visionary-cont ul{
    font-size: 14px;
    gap: 20px;
  }

    .visionary-cont ul{
        line-height: 26px;
    }

    .dependable-engineers{
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
    }

    .dependable-cont{
        width: 345px;
        left: 0;
    }

    .dependable-cont h3{
        font-size: 24px;
        margin: 10px 0;
    }

    .track-recored-grid .col p{
        padding: 10px 14px;
    }

    .dependable-cont p{
        margin: 5px 0;
    }

    .trusted-item{
        height: 725px;
    }
}

  /* page layout */
  body { margin:0; height:100vh; background:#f5f7fb; }
  .stage { position:relative; width:100%; height:700px; overflow:hidden; border-radius:12px; display:flex; align-items:center; }

  /* blue box in the middle */
  .blue-box {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 240px;
    height: 120px;
    background: #0b66ff; /* talensure.ai blue */
    color: #fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    border-radius:10px;
    z-index: 10;
    pointer-events:none;
    box-shadow: 0 6px 18px rgba(11,102,255,0.18);
  }

  /* container for moving SVG images */
  .track {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    pointer-events:none;
  }

  /* each moving image */
  .floating {
    position:absolute;
    width:100%; /* change size as needed */
    height:auto;
    top:50%;
    transform: translateY(-50%) translateX(-150%); /* start well off-left */
    will-change: transform;
    opacity:0;
    z-index:5;
  }

  /* animation: move from off-left to off-right while fading in/out */
  @keyframes slideLeftToRight {
    0%   { transform: translateY(-50%) translateX(-150%); opacity:0; }
    10%  { opacity:1; }
    50%  { transform: translateY(-50%) translateX(60%); } /* pass the blue box (center) */
    90%  { opacity:1; }
    100% { transform: translateY(-50%) translateX(220%); opacity:0; } /* off-right */
  }

  /* start animation when .started is added to .track */
  .track.started .floating {
    animation-name: slideLeftToRight;
    animation-duration: 4s;
    animation-timing-function: cubic-bezier(.18,.88,.35,1);
    animation-fill-mode: forwards;
    animation-iteration-count: 1;
  }

  /* stagger multiple images with different delays */
  .floating:nth-child(1) { left: -10%; animation-delay: 0.0s; }
  .floating:nth-child(2) { left: -12%; animation-delay: 0.6s; }
  .floating:nth-child(3) { left: -14%; animation-delay: 1.2s; }

  /* small responsive tweaks */
  @media (max-width:600px){
    .blue-box { width: 160px; height:90px; }
    .floating { width:100px; }
  }
