:root {
    --blue: #1e90ff;
    --white: #ffffff;
    --darkblue: #001247;
    --grey: #f8f8f9;
    --light-blue: #e9f1fa;
  }


*{
    padding: 0;
    margin: 0;
}
body{
    background: url(/images/bgge.jpg);
    background-size: cover;
}
.custom{
    padding: 10px;
    border-radius: 10px;
}
img.logo{
    width: 50px !important;
}
/* buttons */
.btn-darkblue{
    background: var(--darkblue) !important;
    border-radius: 10px !important;
    height: auto;
    width: auto;
    padding: 10px;
    border: 2px solid var(--darkblue) !important;
}
.btn-darkblue:hover{
    background: var(--white) !important;
    color: #0a1828 !important;
    border: 2px solid var(--darkblue) !important;
}

.btn-gradblue{
    background: linear-gradient(90deg, #0a4afa 0%, #1e78ff 100%) !important;
    border-radius: 10px !important;
    height: auto;
    width: auto;
    padding: 10px;
    border: none !important;
    color: var(--white) !important;
}
.btn-gradblue:hover{
    background: linear-gradient(90deg, #1e78ff 0%, #0a4afa 100%) !important;  
}

.btn-outline-gradblue{
    background: transparent !important;
    border-radius: 10px !important;
    height: auto;
    width: auto;
    padding: 10px;
    border: 2px solid #0a4afa !important;
    border-width: 2px !important;
    color: var(--white) !important;
    transition: all 0.3s ease-in-out;
}
.btn-outline-gradblue:hover{
    border: 2px solid #1e78ff !important;
}


/* text-colors */
.text-dblue{
    color: var(--darkblue) !important;
}
.text-blue{
    color: #1e78ff !important;
}
.text-bblue{
    color: #0a4afa !important;
}
.anime-text{
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    border-right: 0px solid;
    animation: 
        typing 2s steps(18),
        cursor .4s step-end infinite alternate;
}
@keyframes cursor {
    50% { border-color: transparent;}
}
@keyframes typing {
    from { width: 0;}
}

/* layouts */
.mb-75{
    margin-bottom: 75px !important;
}
.mb-70{
    margin-bottom: 70px !important;
}
.mb-150{
    margin-bottom: 150px !important;
}
.mb-100{
    margin-bottom: 100px !important;
}

/* text-size */
.fs-7{
    font-size: 15px;
}
.fn-20{
    font-size: 50px !important;}

/* backgrounds */

.bg-dblue{
    background-color: var(--darkblue) !important;
    color: var(--white) ;
}
.bg-lightblue{
    background-color: var(--light-blue) !important;
    color: var(--darkblue) ;
}
.bg-white{
    background-color: var(--white) !important;
    color: var(--darkblue) ;
}
.bg-gradblue{
    background: linear-gradient(90deg, #0032ba6b 0%, #1e78ff 100%) !important;
}
.bg-bluegrad{
    background: linear-gradient(90deg, #0a4afa 0%, #1e78ff 100%) !important;
    color: var(--white) ;
}
.bg-trans{
    background: rgba(255, 255, 255, 0.1);
    color: var(--white);
}


/* * services section */

.services{
    /* background: linear-gradient(to right, #0a1828, #0a1828); */
      color: white;
      display: flex;
      justify-content: center;
      align-items: center;
}
.card-services{
    border-radius: 2rem;
      padding: 2rem;
      color: #000;
      position: relative;
      transform: rotate(-2deg);
      overflow: hidden;
}
.card-services-rev{
    border-radius: 2rem;
      padding: 2rem;
      color: #000;
      position: relative;
      transform: rotate(2deg);
      overflow: hidden;
}
  .fx h5{
      font-size: 1.5rem;
      font-weight: 900;
      line-height: 1.2;
      margin-bottom: 1rem;
    }
.green {
      background: #b6f57e;
}
.purple {
    background: #df7df3;
}
.skyblue {
    background: #4ce8f3;
}

.t-green {
      color: #59c000;
}
.t-purple {
    color: #8e00ab;
}
.t-skyblue {
    color: #00c1ce;
}



.img-size{
    width: 100% !important;
    max-width: 500px !important;
}

.float-bounce {
    animation: float-bounce 2s ease-in-out infinite;
}
@keyframes float-bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-20px);
    }
}

/* testimonials */

.testimonials { position: relative; }

.testimonial-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(90deg, #0a4afa 0%, #1e78ff 100%) !important;;
    border: 0;
    box-shadow: 0 6px 18px rgba(2,6,23,0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 60;
    transition: transform .12s ease, box-shadow .12s ease;
}

.testimonial-arrow:hover { transform: translateY(-50%) scale(1.03); box-shadow: 0 10px 26px rgba(2,6,23,0.18); }
.testimonial-arrow:active { transform: translateY(-50%) scale(.98); }

.testimonial-arrow.prev { left: -24px; }
.testimonial-arrow.next { right: -24px; }

/* keep arrows visible but move them inside for very narrow viewports */
@media (max-width: 768px) {
    .testimonial-arrow.prev { left: 8px; top: calc(100% - 56px); transform: none; }
    .testimonial-arrow.next { right: 8px; top: calc(100% - 56px); transform: none; }
}

/* hide when card would overflow too much */
@media (max-width: 420px) {
    .testimonial-arrow { display: none; }
}

.testimonials .carousel-item p { color: #153243; line-height:1.5; }
.testimonials .card { max-width:980px; margin:0 auto; background: #ffffff; }
.testimonials .carousel-indicators [data-bs-target] { width:10px; height:0px !important;  background:#c7d2da; }
.testimonials .carousel-indicators .active { background:#0a4afa; }

@media (max-width:575px){
    .testimonials .carousel-item .col { text-align:left; }
    .testimonials .carousel-item img { width:72px;height:72px; }
}

/* counter cards */
/* .counter-card {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    padding: 30px 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    } */
    
    /* .counter-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.2);
    } */