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

@media(max-width:1100px){

.nav-links,
.nav-right{

    display:none;

}

.hamburger{

    display:block;

}

}

@media(max-width:768px){

.logo span{

    display:none;

}

section{

    padding:90px 0;

}

h1{

    font-size:48px;

}

h2{

    font-size:38px;

}

.mobile-menu a{

    font-size:26px;

}

}

@media(max-width:480px){

.container{

    width:92%;

}

.mobile-menu a{

    font-size:22px;

}

.mobile-cta{

    font-size:16px !important;

}

}
/*==================================================
HERO RESPONSIVE
==================================================*/

@media(max-width:992px){

.hero{

    padding-top:120px;

}

.hero-grid{

    grid-template-columns:1fr;

    text-align:center;

    gap:70px;

}

.hero-content{

    max-width:100%;

}

.hero-buttons{

    justify-content:center;

}

.hero-clients{

    justify-content:center;

}

.hero h1{

    font-size:54px;

}

.card1{

    right:0;

}

.card2{

    left:0;

}

}

@media(max-width:768px){

.hero h1{

    font-size:42px;

}

.hero p{

    font-size:16px;

}

.dashboard{

    width:100%;

    padding:24px;

}

.chart{

    height:140px;

}

.bar{

    width:34px;

}

.floating-card{

    font-size:14px;

    padding:12px 18px;

}

}

@media(max-width:480px){

.hero{

    padding-top:110px;

}

.hero h1{

    font-size:34px;

}

.hero-buttons{

    flex-direction:column;

}

.hero-buttons .cta-btn,

.hero-buttons .portfolio-btn{

    width:100%;

}

.hero-clients{

    flex-direction:column;

    gap:12px;

}

.floating-card{

    display:none;

}

}
/*==========================================
HERO
==========================================*/

@media(max-width:992px){

.hero-grid{

    grid-template-columns:1fr;

    text-align:center;

    gap:70px;

}

.hero-buttons{

    justify-content:center;

}

.hero-clients{

    justify-content:center;

}

.hero h1{

    font-size:56px;

}

.dashboard{

    margin:auto;

}

}

@media(max-width:768px){

.hero{

    padding-top:120px;

}

.hero h1{

    font-size:42px;

}

.hero p{

    font-size:16px;

}

.dashboard{

    width:100%;

}

.bar{

    width:34px;

}

.floating-card{

    font-size:14px;

    padding:12px 16px;

}

}

@media(max-width:500px){

.hero h1{

    font-size:34px;

}

.hero-buttons{

    flex-direction:column;

}

.hero-buttons a{

    width:100%;

}

.floating-card{

    display:none;

}

.scroll-down{

    display:none;

}

}
@media (max-width: 1200px) {
  .services-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 992px) {
  .services-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .services-grid { grid-template-columns: 1fr; }
}
@media (max-width: 576px) {
  .service-card { padding: 28px; }
}
@media (max-width: 390px) {
  .service-card { padding: 24px; }
}
/*=========================
        Laptop
=========================*/

@media(max-width:1400px){

.impact-card h3{

font-size:65px;

}

}


/*=========================
        Tablet
=========================*/

@media(max-width:992px){

    .impact-grid{
        grid-template-columns:repeat(2,1fr);
        gap:18px;
    }

    .impact-heading h2{
        font-size:42px;
    }

    .impact-card h3{
        font-size:48px;
    }

}


/*=========================
        Mobile
=========================*/


@media(max-width:768px){

    .impact-section{
        padding:50px 20px;
    }

    .impact-heading{
        margin-bottom:35px;
    }

    .impact-heading h2{
        font-size:34px;
    }

    .impact-heading p{
        font-size:17px;
    }

    .impact-grid{
        grid-template-columns:1fr;
        gap:16px;
    }

    .impact-card{
        padding:24px;
        border-radius:20px;
    }

    .impact-card h3{
        font-size:42px;
    }

    .impact-card span{
        font-size:17px;
    }

}


@media(max-width:992px){

.cta-box{

padding:80px 30px;

}

.cta-box h2{

font-size:48px;

}

.cta-box p{

font-size:20px;

}

}

@media(max-width:768px){

    .cta-section{
        padding:50px 20px;
    }

    .cta-box{
        padding:45px 25px;
        border-radius:28px;
    }

    .cta-box h2{
        font-size:34px;
    }

    .cta-box p{
        font-size:17px;
        margin-bottom:30px;
    }

    .cta-btn{
        padding:16px 28px;
        font-size:18px;
    }

}
@media(max-width:768px){

.footer-container{

flex-direction:column;

text-align:center;

}

.footer-social{

margin-top:20px;

}

.footer-left p{

font-size:16px;

}

}

@media (max-width:700px){

    .footer-grid img{
        display:block;
        margin:0 auto 25px;
    }

}

@media (max-width:700px){

    .footer-grid > div:first-child{
        display:flex;
        flex-direction:column;
        align-items:center;
        text-align:center;
    }

    .footer-grid > div:first-child img{
        display:block;
        margin:0 auto;
    }

    .footer-grid > div:first-child p{
        display:none;
    }

}

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

@media(max-width:992px){

.why-grid{

grid-template-columns:1fr;

gap:70px;

}

.why-left{

position:relative;

top:auto;

text-align:center;

}

.why-left p{

margin:auto;

}

.circle-wrapper{

margin:60px auto 0;

}

}

@media(max-width:768px){

.why-left h2{

font-size:48px;

}

.why-card{

padding:30px;

}

.icon{

width:60px;
height:60px;

font-size:26px;

}

}

@media(max-width:480px){

.why-left h2{

font-size:36px;

}

.section-tag{

font-size:13px;

}

.circle-wrapper{

width:180px;
height:180px;

}

.c1{

width:180px;
height:180px;

}

.c2{

width:120px;
height:120px;
left:30px;
top:30px;

}

.c3{

width:60px;
height:60px;
left:60px;
top:60px;

}

}

@media(max-width:768px){

.hero{

padding-top:50px;

}

.hero h1{

font-size:58px;

letter-spacing:-2px;

}

.hero p{

font-size:18px;

padding:0 20px;

}

.hero-buttons{

flex-direction:column;

align-items:center;

}

.btn-primary,
.btn-secondary{

width:100%;
max-width:320px;
justify-content:center;

}

}

@media(max-width:992px){

.float{

width:42px;

}

.target1{

width:70px;

}

.chart1{

width:55px;

}

.pen1{

width:60px;

}

}

@media (max-width:768px){

    .nav-right{
        display:none;
    }

    .mobile-login-btn{
        display:flex;
        align-items:center;
        justify-content:center;

        width:42px;
        height:42px;

        border:1.5px solid #0B5D3B;
        border-radius:50%;

        color:#0B5D3B;
        background:#fff;

        font-size:20px;

        margin-left:auto;
        margin-right:12px;
    }

    .hamburger{
        display:flex;
    }

}