/* ========== TABLET (max-width: 1024px) ========== */
@media (max-width: 1024px) {
    .about-content {
        grid-template-columns: 1fr;
    }

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

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

    .work-item {
        height: 360px;
    }

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

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

    .award-table-header,
    .award-row {
        grid-template-columns: 40px 1fr 120px 80px 120px;
        font-size: 13px;
    }
}

/* ========== MOBILE (max-width: 768px) ========== */
@media (max-width: 768px) {
    .nav {
        padding: 20px var(--container-padding);
    }

    .nav-links {
        display: none;
    }

    .nav-hamburger {
        display: flex;
    }

    .hero-content {
        padding: 24px;
    }

    .hero-info {
        flex-direction: column;
        gap: 12px;
    }

    .stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
        margin-top: 48px;
        padding-top: 48px;
    }

    .works-grid {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 16px;
        padding-bottom: 16px;
        -webkit-overflow-scrolling: touch;
    }

    .works-grid::-webkit-scrollbar {
        display: none;
    }

    .work-item {
        min-width: 280px;
        max-width: 85vw;
        height: 360px;
        flex-shrink: 0;
        scroll-snap-align: start;
    }

    .work-item-skeleton {
        min-width: 280px;
        flex-shrink: 0;
    }

    .service-name {
        font-size: 16px;
    }

    .award-table-header,
    .award-row {
        grid-template-columns: 30px 1fr 1fr;
        font-size: 12px;
    }

    .award-table-header .category-col,
    .award-row .category,
    .award-table-header .year-col,
    .award-row .year {
        display: none;
    }

    .feature-table-header,
    .feature-row {
        grid-template-columns: 1fr 120px;
    }

    .contact-top {
        gap: 48px;
        margin-bottom: 80px;
    }

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

    .testimonial-card {
        padding: 24px;
    }
}
