/*=========================================
TABLET & MOBILE
=========================================*/

@media (max-width:991px){

    /*==========================
    TOPBAR
    ==========================*/

    .gspl-topbar{
        display:none;
    }

    /*==========================
    HEADER
    ==========================*/

    .gspl-header{
        top:0;
        height:70px;
    }

    .gspl-header .gspl-container{
        height:70px;
    }

    .gspl-logo img{
        height:42px;
    }

    .header-right{
        display:flex;
        align-items:center;
        gap:15px;
    }

    .quote-btn{
        display:none;
    }

    .mobile-toggle{
        display:flex;
    }

    /*==========================
    DESKTOP MENU HIDE
    ==========================*/

    .gspl-navbar{
        display:none;
    }

    /*==========================
    MOBILE PRODUCTS
    ==========================*/

    .mobile-submenu{

        max-height:0;

        overflow:hidden;

        transition:max-height .35s ease;

    }

    .mobile-dropdown.active .mobile-submenu{

        max-height:600px;

    }

}

/*=========================================
MOBILE
=========================================*/

@media (max-width:576px){

    .gspl-container{

        padding:0 16px;

    }

}

/*==================================================
ABOUT SECTION RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-about{

        padding:100px 0;

    }

    .gspl-about-wrapper{

        gap:50px;

    }

    .about-content h2{

        font-size:40px;

    }

    .about-image-small{

        width:190px;

        right:-20px;

    }

    .experience-box{

        width:160px;

        left:-15px;

        bottom:25px;

    }

    .experience-box h2{

        font-size:42px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-about{

        padding:80px 0;

    }

    .gspl-about-wrapper{

        grid-template-columns:1fr;

        gap:60px;

    }

    .about-images{

        max-width:650px;

        margin:auto;

    }

    .about-content{

        text-align:center;

    }

    .about-content h2{

        font-size:36px;

    }

    .about-content p{

        font-size:16px;

    }

    .about-features{

        grid-template-columns:1fr 1fr;

    }

    .about-buttons{

        justify-content:center;

        flex-wrap:wrap;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-about{

        padding:70px 0;

    }

    .about-images{

        margin-bottom:20px;

    }

    .about-image-small{

        width:150px;

        right:10px;

        bottom:20px;

        border-width:5px;

    }

    .experience-box{

        width:130px;

        padding:18px;

        left:10px;

        bottom:15px;

    }

    .experience-box h2{

        font-size:34px;

    }

    .experience-box span{

        font-size:12px;

        line-height:1.5;

    }

    .about-content h2{

        font-size:30px;

        line-height:1.25;

    }

    .about-content p{

        font-size:15px;

        line-height:1.8;

    }

    .about-features{

        grid-template-columns:1fr;

        gap:15px;

        margin:30px 0;

    }

    .about-feature{

        justify-content:flex-start;

        font-size:15px;

    }

    .about-buttons{

        flex-direction:column;

        gap:15px;

    }

    .about-buttons .gspl-btn,
    .about-buttons .gspl-btn-outline{

        width:100%;

        justify-content:center;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-about{

        padding:60px 0;

    }

    .about-content h2{

        font-size:26px;

    }

    .about-image-small{

        width:120px;

    }

    .experience-box{

        width:110px;

        padding:15px;

    }

    .experience-box h2{

        font-size:28px;

    }

    .experience-box span{

        font-size:11px;

    }

}
/*==================================================
OUR PRODUCTS RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-products{

        padding:100px 0;

    }

    .products-grid{

        gap:24px;

    }

    .section-heading h2{

        font-size:40px;

    }

    .product-image{

        height:230px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-products{

        padding:80px 0;

    }

    .section-heading{

        margin-bottom:50px;

    }

    .section-heading h2{

        font-size:36px;

    }

    .section-heading p{

        font-size:16px;

    }

    .products-grid{

        grid-template-columns:repeat(2,1fr);

        gap:24px;

    }

    .product-image{

        height:220px;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-products{

        padding:70px 0;

    }

    .section-heading{

        margin-bottom:40px;

    }

    .section-heading h2{

        font-size:30px;

        line-height:1.25;

    }

    .section-heading p{

        font-size:15px;

        line-height:1.8;

    }

    .products-grid{

        grid-template-columns:1fr;

        gap:22px;

    }

    .product-image{

        height:240px;

    }

    .product-content{

        padding:24px;

    }

    .product-content h3{

        font-size:22px;

    }

    .product-content p{

        min-height:auto;

        margin-bottom:20px;

    }

    .products-btn{

        margin-top:40px;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-products{

        padding:60px 0;

    }

    .section-heading h2{

        font-size:26px;

    }

    .section-heading p{

        font-size:14px;

    }

    .product-image{

        height:210px;

    }

    .product-content{

        padding:20px;

    }

    .product-content h3{

        font-size:20px;

    }

    .product-content p{

        font-size:14px;

        line-height:1.7;

    }

}
/*==================================================
INDUSTRIES RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-industries{

        padding:100px 0;

    }

    .industries-grid{

        gap:24px;

    }

    .industry-card{

        padding:40px 28px;

    }

    .industry-icon{

        width:80px;
        height:80px;

    }

    .industry-icon i{

        font-size:32px;

    }

    .industry-card h3{

        font-size:22px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-industries{

        padding:80px 0;

    }

    .industries-grid{

        grid-template-columns:repeat(2,1fr);

        gap:22px;

        margin-top:45px;

    }

    .industry-card{

        padding:35px 25px;

    }

    .industry-icon{

        width:75px;
        height:75px;

        margin-bottom:22px;

    }

    .industry-icon i{

        font-size:30px;

    }

    .industry-card h3{

        font-size:21px;

    }

    .industry-card p{

        font-size:15px;

        line-height:1.7;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-industries{

        padding:70px 0;

    }

    .industries-grid{

        grid-template-columns:1fr;

        gap:20px;

        margin-top:35px;

    }

    .industry-card{

        padding:32px 22px;

    }

    .industry-icon{

        width:70px;
        height:70px;

        margin-bottom:20px;

    }

    .industry-icon i{

        font-size:28px;

    }

    .industry-card h3{

        font-size:20px;

        margin-bottom:12px;

    }

    .industry-card p{

        font-size:15px;

        line-height:1.7;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-industries{

        padding:60px 0;

    }

    .industry-card{

        padding:28px 20px;

    }

    .industry-icon{

        width:65px;
        height:65px;

    }

    .industry-icon i{

        font-size:24px;

    }

    .industry-card h3{

        font-size:18px;

    }

    .industry-card p{

        font-size:14px;

        line-height:1.6;

    }

}
/*==================================================
WHY CHOOSE RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-why{

        padding:100px 0;

    }

    .gspl-why-wrapper{

        gap:50px;

    }

    .why-content h2{

        font-size:40px;

    }

    .why-features{

        gap:18px;

    }

    .why-badge{

        width:150px;

        right:-15px;

        bottom:25px;

    }

    .why-badge h2{

        font-size:44px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-why{

        padding:80px 0;

    }

    .gspl-why-wrapper{

        grid-template-columns:1fr;

        gap:60px;

    }

    .why-image{

        max-width:650px;

        margin:auto;

    }

    .why-content{

        text-align:center;

    }

    .why-content h2{

        font-size:36px;

    }

    .why-content>p{

        font-size:16px;

    }

    .why-features{

        grid-template-columns:1fr 1fr;

    }

    .why-btn{

        text-align:center;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-why{

        padding:70px 0;

    }

    .why-content h2{

        font-size:30px;

        line-height:1.25;

    }

    .why-content>p{

        font-size:15px;

        line-height:1.8;

        margin-bottom:30px;

    }

    .why-features{

        grid-template-columns:1fr;

        gap:18px;

    }

    .why-item{

        padding:20px;

        text-align:left;

    }

    .why-icon{

        width:55px;

        height:55px;

        font-size:20px;

        border-radius:14px;

    }

    .why-text h4{

        font-size:17px;

    }

    .why-text p{

        font-size:14px;

    }

    .why-badge{

        width:120px;

        padding:18px;

        right:15px;

        bottom:15px;

    }

    .why-badge h2{

        font-size:34px;

    }

    .why-badge span{

        font-size:12px;

        line-height:1.5;

    }

    .why-btn .gspl-btn{

        width:100%;

        justify-content:center;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-why{

        padding:60px 0;

    }

    .why-content h2{

        font-size:26px;

    }

    .why-image{

        margin-bottom:10px;

    }

    .why-badge{

        width:100px;

        padding:15px;

    }

    .why-badge h2{

        font-size:28px;

    }

    .why-badge span{

        font-size:11px;

    }

    .why-item{

        padding:18px;

    }

    .why-icon{

        width:50px;

        height:50px;

        font-size:18px;

    }

    .why-text h4{

        font-size:16px;

    }

    .why-text p{

        font-size:13px;

        line-height:1.6;

    }

}
/*==================================================
MANUFACTURING PROCESS RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-process{

        padding:100px 0;

    }

    .process-grid{

        gap:24px;

    }

    .process-card{

        padding:35px 22px;

    }

    .process-card h3{

        font-size:20px;

    }

    .process-icon{

        width:80px;

        height:80px;

        font-size:30px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-process{

        padding:80px 0;

    }

    .process-grid{

        grid-template-columns:repeat(2,1fr);

        gap:30px;

    }

    .process-grid::before{

        display:none;

    }

    .process-card{

        padding:35px 24px;

    }

    .process-icon{

        width:75px;

        height:75px;

        font-size:28px;

    }

    .process-card h3{

        font-size:20px;

    }

    .process-card p{

        font-size:15px;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-process{

        padding:70px 0;

    }

    .process-grid{

        grid-template-columns:1fr;

        gap:25px;

        margin-top:45px;

    }

    .process-card{

        padding:30px 22px;

    }

    .process-number{

        width:42px;

        height:42px;

        font-size:15px;

    }

    .process-icon{

        width:70px;

        height:70px;

        margin:28px auto 20px;

        font-size:26px;

    }

    .process-card h3{

        font-size:19px;

        margin-bottom:12px;

    }

    .process-card p{

        font-size:14px;

        line-height:1.7;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-process{

        padding:60px 0;

    }

    .process-card{

        padding:28px 20px;

    }

    .process-number{

        width:38px;

        height:38px;

        font-size:14px;

    }

    .process-icon{

        width:65px;

        height:65px;

        font-size:24px;

    }

    .process-card h3{

        font-size:18px;

    }

    .process-card p{

        font-size:13px;

        line-height:1.6;

    }

}
/*==================================================
INFRASTRUCTURE RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-infra{

        padding:100px 0;

    }

    .infra-grid{

        grid-template-columns:1.7fr 1fr;

        grid-template-rows:repeat(3,190px);

        gap:18px;

    }

    .infra-overlay{

        padding:22px;

    }

    .infra-overlay h3{

        font-size:22px;

    }

    .infra-text h3{

        font-size:34px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-infra{

        padding:80px 0;

    }

    .infra-grid{

        grid-template-columns:1fr 1fr;

        grid-template-rows:300px 220px 220px;

        gap:18px;

    }

    .infra-large{

        grid-column:1 / 3;

        grid-row:auto;

    }

    .infra-bottom{

        flex-direction:column;

        text-align:center;

        gap:30px;

        margin-top:50px;

    }

    .infra-text{

        max-width:100%;

    }

    .infra-text h3{

        font-size:32px;

    }

    .infra-text p{

        font-size:16px;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-infra{

        padding:70px 0;

    }

    .infra-grid{

        grid-template-columns:1fr;

        grid-template-rows:auto;

        gap:18px;

        margin-top:40px;

    }

    .infra-large{

        grid-column:auto;

        grid-row:auto;

    }

    .infra-item{

        height:260px;

    }

    .infra-overlay{

        padding:20px;

    }

    .infra-overlay h3{

        font-size:20px;

    }

    .infra-bottom{

        margin-top:40px;

    }

    .infra-text h3{

        font-size:28px;

        line-height:1.3;

    }

    .infra-text p{

        font-size:15px;

        line-height:1.8;

    }

    .infra-button{

        width:100%;

    }

    .infra-button .gspl-btn{

        width:100%;

        justify-content:center;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-infra{

        padding:60px 0;

    }

    .infra-item{

        height:220px;

        border-radius:18px;

    }

    .infra-item::after{

        border-radius:18px;

    }

    .infra-overlay{

        padding:18px;

    }

    .infra-overlay h3{

        font-size:18px;

    }

    .infra-text h3{

        font-size:24px;

    }

    .infra-text p{

        font-size:14px;

    }

}
/*==================================================
CTA RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-cta{

        padding:100px 0;

    }

    .cta-wrapper{

        gap:40px;

    }

    .cta-content h2{

        font-size:44px;

    }

    .cta-box{

        padding:30px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-cta{

        padding:80px 0;

    }

    .cta-wrapper{

        grid-template-columns:1fr;

        gap:40px;

    }

    .cta-content{

        text-align:center;

    }

    .cta-content p{

        max-width:100%;

    }

    .cta-content h2{

        font-size:38px;

    }

    .cta-buttons{

        justify-content:center;

    }

    .cta-box{

        max-width:650px;

        margin:auto;

        width:100%;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-cta{

        padding:70px 0;

    }

    .cta-content h2{

        font-size:30px;

        line-height:1.25;

    }

    .cta-content p{

        font-size:15px;

        line-height:1.8;

        margin-bottom:30px;

    }

    .cta-buttons{

        flex-direction:column;

        width:100%;

        gap:15px;

    }

    .cta-buttons .gspl-btn,

    .cta-buttons .hero-btn{

        width:100%;

        justify-content:center;

    }

    .cta-box{

        padding:25px;

    }

    .cta-item{

        gap:15px;

        padding:16px 0;

    }

    .cta-item i{

        width:52px;

        height:52px;

        font-size:20px;

    }

    .cta-item h4{

        font-size:17px;

    }

    .cta-item span{

        font-size:13px;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-cta{

        padding:60px 0;

    }

    .cta-content h2{

        font-size:26px;

    }

    .cta-content p{

        font-size:14px;

    }

    .cta-box{

        padding:20px;

        border-radius:18px;

    }

    .cta-item i{

        width:46px;

        height:46px;

        font-size:18px;

    }

    .cta-item h4{

        font-size:16px;

    }

    .cta-item span{

        font-size:12px;

    }

}
/*==================================================
FOOTER RESPONSIVE
==================================================*/

/*==================================
LAPTOP
==================================*/

@media (max-width:1200px){

    .gspl-footer{

        padding:80px 0 0;

    }

    .footer-grid{

        grid-template-columns:1.2fr 1fr 1fr 1.2fr;

        gap:35px;

    }

    .footer-logo img{

        height:58px;

    }

    .footer-col h3{

        font-size:20px;

    }

}

/*==================================
TABLET
==================================*/

@media (max-width:991px){

    .gspl-footer{

        padding:70px 0 0;

    }

    .footer-grid{

        grid-template-columns:repeat(2,1fr);

        gap:40px;

        padding-bottom:45px;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

        gap:18px;

    }

    .footer-bottom-links{

        justify-content:center;

    }

}

/*==================================
MOBILE
==================================*/

@media (max-width:768px){

    .gspl-footer{

        padding:60px 0 0;

    }

    .footer-grid{

        grid-template-columns:1fr;

        gap:35px;

    }

    .footer-col{

        text-align:center;

    }

    .footer-col h3::after{

        left:50%;

        transform:translateX(-50%);

    }

    .footer-logo{

        display:flex;

        justify-content:center;

    }

    .footer-social{

        justify-content:center;

    }

    .footer-contact li{

        justify-content:center;

        text-align:left;

    }

    .footer-bottom-links{

        gap:15px;

    }

}

/*==================================
SMALL MOBILE
==================================*/

@media (max-width:480px){

    .gspl-footer{

        padding:50px 0 0;

    }

    .footer-logo img{

        height:50px;

    }

    .footer-col h3{

        font-size:18px;

        margin-bottom:24px;

    }

    .footer-col p,

    .footer-col ul li a,

    .footer-contact span,

    .footer-contact a{

        font-size:14px;

    }

    .footer-social{

        gap:12px;

    }

    .footer-social a{

        width:42px;

        height:42px;

    }

    .footer-bottom{

        padding:22px 0;

    }

    .footer-bottom p,

    .footer-bottom-links a{

        font-size:13px;

    }

}
/*==================================================
GSPL PREMIUM HEADER V2
PART-4
==================================================*/

/*==============================
STICKY HEADER
==============================*/

.gspl-header{

    transition:
    background .35s ease,
    box-shadow .35s ease,
    top .35s ease;

}

.gspl-header .gspl-container{

    transition:height .35s ease;

}

.gspl-logo img{

    transition:height .35s ease;

}

/* Scroll */

.gspl-header.scrolled{

    top:0;

    background:#ffffff;

    box-shadow:0 15px 45px rgba(0,0,0,.08);

    border-bottom:1px solid rgba(0,0,0,.05);

}

.gspl-header.scrolled .gspl-container{

    height:78px;

}

.gspl-header.scrolled .gspl-logo img{

    height:64px !important;

}

.gspl-header.scrolled .gspl-menu>li>a{

    height:78px;

}

/*==============================
ACTIVE MENU
==============================*/

.gspl-menu>li.active>a{

    color:#C32026;

}

.gspl-menu>li.active>a::after{

    width:100%;

}

/*==============================
BUTTON
==============================*/

.gspl-header.scrolled .gspl-btn{

    padding:11px 24px;

}

/*==================================================
RESPONSIVE
==================================================*/

/* Laptop */

@media(max-width:1200px){

    .gspl-menu{

        gap:26px;

    }

}

/* Tablet */

@media(max-width:991px){

    .gspl-topbar{

        display:none;

    }

    .gspl-header{

        top:0;

    }

    .gspl-header .gspl-container{

        height:82px;

    }

    .gspl-logo img{

        height:64px !important;

    }

    .gspl-navbar{

        display:none;

    }

    .gspl-header .gspl-btn{

        display:none;

    }

    .gspl-toggle{

        display:flex;

        align-items:center;

        justify-content:center;

    }

}

/* Mobile */

@media(max-width:768px){

    .gspl-header .gspl-container{

        height:76px;

    }

    .gspl-logo img{

        height:58px !important;

    }

    .mobile-menu{

        width:320px;

    }

}

/* Small Mobile */

@media(max-width:480px){

    .gspl-header .gspl-container{

        height:72px;

    }

    .gspl-logo img{

        height:54px !important;

    }

    .mobile-menu{

        width:290px;

    }

}