/*=========================================================
LARGE DESKTOP
=========================================================*/

@media (max-width:1600px){

    .hero-title{

        font-size:7rem;

    }

}

/*=========================================================
LAPTOP
=========================================================*/

@media (max-width:1400px){

    .hero-title{

        font-size:6rem;

    }

    .work-content{

        padding-left:40px;

    }

}

/*=========================================================
TABLET LANDSCAPE
=========================================================*/

@media (max-width:991px){

    body{

        font-size:16px;

    }

    .navbar{

        padding:15px 20px;

    }

    .hero{

        text-align:center;

    }

    .hero-actions{

        justify-content:center;

    }

    .story-title{

        font-size:4rem;

    }

    .cube-wrapper{

        margin-top:60px;

        transform:scale(.8);

    }

    .work-card{

        position:relative;

        height:auto;

        padding:80px 0;

        border-radius:0;

    }

    .work-image img{

        height:450px;

    }

    .work-content{

        padding:40px 0 0;

    }

    .work-progress{

        display:none;

    }

}

/*=========================================================
TABLET
=========================================================*/

@media (max-width:768px){

	.showreel
	{
		margin-top: 80px;
	}

    .hero-title{

        font-size:4rem;

        letter-spacing:2px;

    }

    .hero-actions{

        flex-direction:column;

    }

    .btn-primary-custom,

    .btn-hero{

        width:100%;

    }

    .services-list{

        justify-content:center;

    }

    .cube-wrapper{

        transform:scale(.65);

    }

    .impact-card{

        margin-bottom:30px;

    }

}

/*=========================================================
MOBILE
=========================================================*/

@media (max-width:576px){

    .hero-title{

        font-size:3rem;

    }

    .section{

        padding:90px 0;

    }

    .story-title{

        font-size:2.8rem;

    }

    .section-title{

        font-size:2.4rem;

    }

    .work-content h2{

        font-size:2.5rem;

    }

    .intro-text{

        flex-direction:column;

        font-size:42px;

        gap:5px;

    }

    .logo-track{

        gap:45px;

    }

    .logo-track img{

        height:30px;

    }

}