:root {
            --lush-black: #000000;
            --lush-white: #ffffff;
            --light-orange: #FFB347; /* Light Orange Color */
            --text-grey: #333333;
        }

        body {
            font-family: 'Helvetica Neue', Arial, sans-serif;
            background-color: var(--lush-white);
            margin: 0;
            padding: 0;
            color: var(--lush-black);
            overflow-x: hidden;
        }

        .main-container {
            display: flex;
            min-height: 100vh;
        }

        /* Left Side: Light Orange Background, Fixed & Centered Title */
        .left-sidebar {
            flex: 0 0 40%; 
            position: sticky;
            top: 0;
            height: 100vh; 
            background-color: var(--light-orange); /* Orange Color */
            color: var(--lush-black); /* Text black rakha hoyeche orange-er upor porar shubidhay */
            display: flex;
            align-items: center; 
            justify-content: center; 
            padding: 60px;
            box-sizing: border-box;
            z-index: 10;
        }

        .left-sidebar h1 {
            font-size: clamp(40px, 5vw, 70px); 
            font-weight: 900;
            text-transform: uppercase;
            line-height: 0.9;
            margin: 0;
            letter-spacing: -3px;
            text-align: left;
        }

        /* Right Side: White Background, Scrollable Team Members */
        .right-content {
            flex: 1;
            padding: 100px 80px;
            background-color: var(--lush-white); 
        }

        .team-grid {
            display: flex;
            flex-direction: column;
            gap: 100px; 
        }

        .member-card {
            display: flex;
            flex-direction: column;
            max-width: 550px;
        }

        .image-container {
            width: 100%;
            aspect-ratio: 1 / 1.25;
            overflow: hidden;
            background-color: #f7f7f7;
            margin-bottom: 30px;
        }

        .image-container img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
        }

        .member-card:hover img {
            transform: scale(1.04);
        }

        .member-info h3 {
            font-size: 26px;
            text-transform: uppercase;
            margin: 0 0 10px 0;
            font-weight: 900;
            letter-spacing: -0.5px;
        }

        .member-info .role {
            font-size: 16px;
            font-weight: bold;
            display: block;
            margin-bottom: 20px;
            color: #555;
            text-transform: uppercase;
        }

        .member-info .explanation {
            font-size: 16px;
            line-height: 1.7;
            color: var(--text-grey);
            text-align: justify;
        }

        /* Mobile Responsive */
        @media (max-width: 1024px) {
            .main-container { flex-direction: column; }
            .left-sidebar { 
                position: relative; 
                height: auto; 
                flex: none; 
                padding: 80px 40px;
            }
            .left-sidebar h1 { text-align: center; font-size: 50px; }
            .right-content { padding: 60px 30px; }
        }