/* ---------- SKILLS RESPONSIVE ---------- */

@media (max-width: 900px) {

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

}

@media (max-width: 600px) {

    .skills-container {
        grid-template-columns: 1fr;
    }

    .skills-section {
        padding: 80px 6%;
    }

    .section-heading h2 {
        font-size: 34px;
    }

}

@media (max-width: 700px) {

    .experience-section {
        padding: 80px 6%;
    }

    .timeline {
        margin-top: 50px;
    }

    .timeline-item {
        padding-left: 50px;
    }

    .timeline::before {
        left: 12px;
    }

    .timeline-dot {
        left: 3px;
    }

    .experience-card {
        padding: 22px;
    }

    .experience-header {
        flex-direction: column;
        gap: 12px;
    }

    .experience-header span {
        align-self: flex-start;
    }

}

@media (max-width: 700px) {

    .projects-section {
        padding: 80px 6%;
    }

    .projects-container {
        grid-template-columns: 1fr;
    }

    .project-image {
        height: 200px;
    }

}

@media (max-width: 900px) {

    .credentials-container {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 600px) {

    .education-section {
        padding: 80px 6%;
    }

}

@media (max-width: 800px) {

    .contact-section {
        padding: 80px 6%;
    }

    .contact-container {
        grid-template-columns: 1fr;
        gap: 40px;
    }

}

@media (max-width: 600px) {

    .footer {
        padding: 40px 6% 20px;
    }

    .footer-container {
        flex-direction: column;
        align-items: flex-start;
        gap: 25px;
    }

    .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

}