* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.6;
            /* color: #333; */
            background: var(--light-bg);
        }

        .header {
            color: white;
            padding: 60px 20px;
            text-align: center;
            /* background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%); */
        }

        .header h1 {
            position: relative;
            color: var(--white-color);
            font-size: clamp(2em, 5vw, 3.5em);
            margin-bottom: 10px;
            font-weight: 800;
            letter-spacing: 2px;
            z-index: 10;
        }

        .header p {
            position: relative;
            font-size: clamp(1em, 2vw, 1.1em);
            color: var(--accent-color);
            z-index: 10;
        }

        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }

        .section-title {
            font-size: clamp(1.5em, 4vw, 2em);
            color: var(--dark-color);
            margin: 60px 0 30px;
            padding-bottom: 15px;
            border-bottom: 3px solid var(--accent-color);
            text-align: center;
        }

        /* Board of Trustees Section */
        .founder-section {
            background: white;
            border-radius: 8px;
            padding: clamp(20px, 4vw, 40px);
            margin: 40px 0;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .founder-card {
            display: flex;
            align-items: center;
            gap: clamp(20px, 4vw, 40px);
            flex-wrap: wrap;
        }

        .founder-image {
            width: clamp(150px, 30vw, 200px);
            height: clamp(150px, 30vw, 200px);
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: clamp(2em, 8vw, 4em);
            color: white;
            flex-shrink: 0;
            margin: 0 auto;
        }

        .founder-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 8px;
        }

        .founder-info {
            flex: 1;
            min-width: min(100%, 300px);
        }

        .founder-info h2 {
            font-size: clamp(1.5em, 4vw, 2em);
            color: var(--dark-color);
            margin-bottom: 5px;
        }

        .founder-info .title {
            color: var(--accent-color);
            font-size: clamp(1em, 2.5vw, 1.1em);
            margin-bottom: 15px;
            font-weight: 600;
        }

        .founder-info .qualification {
            color: var(--gray-color);
            margin-bottom: 15px;
            font-style: italic;
            font-size: clamp(0.9em, 2vw, 1em);
        }

        .founder-info p {
            color: #555;
            line-height: 1.8;
            font-size: clamp(0.95em, 2vw, 1em);
        }

        .read-more-btn {
            display: inline-block;
            padding: 12px 35px;
            background: white;
            color: var(--accent-color);
            border: 2px solid var(--accent-color);
            border-radius: 50px;
            text-decoration: none;
            font-size: clamp(0.9em, 2vw, 1em);
            font-weight: 500;
            transition: all 0.3s ease;
            cursor: pointer;
            margin-top: 20px;
        }

        .read-more-btn:hover {
            background: var(--accent-color);
            color: white;
            transform: scale(1.05);
            box-shadow: 0 5px 15px rgba(231, 76, 60, 0.3);
        }

        .read-more-btn::after {
            content: ' →';
            transition: transform 0.3s ease;
            display: inline-block;
        }

        .read-more-btn:hover::after {
            transform: translateX(5px);
        }

        /* Board Grid Section */
        .board-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
            gap: clamp(20px, 3vw, 30px);
            margin-bottom: 60px;
        }

        .board-member {
            background: white;
            border-radius: 8px;
            padding: clamp(20px, 3vw, 30px);
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            transition: transform 0.3s, box-shadow 0.3s;
        }

        .board-member:hover {
            transform: translateY(-5px);
            box-shadow: 0 5px 20px rgba(0,0,0,0.15);
        }

        .board-member h3 {
            color: var(--dark-color);
            font-size: clamp(1.2em, 3vw, 1.4em);
            margin-bottom: 8px;
        }

        .board-member .role {
            color: var(--accent-color);
            font-weight: 600;
            margin-bottom: 15px;
            font-size: clamp(0.85em, 2vw, 0.95em);
        }

        .board-member p {
            color: #666;
            line-height: 1.7;
            font-size: clamp(0.85em, 2vw, 0.95em);
        }

        /* Team Section */
        .team-section {
            background: white;
            border-radius: 8px;
            padding: clamp(20px, 4vw, 40px);
            margin: 40px 0;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .team-section h2 {
            color: var(--dark-color);
            font-size: clamp(1.3em, 3.5vw, 1.8em);
            margin-bottom: 25px;
            padding-bottom: 10px;
            border-bottom: 2px solid var(--accent-color);
        }

        .team-list {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
            gap: 20px;
        }

        .team-member {
            padding: 20px;
            background: #f8f9fa;
            border-radius: 6px;
            border-left: 4px solid var(--accent-color);
        }

        .team-member strong {
            color: #5a728b;
            display: block;
            margin-bottom: 5px;
            font-size: clamp(1em, 2.5vw, 1.1em);
        }

        .team-member span {
            color: #666;
            font-size: clamp(0.85em, 2vw, 0.9em);
            line-height: 1.5;
        }

        /* Volunteers Section */
.volunteers-section {
            background: white;
            border-radius: 8px;
            padding: clamp(20px, 4vw, 40px);
            margin: 40px auto;
            max-width: 1200px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            min-height: 500px;
            position: relative;
            overflow: hidden;
        }

        .volunteers-section h2 {
            color: var(--dark-color);
            font-size: clamp(1.3em, 3.5vw, 1.8em);
            margin-bottom: 25px;
            padding-bottom: 10px;
            border-bottom: 2px solid var(--accent-color);
            position: relative;
            z-index: 10;
        }

        .volunteer-tags {
            position: relative;
            min-height: 400px;
        }

        .volunteer-tag {
            background: var(--accent-color);
            color: white;
            padding: 10px 20px;
            border-radius: 25px;
            font-size: clamp(0.85em, 2vw, 0.95em);
            position: absolute;
            animation: float linear infinite;
            white-space: nowrap;
            box-shadow: 0 4px 15px rgba(231, 76, 60, 0.3);
            transition: transform 0.3s ease;
        }

        .volunteer-tag:hover {
            transform: scale(1.1);
            z-index: 100;
            box-shadow: 0 6px 20px rgba(231, 76, 60, 0.5);
        }

        @keyframes float {
            0% {
                transform: translateY(0) translateX(0) rotate(0deg);
            }
            25% {
                transform: translateY(-20px) translateX(10px) rotate(5deg);
            }
            50% {
                transform: translateY(-40px) translateX(-10px) rotate(-5deg);
            }
            75% {
                transform: translateY(-20px) translateX(15px) rotate(3deg);
            }
            100% {
                transform: translateY(0) translateX(0) rotate(0deg);
            }
        }

        /* Individual positioning and animation durations */
        .volunteer-tag:nth-child(1) { top: 10%; left: 5%; animation-duration: 6s; animation-delay: 0s; }
        .volunteer-tag:nth-child(2) { top: 15%; left: 25%; animation-duration: 8s; animation-delay: 1s; }
        .volunteer-tag:nth-child(3) { top: 20%; left: 50%; animation-duration: 7s; animation-delay: 0.5s; }
        .volunteer-tag:nth-child(4) { top: 5%; left: 70%; animation-duration: 9s; animation-delay: 2s; }
        .volunteer-tag:nth-child(5) { top: 25%; left: 85%; animation-duration: 6.5s; animation-delay: 1.5s; }
        .volunteer-tag:nth-child(6) { top: 40%; left: 10%; animation-duration: 7.5s; animation-delay: 0.8s; }
        .volunteer-tag:nth-child(7) { top: 45%; left: 30%; animation-duration: 8.5s; animation-delay: 2.5s; }
        .volunteer-tag:nth-child(8) { top: 35%; left: 55%; animation-duration: 7s; animation-delay: 1.2s; }
        .volunteer-tag:nth-child(9) { top: 50%; left: 75%; animation-duration: 6s; animation-delay: 0.3s; }
        .volunteer-tag:nth-child(10) { top: 55%; left: 90%; animation-duration: 8s; animation-delay: 1.8s; }
        .volunteer-tag:nth-child(11) { top: 65%; left: 8%; animation-duration: 7.5s; animation-delay: 0.6s; }
        .volunteer-tag:nth-child(12) { top: 70%; left: 28%; animation-duration: 9s; animation-delay: 2.2s; }
        .volunteer-tag:nth-child(13) { top: 75%; left: 48%; animation-duration: 6.5s; animation-delay: 1.4s; }
        .volunteer-tag:nth-child(14) { top: 80%; left: 68%; animation-duration: 7s; animation-delay: 0.9s; }
        .volunteer-tag:nth-child(15) { top: 12%; left: 15%; animation-duration: 8.5s; animation-delay: 2.8s; }
        .volunteer-tag:nth-child(16) { top: 18%; left: 38%; animation-duration: 6s; animation-delay: 0.4s; }
        .volunteer-tag:nth-child(17) { top: 28%; left: 62%; animation-duration: 7.5s; animation-delay: 1.9s; }
        .volunteer-tag:nth-child(18) { top: 32%; left: 82%; animation-duration: 8s; animation-delay: 0.7s; }
        .volunteer-tag:nth-child(19) { top: 42%; left: 20%; animation-duration: 9s; animation-delay: 2.4s; }
        .volunteer-tag:nth-child(20) { top: 48%; left: 42%; animation-duration: 6.5s; animation-delay: 1.1s; }
        .volunteer-tag:nth-child(21) { top: 58%; left: 65%; animation-duration: 7s; animation-delay: 0.2s; }
        .volunteer-tag:nth-child(22) { top: 62%; left: 88%; animation-duration: 8.5s; animation-delay: 2.6s; }
        .volunteer-tag:nth-child(23) { top: 68%; left: 15%; animation-duration: 7.5s; animation-delay: 1.3s; }
        .volunteer-tag:nth-child(24) { top: 72%; left: 35%; animation-duration: 6s; animation-delay: 0.5s; }
        .volunteer-tag:nth-child(25) { top: 78%; left: 58%; animation-duration: 8s; animation-delay: 2.1s; }
        .volunteer-tag:nth-child(26) { top: 85%; left: 78%; animation-duration: 7s; animation-delay: 1.6s; }
        .volunteer-tag:nth-child(27) { top: 8%; left: 45%; animation-duration: 9s; animation-delay: 0.8s; }
        .volunteer-tag:nth-child(28) { top: 22%; left: 12%; animation-duration: 6.5s; animation-delay: 2.3s; }
        .volunteer-tag:nth-child(29) { top: 38%; left: 40%; animation-duration: 7.5s; animation-delay: 1.7s; }
        .volunteer-tag:nth-child(30) { top: 52%; left: 52%; animation-duration: 8.5s; animation-delay: 0.6s; }
        .volunteer-tag:nth-child(31) { top: 60%; left: 25%; animation-duration: 6s; animation-delay: 2.9s; }
        .volunteer-tag:nth-child(32) { top: 88%; left: 45%; animation-duration: 7s; animation-delay: 1.5s; }
        .volunteer-tag:nth-child(33) { top: 30%; left: 72%; animation-duration: 8s; animation-delay: 0.9s; }

        @media (max-width: 768px) {
            .volunteer-tag {
                font-size: 0.8em;
                padding: 8px 15px;
            }
            
            .volunteers-section {
                min-height: 600px;
            }
            
            .volunteer-tags {
                min-height: 500px;
            }
        }

        /* Governance Section */
        .governance-section {
            background: linear-gradient(135deg, var(--accent-color) 0%, #e751e2 100%);
            color: white;
            border-radius: 8px;
            padding: clamp(30px, 5vw, 50px);
            margin: 40px 0;
            text-align: center;
        }

        .governance-section h2 {
            font-size: clamp(1.5em, 4vw, 2em);
            margin-bottom: 30px;
            font-weight: 300;
        }

        .governance-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
            gap: clamp(20px, 3vw, 30px);
            margin-top: 30px;
        }

        .governance-item {
            background: rgba(255,255,255,0.1);
            padding: 25px;
            border-radius: 8px;
            backdrop-filter: blur(10px);
        }

        .governance-item h3 {
            font-size: clamp(1.1em, 2.5vw, 1.2em);
            margin-bottom: 10px;
        }

        .governance-item p {
            font-size: clamp(0.85em, 2vw, 0.95em);
            opacity: 0.9;
        }

        /* Mobile Specific Styles */
        @media (max-width: 768px) {
            .header {
                padding: 40px 15px;
            }

            .container {
                padding: 15px;
            }

            .founder-card {
                flex-direction: column;
                text-align: center;
            }

            .founder-info {
                width: 100%;
            }

            .section-title {
                margin: 40px 0 20px;
            }

            .founder-section,
            .team-section,
            .volunteers-section {
                margin: 20px 0;
            }

            .read-more-btn {
                width: 100%;
                text-align: center;
            }

            .board-grid {
                margin-bottom: 40px;
            }
        }

        @media (max-width: 480px) {
            .header {
                padding: 30px 10px;
            }

            .header h1 {
                letter-spacing: 1px;
            }

            .founder-section,
            .team-section,
            .volunteers-section,
            .governance-section {
                border-radius: 6px;
            }

            .volunteer-tags {
                justify-content: center;
            }
        }