/* Responsive CSS File */


/* Tablet Styles */

@media screen and (max-width: 1024px) {
    h1 {
        font-size: 2.8rem;
    }
    h2 {
        font-size: 2rem;
    }
    .hero {
        flex-direction: column;
        text-align: center;
    }
    .hero-content {
        max-width: 100%;
        margin-bottom: 3rem;
    }
    .hero-cta {
        justify-content: center;
    }
    .skills-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    /* Removed redundant .project-cards rule (handled in main.css @ 1024px) */
    .about-hero {
        flex-direction: column-reverse;
    }
    .about-image {
        margin-bottom: 2rem;
    }
    .contact-container {
        flex-direction: column;
    }
    .contact-info {
        margin-bottom: 2rem;
    }
}


/* Mobile Styles */

@media screen and (max-width: 768px) {
    /* Removed redundant header/nav/hamburger rules (handled in main.css @ 768px) */
    /* Removed redundant h1/h2 rules (handled in main.css @ 768px) */
    /* Removed redundant .hero-cta rules (handled in main.css @ 768px) */
    .skills-grid {
        /* Kept assuming it targets different elements than .skills-matrix in main.css */
        grid-template-columns: 1fr;
    }
    /* Removed redundant .project-cards rule (handled in main.css @ 768px) */
    /* Removed redundant .timeline-date / .timeline-content rules (handled in main.css @ 1024px) */
    .contact-info {
        /* Assuming this is unique */
        grid-template-columns: 1fr;
    }
    /* Removed redundant .footer-content / .footer-left rules (handled in main.css @ 768px) */
}


/* Small Mobile Styles */

@media screen and (max-width: 480px) {
    .project-tech span {
        font-size: 0.7rem;
    }
    .project-meta {
        flex-direction: column;
        align-items: flex-start;
    }
    .experience-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .job-duration {
        margin-top: 0.5rem;
    }
    .tech-badges {
        gap: 0.4rem;
    }
    .tech-badge {
        font-size: 0.75rem;
        padding: 0.3rem 0.6rem;
    }
    .company-logo {
        width: 40px;
        height: 40px;
    }
    .company-logo i {
        font-size: 1.2rem;
    }
}


/* Removed standalone default .projects-grid and .project-card-resume rules (defined in main.css) */


/* Removed final duplicate @media (max-width: 768px) block (handled in main.css @ 768px) */