<!-- Features Grid Section Template -->
<section id="features" class="features">
  <div class="container">
    <h2 class="section-title">Features</h2>

    <div class="features-grid">
      <!-- Feature Card 1 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_1_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_1_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_1_DESC}}</p>
      </div>

      <!-- Feature Card 2 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_2_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_2_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_2_DESC}}</p>
      </div>

      <!-- Feature Card 3 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_3_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_3_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_3_DESC}}</p>
      </div>

      <!-- Feature Card 4 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_4_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_4_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_4_DESC}}</p>
      </div>

      <!-- Feature Card 5 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_5_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_5_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_5_DESC}}</p>
      </div>

      <!-- Feature Card 6 -->
      <div class="feature-card">
        <div class="feature-icon">{{FEATURE_6_ICON}}</div>
        <h3 class="feature-title">{{FEATURE_6_TITLE}}</h3>
        <p class="feature-desc">{{FEATURE_6_DESC}}</p>
      </div>
    </div>
  </div>
</section>

<!--
PLACEHOLDERS:
- {{FEATURE_N_ICON}}: Emoji or icon for feature (e.g., "⚡", "🔒", "📦")
- {{FEATURE_N_TITLE}}: Feature title (short, 2-4 words)
- {{FEATURE_N_DESC}}: Feature description (1-2 sentences)

NOTE: Adjust number of cards as needed (typically 4-6)
-->
