Add icons to Visibility / Cost Tracking / Compliance pillars

Author: ArturSkowronski

src/pages/index.astro

@@ -97,6 +97,10 @@ const base = import.meta.env.BASE_URL;
       </p>
       <div class="pillars-grid pillars-grid--three">
         <div class="pillar-card">
+          <svg class="pillar-card__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+            <path d="M2 12s3.5-7 10-7 10 7 10 7-3.5 7-10 7-10-7-10-7z"/>
+            <circle cx="12" cy="12" r="3"/>
+          </svg>
           <span class="pillar-card__label">Visibility</span>
           <h3 class="pillar-card__title">See every AI-assisted change</h3>
           <p class="pillar-card__desc">
@@ -107,6 +111,11 @@ const base = import.meta.env.BASE_URL;
           <p class="pillar-card__meta">Session traces &middot; tool calls &middot; git-level attribution</p>
         </div>
         <div class="pillar-card">
+          <svg class="pillar-card__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+            <path d="M3 3v18h18"/>
+            <path d="M7 15l4-4 3 3 6-7"/>
+            <path d="M14 7h6v6"/>
+          </svg>
           <span class="pillar-card__label">Cost Tracking</span>
           <h3 class="pillar-card__title">FinOps for AI-assisted code</h3>
           <p class="pillar-card__desc">
@@ -117,6 +126,10 @@ const base = import.meta.env.BASE_URL;
           <p class="pillar-card__meta">Per-PR spend &middot; cache savings &middot; hard budgets</p>
         </div>
         <div class="pillar-card">
+          <svg class="pillar-card__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+            <path d="M12 2 3 6v6c0 5 3.8 9.4 9 10 5.2-.6 9-5 9-10V6l-9-4z"/>
+            <path d="m9 12 2 2 4-4"/>
+          </svg>
           <span class="pillar-card__label">Compliance</span>
           <h3 class="pillar-card__title">Signed evidence, enforced policy</h3>
           <p class="pillar-card__desc">

src/styles/landing.css

@@ -220,6 +220,14 @@ body {
   border-radius: 999px;
   align-self: flex-start;
 }
+.pillar-card__icon {
+  width: 40px;
+  height: 40px;
+  color: var(--brand-red);
+  display: block;
+  margin-bottom: 4px;
+  flex-shrink: 0;
+}
 .pillar-card__title {
   font-family: var(--font-heading);
   font-weight: 800;