/*============================
LOGIN PAGE RESPONSIVE
==============================*/

/*TABLET*/

@media (max-width:991px){

    body{
        padding:40px 20px;
    }

    .login-container{
        grid-template-columns:1fr;
        max-width:650px;
        border-radius:30px;
    }

    .login-image{
        width:100%;
        min-height:300px;
    }

    .login-image img{
        height:300px;
        object-fit:cover;
    }

    .login-right{
        padding:45px 35px;
    }

    .form-content{
        max-width:100%;
    }

    .logo{
        max-width:240px;
    }

}

/*TABLET*/

@media (max-width:768px){

    body{
        padding:25px 15px;
    }

    .login-container{
        border-radius:25px;
    }

    .login-image{
        min-height:240px;
    }

    .login-image img{
        height:240px;
    }

    .login-right{
        padding:35px 25px;
    }

    .form-content p{
        font-size:14px;
        line-height:1.6;
    }

    .input-box input{
        height:52px;
    }

    .login-options{
        flex-direction:column;
        align-items:flex-start;
        gap:18px;
    }

    .show-password{
        width:100%;
    }

    .signin-btn{
        height:50px;
        font-size:16px;
    }

    .signup-link{
        font-size:14px;
    }

    .footer-bottom p{
        font-size:13px;
        line-height:1.8;
    }

}

/*MOBILE*/

@media (max-width:576px){

    body{
        padding:15px;
    }

    .login-container{
        border-radius:20px;
    }

    .login-image{
        min-height:180px;
    }

    .login-image img{
        height:180px;
    }

    .login-right{
        padding:30px 20px;
    }

    .logo{
        max-width:200px;
        margin-bottom:15px;
    }

    .form-content p{
        font-size:13px;
        margin-bottom:20px;
    }

    .input-box{
        margin-bottom:18px;
    }

    .input-box input{
        height:48px;
        font-size:14px;
        padding-left:50px;
    }

    .input-box i{
        left:18px;
        font-size:13px;
    }

    .input-box label{
        left:25px;
        font-size:14px;
    }

    .signin-btn{
        height:48px;
        font-size:15px;
    }

    .signup-link{
        font-size:13px;
        line-height:1.6;
    }

    .footer-bottom{
        margin-top:25px;
        padding-top:20px;
    }

    .footer-bottom p{
        font-size:12px;
        line-height:1.9;
    }

}

/*SMALL MOBILE*/

@media (max-width:400px){

    body{
        padding:10px;
    }

    .login-right{
        padding:25px 15px;
    }

    .logo{
        max-width:170px;
    }

    .form-content p{
        font-size:12px;
    }

    .input-box input{
        height:46px;
        font-size:13px;
    }

    .forgot-link{
        font-size:12px;
    }

    .show-password span{
        font-size:12px;
    }

    .signin-btn{
        height:46px;
        font-size:14px;
    }

    .signup-link{
        font-size:12px;
    }

    .footer-bottom p{
        font-size:11px;
    }

}
/*==============================
NAVBAR RESPONSIVE
================================*/
/* LARGE LAPTOP*/

@media (max-width:1200px){

.nav-links{
    gap:20px;
}

.logo img{
    height:55px;
    margin-left:0;
}

.nav-buttons{
    gap:12px;
}

}

/*TABLET*/

@media (max-width:992px){

.navbar{
    min-height:80px;
}

.logo img{
    height:50px;
}

.menu-toggle{
    display:flex;
}

.nav-links{
    position:fixed;
    top:80px;
    left:-100%;
    width:300px;
    height:calc(100vh - 80px);

    background:#ffffff;

    flex-direction:column;
    justify-content:flex-start;
    align-items:flex-start;

    padding:40px 30px;
    gap:30px;

    transition:.4s;
    box-shadow:5px 0 20px rgba(0,0,0,.08);
}

.nav-links.active{
    left:0;
}

.nav-links li{
    width:100%;
}

.nav-links a{
    display:block;
    width:100%;
    font-size:18px;
}

.nav-buttons{
    display:none;
}

}

/*MOBILE*/

@media (max-width:768px){

.logo img{
    height:45px;
}

.nav-links{
    width:100%;
}

}

/*SMALL MOBILE*/

@media (max-width:480px){

.navbar{
    min-height:70px;
}

.logo img{
    height:40px;
}

.nav-links{
    top:70px;
    height:calc(100vh - 70px);
    padding:30px 20px;
}

.nav-links a{
    font-size:17px;
}

}

/*============================
HERO RESPONSIVE
=============================*/
/*LARGE LAPTOP 1200PX*/

@media (max-width:1200px){

.hero{
    width:100%;
    padding:20px 40px 70px;
}

.hero-grid{
    gap:40px;
}

.hero h1{
    font-size:48px;
}

.hero p{
    max-width:100%;
}

.hero-image img{
    width:520px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.hero{
    width:100%;
    padding:30px 30px 60px;
}

.hero-grid{
    grid-template-columns:1fr;
    gap:50px;
    text-align:center;
}

.hero-content{
    order:1;
}

.hero-image{
    order:2;
    margin-top:0;
    transform:none;
}

.hero-badge{
    margin:0 auto 20px;
}

.hero h1{
    font-size:42px;
    max-width:100%;
}

.hero p{
    max-width:100%;
    margin:20px auto;
}

.hero-buttons{
    display:flex;
    justify-content:center;
}

.hero-image img{
    width:480px;
    max-width:100%;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.hero{
    padding:20px 20px 50px;
}

.hero-grid{
    gap:40px;
}

.hero-badge{
    padding:10px 20px;
}

.hero-badge h5{
    font-size:14px;
}

.hero h1{
    font-size:36px;
    line-height:1.2;
}

.hero p{
    font-size:15px;
    line-height:1.7;
}

.hero-image img{
    width:400px;
}

.demo-btn .circle{
    width:60px;
    height:60px;
}

.demo-btn::before{
    width:60px;
}

.demo-btn .btn-label{
    font-size:15px;
}

}

/*MOBILE 576PX*/

@media (max-width:576px){

.hero{
    padding:20px 15px 40px;
}

.hero h1{
    font-size:30px;
}

.hero p{
    font-size:14px;
}

.hero-badge{
    width:100%;
    border-radius:30px;
    padding:12px;
}

.hero-badge h5{
    font-size:13px;
}

.hero-image img{
    width:100%;
}

.demo-btn{
    margin-top:25px;
}

.demo-btn .circle{
    width:55px;
    height:55px;
}

.demo-btn::before{
    width:55px;
}

.demo-btn .btn-label{
    font-size:14px;
    padding-right:15px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.hero{
    padding:15px;
}

.hero h1{
    font-size:26px;
}

.hero p{
    font-size:13px;
    line-height:1.6;
}

.hero-badge h5{
    font-size:12px;
}

.demo-btn .circle{
    width:50px;
    height:50px;
    font-size:14px;
}

.demo-btn::before{
    width:50px;
}

.demo-btn .btn-label{
    font-size:13px;
}

}

/*========================
    CORE FEATUERS
==========================*/
/*LARGE LAPTOP 1200PX*/

/* ==========================
   FEATURES + ABOUT
========================== */

@media (max-width:1200px){

.features{
    padding:80px 20px 100px;
}

.intro-card{
    padding:45px 45px 45px 60px;
}

.feature-grid{
    grid-template-columns:repeat(3,1fr);
    gap:25px;
}

.feature-card{
    width:100%;
    min-height:360px;
    padding:35px 25px;
}

.feature-card h3{
    font-size:26px;
}

.feature-sticker{
    width:130px;
}

.about-section{
    padding:70px 20px;
}

.about-left h2{
    font-size:38px;
}

.about-right{
    gap:30px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.features{
    padding:70px 20px 90px;
    border-radius:50px;
}

.intro-card{
    padding:40px;
    margin:35px 0 60px;
}

.intro-content p{
    font-size:15px;
    text-align:left;
}

.pattern-1,
.pattern-2,
.pattern-3{
    display:none;
}

.feature-grid{
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}

.card-1,
.card-2,
.card-3{
    margin-top:0;
}

.feature-card{
    min-height:340px;
}

.about-section{
    grid-template-columns:1fr;
    gap:60px;
}

.about-left{
    text-align:center;
}

.about-left p{
    max-width:700px;
    margin:auto auto 30px;
}

.about-right{
    grid-template-columns:repeat(2,1fr);
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.features{
    padding:60px 15px 80px;
}

.intro-card{
    padding:30px;
}

.intro-content p{
    font-size:14px;
    line-height:1.8;
}

.feature-grid{
    grid-template-columns:1fr;
}

.feature-card{
    max-width:500px;
    margin:auto;
    min-height:auto;
}

.feature-card h3{
    font-size:24px;
}

.feature-sticker{
    width:120px;
}

.about-section{
    padding:60px 20px;
}

.section-tag{
    font-size:16px;
}

.about-left h2{
    font-size:34px;
}

.about-left p{
    font-size:16px;
}

.about-right{
    grid-template-columns:1fr;
    gap:35px;
}

.feature{
    align-items:flex-start;
}

.feature-icon{
    width:60px;
    height:60px;
    min-width:60px;
    font-size:24px;
}

.feature h3{
    font-size:22px;
}

}

/*MOBILE 576PX*/

@media (max-width:576px){

.features{
    padding:50px 15px 70px;
}

.intro-card{
    padding:25px 20px;
    border-radius:20px;
}

.intro-content p{
    font-size:14px;
    line-height:1.7;
}

.feature-card{
    padding:30px 20px;
    border-radius:30px;
}

.feature-card h3{
    font-size:22px;
}

.feature-card p{
    font-size:15px;
    line-height:1.7;
}

.feature-sticker{
    width:110px;
}

.about-section{
    padding:50px 15px;
}

.about-left h2{
    font-size:30px;
}

.about-left p{
    font-size:15px;
}

.outline-btn{
    width:100%;
    text-align:center;
}

.feature{
    flex-direction:column;
    text-align:center;
    align-items:center;
}

.feature h3{
    font-size:20px;
}

.feature p{
    font-size:15px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.features{
    padding:40px 10px 60px;
}

.intro-card{
    padding:20px 15px;
}

.intro-content p{
    font-size:13px;
}

.feature-card{
    padding:25px 15px;
}

.feature-card h3{
    font-size:20px;
}

.feature-sticker{
    width:95px;
}

.about-left h2{
    font-size:26px;
}

.about-left p{
    font-size:14px;
}

.section-tag{
    font-size:14px;
}

.feature-icon{
    width:55px;
    height:55px;
    min-width:55px;
    font-size:20px;
}

.feature h3{
    font-size:18px;
}

.feature p{
    font-size:14px;
}

}

/*========================
    STAT SECTION
==========================*/

/*LARGE LAPTOP 1200PX*/

/* ==========================
   STATS SECTION
========================== */

@media (max-width:1200px){

.stats-container{
    padding:0 40px;
    gap:40px;
}

.stats-circle{
    width:470px;
    height:390px;
}

.stat-item h2{
    font-size:52px;
}

.stat-item p{
    font-size:16px;
}

.stat-left{
    left:-20px;
}

.stat-right{
    right:-40px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.stats-section{
    padding:50px 0;
}

.stats-container{
    flex-direction:column;
    text-align:center;
    padding:0 30px;
    gap:70px;
}

.stats-image{
    width:100%;
}

.stats-image img{
    max-width:500px;
    margin:auto;
}

.stats-circle{
    width:420px;
    height:360px;
}

.stat-item h2{
    font-size:46px;
}

.stat-item p{
    font-size:15px;
}

.stat-top{
    top:-35px;
}

.stat-left{
    left:-10px;
}

.stat-right{
    right:-20px;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.stats-container{
    padding:0 20px;
}

.stats-image img{
    max-width:400px;
}

.stats-circle{
    width:340px;
    height:300px;
}

.stat-item h2{
    font-size:38px;
}

.stat-item p{
    font-size:14px;
}

.stat-top{
    top:-28px;
}

.stat-left{
    left:0;
}

.stat-right{
    right:0;
}

}

/*MOBILE 576PX*/

@media (max-width:576px){

.stats-section{
    padding:40px 0;
}

.stats-container{
    padding:0 15px;
    gap:50px;
}

.stats-image img{
    width:100%;
    max-width:320px;
}

.stats-circle{
    width:280px;
    height:250px;
}

.stat-item h2{
    font-size:30px;
}

.stat-item p{
    font-size:13px;
}

.stat-top{
    top:-22px;
}

.stat-left{
    left:8px;
    top:70%;
}

.stat-right{
    right:8px;
    top:70%;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.stats-container{
    padding:0 10px;
}

.stats-image img{
    max-width:260px;
}

.stats-circle{
    width:230px;
    height:210px;
}

.stat-item h2{
    font-size:24px;
}

.stat-item p{
    font-size:12px;
}

.stat-top{
    top:-18px;
}

.stat-left{
    left:5px;
}

.stat-right{
    right:5px;
}

}

/*========================
ABOUT GLAERS RESPONSIVE
==========================*/

/*LARGE LAPTOP 1200PX*/

/* ==========================
   ABOUT GLAERS
========================== */

@media (max-width:1200px){

.about.glaers{
    padding:60px 20px;
}

.about-layout{
    grid-template-columns:100px 1fr;
    gap:30px;
}

.about-content{
    max-width:100%;
}

.about-content .section-title h2{
    font-size:44px;
}

.about-content p{
    font-size:15px;
}

.timeline-icon{
    width:65px;
    height:65px;
}

.timeline-icon i{
    font-size:26px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.about.glaers{
    padding:60px 25px;
}

.about-layout{
    grid-template-columns:1fr;
    gap:40px;
}

.about-timeline{
    flex-direction:row;
    justify-content:center;
    flex-wrap:wrap;
    gap:25px;
}

.about-timeline::before{
    display:none;
}

.about-content{
    text-align:center;
}

.about-content .section-title h2{
    font-size:40px;
}

.about-content p{
    max-width:850px;
    margin:0 auto 25px;
}

.timeline-icon{
    width:70px;
    height:70px;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.about.glaers{
    padding:50px 20px;
}

.about-content .section-title h2{
    font-size:34px;
}

.about-content p{
    font-size:15px;
    line-height:1.8;
}

.about-timeline{
    gap:18px;
}

.timeline-icon{
    width:60px;
    height:60px;
}

.timeline-icon i{
    font-size:24px;
}

}

/* MOBILE 576PX*/

@media (max-width:576px){

.about.glaers{
    padding:40px 15px;
}

.about-content .section-title h2{
    font-size:30px;
}

.about-content p{
    font-size:14px;
    line-height:1.7;
    text-align:left;
}

.about-timeline{
    gap:15px;
}

.timeline-icon{
    width:55px;
    height:55px;
}

.timeline-icon i{
    font-size:20px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.about.glaers{
    padding:35px 10px;
}

.about-content .section-title h2{
    font-size:26px;
}

.about-content p{
    font-size:13px;
}

.about-timeline{
    gap:12px;
}

.timeline-icon{
    width:50px;
    height:50px;
}

.timeline-icon i{
    font-size:18px;
}

}

/* ==========================
   ABOUT CTA
========================== */

/*LARGE LAPTOP 1200PX*/

@media (max-width:1200px){

.about-cta{

    padding:100px 5%;
    min-height:550px;

    background-size:cover;
}

.about-cta-content{

    max-width:500px;
    padding-left:40px;
}

.about-cta-content h2{

    font-size:46px;
}

.about-cta-content p{

    font-size:17px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.about-cta{

    padding:80px 30px;
    min-height:auto;

    background-size:cover;
    background-position:center;
}

.about-cta-content{

    max-width:650px;
    margin:auto;

    padding-left:0;

    text-align:center;
}

.about-cta-content h2{

    font-size:40px;
}

.about-cta-content p{

    font-size:16px;
    margin-bottom:35px;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.about-cta{

    padding:70px 20px;
}

.about-cta-content h2{

    font-size:34px;
    line-height:1.25;
}

.about-cta-content p{

    font-size:15px;
    line-height:1.8;
}

.about-cta-btn{

    padding:15px 36px;
    font-size:15px;
}

}

/*MOBILE 576PX*/

@media (max-width:576px){

.about-cta{

    padding:60px 15px;
}

.about-cta-content{

    max-width:100%;
}

.about-cta-content h2{

    font-size:30px;
}

.about-cta-content p{

    font-size:14px;
    margin-bottom:30px;
}

.about-cta-btn{

    width:100%;
    padding:16px;

    font-size:15px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.about-cta{

    padding:50px 12px;
}

.about-cta-content h2{

    font-size:26px;
}

.about-cta-content p{

    font-size:13px;
}

.about-cta-btn{

    font-size:14px;
    padding:14px;
}

}

/* ==========================
   PRICING SECTION
========================== */

/*LARGE LAPTOP 1200PX*/

@media (max-width:1200px){

.pricing-section{
    padding:80px 40px;
    gap:50px;
}

.pricing-left h2{
    font-size:44px;
}

.pricing-left p{
    font-size:16px;
    max-width:100%;
}

.pricing-right img{
    max-width:450px;
}

.pricing-right::before{
    width:350px;
    height:350px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.pricing-section{
    flex-direction:column;
    text-align:center;
    padding:70px 30px;
    gap:50px;
}

.pricing-left{
    order:1;
}

.pricing-right{
    order:2;
}

.pricing-left h2::after{
    margin:12px auto 0;
}

.pricing-left p{
    margin:30px auto;
    max-width:700px;
}

.pricing-right img{
    max-width:420px;
}

.pricing-right::before{
    width:320px;
    height:320px;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.pricing-section{
    padding:60px 20px;
}

.pricing-left h2{
    font-size:36px;
}

.pricing-left p{
    font-size:15px;
    line-height:1.8;
}

.pricing-right img{
    max-width:340px;
}

.pricing-right::before{
    width:260px;
    height:260px;
}

.outline-btn{
    padding:15px 34px;
    font-size:15px;
}

}

/*MOBILE 576PX*/

@media (max-width:576px){

.pricing-section{
    padding:50px 15px;
}

.pricing-left h2{
    font-size:30px;
}

.pricing-left p{
    font-size:14px;
    margin:25px auto;
}

.pricing-right img{
    width:100%;
    max-width:280px;
}

.pricing-right::before{
    width:220px;
    height:220px;
}

.outline-btn{
    width:100%;
    text-align:center;
    padding:15px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.pricing-section{
    padding:40px 10px;
}

.pricing-left h2{
    font-size:26px;
}

.pricing-left p{
    font-size:13px;
}

.pricing-right img{
    max-width:240px;
}

.pricing-right::before{
    width:180px;
    height:180px;
}

.outline-btn{
    font-size:14px;
    padding:14px;
}

}

/* ==========================
   NEWS SECTION
========================== */
/*LARGE LAPTOP 1200PX*/

@media (max-width:1200px){

.latest-news{
    padding:80px 20px;
}

.news-grid{
    gap:25px;
}

.news-content{
    padding:22px;
}

.news-content h3{
    font-size:20px;
}

.news-text{
    font-size:14px;
}

.news-card img{
    height:220px;
}

}

/*TABLET 992PX*/

@media (max-width:992px){

.latest-news{
    padding:70px 20px;
}

.latest-news .section-title h2{
    font-size:36px;
}

.latest-news .section-title p{
    font-size:16px;
}

.news-grid{
    grid-template-columns:repeat(2,1fr);
    gap:25px;
}

.news-card img{
    height:210px;
}

.news-content h3{
    font-size:20px;
}

}

/*SMALL TABLET 768PX*/

@media (max-width:768px){

.latest-news{
    padding:60px 15px;
}

.latest-news .section-title h2{
    font-size:32px;
}

.latest-news .section-title p{
    font-size:15px;
}

.news-grid{
    grid-template-columns:1fr;
    gap:25px;
}

.news-card{
    max-width:550px;
    margin:auto;
}

.news-card img{
    height:240px;
}

.news-content{
    padding:22px;
}

.news-content h3{
    font-size:22px;
}

.news-text{
    font-size:15px;
}

.news-toggle{
    width:40px;
    height:40px;
}

}

/*MOBILE 768PX*/

@media (max-width:576px){

.latest-news{
    padding:50px 15px;
}

.latest-news .section-title h2{
    font-size:28px;
}

.latest-news .section-title p{
    font-size:14px;
}

.news-card{
    border-radius:20px;
}

.news-card img{
    height:200px;
}

.news-content{
    padding:18px;
}

.news-content h3{
    font-size:19px;
}

.news-text{
    font-size:14px;
    line-height:1.7;
}

.news-toggle{
    width:38px;
    height:38px;
}

}

/*SMALL MOBILE 400PX*/

@media (max-width:400px){

.latest-news{
    padding:40px 10px;
}

.latest-news .section-title h2{
    font-size:24px;
}

.latest-news .section-title p{
    font-size:13px;
}

.news-card img{
    height:170px;
}

.news-content{
    padding:15px;
}

.news-content h3{
    font-size:17px;
}

.news-text{
    font-size:13px;
}

.news-toggle{
    width:35px;
    height:35px;
}

}

/* ==========================
   CTA 
========================== */

/*LARGE LAPTOP*/
@media (max-width:1200px){

.footer-cta{
    padding:55px 40px;
}

.cta-text h2{
    font-size:36px;
}

.cta-text p{
    font-size:15px;
}

}

/*TABLET*/
@media (max-width:992px){

.footer-cta{
    padding:50px 30px;
}

.cta-content{
    flex-direction:column;
    text-align:center;
}

.cta-text h2{
    font-size:34px;
    max-width:100%;
}

.cta-text p{
    max-width:700px;
    margin:auto;
}

.cta-btn{
    margin-top:10px;
}

}
/*SMALL TABLET*/
@media (max-width:768px){

.footer-cta{
    padding:45px 20px;

    clip-path:none;
}

.cta-text h2{
    font-size:30px;
}

.cta-text p{
    font-size:14px;
    line-height:1.8;
}

.cta-btn{
    padding:15px 35px;
    font-size:16px;
}

}
/*MOBILE*/
@media (max-width:576px){

.footer-cta{
    padding:40px 15px;
}

.cta-text h2{
    font-size:26px;
}

.cta-text p{
    font-size:14px;
}

.cta-btn{
    width:100%;
    padding:15px;
    font-size:15px;
}

}
/*SMALL MOBILE*/

@media (max-width:400px){

.footer-cta{
    padding:35px 10px;
}

.cta-text h2{
    font-size:22px;
}

.cta-text p{
    font-size:13px;
}

.cta-btn{
    font-size:14px;
}

}

/*===========================
    FOOTER
============================*/

/*LARGE LAPTOP*/

@media (max-width:1200px){

.footer{
    padding:80px 20px 25px;
}

.footer-grid{
    gap:35px;
}

.footer-logo{
    width:190px;
}

}

/*TABLET*/

@media (max-width:992px){

.footer-grid{
    grid-template-columns:repeat(2,1fr);
    gap:40px;
}

.footer-col{
    text-align:center;
}

.footer-logo{
    margin:auto auto 20px;
}

.footer-social{
    justify-content:center;
}

}

/*SMALL TABLET*/

@media (max-width:768px){

.footer{
    padding:70px 20px 25px;
}

.footer-grid{
    grid-template-columns:1fr;
    gap:45px;
}

.footer-col{
    text-align:center;
}

.footer-logo{
    width:180px;
}

.footer-social{
    justify-content:center;
}

.footer-bottom p{
    font-size:14px;
    line-height:1.8;
}

}

/*MOBILE*/

@media (max-width:576px){

.footer{
    padding:60px 15px 20px;
}

.footer-col h3{
    font-size:20px;
}

.footer-col p,
.footer-col ul li a{
    font-size:15px;
}

.footer-social a{
    width:42px;
    height:42px;
}

.footer-bottom{
    margin-top:30px;
}

.footer-bottom p{
    font-size:13px;
}

}

/*SMALL MOBILE*/

@media (max-width:400px){

.footer{
    padding:50px 10px 20px;
}

.footer-logo{
    width:160px;
}

.footer-col h3{
    font-size:18px;
}

.footer-col p,
.footer-col ul li a{
    font-size:14px;
}

.footer-social{
    gap:10px;
}

.footer-social a{
    width:38px;
    height:38px;
}

.footer-bottom p{
    font-size:12px;
    line-height:1.7;
}

}

/*==================================================
            CONTACTUS PAGE RESPONSIVE
==================================================*/

/*CONTACT HERO SECTION*/

/*LARGE LAPTOP*/

@media (max-width:1200px){

.contact-hero{

    padding:30px 5% 50px;

}

.contact-hero-container{

    gap:60px;

}

.contact-hero-content{

    max-width:560px;

}

.contact-hero-content h1{

    font-size:38px;

}

.contact-hero-content p{

    font-size:15px;

}

.contact-hero-image img{

    max-width:360px;

}

}

/*TABLET*/

@media (max-width:992px){

.contact-hero{

    padding:40px 5% 60px;

}

.contact-hero-container{

    flex-direction:column-reverse;

    text-align:center;

    gap:45px;

}

.contact-hero-content{

    max-width:100%;

}

.contact-hero-content .section-tag{

    font-size:14px;

}

.contact-hero-content h1{

    font-size:36px;

}

.contact-hero-content p{

    max-width:700px;

    margin:0 auto;

    font-size:15px;

}

.contact-hero-image{

    width:100%;

}

.contact-hero-image img{

    max-width:340px;

}

}

/*SMALL TABLET*/

@media (max-width:768px){

.contact-hero{

    padding:35px 5% 50px;

}

.contact-hero-container{

    gap:35px;

}

.contact-hero-content h1{

    font-size:30px;

    line-height:1.3;

}

.contact-hero-content p{

    font-size:15px;

    line-height:1.8;

}

.contact-hero-image img{

    max-width:280px;

}

}

/*MOBILE*/

@media (max-width:576px){

.contact-hero{

    padding:30px 5% 45px;

}

.contact-hero-content .section-tag{

    font-size:13px;

}

.contact-hero-content h1{

    font-size:26px;

}

.contact-hero-content p{

    font-size:14px;

    line-height:1.7;

}

.contact-hero-image img{

    max-width:230px;

}

}

/*SMALL MOBILE*/

@media (max-width:400px){

.contact-hero{

    padding:25px 4% 40px;

}

.contact-hero-content .section-tag{

    font-size:12px;

}

.contact-hero-content h1{

    font-size:22px;

}

.contact-hero-content p{

    font-size:13px;

    line-height:1.7;

}

.contact-hero-image img{

    max-width:190px;

}

}

/*CONTACT FORM*/

/*LARGE LAPTOP*/

@media (max-width:1200px){

.contact-section{

    padding:100px 5%;

}

.contact-container{

    gap:60px;

}

.contact-info h2{

    font-size:34px;

}

.contact-info>p{

    font-size:15px;

}

.contact-form-wrapper{

    padding:40px;

}

}


/*TABLET*/

@media (max-width:992px){

.contact-section{

    padding:90px 5%;

}

.contact-container{

    grid-template-columns:1fr;

    gap:50px;

}

.contact-info{

    text-align:center;

}

.contact-info>p{

    max-width:700px;

    margin:0 auto 40px;

}

.info-item{

    justify-content:center;

    text-align:left;

}

.contact-form-wrapper{

    padding:35px;

}

}

/*SMALL TABLET*/

@media (max-width:768px){

.contact-section{

    padding:80px 5%;

}

.contact-info{

    text-align:left;

}

.contact-info .section-tag{

    font-size:14px;

}

.contact-info h2{

    font-size:30px;

}

.contact-info>p{

    font-size:15px;

    line-height:1.7;

    margin-bottom:35px;

}

.form-row{

    grid-template-columns:1fr;

    gap:18px;

}

.contact-form-wrapper{

    padding:30px;

    border-radius:24px;

}

.input-group label{

    font-size:14px;

}

.input-group input,
.input-group textarea{

    padding:14px 16px;

    font-size:14px;

}

.contact-btn{

    width:100%;

    justify-content:center;

}

.info-item{

    gap:16px;

}

.info-icon{

    width:52px;

    height:52px;

}

}

/*MOBILE*/

@media (max-width:576px){

.contact-section{

    padding:70px 4%;

}

.contact-container{

    gap:40px;

}

.contact-info .section-tag{

    font-size:13px;

}

.contact-info h2{

    font-size:26px;

}

.contact-info>p{

    font-size:14px;

}

.contact-form-wrapper{

    padding:22px;

    border-radius:20px;

}

.form-row{

    gap:15px;

}

.input-group label{

    font-size:13px;

}

.input-group input,
.input-group textarea{

    padding:13px 14px;

    font-size:14px;

}

.contact-btn{

    width:100%;

    padding:14px;

    font-size:15px;

}

.info-item{

    gap:14px;

}

.info-icon{

    width:46px;

    height:46px;

    border-radius:14px;

    font-size:16px;

}

.info-text h4{

    font-size:15px;

}

.info-text p{

    font-size:14px;

}

}

/*SMALL MOBILE*/

@media (max-width:400px){

.contact-section{

    padding:60px 4%;

}

.contact-info .section-tag{

    font-size:12px;

}

.contact-info h2{

    font-size:22px;

}

.contact-info>p{

    font-size:13px;

    line-height:1.7;

}

.contact-form-wrapper{

    padding:18px;

}

.input-group label{

    font-size:13px;

}

.input-group input,
.input-group textarea{

    padding:12px;

    font-size:13px;

    border-radius:12px;

}

.contact-btn{

    padding:13px;

    font-size:14px;

}

.info-item{

    gap:12px;

}

.info-icon{

    width:42px;

    height:42px;

    font-size:15px;

}

.info-text h4{

    font-size:14px;

}

.info-text p{

    font-size:13px;

}

}

/*==================================================
            ABOUTUS PAGE
==================================================*/
/*HERO SECTION*/

/*LARGE LAPTOP*/

@media (max-width:1200px){

.about-hero{

    padding:100px 5%;

}

.about-hero-container{

    gap:60px;

}

.about-hero-content h1{

    font-size:34px;

}

.about-hero-content p{

    max-width:560px;

    font-size:15px;

}

}
/*TABLET*/

@media (max-width:992px){

.about-hero{

    padding:90px 5%;

}

.about-hero-container{

    justify-content:center;

    text-align:center;

}

.about-hero-content{

    max-width:750px;

}

.about-tag{

    font-size:14px;

    letter-spacing:2px;

}

.about-hero-content h1{

    font-size:32px;

    line-height:1.35;

}

.about-hero-content p{

    max-width:700px;

    margin:0 auto;

    font-size:15px;

}

.hero-line{

    margin:20px auto;

}

}


/*SMALL TABLET*/

@media (max-width:768px){

.about-hero{

    padding:80px 5%;

}

.about-tag{

    font-size:13px;

}

.about-hero-content h1{

    font-size:28px;

}

.about-hero-content p{

    font-size:15px;

    line-height:1.8;

}

.hero-line{

    margin:18px auto;

}

}

/*MOBILE*/

@media (max-width:576px){

.about-hero{

    padding:70px 5%;

}

.about-tag{

    font-size:12px;

    letter-spacing:1.5px;

}

.about-hero-content h1{

    font-size:24px;

    line-height:1.4;

}

.about-hero-content p{

    font-size:14px;

    line-height:1.7;

}

.hero-line{

    width:80px;

}

}

/*SMALL MOBILE*/

@media (max-width:400px){

.about-hero{

    padding:60px 4%;

}

.about-tag{

    font-size:11px;

}

.about-hero-content h1{

    font-size:21px;

    line-height:1.45;

}

.about-hero-content p{

    font-size:13px;

    line-height:1.7;

}

.hero-line{

    width:65px;

}

}

/*WHO WE ARE SECTION*/

/*LARGE LAPTOPS*/

@media (max-width:1200px){

    .about-company{
        padding:70px 5%;
    }

    .about-company-container{
        gap:60px;
    }

    .company-image img{
        max-width:420px;
    }

    .company-content h2{
        font-size:34px;
    }

    .company-content > p{
        font-size:15px;
        line-height:1.7;
    }

    .experience-badge{
        left:20px;
        bottom:20px;
        padding:18px 24px;
    }

    .experience-badge h2{
        font-size:1.8rem;
    }

}
/*TABLETS*/

@media (max-width:992px){

    .about-company{
        padding:70px 5%;
    }

    .about-company-container{
        flex-direction:column;
        text-align:center;
        gap:50px;
    }

    .company-image{
        order:1;
    }

    .company-content{
        order:2;
        max-width:720px;
    }

    .company-image img{
        max-width:400px;
    }

    .experience-badge{
        left:20px;
        bottom:20px;
    }

    .company-content h2{
        font-size:32px;
    }

    .company-content > p{
        font-size:15px;
        line-height:1.8;
    }

    .company-highlights{
        grid-template-columns:repeat(2,1fr);
        gap:20px;
        margin-top:30px;
    }

    .highlight{
        text-align:left;
    }

}

/*MOBILE*/

@media (max-width:768px){

    .about-company{
        padding:60px 5%;
    }

    .about-company-container{
        gap:40px;
    }

    .section-tag{
        font-size:13px;
        letter-spacing:2px;
    }

    .company-content h2{
        font-size:28px;
        line-height:1.35;
    }

    .company-content > p{
        font-size:14px;
        line-height:1.8;
    }

    .company-image img{
        max-width:340px;
    }

    .experience-badge{
        left:15px;
        bottom:15px;
        padding:16px 20px;
        border-radius:16px;
    }

    .experience-badge h2{
        font-size:1.6rem;
    }

    .experience-badge span{
        font-size:.9rem;
    }

    .company-highlights{
        grid-template-columns:1fr;
        gap:20px;
    }

    .highlight{
        gap:15px;
        align-items:flex-start;
    }

    .highlight-icon{
        width:38px;
        height:38px;
        font-size:1rem;
    }

    .highlight h4{
        font-size:17px;
    }

    .highlight p{
        font-size:14px;
    }

}
/*MOBILE*/

@media (max-width:576px){

    .about-company{
        padding:50px 4%;
    }

    .company-image img{
        max-width:280px;
    }

    .experience-badge{
        left:12px;
        bottom:12px;
        padding:14px 18px;
    }

    .experience-badge h2{
        font-size:1.4rem;
    }

    .experience-badge span{
        font-size:.85rem;
    }

    .company-content h2{
        font-size:24px;
    }

    .company-content > p{
        font-size:14px;
        line-height:1.7;
    }

    .highlight{
        gap:14px;
    }

    .highlight-icon{
        width:36px;
        height:36px;
        border-radius:12px;
    }

    .highlight h4{
        font-size:16px;
    }

    .highlight p{
        font-size:13px;
    }

}


/*SMALL MOBILE*/

@media (max-width:400px){

    .about-company{
        padding:45px 4%;
    }

    .section-tag{
        font-size:12px;
        letter-spacing:1.5px;
    }

    .company-image img{
        max-width:240px;
    }

    .experience-badge{
        left:10px;
        bottom:10px;
        padding:12px 16px;
    }

    .experience-badge h2{
        font-size:1.2rem;
    }

    .experience-badge span{
        font-size:.8rem;
    }

    .company-content h2{
        font-size:21px;
        line-height:1.4;
    }

    .company-content > p{
        font-size:13px;
        line-height:1.7;
    }

    .highlight{
        gap:12px;
    }

    .highlight-icon{
        width:34px;
        height:34px;
        font-size:.9rem;
    }

    .highlight h4{
        font-size:15px;
    }

    .highlight p{
        font-size:12px;
    }

}

/*VISION SECTION*/

/*LARGE LAPTOP*/

@media (max-width:1200px){

    .vision-section{
        padding:100px 5%;
    }

    .vision-container{
        gap:60px;
    }

    .vision-left h2{
        font-size:34px;
    }

    .vision-left p{
        font-size:15px;
        line-height:1.7;
    }

    .vision-card{
        max-width:430px;
        padding:45px 35px;
    }

}

/*TABLETS*/

@media (max-width:992px){

    .vision-section{
        padding:80px 5%;
    }

    .vision-container{
        flex-direction:column;
        text-align:center;
        gap:50px;
    }

    .vision-left,
    .vision-right{
        width:100%;
    }

    .vision-left h2{
        font-size:32px;
    }

    .vision-left p{
        font-size:15px;
        line-height:1.8;
        max-width:700px;
        margin:0 auto 25px;
    }

    .vision-list{
        align-items:center;
    }

    .vision-item{
        justify-content:center;
    }

    .vision-card{
        max-width:650px;
        margin:auto;
    }

    .vision-author{
        justify-content:center;
    }

}

/*SMALL TABLET*/

@media (max-width:768px){

    .vision-section{
        padding:70px 5%;
    }

    .vision-left .section-tag{
        font-size:13px;
        letter-spacing:2px;
    }

    .vision-left h2{
        font-size:28px;
        line-height:1.35;
    }

    .vision-left p{
        font-size:14px;
        line-height:1.8;
    }

    .vision-list{
        gap:18px;
    }

    .vision-item{
        gap:15px;
    }

    .vision-item i{
        width:34px;
        height:34px;
        font-size:14px;
    }

    .vision-item span{
        font-size:15px;
    }

    .vision-card{
        padding:35px 30px;
        border-radius:24px;
    }

    .quote-icon{
        width:38px;
        height:38px;
        font-size:14px;
        margin-bottom:20px;
    }

    .vision-card p{
        font-size:15px;
        line-height:1.8;
    }

}
/*MOBILE*/

@media (max-width:576px){

    .vision-section{
        padding:60px 4%;
    }

    .vision-left .section-tag{
        font-size:12px;
        letter-spacing:1.5px;
    }

    .vision-left h2{
        font-size:24px;
    }

    .vision-left p{
        font-size:14px;
    }

    .vision-list{
        gap:16px;
    }

    .vision-item{
        justify-content:flex-start;
        text-align:left;
    }

    .vision-item span{
        font-size:14px;
    }

    .vision-card{
        padding:30px 25px;
        border-radius:20px;
    }

    .vision-card p{
        font-size:14px;
        margin-bottom:25px;
    }

    .author-line{
        width:45px;
    }

    .vision-author span{
        font-size:14px;
    }

}

/*SMALL MOBILE*/

@media (max-width:400px){

    .vision-section{
        padding:50px 4%;
    }

    .vision-left h2{
        font-size:21px;
        line-height:1.4;
    }

    .vision-left p{
        font-size:13px;
        line-height:1.7;
    }

    .vision-item{
        gap:12px;
    }

    .vision-item i{
        width:32px;
        height:32px;
        font-size:13px;
    }

    .vision-item span{
        font-size:13px;
    }

    .vision-card{
        padding:25px 20px;
    }

    .quote-icon{
        width:34px;
        height:34px;
        font-size:13px;
    }

    .vision-card p{
        font-size:13px;
    }

    .vision-author span{
        font-size:13px;
    }

}

/*MISSION*/

/*LARGE LAPTOPS*/

@media (max-width:1200px){

    .mission-section{
        padding:100px 5%;
    }

    .mission-container{
        gap:60px;
    }

    .mission-image img{
        max-width:420px;
    }

    .mission-content h2{
        font-size:34px;
    }

    .mission-content > p{
        font-size:15px;
        line-height:1.7;
    }

}

/*TABLETS*/

@media (max-width:992px){

    .mission-section{
        padding:80px 5%;
    }

    .mission-container{
        flex-direction:column;
        text-align:center;
        gap:50px;
    }

    .mission-image,
    .mission-content{
        width:100%;
    }

    .mission-image img{
        max-width:400px;
    }

    .mission-content h2{
        font-size:32px;
    }

    .mission-content > p{
        max-width:700px;
        margin:0 auto 25px;
        font-size:15px;
        line-height:1.8;
    }

    .mission-points{
        align-items:center;
        gap:12px;
    }

    .mission-point{
        justify-content:center;
        max-width:600px;
        width:100%;
    }

}

/* SMALL TABLET*/

@media (max-width:768px){

    .mission-section{
        padding:70px 5%;
    }

    .mission-content .section-tag{
        font-size:13px;
        letter-spacing:2px;
    }

    .mission-content h2{
        font-size:28px;
        line-height:1.35;
    }

    .mission-content > p{
        font-size:14px;
        line-height:1.8;
    }

    .mission-image img{
        max-width:340px;
    }

    .mission-points{
        gap:15px;
    }

    .mission-point{
        gap:14px;
        padding:12px 15px;
        justify-content:flex-start;
        text-align:left;
    }

    .mission-point i{
        width:36px;
        height:36px;
        font-size:13px;
    }

    .mission-point span{
        font-size:14px;
    }

}

/*MOBILE*/

@media (max-width:576px){

    .mission-section{
        padding:60px 4%;
    }

    .mission-content .section-tag{
        font-size:12px;
        letter-spacing:1.5px;
    }

    .mission-content h2{
        font-size:24px;
    }

    .mission-content > p{
        font-size:14px;
    }

    .mission-image img{
        max-width:280px;
    }

    .mission-points{
        gap:12px;
    }

    .mission-point{
        padding:10px 12px;
        gap:12px;
    }

    .mission-point i{
        width:34px;
        height:34px;
        border-radius:12px;
        font-size:12px;
    }

    .mission-point span{
        font-size:13px;
        line-height:1.5;
    }

}

/*SMALL MOBILE*/

@media (max-width:400px){

    .mission-section{
        padding:50px 4%;
    }

    .mission-content h2{
        font-size:21px;
        line-height:1.4;
    }

    .mission-content > p{
        font-size:13px;
        line-height:1.7;
    }

    .mission-image img{
        max-width:240px;
    }

    .mission-point{
        gap:10px;
        padding:8px 10px;
    }

    .mission-point i{
        width:32px;
        height:32px;
        font-size:11px;
    }

    .mission-point span{
        font-size:12px;
    }

}