/* MOBILE DEVICES (max-width: 480px)  */

@media (max-width: 480px) {

    /* header css */
    .header {
        width: 100%;
        height: 60px;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1000;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        gap: 3px;
        align-items: center;
        background-color: white;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    }

    .hamburger {
        width: 10%;
        height: 100%;
        padding: 20px;
        display: block;
        font-size: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .logo {
        width: 30%;
        height: 100%;
    }

    .logo a {
        width: 100%;
        height: 100%;
        display: block;
    }

    .logo a img {
        height: 100%;
        width: 100%;
        object-fit: contain;
        display: block;
    }

    .header-text {
        display: none;
        width: 350px;
        height: 100%;
        /* display: flex;
        justify-content: flex-start;
        align-items: center; */
    }

    .header-text h1 {
        color: #162d42;
        font-size: 9px;
        font-weight: bold;
        letter-spacing: 1px;
        color: #162d42;
    }

    .AndersenConsultingMember {
        width: 60%;
        height: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }

    .AndersenConsultingMember a {
        width: 100%;
        height: 100%;
        display: block;
    }

    .AndersenConsultingMember a img {
        padding-right: 8px;
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
    }



    /* navigation menu css*/
    .nav-menu {
        padding: 20px;
        width: 100%;
        height: 100%;
        z-index: 999;
        position: fixed;
        top: 60px;
        left: 0;
        background-color: #162d42;
        display: flex;
        flex-direction: column;
        list-style: none;
        justify-content: flex-start;
        align-items: flex-start;
        box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.25);
        transition: transform 0.3s ease;
        transform: translateY(-100%);
    }

    .nav-menu.active {
        transform: translateY(0);
    }


    .nav-menu-item {
        width: 100%;
        height: 40px;
        display: flex;
        justify-content: flex-start;
        align-items: stretch;
    }


    .nav-menu-item a {
        width: 100%;
        height: 100%;
        text-decoration: none;
        display: flex;
        align-items: center;
        color: white;
        font-size: 15px;
        letter-spacing: 1.2px;
        transition: all 0.3s ease;
    }

    .nav-menu-item a:hover {
        background-color: #C28B28;
        color: #162d42;
    }



    /* parent dropdown css */
    .nav-menu-item .parent-dropdown {
        padding: 20px;
        width: 100%;
        height: 100%;
        list-style: none;
        position: fixed;
        top: 0;
        left: 0;
        background-color: #162d42;
        margin: 0;
        display: none;
        z-index: 2000;
    }

    #digt-dropdown {
        left: 2%;
    }

    .parent-dropdown .parent-dropdown-item {
        padding-top: 10px;
        width: 100%;
        position: relative;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }

    .parent-dropdown .parent-dropdown-item a {
        font-size: 14px;
        height: 100%;
        width: 100%;
        font-weight: normal;
        display: flex;
        justify-content: flex-start;
        align-items: center;
    }


    .arrow-icon {
        height: auto;
        margin-left: auto;
        vertical-align: middle;
        cursor: pointer;
        transform: rotate(360deg);
        transition: all 0.8 ease;
    }

    .parent-dropdown.active {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

    .back-btn {
        color: #C28B28;
        font-weight: bold;
        cursor: pointer;
    }

    /* main content css */

    /* text_with_image section common css */

    .text-image-section {
        width: 100%;
        height: auto;
        justify-content: flex-start;
        align-items: center;
        flex-direction: column !important;
        margin: 15px 0;
        padding: 10px 10px;
    }

    .text-image-section-reverse {
        flex-direction: column-reverse !important;
    }

    .text-image-section .text {
        margin-top: 15px;
        text-align: justify;
        padding: 0;
        height: 60%;
        width: 100%;
    }

    .text-image-section .text h3 {
        text-align: left;
        margin-bottom: 10px;
        font-size: 20px !important;
    }

    .text-image-section .text h4 {
        text-align: left;
        margin-bottom: 10px;
        font-size: 18px !important;
    }

    .text-image-section .text p {
        font-size: 16px !important;
        line-height: 1.4;
    }

    .text-image-section .image {
        height: 35%;
        width: 100%;
        object-fit: contain;
        box-shadow: none;
    }

    .text-image-section .image img {
        height: 100%;
        width: 100%;
        box-shadow: none;
    }




    /* mission-vision css */

    .mission-vision .text {
        text-align: justify;
        height: 270px;
        padding: 20px;
    }

    .mission-vision .text h3 {
        text-align: center;
        margin-bottom: 5px;
        font-size: 20px;
    }

    .mission-vision .text p {
        font-size: 18px;
        line-height: 1.5;
    }

    /* services css */

    .service-card {
        width: 100%;
    }

    .service-card div {
        padding: 10px;
    }

    /* industries css */

    .Worked {
        padding: 20px 15px;
        background-color: #f8f9fa;
        text-align: center;
    }

    .Worked h3 {
        font-size: 1.5rem;
        letter-spacing: 1.5px;
        margin-bottom: 20px;
    }

    .industries {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        column-gap: 8px;
        justify-items: center;
        align-items: center;
    }

    .industry {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background-color: #ffffff;
        border-radius: 12px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
        padding: 5px 4px;
        height: 100px;
        min-width: 95px;
        flex: 1 1 auto;
        text-align: center;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .industry:hover {
        transform: translateY(-6px);
        box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
    }

    .industry img {
        width: 30px;
        height: 30px;
        object-fit: contain;
        margin-bottom: 5px;
    }

    .industry p {
        font-size: .7rem;
        font-weight: 600;
        color: black;
        line-height: 1.2;
    }

    .industry a {
        text-decoration: none;
    }


    /* companies css */

    .companies {
        padding: 10px 15px;
        margin-bottom: 10px;
    }

    .companies h3 {
        font-size: 1.5rem;
        color: #162d42;
        margin-bottom: 20px;
    }

    .company-logos {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: .5rem;
    }

    .company-logos .logo {
        flex: 0 0 30%;
        height: 60px;
        background-color: white;
        border-radius: 10px;
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
        padding: 8px;
    }

    /* text with bg images section css */

    .text-bg-section {
        padding: 40px 20px;
    }

    .text-bg-section h3 {
        font-size: 1.6rem;
        letter-spacing: 1px;
        margin-bottom: 25px;
        text-shadow: none;
    }

    .text-bg-section p {
        text-align: justify;
        font-size: 0.95rem;
        line-height: 1.6;
        margin-bottom: 15px;
        padding: 0 5px;
        text-shadow: none;
    }


    /* services css */

    .services-split {
        padding: 10px 10px;
        display: flex;
        flex-direction: column;
    }

    .service-row {
        width: 100%;
        height: auto;
    }

    .know-more {
        margin-top: 5px;
        display: inline-block;
        padding: 5px 20px;
        font-weight: 500;
    }

    /* sap css */

    .sap-hana .container {
        width: 100%;
        height: auto;
        gap: 5px;
    }

    .We_Do .container {
        margin: 0;
        height: auto;
        gap: 10px;
    }

    .We_Do .text {
        margin: 0;
    }

    .sap-cloud {
        flex-wrap: wrap;
    }


    /* ukg css */

    .heading-u {
        height: auto;
        margin: 0;
        gap: 5px;
    }

    .heading .content {
        margin: 0;
    }

    .heading h4 {
        color: #0a192f;
        font-size: 1.1rem;
        margin-bottom: 5px;
    }

    .ukg-pro-wfm {
        margin: 20px 0;
        padding: 0;
    }

    .ukg-pro-wfm .container {
        height: auto;
        gap: 5px;
    }

    .ukg-pro-wfm .content {
        margin: 0;
    }

    .ukg-pro-wfm .content h3 {
        margin: 0;
    }

    .product-services {
        padding: 10px 3%;
        gap: 20px;
    }

    .product-services .services {
        gap: 20px;
        height: auto;
    }

    .product-services .service {
        width: 100%;
        height: auto;
        gap: 10px;
        margin: 0;
    }

    .product-services .service .text {
        margin: 0;
    }

    .product-services h3 {
        font-size: 1.5rem;
        margin-bottom: 5px;
    }

    .qoute p {
        font-size: 1.2rem;
    }

    /* product-suite css */

    .heading {
        height: auto;
    }

    .heading h2 {
        font-size: 2rem;
        letter-spacing: 1px;
        padding: 0;
    }

    .intro {
        width: 100%;
        height: 70px;
    }

    .intro .red {
        padding: 15px;
    }

    .intro .blue {
        padding: 15px;
    }


    .intro p {
        font-size: 18px;
        line-height: 1.5rem;
    }


    .media {
        width: 100%;
        height: auto;
        padding: 20px 0;
    }

    .media .container {
        width: 100%;
        height: auto;
        gap: 10px;
        margin: 0;
    }

    .media .text {
        margin: 0;
    }

    .features {
        margin: 5px 0;
        padding: 5px 0;
    }

    .features h3 {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    .features .container {
        flex-wrap: wrap;
        padding: 0 20px;
        gap: 30px;
    }

    .features .view-btn {
        margin: 15px 0;
        padding: 8px 10px;
        font-size: 0.9rem;
    }


    .modal-content {
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 95%;
        max-height: 95vh;
        border-radius: 6px;
    }

    .close {
        top: 10px;
        right: 10px;
        font-size: 1.6rem;
    }

    .video-container iframe {
        width: 100vw;
        height: 56.25vw;
        /* 16:9 ratio */
        border-radius: 8px;
    }


    .video-section {
        margin: 20px 10px;
        padding: 20px;
        flex-direction: column;
        gap: 1rem;
        box-shadow: none;
        overflow: visible;
    }

    .video-container {
        flex: 1 1 100%;
        width: 100%;
        aspect-ratio: 16 / 9;
        overflow: visible;
    }

    .video-text {
        text-align: justify;
        flex: 1 1 100%;
        text-align: center;
        padding: 10px;
    }

    .video-text h3 {
        font-size: 1.4rem;
    }

    .video-text p {
        font-size: 0.95rem;
        line-height: 1.5;
    }

    .video-text button {
        padding: 8px 16px;
        font-size: 0.9rem;
    }


    .ConKraft {
        margin-top: 20px;
        box-shadow: none;
    }

    .ConKraft .container {
        margin-bottom: 30px;
        height: auto;
        gap: 0;
    }



    /* Digital transformation css */

    .banner {
        padding: 40px 5px;
    }

    .banner h3 {
        font-size: 1.8rem;
    }

    .cloud-computing {
        background: white;
        padding: 25px 5%;
    }

    .cloud-computing h3 {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }

    .cloud-computing .container {
        gap: 30px;
    }

    .cloud-computing .content h4 {
        text-align: center;
        font-size: 1.2rem;
        color: black;
        margin-bottom: 10px;
    }

    .cloud-computing .content p {
        text-align: justify;
        font-size: 1rem;
        line-height: 1.8;
    }

    .digital-transformation {
        background: #eaf5ff;
        padding: 40px 4%;
    }

    .digital-transformation h3 {
        font-size: 1.8rem;
        margin-bottom: 30px;
    }

    .digital-transformation .container {
        gap: 30px;
    }

    .digital-transformation .content h4 {
        font-size: 1.2rem;
        color: black;
        margin-bottom: 10px;
    }

    .digital-transformation .content p {
        text-align: justify;
        font-size: 1rem;
        color: black;
        line-height: 1.8;
    }


    /* Management consulting css */
    .banner-m {
        padding: 15px 5px;
    }

    .banner .text {
        margin-top: 5px;
        padding: 0 20px;
    }

    .banner-m p {
        text-align: justify;
        margin-top: 15px;
        font-size: 1.1rem;
        line-height: 1.7;
        padding: 0 10px;
    }

    .strategic-advisory {
        margin: 20px 0;
        padding: 40px 10px;
    }

    .strategic-advisory h3 {
        font-size: 1.5rem;
        margin-bottom: 1.5rem;
    }

    .strategic-advisory .container {
        gap: 1.5rem;
    }

    .strategic-advisory .text h4 {
        margin-bottom: 8px;
        font-size: 1rem;
    }

    .strategic-advisory .text p {
        font-size: 0.9rem;
    }

    .operation-advisory {
        padding: 20px 10px;
    }

    .operation-advisory h3 {
        font-size: 1.5rem;
        margin-bottom: 1.5rem;
    }

    .operation-advisory .container {
        gap: 1.5rem;
    }

    .operation-advisory .text {
        flex: 1 1 200px;
        padding: 20px 25px;
    }

    .CIO-advisory {
        padding: 40px 10px;
    }

    .CIO-advisory h3 {
        font-size: 1.5rem;
        margin-bottom: 1.5rem;
    }

    .CIO-advisory .container {
        gap: 1.5rem;
    }

    .CIO-advisory .text {
        flex: 1 1 200px;
        background: white;
        padding: 30px 25px;
    }

    .innovation {
        padding: 20px 10px;
    }

    .innovation h3 {
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }

    .innovation .container {
        flex-direction: column-reverse;
        gap: 0;
    }

    .innovation .text {
        flex: 1 1 50%;
        background: #fff;
        padding: 10px 10px;
    }

    .innovation .text h4 {
        margin-bottom: 10px;
        font-size: 1.3rem;
    }

    .innovation .img {
        flex: 1 1 50%;
    }

    /* industries css */

    .banner-content h1 {
        font-size: 2rem;
    }

    .industrial-solutions {
        padding: 40px 20px;
    }

    .industrial-solutions h3 {
        font-size: 1.8rem;
        margin-bottom: 25px;
    }

    .solutions {
        gap: 20px;
        flex-wrap: wrap;
    }

    .sol {
        width: 100%;
        flex: 1 1 auto;
    }

    /* about-us css */

    .intro-a {
        margin: 0;
        padding: 0 10px;
        margin-bottom: 20px;
        height: auto;
        gap: 0;
    }

    .intro .content h3 {
        margin: 5px 0;
    }

    .intro .content p {
        padding: 0;
    }

    .purpose {
        gap: 5px;
        margin-bottom: 30px;
        padding: 20px;
    }

    .people {
        border-radius: 0;
        padding: 20px;
        gap: 5px;
    }

    .people .content {
        margin: 0;
    }


    .people .content h3 {
        margin-bottom: 10px;
    }

    /* leadership css */

    .leader,
    .leader.reverse {
        height: auto;
        flex-direction: column;
        text-align: center;
    }

    .leader .text {
        padding: 0;
    }


    .leadership {
        padding: 15px;
    }

    .leadership h2 {
        font-size: 1.4rem;
        margin-bottom: 15px;
    }

    .leaders {
        gap: 20px;
    }

    .leader h3 {
        margin-top: 8px;
        flex-direction: column;
        gap: 0;
    }

    .leader h3 a {
        font-size: 1.3rem;
    }

    .position {
        margin: 5px 0 12px;
    }

    .desc {
        padding: 10px;
        font-size: 0.9rem;
        line-height: 1.4;
    }

    .leader .img {
        width: 100%;
        height: auto;
        padding: 10px 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .leader img {
        width: 150px;
        height: 150px;
    }

    /* career css */

    .careers-hero {
        height: 200px;
        padding: 50px 10px;
    }

    .careers-hero h1 {
        font-size: 1.8rem;
    }

    .careers-hero p {
        text-align: right;
        font-size: 1.2rem;
        margin-top: 10px;
    }


    .careers-section {
        padding: 40px 15px;
    }

    .careers-left {
        padding: 20px 15px;
    }

    .careers-left h2 {
        font-size: 1.5rem;
    }

    .career-intro {
        font-size: 0.9rem;
    }

    .career-list li a {
        font-size: 0.9rem;
        padding: 10px 12px;
    }


    /* contact css */

    .contact-section {
        padding: 30px 15px;
    }

    .contact-info {
        padding: 20px;
    }

    .contact-info h2 {
        font-size: 1.4rem;
        text-align: center;
    }

    .contact-info h2::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .contact-info p {
        text-align: center;
        font-size: 0.9rem;
    }

    .info-block {
        text-align: center;
    }

    .contact-info iframe {
        height: 250px;
    }

    /* media css */

    .media-banner {
        flex-direction: column;
        justify-content: center;
        background-position: center;
        z-index: 0;
    }

    .media-banner::before {
        background: rgba(0, 0, 0, 0.89);
        z-index: 1;
    }

    .media-banner::after {
        background-color: rgba(0, 0, 0, 0.968);
    }

    .media-overlay {
        width: 100%;
        padding: 20px;
        background-color: rgba(255, 255, 255, 0.753);
        backdrop-filter: none;
        box-shadow: none;
        z-index: 4;
    }

    .media-text {
        max-width: 100%;
    }

    .media-text h2 {
        text-align: center;
        font-size: 20px;
        margin-bottom: 12px;
        color: #162d42;
    }

    .media-text p {
        font-size: 14px;
        line-height: 1.6;
        color: #111111;
    }

    .media-text p::before {
        font-size: 10px;
        margin-right: 6px;
    }


    .media-section {
        margin: 0;
        padding: 1rem 0.5rem;
    }

    .media-section h2 {
        font-size: 1.5rem;
        margin-bottom: 0.8rem;
        letter-spacing: 0.5px;
    }

    .scroll-horizontal {
        gap: 1rem;
        padding: 0;
    }

    .media-card {
        height: auto;
        padding: 12px;
    }

    .media-card img {
        height: 120px;
    }

    .media-card p {
        font-size: 13px;
        line-height: 1.4;
    }

    .media-card p strong {
        font-size: 13.5px;
    }

    .container-a>div {
        width: 95%;
        padding: 25px 15px;
    }

    .container-a img {
        max-height: 200px;
    }



    /* footer css */
    .footer {
        border-top: .1px solid black;
        background: white;
        grid-template-columns: 1fr;
        padding: 30px 20px;
        text-align: center;
        gap: 25px;
    }

    .footer h2 {
        color: gb(2, 19, 74);
        font-size: 1.1rem;
        margin-bottom: 10px;
    }

    .footer h2:hover {
        color: #fff;
        text-shadow: 0 0 8px rgba(255, 255, 255, 0.6);
    }

    .footer p {
        color: black;
        font-size: 0.9rem;
        margin-bottom: 10px;
    }

    .footer-bottom {
        display: flex;
        flex-direction: column;
        gap: 5px;
        padding-top: 8px;
        font-size: 0.85rem;
        border-top: .1px solid black;
    }

    .footer-links a {
        text-decoration: none;
        color: black;
        margin: 3px 5px;
        font-size: 0.9rem;
    }

    .social-icons {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 5px;
    }

    .social-icons a {
        color: black;
        font-size: 1.1rem;
        width: 30px;
        height: 30px;
    }

    .footer-links {
        font-size: 0.85rem;
    }

    .footer-text {
        font-size: 0.85rem;
    }




}





/* TABLETS (481px – 768px) */

@media (min-width: 481px) and (max-width: 768px) {

    /* header css */
    .header-text {
        margin-top: 5px;
        margin-left: 5px;
        padding-left: 5px;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .header-text h1 {
        font-size: 1rem;
    }

    .AndersenConsultingMember {
        margin-left: auto;
        margin-right: 2px;
        padding-right: 10px;
    }


    /* main css */

    /* index css */

    .choose-dot1 {
        padding: 40px 5%;
    }

    .choose-dot1 .cards {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }

    .choose-dot1 .card {
        width: 300px;
        height: 150px;
        padding: 30px 20px;
    }

    .service-cards {
        gap: 40px;
    }

    .Worked {
        padding: 40px 10px;
    }

    .industries {
        /* display: grid;
        grid-template-columns: 1fr 1fr 1fr; */
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
        justify-items: center;
    }

    .industry {
        padding: 20px 10px;
        height: 180px;
        width: 100%;
        max-width: 170px;
    }

    .our-services {
        padding: 10px 40px;
    }

    .our-services h3 {
        font-size: 2.5rem;
        margin-bottom: 10px;
    }

    .our-services p {
        text-align: justify;
    }

    .services-split {
        padding: 20px 10px;
    }

    .service-row {
        width: 100%;
        height: 450px;
        gap: 30px;
        margin-top: 0;
        margin-bottom: 40px;
    }

    .service-image {
        width: 50%;
        height: 100%;
        object-fit: cover;
    }

    .service-info {
        width: 50%;
        height: 100%;
    }

    .service-info h3 {
        font-size: 1.5rem;
        margin-bottom: 5px;
    }

    .service-info p {
        font-size: 1rem;
    }

    /* sap css */

    .We_Do .container {
        height: 500px;
        gap: 20px;
    }

    .We_Do .text {
        padding-right: 10px;
        line-height: 1.5;
        font-size: .9rem;
    }

    .We_Do .text h3 {
        font-size: 1.8rem;
        margin-bottom: 3px;
    }

    .sap-hana .container {
        align-items: flex-start;
        width: 100%;
        height: 400px;
        gap: 40px;
    }

    .sap-hana .container .content h3 {
        font-size: 1.8rem;
        margin-bottom: 3px;
    }

    .sap-hana .content {
        padding: 15px;
        line-height: 1.8;
        font-size: .9rem;

    }


    .sap-cloud {
        justify-content: flex-start;
        gap: 15px;
        padding: 30px 2%;
    }

    .sap-cloud .cloud {
        padding: 10px 10px;
    }

    .sap-cloud .cloud h4 {
        font-size: 1rem;
        margin-bottom: 5px;
    }

    .sap-cloud .cloud p {
        font-size: .9rem;
        line-height: 1.5;
    }

    /* ukg css */

    .heading {
        height: 350px;
        gap: 20px;
    }

    .heading .content {
        padding: 10px;
    }

    .heading h3 {
        font-size: 1.8rem;
        margin-bottom: 3px;
    }

    .heading h4 {
        color: #0a192f;
        font-size: 1rem;
        margin-bottom: 3px;
    }

    .heading p {
        font-size: .9rem;
        line-height: 1.6;
    }

    .ukg-pro-wfm .container {
        gap: 10px;
        height: 400px;
    }

    .ukg-pro-wfm .img {
        width: 45%;
    }

    .ukg-pro-wfm .content {
        padding: 10px 5px;
        width: 55%;
    }

    .ukg-pro-wfm .content h3 {
        font-size: 1.5rem;
        margin-bottom: 3px;
    }

    .ukg-pro-wfm .content p {
        font-size: .9rem;
        line-height: 1.6;
    }

    .product-services h3 {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }

    .product-services .services {
        gap: 30px;
    }

    .product-services .service {
        align-items: center;
        height: 400px;
        gap: 30px;
    }

    .product-services .text h4 {
        font-size: 1.5rem;
        margin-bottom: 3px;
    }

    .product-services .text p {
        font-size: .9rem;
        line-height: 1.5;
    }


    /* product-suite css */

    .heading-p {
        padding: 30px 20px;
        height: 100px;
    }

    .heading-p h2 {
        font-size: 2rem;
    }

    .media .container {
        height: 400px;
        gap: 10px;
    }

    .media .text {
        padding: 0 10px;
    }

    .media .text h3 {
        font-size: 1.8rem;
        margin-bottom: 10px;
    }

    .media .text p {
        line-height: 1.5;
        font-size: .9rem;
    }

    .features .container {
        padding: 0 20px;
        gap: 20px;
    }

    .video-section {
        margin: 30px 60px;
        flex-direction: column;
        gap: 1rem;

    }

    .video-container {
        width: 100%;
        flex: 1 1 100%;
    }

    .video-text {
        flex: 1 1 100%;
        padding: 10px;
    }

    .ConKraft .container {
        align-items: flex-start;
        height: 450px;
        gap: 10px;
    }

    .ConKraft .text {
        padding: 0 10px;
    }

    .ConKraft .text h3 {
        font-size: 1.8rem;
        margin-bottom: 5px;
    }

    .ConKraft .text p {
        font-size: 1rem;
        line-height: 1.5;
    }

    /* digital-transformation css */

    .banner h3 {
        font-size: 2rem;
    }

    .cloud-computing {
        background: white;
        padding: 30px 8%;
    }

    .cloud-computing h3 {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }

    .digital-transformation {
        background: #eaf5ff;
        padding: 40px 8%;
    }

    .digital-transformation h3 {
        font-size: 1.8rem;
        margin-bottom: 30px;
    }


    /* management consulting css */

    .banner-m {
        padding: 30px 10px;
    }

    .banner-m h3 {
        font-size: 2rem;
    }

    .banner-m .text {
        padding: 0 30px;
    }


    .innovation h3 {
        font-size: 1.8rem;
        margin-bottom: 10px;
    }

    .innovation .container {
        display: flex;
        flex-direction: column-reverse;
        gap: 10px;
    }


    .innovation .text {
        flex: none;
        padding: 10px;
        width: 100%;
        height: 30%;
    }

    .innovation .img {
        flex: none;
        height: 30%;
        width: 100%;
        object-fit: cover;
    }

    .innovation .img img {
        width: 100%;
        height: 100%;
        max-width: 100%;
    }

    /* industries css */

    .industrial-solutions {
        padding: 30px 20px;
    }

    .industrial-solutions h3 {
        font-size: 1.8rem;
        margin-bottom: 20px;
    }

    .solutions {
        gap: 40px;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
    }

    .sol {
        width: 200px;
    }

    /* media css */

    .media-text h2 {
        font-size: 20px;
    }

    .media-text p {
        font-size: 15px;
        line-height: 1.5;
        margin-bottom: 5px;
    }

    .media-overlay {
        padding: 30px 30px;
    }

    .scroll-horizontal {
        flex-wrap: nowrap;
    }

    .media-card-r {
        width: 400px;
        height: 700px;
        padding: 10px;
        margin: 0 5px;
    }

    /* about-us css */

    .intro-a {
        height: 600px;
        gap: 10px;
    }

    .intro-a .content h3 {
        font-size: 1.8rem;
    }

    .intro-a .content p {
        padding: 0 10px;
        font-size: .9rem;
        line-height: 1.4;
    }

    .purpose {
        gap: 20px;
        padding: 20px 5%;
    }

    .purpose .content {
        width: 50%;
        height: 100%;
        padding: 10px;
    }

    .purpose .content h3 {
        font-size: 1.8rem;
    }

    .purpose .content p {
        line-height: 1.5;
    }

    .people {
        height: 400px;
        padding: 20px;
        gap: 20px;
    }

    .people .content {
        width: 40%;
        height: 100%;
        padding: 0;
    }

    .people .content h3 {
        font-size: 1.8rem;
        margin-bottom: 10px;
    }

    .people .content p {
        font-size: .9rem;
        line-height: 1.5;
    }

    .people .img {
        width: 60%;
        height: 100%;
        object-fit: cover;
    }



    .leadership h2 {
        font-size: 2rem;
    }

    .leader {
        height: auto;
        flex-direction: column !important;
    }

    .leader .img {
        width: 100%;
        height: auto;
        padding: 10px 0;
    }

    .leader img {
        width: 180px;
        height: 180px;
    }

    .leader .text {
        text-align: center;
        color: white;
        flex: 1;
        padding: 0 40px;
    }

    .leader h3 {
        margin-top: 10px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .leader .text {
        padding: 15px 15px;
    }

    .leader h3 {
        justify-content: center;
        font-size: 1.2rem;
    }

    .desc {
        text-align: justify;
        font-size: 0.95rem;
    }


    /* contact css */

    .contact-container {
        flex-wrap: nowrap;
        gap: 15px;
        padding: 0 10px;
    }

    .contact-info {
        flex: 1 1 50%;
        padding: 15px;
    }

    .contact-info h2 {
        font-size: 1.5rem;
    }

    .contact-info p,
    .info-block p {
        font-size: 0.9rem;
    }

    .contact-info iframe {
        height: 300px;
    }


    /* carrer css */

    .careers-left {
        padding: 30px 25px;
    }

    .careers-left h2 {
        font-size: 1.7rem;
    }

    .career-intro {
        font-size: 0.95rem;
    }

    .career-list li a {
        padding: 12px 14px;
        font-size: 0.95rem;
    }







    /* footer css */
    .footer {
        flex-direction: row;
        justify-content: center;
        align-items: flex-start;
        padding: 10px 10px;
        row-gap: 15px;
        column-gap: 30px;
        text-align: left;
    }

    .footer h2 {
        font-size: 1.15rem;
    }

    .footer p {
        font-size: 0.9rem;
    }

    .footer-bottom {
        flex-direction: column;
        row-gap: 10px;
        column-gap: 0;
        padding-top: 10px;
        font-size: 0.85rem;
        text-align: center;
    }

    .footer-bottom p {
        margin-right: 0;
    }

    .footer-links a {
        display: inline-block;
        margin: 5px;
        font-size: 0.9rem;
    }

}


/* SMALL LAPTOPS (769px – 1024px) */

@media (min-width: 769px) and (max-width: 1024px) {
    .header-text {
        margin-top: 10px;
        margin-left: 2px;
        padding-left: 5px;
        text-align: center;
    }

    .header-text h1 {
        font-size: 1.2rem;
        margin: 20px 0;
    }

    /* our-services section */
    .our-services {
        padding: 50px 40px;
    }

    .our-services h3 {
        font-size: 2.2rem;
        margin-bottom: 30px;
    }

    .our-services p {
        font-size: 1.05rem;
        line-height: 1.8;
        max-width: 800px;
    }

    /* services section */
    .services-split {
        padding: 30px 40px;
    }

    .service-row {
        height: 450px;
        row-gap: 30px;
    }

    .service-image {
        width: 60%;
        height: 100%;
    }

    .service-image img {
        width: 100%;
        height: 100%;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    }

    .service-info {
        width: 40%;
        height: 100%;
    }

    .service-info h3 {
        font-size: 1.8rem;
    }

    .service-info p {
        font-size: 1rem;
        line-height: 1.7;
    }

    .know-more {
        font-size: 1rem;
        padding: 8px 20px;
    }


    /* sap css */

    .We_Do .container {
        height: 600px;
    }

    .sap-hana .container {
        height: 450px;
    }


    /* ukg css */
    .heading-u {
        height: 400px;
    }

    .ukg-pro-wfm {
        height: 450px;
    }

    .ukg-pro-wfm .content {
        padding: 0;
    }

    /* product suite css */

    .media .container {
        height: 480px;
    }


    .ConKraft .container {
        height: 480px;
    }

    /* leadership css */

    .leadership {
        padding: 20px 40px;
    }

    .leadership h2 {
        font-size: 2rem;
        margin-bottom: 30px;
    }

    .leaders {
        gap: 30px;
    }

    .leader {
        height: auto;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .leader.reverse {
        flex-direction: column;
    }

    .leader .img {
        padding: 8px;
        width: 100%;
        height: auto;
        /* background-color: transparent; */
        margin-bottom: 15px;
    }

    .leader img {
        width: 180px;
        height: 180px;
        border-radius: 50%;
        border: 3px solid #fff;
    }

    .leader .text {
        padding: 10px 20px;
        width: 100%;
    }

    .leader h3 {
        font-size: 1.2rem;
        justify-content: center;
    }

    .leader h3 a {
        font-size: 1.3rem;
    }

    .position {
        font-size: 1rem;
    }

    .desc {
        font-size: 0.95rem;
        line-height: 1.7;
        text-align: justify;
        max-width: 90%;
        margin: 0 auto;
    }

    /* contact css */

    .contact-container {
        flex-wrap: nowrap;
        gap: 15px;
        padding: 0 10px;
    }

    .contact-info {
        flex: 1 1 50%;
        padding: 15px;
    }

    .contact-info h2 {
        font-size: 1.5rem;
    }

    .contact-info p,
    .info-block p {
        font-size: 0.9rem;
    }

    .contact-info iframe {
        height: 300px;
    }
}


/* LARGE SCREENS (above 1366px) */

@media (min-width: 1367px) {}