body{

font-family:'Inter',sans-serif;

background:#f8fafc;

color:#222;

}

.hero{

padding:120px 0;

background:linear-gradient(135deg,#111827,#1f2937);

color:white;

}

.hero h1{

font-size:58px;

font-weight:800;

margin-bottom:25px;

}

.hero p{

font-size:22px;

opacity:.9;

margin-bottom:35px;

}

.btn-primary{

padding:15px 35px;

border-radius:50px;

}

.navbar-brand{

font-size:28px;

}

section{

padding:80px 0;

}

.card{

border:none;

border-radius:15px;

transition:.3s;

}

.card:hover{

transform:translateY(-8px);

}

footer{

font-size:15px;

}

/* ==========================
WHY US
========================== */

#why-us{

    padding:100px 0;

}

#why-us .card{

    border-radius:18px;
    transition:0.35s;
    overflow:hidden;

}

#why-us .card:hover{

    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.12)!important;

}

#why-us i{

    color:#2563eb;

}

#why-us h2{

    font-weight:800;

}

#why-us .lead{

    font-size:1.2rem;

}

/*=====================================
HOME SERVICES
======================================*/

#services-home{

    padding:100px 0;

}

.service-card{

    border-radius:18px;
    transition:.35s;

}

.service-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.12)!important;

}

.service-icon{

    width:70px;
    height:70px;
    background:#2563eb;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;

}

.service-card h3{

    font-weight:700;
    margin-bottom:15px;

}

.service-card ul li{

    margin-bottom:8px;
    color:#555;

}

.service-card .btn{

    margin-top:20px;

}

/*=====================================
PROCESS
======================================*/

#process{

    padding:100px 0;

}

.process-card{

    background:#fff;
    border-radius:18px;
    padding:35px 25px;
    height:100%;
    transition:.35s;
    box-shadow:0 5px 15px rgba(0,0,0,.06);

}

.process-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.process-number{

    width:45px;
    height:45px;
    margin:0 auto 20px;
    background:#2563eb;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;

}

.process-icon{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
}

.process-card h4{

    margin-bottom:15px;
    font-weight:700;

}

/*=====================================
INDUSTRIES
======================================*/

#industries{

    padding:100px 0;

}

.industry-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.industry-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.industry-card i{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
    display:block;

}

.industry-card h4{

    font-weight:700;
    margin-bottom:20px;

}

.industry-card ul{

    padding-left:18px;
    color:#555;
    margin-bottom:0;

}

.industry-card ul li{

    margin-bottom:8px;

}

/*=====================================
FEATURED SOLUTIONS
======================================*/

#solutions {
    padding: 100px 0;
}

.solution-card {
    background: #fff;
    border-radius: 18px;
    padding: 30px;
    height: 100%;
    transition: all .35s ease;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.solution-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(0,0,0,.12);
}

.solution-icon {
    width: 70px;
    height: 70px;
    background: #2563eb;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    margin-bottom: 20px;
}

.solution-card h4 {
    font-weight: 700;
    margin-bottom: 15px;
}

.solution-card p {
    margin-bottom: 20px;
}

.solution-card ul {
    padding-left: 20px;
    color: #555;
    margin-bottom: 0;
}

.solution-card ul li {
    margin-bottom: 8px;
}

/*=====================================
WHY BUSINESSES TRUST IQNINJA
======================================*/

#testimonials{

    padding:100px 0;

}

.trust-card{

    background:#fff;
    border-radius:18px;
    padding:35px 30px;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.trust-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.trust-card i{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
    display:block;

}

.trust-card h4{

    font-weight:700;
    margin-bottom:15px;

}

.trust-card p{

    color:#555;
    margin-bottom:0;

}

/*=====================================
SERVICES PAGE HEADER
======================================*/

#page-header{

    padding:120px 0 80px;
    background:linear-gradient(135deg,#f8fbff,#eef5ff);

}

.min-vh-75{

    min-height:75vh;

}

#page-header h1{

    font-weight:800;
    line-height:1.2;

}

#page-header .lead{

    font-size:1.25rem;

}

.breadcrumb{

    background:none;
    padding:0;

}

.breadcrumb a{

    text-decoration:none;

}

.hero-image{

    max-width:100%;
    animation:floatHero 5s ease-in-out infinite;

}

@keyframes floatHero{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0px);

    }

}

.trust-mini{

    display:flex;
    align-items:center;
    gap:10px;
    background:#fff;
    border-radius:12px;
    padding:12px 15px;
    box-shadow:0 5px 15px rgba(0,0,0,.06);

}

.trust-mini i{

    color:#2563eb;
    font-size:22px;

}

.trust-mini span{

    font-size:.95rem;
    font-weight:600;

}

@media(max-width:991px){

    #page-header{

        padding:80px 0 60px;

        text-align:center;

    }

    .breadcrumb{

        justify-content:center;

    }

    .trust-mini{

        justify-content:center;

    }

}

/*=====================================
SERVICES OVERVIEW
======================================*/

#services-overview{

    padding:100px 0;

}

.overview-card{

    background:#fff;
    border-radius:18px;
    padding:35px 30px;
    height:100%;
    text-align:center;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.overview-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.overview-icon{

    width:75px;
    height:75px;
    background:#2563eb;
    color:#fff;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    margin:0 auto 25px;

}

.overview-card h4{

    font-weight:700;
    margin-bottom:15px;

}

.overview-card p{

    color:#666;
    margin-bottom:20px;

}

.overview-card .btn-link{

    font-weight:600;
    text-decoration:none;

}

.overview-card .btn-link:hover{

    text-decoration:underline;

}

/*=====================================
AI INTEGRATION
======================================*/

#ai-integration{

    padding:100px 0;

}

.feature-item{

    display:flex;
    align-items:center;
    gap:10px;
    background:#fff;
    border-radius:12px;
    padding:12px 18px;
    box-shadow:0 4px 12px rgba(0,0,0,.05);

}

.feature-item i{

    color:#2563eb;
    font-size:18px;

}

.integration-box{

    background:#fff;
    border-radius:20px;
    padding:35px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.integration-project{

    display:flex;
    gap:20px;
    margin-bottom:30px;

}

.integration-project:last-child{

    margin-bottom:0;

}

.integration-project i{

    font-size:32px;
    color:#2563eb;
    min-width:40px;

}

.integration-project h5{

    font-weight:700;
    margin-bottom:8px;

}

.integration-project p{

    color:#666;
    margin-bottom:0;

}

/*=====================================
AI CHATBOTS
======================================*/

#ai-chatbots{

    padding:100px 0;

}

.chatbot-image{

    max-width:100%;
    animation:floatHero 5s ease-in-out infinite;

}

.chatbot-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    text-align:center;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.chatbot-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.chatbot-card i{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
    display:block;

}

.chatbot-card h5{

    font-weight:700;
    margin-bottom:15px;

}

.chatbot-card p{

    color:#666;
    margin-bottom:0;

}

/*=====================================
WORKFLOW AUTOMATION
======================================*/

#workflow-automation{

    padding:100px 0;

}

.workflow-image{

    max-width:100%;
    animation:floatHero 5s ease-in-out infinite;

}

.automation-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    text-align:center;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.automation-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.automation-card i{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
    display:block;

}

.automation-card h5{

    font-weight:700;
    margin-bottom:15px;

}

.automation-card p{

    color:#666;
    margin-bottom:0;

}

/*=====================================
DOCUMENT INTELLIGENCE
======================================*/

#document-intelligence{

    padding:100px 0;

}

.document-image{

    max-width:100%;
    animation:floatHero 5s ease-in-out infinite;

}

.document-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    text-align:center;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.document-card:hover{

    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.document-card i{

    font-size:42px;
    color:#2563eb;
    margin-bottom:20px;
    display:block;

}

.document-card h5{

    font-weight:700;
    margin-bottom:15px;

}

.document-card p{

    color:#666;
    margin-bottom:0;

}

/*=====================================
ENTERPRISE AI
======================================*/

#enterprise-ai{

    padding:100px 0;

}

.enterprise-image{

    max-width:100%;
    animation:floatHero 5s ease-in-out infinite;

}

.enterprise-card{

    background:#fff;
    border-radius:18px;
    padding:30px;
    text-align:center;
    height:100%;
    transition:.35s;
    box-shadow:0 6px 18px rgba(0,0,0,.06);

}

.enterprise-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.enterprise-card i{

    font-size:42px;

    color:#2563eb;

    display:block;

    margin-bottom:20px;

}

.enterprise-card h5{

    font-weight:700;

    margin-bottom:15px;

}

.enterprise-card p{

    color:#666;

    margin-bottom:0;

}

/*=====================================
TECHNOLOGY STACK
======================================*/

#technology-stack{

    padding:100px 0;

}

.tech-category{

    border-bottom:1px solid #ececec;

    padding-bottom:30px;

}

.tech-category:last-child{

    border-bottom:none;

}

.tech-badge{

    background:#f4f7fb;

    color:#2563eb;

    border:1px solid #dbe7ff;

    padding:12px 20px;

    border-radius:50px;

    font-weight:600;

    transition:.3s;

}

.tech-badge:hover{

    background:#2563eb;

    color:#fff;

    cursor:default;

    transform:translateY(-3px);

}

/*=====================================
PRICING PREVIEW
======================================*/

#pricing-preview{

    padding:100px 0;

}

.pricing-card{

    background:#fff;
    border-radius:20px;
    padding:35px 30px;
    height:100%;
    text-align:center;
    box-shadow:0 8px 25px rgba(0,0,0,.06);
    transition:.35s;
    position:relative;

}

.pricing-card:hover{

    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.pricing-icon{

    width:80px;
    height:80px;
    margin:0 auto 25px;
    border-radius:50%;
    background:#2563eb;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;

}

.pricing-card ul{

    margin-top:20px;
    text-align:left;

}

.pricing-card ul li{

    padding:6px 0;

}

.featured{

    border:3px solid #2563eb;

}

.pricing-badge{

    position:absolute;
    top:-12px;
    left:50%;
    transform:translateX(-50%);
    background:#2563eb;
    color:#fff;
    padding:6px 18px;
    border-radius:25px;
    font-size:.85rem;
    font-weight:600;

}

/*=====================================
FAQ
======================================*/

#faq{

    padding:100px 0;

}

.accordion-item{

    border:none;
    margin-bottom:15px;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 4px 15px rgba(0,0,0,.05);

}

.accordion-button{

    font-weight:600;
    padding:20px 25px;

}

.accordion-button:not(.collapsed){

    background:#2563eb;
    color:#fff;

}

.accordion-button:focus{

    box-shadow:none;

}

.accordion-body{

    padding:25px;
    color:#666;
    line-height:1.8;

}
/*=====================================================
CONTACT CTA
=====================================================*/

#contact-cta{

    padding:100px 0;

    background:linear-gradient(135deg,#0f172a 0%,#1e40af 60%,#2563eb 100%);

}

/* Main Card */

#contact-cta .cta-wrapper{

    background:transparent;

    padding:60px;

}

/* Left Side */

#contact-cta .badge{

    background:#ffffff !important;

    color:#2563eb !important;

    font-weight:700;

    letter-spacing:.5px;

}

#contact-cta h2{

    color:#ffffff !important;

    font-size:2.8rem;

    font-weight:800;

    line-height:1.2;

    margin-bottom:25px;

}

#contact-cta p{

    color:#f1f5f9 !important;

    font-size:1.1rem;

    line-height:1.8;

}

#contact-cta .lead{

    color:#f1f5f9 !important;

}

/* Feature List */

#contact-cta .cta-feature{

    display:flex;

    align-items:center;

    gap:12px;

    color:#ffffff;

    font-weight:600;

    margin-bottom:15px;

}

#contact-cta .cta-feature i{

    color:#22c55e;

    font-size:20px;

}

/* Buttons */

#contact-cta .btn-light{

    font-weight:600;

    padding:14px 28px;

}

#contact-cta .btn-outline-light{

    border:2px solid #ffffff;

    color:#ffffff;

    font-weight:600;

    padding:14px 28px;

}

#contact-cta .btn-outline-light:hover{

    background:#ffffff;

    color:#2563eb;

}

/* Right Box */

#contact-cta .consultation-box{

    background:#ffffff;

    border-radius:18px;

    padding:40px;

    box-shadow:0 20px 50px rgba(0,0,0,.20);

}

#contact-cta .consultation-icon{

    width:90px;

    height:90px;

    margin:0 auto 25px;

    border-radius:50%;

    background:#2563eb;

    color:#ffffff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:38px;

}

#contact-cta .consultation-box h3{

    color:#1e293b;

    text-align:center;

    font-weight:700;

    margin-bottom:25px;

}

#contact-cta .consultation-box ul{

    padding-left:0;

}

#contact-cta .consultation-box li{

    list-style:none;

    margin-bottom:15px;

    color:#475569;

    font-size:1rem;

}

#contact-cta .consultation-box li i{

    color:#2563eb;

    margin-right:10px;

}

/* Mobile */

@media (max-width:991px){

    #contact-cta{

        text-align:center;

    }

    #contact-cta .cta-wrapper{

        padding:35px 25px;

    }

    #contact-cta h2{

        font-size:2rem;

    }

}