/* --- 📱 Mobile & Tablet Responsive Fix --- */
@media screen and (max-width: 768px) {
    .card-grid {
        /* Sidebar එකට තැබූ ඉඩ අයින් කරමු */
        margin-left: 0 !important; 
        padding: 15px;
        gap: 15px;
        
        /* Mobile එකේදී එක පේළියට කාඩ් 1ක් හෝ 2ක් පෙන්වීමට */
        grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
    }

    /* කාඩ් එකේ Title එක පොඩ්ඩක් ලොකු කරමු Mobile එකට ගැලපෙන්න */
    .yt-title {
        font-size: 15px;
    }

    /* Content එක Header එකට යට නොවෙන්න (Header එක fixed නම්) */
    body {
        padding-top: 70px; 
    }
}

/* Tablet වගේ පොඩ්ඩක් ලොකු screen වලට (පේළියට කාඩ් 2 බැගින්) */
@media screen and (min-width: 480px) and (max-width: 768px) {
    .card-grid {
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    }
}