﻿
.image-column-3 .inner-column .image1 {
    max-width: 96%;
    height: 400px;
    overflow: hidden;
    border-radius: 12px;
    border: 10px solid var(--theme-color-white);
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
}

.header-lower {
    height: 90px;
    position: relative;
}

.btn-style-two {
    padding: 16px 28px;
}
.payroll-img {
    max-width: 96%;
    height: 500px;
    overflow: hidden;
    border-radius: 12px;
    border: 10px solid var(--theme-color-white);
    box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.1019607843);
}
.payroll-img img{
height:100%;
width:100%;
object-fit:cover;
}
    .card-custom {
    height: 100%;
}
    .card-custom h3{
        font-size:24px !important;
        font-weight:700;
        color:#fff;
    }

    .card-custom ul {
        list-style: none; /* remove default bullets */
        padding-left: 0;
        margin-top: 15px;
        margin-bottom: 15px;
    }

        .card-custom ul li {
            position: relative;
            font-size:18px;
            color:#fff;
            padding-left: 20px; /* space for custom dot */
            margin-bottom: 10px;
        }
            .card-custom ul li strong {
                color: #fff;
            }
            .card-custom ul li::before {
                content: "•"; /* dot */
                position: absolute;
                left: 0;
                top: 0;
                color: #ff4200; /* Bootstrap blue */
                font-weight: bold;
            }
.contact-four__form input, .contact-four__form textarea{
    margin-top:5px;
    margin-bottom:10px;
}


.contact-four__form custom-select {
    margin-top: 5px;
    margin-bottom: 10px;
}

.header-style-one.header-5 {
    position: relative;
}
.contact-four__form{
    z-index:9999;
    position:relative;
}
.about-content-2 {
    max-width: 100%;
}
.hero-6 {
    position: relative; /* Needed for the ::before to position correctly */
    padding: 150px 50px 50px !important;
    margin-top:-105px;
    padding-top: 0px;
    background-image: url('../images/landing/banner-1.png');
    background-size: cover;
    background-position: center;
}

    .hero-6::before {
        content: ""; /* Required for pseudo-elements */
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.8); /* Example: semi-transparent overlay */
        z-index: 0; /* Behind content */
    }


    .hero-6 .bg-layer {
        position: relative;
    }

.icon-items-style-2 {
    background: #fff;
    text-align: start;
    padding: 20px;
    border-radius: 24px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    height: 100%;
}

.indistries-wrap {
    margin-top: 50px;
}

    .indistries-wrap h4 {
        font-size: 28px;
        font-weight:700;
        margin-bottom: 40px;
    }
.faq-content-1 .accordion-box .block .acc-content .content .text{
    font-size:18px;
}

.industries-list ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1em; /* spacing between items */
    list-style: none;
    padding: 0;
    margin: 0;
}

    .industries-list ul li {
        /* 4 items per row (responsive) */
        background: #fff;
        padding: 12px 20px !important;
        border-radius: 16px !important;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        font-weight: 500;
        transition: all 0.3s ease;
    }

        .industries-list ul li:hover {
            transform: translateY(-5px);
            box-shadow: 0 6px 15px rgba(0,0,0,0.15);
            background: #f8f9fa;
        }

.challenges-section {
    margin-top: 50px;
}

    .challenges-section h4 {
        font-size: 32px;
        margin-bottom: 1em;
        color: #333;
    }

.challenges-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 1em;
}

    .challenges-list li {
        display: flex;
        align-items: flex-start;
        gap: 0.8em;
        background: #fff;
        padding: 1em;
        border-radius: 10px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.05);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

        .challenges-list li:hover {
            transform: translateY(-4px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        }

    .challenges-list i {
        font-size: 1.5em;
        color: #ff4200; /* red accent */
        flex-shrink: 0;
        margin-top: 2px;
    }

    .challenges-list p {
        margin: 0;
        font-size: 18px;
    }

.note {
    margin-top: 1.5em;
    font-style: italic;
    color: #666;
    text-align: center;
}

.advantage-section {
    background: #000;
    padding: 4em 2em;
    font-family: "Segoe UI", sans-serif;
}

.section-title {
    font-size: 2em;
    text-align: center;
    font-weight: 700;
    margin-bottom: 0.3em;
    color: #222;
}

.section-subtitle {
    text-align: center;
    color: #555;
    margin-bottom: 1.5em;
    font-size: 1.1em;
}

.intro {
    max-width: 850px;
    margin: 0 auto 2.5em;
    text-align: center;
    color: #444;
    line-height: 1.6;
}

.advantage-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(1, 1fr));
    gap: 2em;
}

.adv-card {
    background: #fff;
    padding: 2em;
    border-radius: 15px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.08);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .adv-card:hover {
        transform: translateY(-6px);
        box-shadow: 0 10px 24px rgba(0,0,0,0.12);
    }

    .adv-card i {
        font-size: 2em;
        color: #ff4200;
        margin-bottom: 0.8em;
        display: inline-block;
    }

    .adv-card h4 {
        font-size: 1.2em;
        font-weight: 600;
        margin-bottom: 0.6em;
        color: #222;
    }

    .adv-card p {
        color: #555;
        line-height: 1.6;
        margin-bottom: 1em;
    }

.adv-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .adv-list li {
        position: relative;
        padding-left: 2em; /* space for icon */
        margin-bottom: 0.8em;
        color: #444;
        font-size: 0.95em;
        line-height: 1.6;
    }

        /* Add Font Awesome check-circle before each li */
        .adv-list li::before {
            font-family: "Font Awesome 6 Free"; /* Ensure FA is loaded */
            font-weight: 900; /* Solid style */
            content: "\f058"; /* check-circle icon */
            position: absolute;
            left: 0;
            top: 0.25em;
            font-size: 1.1em;
            color: #ff4200;
        }

.case-studies {
    padding: 4em 2em;
    background: #fafafa;
    text-align: center;
}

.section-title {
    font-size: 2.2em;
    font-weight: 700;
    margin-bottom: 2em;
    color: #2b2b2b;
    position: relative;
}

.case-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 2em;
    justify-content: center;
}

.case-card {
    background: #fff;
    border-radius: 12px;
    padding: 2em;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    text-align: left;
    position: relative;
    transition: transform 0.3s ease;
}

    .case-card:hover {
        transform: translateY(-8px);
    }

.case-badge {
    position: absolute;
    top: -15px;
    left: 20px;
    background: #ff4200;
    color: #fff;
    padding: 0.3em 1em;
    border-radius: 20px;
    font-size: 0.9em;
    font-weight: 600;
}

.case-card h3 {
    font-size:24px;
    margin-bottom: 30px;
    font-weight:700;
    color: #222;
}

.case-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
h2 > span {
    color: #ff4200;
}
.feature-block-one .inner-box .content-box .feature-text{
    font-size:16px;
}
.service-block-three .outer-box .content-box .feature-list li{
    color:unset !important;
}

.case-card li {
    margin-bottom: 1.2em;
    line-height: 1.6;
    padding-left: 2em;
    position: relative;
    font-size: 18px;
    color: #444;
}

    /* Font Awesome Icons */
    .case-card li::before {
        font-family: "Font Awesome 6 Free";
        font-weight: 900;
        position: absolute;
        left: 0;
        top: 0.2em;
        font-size: 1.1em;
    }

.about-section-2 {
    margin-bottom: 50px;
    margin-top: 50px;
}
/* Different icons for each type */
.case-card li.challenge::before {
    content: "\f071"; /* exclamation-triangle */
    color: #ff4200;
}

.case-card li.solution::before {
    content: "\f0ad"; /* cogs */
    color: #ff4200;
}

.case-card li.impact::before {
    content: "\f201"; /* chart-line */
    color: #ff4200;
}

.call-floating {
    position: fixed;
    bottom: 100px; /* distance from bottom */
    right: 20px; /* distance from right */
    background: #ff4200; /* theme color */
    color: #fff;
    font-size: 22px;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    text-decoration: none;
    z-index: 999;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .call-floating:hover {
        transform: scale(1.1);
        box-shadow: 0 6px 16px rgba(0,0,0,0.25);
        color: #fff;
        background: #ff4200; /* theme color */
    }

    .call-floating i {
        font-size: 1.4em;
    }

.icon-items-style-2 .content h3 {
    font-size: 24px;
    line-height:30px;
    font-weight:700;
}

.capcha-field {
    display: flex;
    gap: 1rem;
}

input#ContentPlaceHolder1_ImageButton1 {
    width: 45px;
    height: 45px;
    margin-bottom: 0px;
}

    input#ContentPlaceHolder1_ImageButton1 img {
        padding: 4px;
    }

.hero-6 .banner-content h1 {
    font-size: 48px;
    line-height: 54px;
}
.contact-four__form textarea {
    height: 90px;
    resize: none;
}
.capcha-field input {
    height: 45px;
    padding: 10px;
}

.adventure-head {
    font-size: 32px;
}

img#ContentPlaceHolder1_Image1 {
    object-fit: contain;
}
.feature-block-one .inner-box{
    text-align:center;
    padding:20px 0px;
    border:unset !important;
}
.feature-block-one .inner-box h2 { 
                                      font-size:55px;
                                      font-weight:700;
                                      margin-bottom:20px;
                                  }
    .feature-block-one .inner-box::before {
    display: none;
}
.feature-block-one.active .inner-box h4{
    color:#000;
}
.feature-block-one .inner-box .content-box .feature-title a {
    color: #000;
    font-size: 18px;
}
.feature-block-one.active .inner-box .content-box .feature-title a {
    color: #000;
    font-size: 18px;
}
.feature-block-one.active .inner-box .content-box .feature-text, .feature-block-one:hover .inner-box .content-box .feature-text {
    color: #000;
}
.industry-icon {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex: 0 0 28px;
}

/* Optional: rounded tokens/background for icons */
.icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(0,0,0,0.04);
}

/* Slightly bigger touch target for mobile */
.list-item-text {
    font-size: 18px !important;
}

/* Two-column layout on md+, single column on small screens */
.industries-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}
.tooltip-wrap {
    position: relative;
    display: inline-block;
    cursor: help;
    border-bottom: 1px dotted rgba(0,0,0,0.25);
}

    .tooltip-wrap .tooltip-text {
        visibility: hidden;
        white-space: nowrap;
        background: rgba(0,0,0,0.85);
        color: #fff;
        padding: 6px 8px;
        border-radius: 4px;
        font-size: 13px;
        position: absolute;
        z-index: 9999;
        bottom: calc(100% + 6px);
        left: 50%;
        transform: translateX(-50%);
        opacity: 0;
        transition: opacity .12s ease, visibility .12s ease;
        pointer-events: none;
    }

    .tooltip-wrap:hover .tooltip-text,
    .tooltip-wrap:focus-within .tooltip-text {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }
ul.feature-list {
    padding-left: 0px;
}
.sec-title h2{
    font-weight:700;
}
.card-custom h4{
    font-size:20px;
}
/* Medium screens (tablets) */
@media (max-width: 991px) {
    .feature-block-one .inner-box h2 {
        font-size: 40px;
    }
}

/* Small screens (mobile) */
@media (max-width: 767px) {
    .feature-block-one .inner-box h2 {
        font-size: 30px;
    }
}

/* Extra small screens (very small phones) */
@media (max-width: 480px) {
    .feature-block-one .inner-box h2 {
        font-size: 24px;
    }
}
@media (min-width: 768px) {
    .industries-grid {
        grid-template-columns: 1fr 1fr;
    }
}




/* ===============================
   Base (Desktop-First)
   =============================== */
/* Your existing code stays as it is */
/* ===============================
   Responsive Adjustments
   =============================== */
/* Tablets & Small Laptops (≤1024px) */
@media (max-width: 1024px) {
    .image-column-3 .inner-column .image1 {
        height: 320px; /* reduce fixed height */
        max-width: 100%;
    }

    .btn-style-two {
        padding: 14px 24px;
        padding-right: 60px;
        font-size: 0.95em;
    }

    .challenges-list p {
        margin: 0;
        font-size: 16px;
    }

    .indistries-wrap h4,
    .challenges-section h4 {
        font-size: 26px;
    }

    .industries-list ul {
        gap: 0.8em;
    }

    .advantage-section {
        padding: 3em 1.5em;
    }

    .advantage-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .case-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .case-card {
        padding: 1.5em;
    }
}

/* Mobile (≤768px) */
@media (max-width: 768px) {
    .image-column-3 .inner-column .image1 {
        height: auto; /* allow natural image height */
    }
    .card-custom h3{
        font-size:20px;
    }
    .card-custom h4 {
        font-size: 18px;
    }
    .btn-style-two {
        font-size: 0.9em;
        padding: 15px 16px !important;
        width: 48% !important;
        text-align: start !important;
    }
    .faq-content-1 .accordion-box{
        padding-left:0px;
    }
    ul.feature-list {
        padding-left: 0px;
    }
    .hero-6 {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .service-block-three .outer-box .arrow-shape-2 {
        display: none;
    }

    container-fluid.pt-0 {
        padding-bottom: 0px !important;
    }

    .contact-four__form {
        padding: 20px 10px !important;
    }

    .image-column-3 {
        margin-top: 30px;
    }

    .faq-content-1 {
        padding-left: 0px;
    }

    .case-card {
        padding: 40px 10px !important;
    }

    .case-studies {
        padding: 2em 0em;
        background: #fafafa;
        text-align: center;
    }

    .hero-6 .banner-content h1 {
        font-size: 32px !important;
        line-height: 40px !important;
    }

    .btn-style-two {
        display: block;
        width: 100%;
        text-align: center;
        padding: 12px 20px;
        padding-right: 20px;
    }

    .service-block-three .outer-box {
        padding: 20px !important;
    }

    .indistries-wrap h4,
    .challenges-section h4 {
        font-size: 22px;
        text-align: center;
    }

    .industries-list ul {
        flex-direction: column;
        gap: 0.6em;
    }

        .industries-list ul li {
            text-align: center;
            padding: 10px 16px;
        }

    .challenges-list li {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
    }

    .advantage-section {
        padding: 2.5em 0em;
    }

    .icon-items-style-2 .content h3 {
        font-size: 20px;
    }

    .adv-card {
        padding: 1.5em;
    }

    .section-title {
        font-size: 1.6em;
    }

    .section-subtitle {
        font-size: 1em;
    }

    .intro {
        font-size: 0.95em;
        padding: 0 0.5em;
    }

    .case-card h3 {
        font-size: 1.1em;
    }

    .case-card ul li {
        font-size: 0.9em;
    }
}

/* Very Small Devices (≤480px) */
@media (max-width: 480px) {
    .btn-style-two {
        font-size: 0.9em;
        padding: 10px 16px;
    }

    .adv-card h4 {
        font-size: 1.05em;
    }

    .adv-card p {
        font-size: 0.9em;
    }

    .case-card {
        padding: 1em;
    }

        .case-card h3 {
            font-size: 1em;
        }
}
.banner-content .custom-list {
    list-style: none;
    padding: 0;
    margin: 20px 0 0 0;
}

    .banner-content .custom-list li {
        position: relative;
        padding-left: 28px;
        margin-bottom: 15px;
        color:#fff;
        font-size: 18px;
        line-height: 1.6;
    }

        .banner-content .custom-list li::before {
            content: "●"; /* Circle bullet */
            position: absolute;
            left: 0;
            top: 2px;
            color: #d32f2f; /* Brand red */
            font-size: 14px;
        }
.expertise-card {
    background-color: #1a1a1a;
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.2);
    transition: transform 0.3s, box-shadow 0.3s;
    height: 100%;
}

    .expertise-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 30px rgba(0,0,0,0.35);
    }

.expertise-card-body {
    padding: 25px;
    text-align: left;
}

.expertise-card-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #f8f9fa;
}

.expertise-card-text {
    font-size: 18px;
    color: #d1d1d1;
    line-height: 1.6;
}

.icon-wrapper {
    font-size: 2rem;
    color: #e63946; /* icon color */
}

.custom-card {
    background-color: #1a1a1a; /* Dark card background */
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0,0,0,0.2);
    transition: transform 0.3s, box-shadow 0.3s;
    height: 100%;
}

    .custom-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 30px rgba(0,0,0,0.35);
    }

.custom-card-body {
    padding: 25px;
}

.custom-card-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #f8f9fa; /* White text for dark background */
}

.custom-card-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

    .custom-card-list li {
        position: relative;
        padding-left: 20px;
        margin-bottom: 10px;
        font-size: 18px;
        color: #d1d1d1;
    }

        .custom-card-list li::before {
            content: '•';
            position: absolute;
            left: 0;
            color: #e63946; /* Bullet color */
            font-size: 1.2rem;
            line-height: 1;
        }
/* Icon size + spacing */
.industry-icon {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex: 0 0 28px;
}

/* Optional: rounded tokens/background for icons */
.icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(0,0,0,0.04);
}

/* Slightly bigger touch target for mobile */
.list-item-text {
    font-size: 0.96rem;
}

/* Two-column layout on md+, single column on small screens */
.industries-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
}

@media (min-width: 768px) {
    .industries-grid {
        grid-template-columns: 1fr 1fr;
    }
}