prevent long word breaking

source/_patterns/01-molecules/27-carousel/carousel-card-list.mustache

@@ -7,8 +7,8 @@
               <slide>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-2 md:gap-8">
                 {{> atoms-colored-card(bodyClasses: "p-4", title: "Otevřenost a zapojení občanů", description: "Short description" )}}
-                {{> atoms-colored-card(bodyClasses: "p-4", title: "Otevřenost a zapojení občanů", description: "Short description" )}}
-                {{> atoms-colored-card(bodyClasses: "p-4", title: "Otevřenost a zapojení občanů", description: "Short description" )}}
+                {{> atoms-colored-card(bodyClasses: "p-4", title: "Obhospodařovávání vysokorychlostních longloremipsum", description: "Short description" )}}
+                {{> atoms-icon-colored-card(classes: "card--hoveractive", archetype: "zemedelstvi", bodyClasses: "p-4", title: "Obhospodařovávání vysokorychlostních longloremipsum" )}}
                 {{> atoms-colored-card(bodyClasses: "p-4", title: "Otevřenost a zapojení občanů", description: "Long description. Long description. Long description. Long description. Long description. Long description. Long description. Long description. Long description. Long description. " )}}
                </div>
               </slide>

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

@@ -11,9 +11,9 @@
             <a class="switch__item switch__item--active" data-chosen="mujprogram">Můj program</a>
             <a class="switch__item" data-chosen="celyprogram">Celý program</a>
           </div>
-          <div class="filters">
-            {{> atoms-select(wrapClasses: "inline-flex w-auto text-black", classes: "bg-black block filter-pirati-stan", placeholder: "Podle resortu", selected: "Životní prostředí") }}
-            {{> atoms-select(wrapClasses: "inline-flex w-auto text-white", classes: "bg-black block filter-pirati-stan", placeholder: "Podle plánu") }}
+          <div class="filters sm:px-20">
+            {{> atoms-select(wrapClasses: "inline-flex w-auto text-black w-full md:w-auto", classes: "bg-black block filter-pirati-stan", placeholder: "Podle resortu", selected: "Konstruktivní boj proti dezinformacím") }}
+            {{> atoms-select(wrapClasses: "inline-flex w-auto text-white w-full md:w-auto", classes: "bg-black block filter-pirati-stan", placeholder: "Podle plánu") }}
           </div>
         </div>
 
@@ -25,6 +25,7 @@
             {{> 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" )}}
+            {{> atoms-colored-card(bodyClasses: "p-4", title: "Obhospodařovávání vysokorychlostních longloremipsum", description: "Short description" )}}
             {{> 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

@@ -45,7 +45,8 @@
     background-position: 90% 13%;
     background-size: 60px;
     h1, h2, h3, h4{
-      max-width: 70%;
+      max-width: 75%;
+      word-wrap: normal;
     }
 }