Update style

assets/style.css

@@ -701,6 +701,18 @@ video {
   margin-bottom: 1rem;
 }
 
+.-ml-1 {
+  margin-left: -0.25rem;
+}
+
+.-ml-0\.5 {
+  margin-left: -0.125rem;
+}
+
+.-ml-0 {
+  margin-left: -0px;
+}
+
 .block {
   display: block;
 }
@@ -747,6 +759,10 @@ video {
   grid-template-columns: repeat(1, minmax(0, 1fr));
 }
 
+.flex-row {
+  flex-direction: row;
+}
+
 .flex-col {
   flex-direction: column;
 }
@@ -785,6 +801,23 @@ video {
   row-gap: 1rem;
 }
 
+.gap-y-12 {
+  row-gap: 3rem;
+}
+
+.gap-y-8 {
+  row-gap: 2rem;
+}
+
+.gap-y-10 {
+  row-gap: 2.5rem;
+}
+
+.gap-x-12 {
+  -moz-column-gap: 3rem;
+       column-gap: 3rem;
+}
+
 .self-start {
   align-self: flex-start;
 }
@@ -896,6 +929,11 @@ video {
   line-height: 1rem;
 }
 
+.text-lg {
+  font-size: 1.125rem;
+  line-height: 1.75rem;
+}
+
 .font-bold {
   font-weight: 700;
 }
@@ -1148,6 +1186,10 @@ html:not(.dark) .light\:hidden {
 }
 
 @media (min-width: 768px) {
+  .md\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
   .md\:text-\[22px\] {
     font-size: 22px;
   }

layouts/partials/services.html

@@ -1,15 +1,15 @@
 <h2 class="sr-only">Služby</h2>
-<ul class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+<ul class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-x-8 gap-y-12">
   {{ range (where site.RegularPages.ByWeight "Type" "services") }}
     <li>
       <article>
-        <div class="flex flex-col lg:flex-row lg:items-center lg:gap-2 mb-2">
+        <div class="flex flex-row items-center gap-2 mb-2 -ml-0.5">
           {{ with .Params.icon }}
           <span class="fill-current">{{ . | safeHTML }}</span>
           {{ end }}
           <h3 class="mr-1"><a href="{{ .Params.href }}" class="font-bold link">{{ .Title }}</a></h3>
         </div>
-        <div class="prose">
+        <div class="prose text-sm">
           {{ .Params.description | safeHTML }}
         </div>
         {{/*  <p class="mt-2">