People & team cards

<article class="p-person-card">
<span class="avatar tone-0 " aria-hidden="true">AM</span>
<h2>Alex Morgan</h2>
<p>Workspace admin · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>12</strong>
<span>Projects</span>
</div>
<div>
<strong>64</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-primary" data-follow="0" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>

<article class="p-person-card">
<span class="avatar tone-1 " aria-hidden="true">SW</span>
<h2>Sara Wilson</h2>
<p>Job title · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>15</strong>
<span>Projects</span>
</div>
<div>
<strong>78</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-secondary" data-follow="1" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>

<article class="p-person-card">
<span class="avatar tone-2 " aria-hidden="true">OH</span>
<h2>Omar Hassan</h2>
<p>Company · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>18</strong>
<span>Projects</span>
</div>
<div>
<strong>92</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-primary" data-follow="2" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>

<article class="p-person-card">
<span class="avatar tone-3 " aria-hidden="true">LD</span>
<h2>Lina Davis</h2>
<p>Workspace admin · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>21</strong>
<span>Projects</span>
</div>
<div>
<strong>106</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-secondary" data-follow="3" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>

<article class="p-person-card">
<span class="avatar tone-4 " aria-hidden="true">AC</span>
<h2>Adam Clark</h2>
<p>Job title · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>24</strong>
<span>Projects</span>
</div>
<div>
<strong>120</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-primary" data-follow="4" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>

<article class="p-person-card">
<span class="avatar tone-5 " aria-hidden="true">MC</span>
<h2>Maya Chen</h2>
<p>Company · Amman, Jordan</p>
<div class="p-person-stats">
<div>
<strong>27</strong>
<span>Projects</span>
</div>
<div>
<strong>134</strong>
<span>Connections</span>
</div>
</div>
<button class="btn btn-secondary" data-follow="5" aria-pressed="false">
<svg class="icon " viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 5v14M5 12h14"/>
</svg>Follow</button>
<a class="text-button section-copy" href="pages/system/profile.html">View details</a>
</article>