/* ===========================
   TABLETS
=========================== */

@media (max-width: 900px) {

    .hero h1 {
        font-size: 42px;
    }

    .about .container,
    .offers .container,
    .contact-grid {
        grid-template-columns: 1fr;
    }

    .cards,
    .offer-grid,
    .gallery-grid,
    .stats .container {
        grid-template-columns: 1fr 1fr;
    }

    .buttons,
    .hero-buttons {
        flex-direction: column;
        align-items: center;
    }

    /* Hide desktop navigation */
    .nav-links {
        display: none;
    }

    /* Show hamburger */
    .hamburger {
        display: flex;
    }
}

/* ===========================
   PHONES
=========================== */

@media (max-width: 768px) {

    .btn {
        width: 260px;
    }

    .stats .container,
    .cards,
    .offer-grid,
    .gallery-grid {
        grid-template-columns: 1fr;
    }

    #backToTop {
        width: 50px;
        height: 50px;
        right: 20px;
        bottom: 20px;
    }

    /* Mobile navigation */

    .nav-links.active {

        display: flex;

        position: fixed;

        top: 80px;
        right: 0;

        width: 280px;
        height: calc(100vh - 80px);

        background: #111;

        flex-direction: column;

        align-items: center;

        gap: 30px;

        padding-top: 40px;

        z-index: 9999;
    }
}