icon cards title icon too close fix + demo

source/_patterns/00-atoms/09-cards/icon-colored-card.mustache

 <div class="card icon-card shadow-none bg-{{# cardColor }}{{ cardColor }}{{/ cardColor}}{{^ cardColor}}grey-125{{/ cardColor }} {{ classes }}" data-archetype="{{archetype}}">
   <div class="card__body">
-    <h1 class="card-headline mb-8 pr-12"><a href="#">{{ title }}{{^ title }}{{ headline.short }}{{/ title }}</a></h1>
+    <h1 class="card-headline mb-8"><a href="#">{{ title }}{{^ title }}{{ headline.short }}{{/ title }}</a></h1>
     <p class="card-body-text">{{ excerpt.short }}</p>
   </div>
 </div>

source/_patterns/03-templates/coalition-program-points/elections-program-listing-pirati-stan.mustache

@@ -21,9 +21,10 @@
 
           <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
             {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "zemedelstvi", bodyClasses: "p-4", title: "Otevřenost a zapojení občanů" )}}
-            {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "prostredi", bodyClasses: "p-4", title: "Konstruktivní boj proti dezinformací" )}}
+            {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "prostredi", bodyClasses: "p-4", title: "Konstruktivní boj proti dezinformacím" )}}
             {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "zdravotnictvi", bodyClasses: "p-4", title: "Řízení a organizační struktura města" )}}
             {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "vzdelavani", bodyClasses: "p-4", title: "Vzdělávání a věda" )}}
+            {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "prumysl", bodyClasses: "p-4", title: "Průmysl připravený na změny" )}}
             {{> organisms-lead-banner-pirati-stan(classes: "col-span-1 md:col-span-2 lg:col-span-3 mx-auto", programAppLink: true)}}
             {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Rozvoj města a bydlení" )}}
             {{> atoms-colored-card(classes: "card--hoveractive", bodyClasses: "p-4", title: "Doprava" )}}

source/css/atoms/card.pcss

@@ -44,6 +44,9 @@
     background-repeat: no-repeat;
     background-position: 90% 13%;
     background-size: 60px;
+    h1, h2, h3, h4{
+      max-width: 70%;
+    }
 }
 
 [data-archetype="doprava"]{