main{
            background: #0f2027; 
            font-family: 'Poppins', sans-serif;
            overflow-x: hidden;
            color: white;
        }
        .chairman-section {
            position: relative;
            padding: 100px 0;
            min-height: 100vh;
            display: flex;
            justify-content: center;
            align-items: center;
            overflow: hidden;
        }

        /* --- THE DOUBLE SNAKE FRAME --- */
        .portrait-wrapper {
            position: absolute;
            left: 0;
            z-index: 50;
            opacity: 0;
            transform: translateX(-120px);
            transition: all 1.5s cubic-bezier(0.19, 1, 0.22, 1);
        }

        .premium-frame {
            position: relative;
            width: 360px;
            height: 480px;
            background: #0f2027; 
            border-radius: 50px;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden; 
            box-shadow: -20px 30px 60px rgba(0,0,0,0.8);
            animation: floating 6s infinite ease-in-out;
        }

        /* THE DOUBLE SNAKE (Two light sources chasing each other) */
        .premium-frame::before {
            content: '';
            position: absolute;
            width: 250%;
            height: 250%;
            /* Two Snakes: One at 0-180 and one at 180-360 */
            background: conic-gradient(
                #fdf804 0deg, #f1c40f 20deg, #baaa16d3 90deg, 
                #f1c40f 180deg, #f5de54 200deg, #9e8f07d3 270deg,
                #ead736 360deg
            );
            animation: snakeRotate 3.5s infinite linear;
            z-index: 1;
        }

        /* The Mask to create the Border Line */
        .premium-frame::after {
            content: '';
            position: absolute;
            inset: 8px; 
            background: #0f2027;
            border-radius: 42px;
            z-index: 2;
        }

        @keyframes snakeRotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        @keyframes floating {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-20px); }
        }

        .chairman-photo {
            width: calc(100% - 24px); 
            height: calc(100% - 24px);
            object-fit: cover;
            border-radius: 38px;
            position: relative;
            z-index: 10; 
            border: 1px solid rgba(255,255,255,0.1);
        }

        /* --- THE GLASS CARD --- */
        .glass-card {
            width: 90%;
            max-width: 1200px;
            background: rgba(32, 58, 67, 0.3); /* #203a43 */
            backdrop-filter: blur(40px) saturate(180%);
            -webkit-backdrop-filter: blur(40px) saturate(180%);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-radius: 60px;
            padding: 80px 60px 80px 340px; /* Offset for image */
            box-shadow: 0 40px 100px rgba(0,0,0,0.5);
            opacity: 0;
            transform: translateX(100px);
            transition: all 1.2s cubic-bezier(0.19, 1, 0.22, 1);
        }

        /* Staggered Reveal Items */
        .stagger { opacity: 0; transform: translateY(20px); transition: 0.8s ease-out; }
        .active-view { opacity: 1 !important; transform: translate(0, 0) !important; }

        .main-title { font-size: 3.2rem; font-weight: 900; line-height: 1.1; margin-bottom: 25px; }
        .main-title span { color: #f1c40f; display: block; font-size: 0.9rem; letter-spacing: 8px; margin-bottom: 10px; }
        .greeting { font-size: 1.3rem; color: #d4af37; margin-bottom: 25px; font-style: italic; border-left: 3px solid #f1c40f; padding-left: 20px; }
        .message-p { color: rgba(255, 255, 255, 0.85); line-height: 1.8; margin-bottom: 20px; font-size: 1.1rem; text-align: justify; }
        .name { font-size: 1.8rem; font-weight: 700; color: #f1c40f; margin-top: 40px; }

        /* Mobile */
        @media (max-width: 1100px) {
            .chairman-section { padding-top: 150px; }
            .room { flex-direction: column; display: flex; align-items: center; justify-content: center; width: 100%;}
            .portrait-wrapper { position: relative; left: 0; transform: translateY(60px); margin-bottom: -60px; }
            .premium-frame { width: 300px; height: 400px; }
            .glass-card { width: 95%; padding: 100px 30px 40px 30px; border-radius: 40px; text-align: center; }
            .greeting { border-left: none; padding-left: 0; }
            .message-p { text-align: center; }
                .main-title {
        font-size: 2.5rem;
        }