/* ======================================================
   RESPONSIVE / MEDIA QUERIES
   ====================================================== */

/* Large screens */
@media (min-width: 1400px) {

    :root {
        --container: 1320px;
    }

    .hero h1 {
        font-size: 62px;
    }
    .svc-do-grid{
            grid-template-columns: repeat(3, 1fr);
    }
    .about-grid{
        align-items: center;
    }
    .about-media{
        position: relative;
       
    }
    .navbar .nav-logo{
    display:none;
}
.topbar .nav-logo{
    display:flex;
}
}

/* Desktop -> small desktop / large tablet */
@media (max-width: 1024px) {
  
    .service-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .why-features {
        grid-template-columns: repeat(2, 1fr);
    }

    .gallery-grid {
        grid-template-columns: repeat(3, 1fr);
    }

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

}

/* Tablet */
@media (max-width: 900px) {
    .hamburger {
        display: block;
    }

    .nav-row {
        position: relative;
    }

    .menu {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--dark-2);
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        max-height: 0;
        overflow: hidden;
        transition: max-height .3s ease;
    }

    .menu.open {
        max-height: 600px;
        padding: 8px 0;
    }

    .menu>a {
        padding: 13px 20px;
        border-bottom: 1px solid #333;
        width: 100%;
    }
.topbar .nav-logo {
    display:none;
}

    .topbar{
        display: none;
    }

    /* floating WhatsApp + Call buttons: mobile/tablet only */
    .float-actions {
        display: flex;
    }

    .testi-grid {
        grid-template-columns: 1fr;
    }

    .cta-text strong {
        font-size: 18px;
    }
    .about-media{
           position: relative;
    top:0;
    }
    .about-grid{
        align-items: center;
    }
}

/* Mobile */
@media (max-width: 600px) {

    .btn{
        padding:10px;
        font-size:12px;
    }
    .topbar-info {
        gap: 16px;
    }
.navbar .btn-red{
    display:none;
}
.ti-icon {
    width: 34px;
    height: 34px;
    font-size: 13px;
}

.ti-item {
   
    width: 215px;
}
    .hero-content {
        padding: 60px 20px;
    }

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

    .hero p {
        font-size: 15px;
    }

    .hero-btns .btn,
    .cta-row .btn {
        width: 100%;
        justify-content: center;
    }

    .hero-btns {
        width: 100%;
    }

    h2 {
        font-size: 24px;
    }

    .service-grid {
        grid-template-columns: 1fr;
    }

    .why-top {
        grid-template-columns: 1fr;
    }

    .why-features {
        grid-template-columns: 1fr;
    }

    .stats {
        grid-template-columns: 1fr 1fr;
    }

    .gallery-grid {
        grid-template-columns: 1fr 1fr;
        grid-auto-rows: 200px;
    }

    .gallery-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .g-item figcaption {
        transform: translateY(0);
        opacity: 1;
    }

    .check-list {
        grid-template-columns: 1fr;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .cta-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .about,
    .services,
    .why,
    .gallery,
    .testimonials {
        padding: 50px 0;
    }
}

/* Very small phones */
@media (max-width: 380px) {
    .service-grid,
    .gallery-grid,
    .stats {
        grid-template-columns: 1fr;
    }

    .g-item.g-wide {
        grid-column: span 1;
    }

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