@media (max-width: 968px) {
    .hero-content {grid-template-columns: 1fr; text-align: center;}
    .hero-text h1 {font-size: 2.5rem;}
    .hero-buttons {justify-content: center;}
    .social-links {justify-content: center;}
    .about-content {grid-template-columns: 1fr;}
    .project-card-detailed {grid-template-columns: 1fr;}
    .project-card-detailed .project-image {min-height: 250px;}
    .contact-content {grid-template-columns: 1fr;}
    .nav-menu {
        position: fixed; left: -100%; top: 70px; flex-direction: column;
        background: var(--card-bg); backdrop-filter: blur(10px); width: 100%;
        text-align: center; transition: left var(--transition-normal);
        padding: var(--spacing-md) 0; border-bottom: 1px solid var(--card-border);
    }
    .nav-menu.active {left: 0;}
    .hamburger {display: flex;}
    .hamburger.active span:nth-child(1) {transform: rotate(45deg) translate(8px, 8px);}
    .hamburger.active span:nth-child(2) {opacity: 0;}
    .hamburger.active span:nth-child(3) {transform: rotate(-45deg) translate(7px, -7px);}
}

@media (max-width: 640px) {
    .hero-text h1 {font-size: 2rem;}
    .subtitle {font-size: 1.2rem;}
    .page-title {font-size: 2rem;}
    .section-title {font-size: 2rem;}
    .projects-grid {grid-template-columns: 1fr;}
    .hero-buttons {flex-direction: column;}
    .btn {width: 100%; justify-content: center;}
    .image-container {width: 300px !important; height: 300px !important;}
    .filter-buttons {flex-direction: column;}
    .filter-btn {width: 100%;}
}