
                /* Responsive Design */
        @media (max-width: 992px) {            
            .steps {
                flex-direction: column;
                gap: 40px;
            }
            
            .steps::before {
                display: none;
            }
            
            .step {
                width: 100%;
            }
            .comments-section {
                flex-direction: column;
            }
            .comment-content-container, .comments-section .video{
                max-width: 100%;
            }
        }

@media (max-width: 768px) {
    #training .training-list{
        flex-direction: column;
    }
    .training-filter{
        width: 100%;
    }
    .achievement {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
    
    .stat-card {
        padding: 20px 15px;
    }
    
    .stat-number {
        font-size: 2rem;
    }
    
    .stat-text {
        font-size: 1rem;
    }
    
    .stat-icon {
        width: 50px;
        height: 50px;
        font-size: 1.3rem;
    }
        .footer-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    .footer-bottom {
        flex-direction: column;
    }

    .project-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        gap: 1.8rem;
    }
    #projects {
        padding: 4rem 5%;
    }
    #aboutMe .about{
        flex-direction: column;
    }
    .about .profile,
    .about .content,
    #aboutMe .about .profile,
    #aboutMe .about,
    .other-service .profile,
    .other-service .content,
    .search-bar form,
    #home-contact .contact-info,
    #home-contact .contact-form{
        width: 100%;
        max-width: 100%;
    }
    .hero-bg{
        background-size: cover;
    }
    .hero-tagline{
    font-weight: 800;
    }
    .edu-header,
    .edu-content,
    .project-content,
    .contact-info,
    .contact-form-wrapper{
        padding: 15px;
    }
    #about .contact-info{
        gap: 10px;
    }

    .contact-container {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .info-item {
        margin-bottom: 20px;
    }
    .other-service{
        flex-direction: column;
        gap: 0;
    }

    .training-card{
        max-width: 100%;
    }
    .search-bar {
    flex-direction: column;
    gap: 20px;
}

.training-buttons .btn{
    padding: 5px 10px;
    width: 45%;
}
#home-contact .contact-info,
    #home-contact .contact-form{
        flex: none;
    }

    .mobile-view{
        display: block;
    }
    .desktop-view{
        display: none;
    }
    .video-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .achievement {
        grid-template-columns: 1fr;
    }
        .footer-grid {
        grid-template-columns: 1fr;
    }

    .filter-controls {
        gap: 0.6rem;
        justify-content: space-between;
    }
    .filter-btn {
        padding: 0.5rem 1.2rem;
        font-size: 0.85rem;
    }
    .search-bar form,
    .verify-form{
        flex-direction: column;
    }
    .input-field{
        max-width: 100%;
        width: 100%;
    }
    #about-stats .stats-grid,.clients-grid{
        gap: 15px;
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }
    .clients-grid{
        gap: 30px;
    }
    .service-card{
        max-width: 100%;
    }
    #about-chairman .chairman-box{
        display: block;
    }
    #home-contact .contact-wrapper{
        padding: 20px;
    }
}