Card Group

<div class="d-g gtc-1 sm:gtc-3 g-6">
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Fast performance</h3>
      <p class="fs-sm tc-slate-6 m-0">Optimized for speed and efficiency.</p>
   </div>
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Secure by default</h3>
      <p class="fs-sm tc-slate-6 m-0">Built with security in mind.</p>
   </div>
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"/><circle cx="12" cy="12" r="3"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Fully customizable</h3>
      <p class="fs-sm tc-slate-6 m-0">Adapt to your needs easily.</p>
   </div>
</div>

<div class="d-g gtc-1 sm:gtc-2 g-6">
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 3v16a2 2 0 0 0 2 2h16"/><path d="m19 9-5 5-4-4-3 3"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Analytics</h3>
      <p class="fs-sm tc-slate-6 m-0">Track your metrics and monitor performance in real-time.</p>
   </div>
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 8V4H8"/><rect width="16" height="12" x="4" y="8" rx="2"/><path d="M2 14h2"/><path d="M20 14h2"/><path d="M15 13v2"/><path d="M9 13v2"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Automation</h3>
      <p class="fs-sm tc-slate-6 m-0">Automate workflows and save time on repetitive tasks.</p>
   </div>
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Integrations</h3>
      <p class="fs-sm tc-slate-6 m-0">Connect with your favorite tools and services.</p>
   </div>
   <div class="p-6 b-1 bc-silver-4 rad-0">
      <div class="d-f ai-c jc-c d-10 rad-9 bg-silver-1 tc-slate mb-4">
         <svg xmlns="http://www.w3.org/2000/svg" class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
      </div>
      <h3 class="ff-s fs-md fw-600 tc-slate mb-2">Collaboration</h3>
      <p class="fs-sm tc-slate-6 m-0">Work together with your team in real-time.</p>
   </div>
</div>