.web-dev-hero-decion {
    background-image: url(/Images/services/Web-Dev/heosection.jpg);
}

.design-hero-section {
    background-image: url(/Images/services/GraphicDesigning/herosection.jpg);
}

.motion-hraphics-hero-section {
    background-image: url(/Images/services/MotionGraphics/herosection.jpg);
}

.whiteboard-hero-section {
    background-image: url(/Images/services/WhiteboardAnimation/herosection.jpeg);
}
/* Specialities  */
.healthcare-hero-section {
    background-image: url(/Images/Specialities/Healthcare/herosection.jpg);
    background-position: bottom;
}

.e-commerce-hero-section {
    background-image: url(/Images/Specialities/E-Commerce/herosection.webp);
    background-position: top;
}

.transport-hero-section {
    background-image: url(/Images/Specialities/Transport/herosection.png);
    /* background-position: top; */
}

.erp-hero-section {
    background-image: url(/Images/Specialities/ERP/herosection.webp);
    /* background-position: top; */
}




.web-types-section {
    padding: 50px 0px;
}
/* Our Services  */
.our-services-section {
    background-color: #f5f5f5;
    padding: 50px 0px;
}

.client-card:hover .services-image {
    filter: brightness(0) invert(1);
}



@keyframes shake {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-5px);
    }

    50% {
        transform: translateX(5px);
    }

    75% {
        transform: translateX(-5px);
    }

    100% {
        transform: translateX(0);
    }
}

.specialities-icon {
    color: #4c4c4c !important;
}

.client-card:hover .specialities-icon {
    filter: brightness(0) invert(1);
}




.client-card {
    background-color: #ffffff;
    border: 2px solid transparent;
    border-radius: 10px;
    transition: all 0.3s ease; /* Transition for all properties */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

    .client-card:hover {
        background-color: #25426c;
        color: #ffffff;
        border-color: #25426c;
        border-radius: 40px;
        transition: border-radius 0.5s ease;
    }


    .client-card img {
        width: 50px;
        height: 50px;
    }

.trust-card-heading {
    font-size: 18px;
    font-weight: bold;
    color: #25426c;
    transition: color 0.3s ease;
}

.client-card:hover .trust-card-heading {
    color: #ffffff;
}

.client-card p {
    font-size: 14px;
    color: #25426c;
}

.client-card:hover p {
    color: #ffffff;
}

/* Default state: same as hover state of the original card */
.client-card-reversed {
    background-color: #25426c; /* Originally hover background color */
    color: #ffffff; /* Originally hover text color */
    border: 2px solid #25426c; /* Originally hover border color */
    border-radius: 40px; /* Originally hover border-radius */
    border-radius: 10px;
    transition: all 0.3s ease; /* Transition for all properties */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Same as the original */
}

    .client-card-reversed img {
        width: 50px;
        height: 50px;
        filter: brightness(0) invert(1); /* Originally hover image filter */
        transition: filter 0.3s ease-in-out; /* Smooth filter transition */
    }

.trust-card-heading-reversed {
    font-size: 18px;
    font-weight: bold;
    color: #ffffff; /* Originally hover heading color */
    transition: color 0.3s ease;
}

.client-card-reversed p {
    font-size: 14px;
    color: #ffffff; /* Originally hover paragraph color */
    transition: color 0.3s ease;
}

/* Hover state: Revert to original simple state */
/* .client-card-reversed:hover {
    background-color: #ffffff; 
    color: #25426c; 
    border-color: transparent; 
    border-radius: 10px;
  }
  
  .client-card-reversed:hover img {
    filter: none; 
  }
  
  .client-card-reversed:hover .trust-card-heading-reversed {
    color: #25426c;
  }
  
  .client-card-reversed:hover p {
    color: #25426c; 
  } */





/* Our Services End  */

/* We-Help-You  */
.we-help-you-section {
    background-color: white;
}

.help-you-left {
    display: flex;
    justify-content: center;
    align-items: center;
}

.help-you-heading {
    font-size: 22px;
    font-weight: bold;
    color: #25426c;
    margin-bottom: 10px;
}

p {
    font-size: 16px;
    color: #555;
}

.circle-top {
    width: 70px; /* Adjust size */
    height: 70px; /* Adjust size */
    border-radius: 50%;
    background-color: #25426c;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px; /* Increase font size for numbers */
    font-weight: bold;
}

.we-help-text-div {
    padding-top: 20px;
}

.border-line-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.dotted-line {
    border-left: 2px dotted #25426c;
    width: 2px;
    height: 100%;
}

.full-height {
    flex: 1; /* Makes the line fill the space between circles */
}

/* Responsive Adjustments for Small Screens */
@media (max-width: 992px) {
    .circle-top {
        width: 60px; /* Adjust for smaller screens */
        height: 60px; /* Adjust for smaller screens */
        font-size: 20px; /* Adjust font size for smaller screens */
    }

    .we-help-text-div {
        padding-top: 50px;
    }

    .border-line-container {
        display: none; /* Hide the entire container for smaller screens */
    }

    .dotted-line {
        display: none; /* Remove the dotted line */
    }

    /* .circle-top {
      display: none; 
    } */
}

/* Frequently Asked Questions  */
/* Section Styling */
.questions-section {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    padding: 40px 20px;
    /* border-radius: 12px; */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

/* Accordion Box */
.accordion-box {
    background: #ffffff;
    border: none;
    border-radius: 12px;
    margin-bottom: 20px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .accordion-box:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    }

/* Accordion Header */
/* Accordion Header */
/* Section Heading */
.section-heading {
    font-size: 36px;
    font-weight: bold;
    color: #25426c;
    margin-bottom: 10px;
}

.section-subheading {
    font-size: 18px;
    color: #555;
    margin-bottom: 30px;
}

/* Accordion Updates for List Styling */
.accordion-content ul {
    margin: 10px 0 0;
    padding-left: 20px;
}

    .accordion-content ul li {
        font-size: 16px;
        color: #333;
        line-height: 1.8;
    }

.accordion-header {
    background: linear-gradient(135deg, #25426c, #3a557c);
    color: #ffffff;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    border-radius: 12px 12px 0 0;
    cursor: pointer;
    transition: background 0.3s ease;
}

    .accordion-header:hover {
        background: linear-gradient(135deg, #20395e, #344b6e);
    }

/* Toggle Icon */
.toggle-icon {
    font-size: 24px;
    font-weight: bold;
    transition: transform 0.3s ease, color 0.3s ease;
}

.accordion-box.active .toggle-icon {
    transform: rotate(45deg);
    color: #ffab00;
}

/* Accordion Content */
.accordion-content {
    display: none;
    background: #f9f9f9;
    padding: 15px 20px;
    border-radius: 0 0 12px 12px;
    font-size: 18px;
    color: #333333;
    line-height: 1.6;
    animation: fadeIn 0.3s ease-in-out;
}

/* Keyframes for smooth content reveal */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.accordion-box.active .accordion-content {
    display: block;
}

/* Frequently Asked Questions End */