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

/* Large Desktop */

@media (max-width:1400px) {

    .container {

        width: 95%;

    }

    .hero h1 {

        font-size: 54px;

    }

    .section-title h2 {

        font-size: 42px;

    }

}

/*=========================================*/

/* Laptop */

@media (max-width:1200px) {

    .nav-links {

        gap: 20px;

    }

    .hero {

        padding: 140px 0;

    }

    .hero h1 {

        font-size: 48px;

    }

    .hero p {

        font-size: 18px;

    }

    .about-grid {

        grid-template-columns: 1fr;

        gap: 50px;

    }

    .stats-grid {

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

    }

    .service-grid {

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

    }

    .solutions-grid {

        grid-template-columns: 1fr;

    }

    .industry-grid {

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

    }

    .tech-grid {

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

    }

    .innovation-grid {

        grid-template-columns: 1fr;

    }

    .why-grid {

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

    }

    .timeline {

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

    }

    .portfolio-grid {

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

    }

    .footer-grid {

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

    }

}

/*=========================================*/

/* Tablet */

@media (max-width:992px) {

    .navbar {

        padding: 18px 0;

    }

    .logo img {

        width: 160px;

    }

    .nav-links {

        display: none;

    }

    .mobile-toggle {

        display: block;

        cursor: pointer;

        font-size: 30px;

    }

    .hero {

        text-align: center;

        padding: 120px 0;

    }

    .hero-content {

        margin: auto;

    }

    .hero h1 {

        font-size: 42px;

    }

    .hero-buttons {

        display: flex;

        justify-content: center;

        flex-wrap: wrap;

        gap: 15px;

    }

    .about-features {

        grid-template-columns: 1fr;

    }

    .stats-grid {

        grid-template-columns: 1fr;

    }

    .service-grid {

        grid-template-columns: 1fr;

    }

    .industry-grid {

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

    }

    .tech-grid {

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

    }

    .why-grid {

        grid-template-columns: 1fr;

    }

    .timeline {

        grid-template-columns: 1fr;

    }

    .portfolio-grid {

        grid-template-columns: 1fr;

    }

    .testimonial-slider {

        grid-template-columns: 1fr;

    }

    .footer-grid {

        grid-template-columns: 1fr;

        text-align: center;

    }

}

/*=========================================*/

/* Mobile */

@media (max-width:768px) {

    .hero {

        min-height: 90vh;

    }

    .hero h1 {

        font-size: 34px;

        line-height: 1.3;

    }

    .hero h5 {

        font-size: 16px;

    }

    .hero p {

        font-size: 16px;

    }

    .section-title h2 {

        font-size: 34px;

    }

    .section-title p {

        font-size: 16px;

    }

    .about-content h3 {

        font-size: 30px;

    }

    .service-card {

        padding: 35px;

    }

    .solution-card {

        padding: 35px;

    }

    .innovation-card {

        padding: 35px;

    }

    .tech-grid {

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

    }

    .industry-grid {

        grid-template-columns: 1fr;

    }

    .cta h2 {

        font-size: 36px;

    }

    .btn-primary,

    .btn-secondary {

        display: block;

        width: 100%;

        text-align: center;

        margin: 10px 0;

    }

}

/*=========================================*/

/* Small Mobile */

@media (max-width:576px) {

    .container {

        width: 92%;

    }

    .hero {

        padding: 100px 0;

    }

    .hero h1 {

        font-size: 30px;

    }

    .section-title h2 {

        font-size: 28px;

    }

    .section-title span {

        font-size: 14px;

    }

    .about-grid {

        gap: 30px;

    }

    .about-features {

        grid-template-columns: 1fr;

    }

    .feature {

        padding: 15px;

    }

    .stat-card {

        padding: 30px;

    }

    .stat-card h2 {

        font-size: 42px;

    }

    .service-card {

        padding: 30px;

    }

    .solution-card {

        padding: 30px;

    }

    .tech-grid {

        grid-template-columns: 1fr;

    }

    .timeline {

        gap: 20px;

    }

    .step {

        padding: 25px;

    }

    .footer-grid {

        gap: 30px;

    }

    .copyright {

        font-size: 14px;

    }

}

/*=========================================*/

/* Ultra Small */

@media (max-width:400px) {

    .hero h1 {

        font-size: 26px;

    }

    .section-title h2 {

        font-size: 24px;

    }

    .btn-primary,

    .btn-secondary {

        padding: 14px 20px;

        font-size: 14px;

    }

    .logo img {

        width: 140px;

    }

}