/*
Theme Name: Portfolio Theme
Author: Sabbir Ahmad
Description: Clean Theme with Hind Siliguri and Responsive Menu
Version: 1.8
*/

@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600;700&display=swap');

body {
    margin: 0; padding: 0;
    font-family: 'Hind Siliguri', sans-serif;
    background-color: #fdfdfd; color: #333;
    overflow-x: hidden; /* মোবাইলে ডানে-বামে স্ক্রল বন্ধ করতে */
}

.container { width: 90%; margin: 0 auto; max-width: 1200px; }

/* লোগো সাইজ */
.custom-logo { max-width: 50px; height: auto; display: block; }

/* মেনু ডিজাইন - কম্পিউটার */
.nav-list { display: flex; list-style: none; gap: 20px; margin: 0; padding: 0; }
.nav-list li a { text-decoration: none; color: #333; font-weight: 500; }
.mobile-menu-btn { display: none; cursor: pointer; font-size: 24px; color: #004d30; }

/* মোবাইল রেসপনসিভ ফিক্স */
@media (max-width: 768px) {
    .hero-flex-container {
        flex-direction: column-reverse !important; 
    }

    .nav-list {
        display: none; /* জাভাস্ক্রিপ্ট ক্লিক ছাড়া এটি দেখাবে না */
        flex-direction: column; 
        position: absolute;
        top: 60px; /* হেডারের উচ্চতা অনুযায়ী অ্যাডজাস্ট করা */
        left: 0; 
        width: 100%; 
        background: #ffffff; 
        padding: 20px 0; 
        box-shadow: 0 10px 15px rgba(0,0,0,0.1); 
        z-index: 9999; /* মেনু যাতে সব কন্টেন্টের উপরে থাকে */
        box-sizing: border-box;
    }

    /* মেনু যখন ওপেন হবে */
    .nav-list.active { 
        display: flex !important; 
    }

    .nav-list li {
        width: 100%;
        text-align: center;
        padding: 10px 0;
        border-bottom: 1px solid #f0f0f0;
    }

    .nav-list li a {
        color: #333 !important; /* সাদা ব্যাকগ্রাউন্ডে টেক্সট কালো হবে */
        display: block;
        width: 100%;
    }

    .mobile-menu-btn { 
        display: block; 
    }
    
    .custom-logo { max-width: 40px; }
    
    .hero-text-area {
        text-align: center !important;
        margin-top: 20px;
    }
}

/* গ্রিড ও গ্যালারি */
.grid-container { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; }

/* স্ক্রলবার হাইড (সব এলিমেন্টের জন্য) */
*::-webkit-scrollbar { display: none; }
* { -ms-overflow-style: none; scrollbar-width: none; }