  </div>
    </section>

    <!-- Colors Section -->
    <section id="colors" class="demo-section">
        <div class="container">
            <h2 class="h2 text-center mb-8">Color System</h2>
            
            <h3 class="h4 mb-4">Semantic Colors</h3>
            <div class="row mb-6">
                <div class="col-12 col-md-3 mb-4">
                    <div class="demo-color-swatch" style="background-color: #3b82f6;">
                        Primary
                    </div>
                    